diff --git a/web/static/index.css b/web/static/index.css index e624d8b..99038bc 100644 --- a/web/static/index.css +++ b/web/static/index.css @@ -87,23 +87,35 @@ body { width: 300px; } -#boardActionBar { - font-size: 12px; +.action-bar { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 0.75rem; + font-size: 12pt; +} + +.action-bar>* { + margin: 0; +} + +.action-search { + flex: 1 1 150px; } /* THREAD CATALOG */ #catalog { - display: flex; - margin: 2rem; - flex-wrap: wrap; + display: grid; + gap: 10px; + margin: 1rem; + grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); } .catalog-preview { margin: 10px; text-align: center; padding: 10px; - width: 250px; max-height: 300px; overflow: hidden; } @@ -153,7 +165,7 @@ body { right: 100%; margin-right: 6px; top: 50%; - left: 22%; + left: 5%; transform: translateY(-50%); display: flex; } @@ -472,3 +484,20 @@ footer { display: block; margin: auto; } + +@media (max-width: 600px) { + .action-bar { + flex-direction: column; + align-items: stretch; + } + + .action-bar select, + .action-bar input, + .action-bar .link-button { + width: 100%0px; + } + + .action-search { + flex: 1; + } +} diff --git a/web/views/board.templ b/web/views/board.templ index f441a86..1db312b 100644 --- a/web/views/board.templ +++ b/web/views/board.templ @@ -31,19 +31,35 @@ templ Board(board database.Board, isAdmin bool) { @shared.NewPostForm(board, fmt.Sprintf("/%s/threads", board.Slug), true)