diff --git a/client/src/MassiveDecks/UI/General.elm b/client/src/MassiveDecks/UI/General.elm index fa21e27..5ace3f8 100644 --- a/client/src/MassiveDecks/UI/General.elm +++ b/client/src/MassiveDecks/UI/General.elm @@ -14,10 +14,11 @@ icon name = node "i" [ class ("fa fa-" ++ name) ] [] errorMessage : Signal.Address Action -> Int -> Error -> Html errorMessage address index error = li [ class "error" ] [ div [] [ - a [ href "#", onClick address (RemoveErrorPanel index) ] [ icon "times", text " Close" ] - , p [] [] - , icon "exclamation-triangle" - , text " Error" + a [ href "#", onClick address (RemoveErrorPanel index) ] [ icon "times" ] + , h5 [] + [ icon "exclamation-triangle" + , text " Error" + ] , divider , p [] [ text error.message ] ] ] diff --git a/server/app/assets/stylesheets/massivedecks.less b/server/app/assets/stylesheets/massivedecks.less index 0434254..e3fca2e 100644 --- a/server/app/assets/stylesheets/massivedecks.less +++ b/server/app/assets/stylesheets/massivedecks.less @@ -79,23 +79,26 @@ body.hide-scores { } #errorPanel { + display: block; margin: 0px; padding: 0px; list-style-type: none; - display: inline-block; - position: absolute; + position: fixed; bottom: 10px; right: 10px; + max-height: 50%; + overflow: auto; + z-index: 10; } .error { + position: relative; display: block; border: 1px solid #ff0000; background-color: #ffaaaa; border-radius: 10px; padding: 10px; width: 200px; - position: relative; text-align: center; margin: 5px; @@ -103,10 +106,27 @@ body.hide-scores { margin: 10px; } + h5 { + margin: 0px; + } + + a { + display: block; + position: absolute; + top: 5px; + right: 10px; + text-align: center; + font-size: 20px; + } + p { text-align: left; margin: 0px; } + + .mui-divider { + margin: 2px; + } } #mui-overlay {