diff --git a/CHANGELOG.md b/CHANGELOG.md index 20291958..a304e56f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # CHANGELOG +## v1.0.5 -- XXXX-XX-XX + +* Reorder the package page columns in mobile view (#233) + ## v1.0.4 -- 2022-10-02 * Colourise the search bars on focus (#215) diff --git a/assets/css/app.css b/assets/css/app.css index 2abbd713..bdb10c10 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -111,14 +111,21 @@ a { } .error-code { - --tw-bg-opacity: 1; + color: var(--error-code); + font-size: 3rem; + line-height: 1; + font-weight: 800; +} +.error-message { + letter-spacing: -0.025em; + font-weight: 800; + font-size: 3rem; + line-height: 1; color: var(--error-code); } .error-page-button { - --tw-bg-opacity: 1; - background-color: var(--error-button); } @@ -174,6 +181,9 @@ div[class="bullets"] { } .package-body { + display: flex; + flex-direction: column; + a { font-weight: 500; } @@ -268,6 +278,10 @@ div[class="bullets"] { text-decoration: underline; } +.release a:hover { + text-decoration: underline; +} + .package-list { .package-list-item { font-size: 1.25rem; @@ -408,4 +422,24 @@ div[class="bullets"] { .dependency { white-space: nowrap; } + + .package-body { + flex-direction: row; + } +} + +/* smaller display rules */ + +@media (max-width: px) { + .package-left-column { + order: 1; + } + + .package-right-column { + order: 2; + } + + .package-readme-column { + order: 3; + } } diff --git a/src/FloraWeb/Server.hs b/src/FloraWeb/Server.hs index 9c1429c9..51c3fde7 100644 --- a/src/FloraWeb/Server.hs +++ b/src/FloraWeb/Server.hs @@ -24,12 +24,18 @@ import Prometheus.Metric.Proc (procMetrics) import Servant ( Application , Context (..) + , ErrorFormatters , Handler , HasServer (hoistServerWithContext) + , NotFoundErrorFormatter , Proxy (Proxy) + , defaultErrorFormatters + , err404 , hoistServer + , notFoundErrorFormatter , serveDirectoryWebApp ) +import Servant.API (getResponse) import Servant.Server.Generic (AsServerT, genericServeTWithContext) import Control.Exception.Safe qualified as Safe @@ -47,6 +53,7 @@ import Data.Function ((&)) import Data.Pool (Pool) import Database.PostgreSQL.Simple (Connection) import Effectful.Dispatch.Static +import Effectful.Error.Static (runErrorNoCallStack) import Effectful.PostgreSQL.Transact.Effect (runDB) import Flora.Environment (DeploymentEnv, FloraEnv (..), LoggingEnv (..), getFloraEnv) import Flora.Environment.OddJobs qualified as OddJobs @@ -63,8 +70,10 @@ import FloraWeb.Server.Metrics import FloraWeb.Server.OpenSearch import FloraWeb.Server.Pages qualified as Pages import FloraWeb.Server.Tracing +import FloraWeb.Templates (defaultTemplateEnv, defaultsToEnv) +import FloraWeb.Templates.Error (renderError) import FloraWeb.Types -import Servant.API (getResponse) +import Network.HTTP.Types (notFound404) runFlora :: IO () runFlora = bracket (runEff getFloraEnv) (runEff . shutdownFlora) $ \env -> runEff . runCurrentTimeIO . runConcurrent $ do @@ -171,5 +180,16 @@ naturalTransform deploymentEnv logger webEnvStore app = & runLog deploymentEnv logger & effToHandler -genAuthServerContext :: Logger -> FloraEnv -> Context '[FloraAuthContext] -genAuthServerContext logger floraEnv = authHandler logger floraEnv :. EmptyContext +genAuthServerContext :: Logger -> FloraEnv -> Context '[FloraAuthContext, ErrorFormatters] +genAuthServerContext logger floraEnv = authHandler logger floraEnv :. errorFormatters :. EmptyContext + +errorFormatters :: ErrorFormatters +errorFormatters = + defaultErrorFormatters{notFoundErrorFormatter = notFoundPage} + +notFoundPage :: NotFoundErrorFormatter +notFoundPage _req = + let result = runPureEff $ runErrorNoCallStack $ renderError (defaultsToEnv defaultTemplateEnv) notFound404 + in case result of + Left err -> err + Right _ -> err404 diff --git a/src/FloraWeb/Templates/Error.hs b/src/FloraWeb/Templates/Error.hs index 366b8d18..109a9b92 100644 --- a/src/FloraWeb/Templates/Error.hs +++ b/src/FloraWeb/Templates/Error.hs @@ -36,10 +36,10 @@ showError status = do div_ [class_ "px-4 py-2 sm:px-6 sm:py-24 md:grid md:place-items-center lg:px-8"] $ div_ [class_ "max-w-max mx-auto"] $ main_ [class_ "sm:flex"] $ do - p_ [class_ "lg:text-5xl font-extrabold sm:text-5xl error-code"] $ toHtml $ show $ statusCode status + p_ [class_ "error-code"] $ toHtml $ show $ statusCode status div_ [class_ "sm:ml-6"] $ do div_ [class_ "sm:border-l sm:border-gray-200 sm:pl-6"] $ do - h1_ [class_ "text-6xl font-extrabold dark:text-gray-100 text-gray-900 tracking-tight sm:text-5xl"] $ + h1_ [class_ "text-5xl error-message"] $ toHtml $ statusMessage status div_ [class_ "mt-10 flex space-x-3 sm:border-l sm:border-transparent sm:pl-6"] $ do