diff options
Diffstat (limited to 'assets/css/search.css')
| -rw-r--r-- | assets/css/search.css | 121 |
1 files changed, 121 insertions, 0 deletions
diff --git a/assets/css/search.css b/assets/css/search.css new file mode 100644 index 00000000..7036fd28 --- /dev/null +++ b/assets/css/search.css @@ -0,0 +1,121 @@ +summary { + /* This should hide the marker */ + display: block; + + font-size: 1.17em; + font-weight: bold; + margin: 0 auto 10px auto; + cursor: pointer; +} + +summary::-webkit-details-marker, +summary::marker { display: none; } + +summary:before { + border-radius: 5px; + content: "[ + ]"; + margin: -2px 10px 0 10px; + padding: 1px 0 3px 0; + text-align: center; + width: 40px; +} + +details[open] > summary:before { content: "[ − ]"; } + + +#filters-box { + padding: 10px 20px 20px 10px; + margin: 10px 15px; +} +#filters-flex { + display: flex; + flex-wrap: wrap; + flex-direction: row; + align-items: flex-start; + align-content: flex-start; + justify-content: flex-start; +} + + +fieldset, legend { + display: contents !important; + border: none !important; + margin: 0 !important; + padding: 0 !important; +} + + +.filter-column { + display: inline-block; + display: inline-flex; + width: max-content; + min-width: max-content; + max-width: 16em; + margin: 15px; + flex-grow: 2; + flex-basis: auto; + flex-direction: column; +} +.filter-name, .filter-options { + display: block; + padding: 5px 10px; + margin: 0; + text-align: start; +} + +.filter-options div { margin: 6px 0; } +.filter-options div * { vertical-align: middle; } +.filter-options label { margin: 0 10px; } + + +#filters-apply { + text-align: right; /* IE11 only */ + text-align: end; /* Override for compatible browsers */ +} + +/* Error message */ + +.no-results-error { + text-align: center; + line-height: 180%; + font-size: 110%; + padding: 15px 15px 125px 15px; +} + +/* Responsive rules */ + +@media only screen and (max-width: 800px) { + summary { font-size: 1.30em; } + #filters-box { + margin: 10px 0 0 0; + padding: 0; + } + #filters-apply { + text-align: center; + padding: 15px; + } +} + +/* Light theme */ + +.light-theme #filters-box { + background: #dfdfdf; +} + +@media (prefers-color-scheme: light) { + .no-theme #filters-box { + background: #dfdfdf; + } +} + +/* Dark theme */ + +.dark-theme #filters-box { + background: #373737; +} + +@media (prefers-color-scheme: dark) { + .no-theme #filters-box { + background: #373737; + } +} |
