diff --git a/dist/www/index.html b/dist/www/index.html index 03fd374..62882e8 100644 --- a/dist/www/index.html +++ b/dist/www/index.html @@ -141,11 +141,24 @@ p { display: grid; align-items: center; justify-content: center; + text-align: center; height: 100vh; } -.uh-oh-stinky > p { +.uh-oh-stinky > div { + border: 4px solid red; + max-width: 575px; + background-color: #311725; + border-radius: 20px; +} +.uh-oh-stinky > div > h1 { + font-size: 150px; + color: red; + margin-top: 40px; +} +.uh-oh-stinky > div > p { max-width: 50vw; - text-align: center; + margin-bottom: 80px; + line-height: 1.3; } /* Yoinked from https://codepen.io/AdamDipinto/pen/eYOaGvY diff --git a/src/UI.purs b/src/UI.purs index e9516e9..1543018 100644 --- a/src/UI.purs +++ b/src/UI.purs @@ -143,7 +143,10 @@ render :: forall m. Model -> H.ComponentHTML Event () m render (GError e) = HH.div [ HP.class_ $ ClassName "uh-oh-stinky" ] - [ HH.p_ [ HH.text $ show e ] + [ HH.div_ + [ HH.h1_ [ HH.text "⚠" ] + , HH.p_ [ HH.text $ show e ] + ] ] render (GLoaded {title, desc, images, focus}) = HH.div_ ((maybe [] (HH.text >>> pure >>> HH.h1_ >>> pure) title) <>