123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128 |
- /* from Invidious, AGPL-3.0 */
- em {
- font-weight: bold;
- font-style: normal;
- }
- 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;
- }
- }
|