From: Danilo M. Date: Sun, 3 May 2026 13:18:22 +0000 (+0200) Subject: move search into breadcrumb bar; fix index_include dark mode bg X-Git-Url: https://git.danix.xyz/?a=commitdiff_plain;ds=inline;p=gitweb-theme-danix.git move search into breadcrumb bar; fix index_include dark mode bg - Pull search form alongside .page_header via negative margin-top + :has() - Pointer-events passthrough so breadcrumb links remain clickable - Mobile: search drops below header as stacked block row - index_include gets bg-alt card background for dark mode readability Co-Authored-By: Claude Sonnet 4.6 --- diff --git a/gitweb-danixland/gitweb.css b/gitweb-danixland/gitweb.css index b8254d4..01ed7bc 100644 --- a/gitweb-danixland/gitweb.css +++ b/gitweb-danixland/gitweb.css @@ -312,7 +312,7 @@ td, th { line-height: 48px; position: relative; padding: 0 24px; - margin-bottom: 16px; + margin-bottom: 0; font-size: 14px; font-weight: 600; font-family: 'IBM Plex Sans', sans-serif; @@ -347,6 +347,34 @@ td, th { content: 'You\'re in: '; } +/* Search form pulled into the breadcrumb bar */ +form:has(.search) { + max-width: 1280px; + width: calc(100% - 48px); + margin-left: auto; + margin-right: auto; + margin-top: -48px; + margin-bottom: 16px; + display: flex; + justify-content: flex-end; + align-items: center; + height: 48px; + box-sizing: border-box; + padding: 0 24px; + pointer-events: none; +} + +form:has(.search) .search { + pointer-events: auto; + display: flex; + align-items: center; + gap: 6px; + padding: 0; + margin: 0; + color: var(--fg); + font-size: 13px; +} + /* Page Footer ---------------------------------------------------------------------------- */ @@ -441,7 +469,10 @@ div.page_header a img.logo { .index_include { margin-bottom: 16px; - padding: 16px 0; + padding: 20px 24px; + background-color: var(--bg-alt); + border: 1px solid var(--border); + border-radius: 6px; } .index_include h2 { @@ -568,12 +599,15 @@ th .header { .page_nav, .list_head, -.page_path, -.search { +.page_path { color: var(--fg); padding: 5px; margin: 0 auto 16px auto; } + +.search { + color: var(--fg); +} .page_nav { text-align: center; } @@ -1091,7 +1125,6 @@ div.site-header h1 span.evident { .page_nav, .list_head, .page_path, - .search, .title, .readme, .projects_list, @@ -1113,6 +1146,16 @@ div.site-header h1 span.evident { line-height: 1.4; display: flex; align-items: center; + margin-bottom: 0; + } + + form:has(.search) { + width: calc(100% - 24px); + margin-top: 0; + height: auto; + padding: 6px 12px; + border-bottom: 1px solid var(--border); + margin-bottom: 12px; } div.site-header { padding: 12px 16px; } @@ -1149,7 +1192,6 @@ div.site-header h1 span.evident { .page_nav, .list_head, .page_path, - .search, .title, .readme, .projects_list, @@ -1164,6 +1206,11 @@ div.site-header h1 span.evident { border-radius: 0; } + form:has(.search) { + width: 100%; + border-radius: 0; + } + td, th { padding: 6px 8px; } div.site-header h1 { font-size: 14px; } div.site-header h1 img.site-logo { height: 24px; top: 6px; }