diff options
| author | 2014-01-09 21:24:48 +0100 | |
|---|---|---|
| committer | 2014-01-09 21:24:48 +0100 | |
| commit | bddbe5f79f42d526d7d56a7189ca0b65970abe89 (patch) | |
| tree | 8cea5e686731733d4fee554ee80f37ae87b2279d /p | |
| parent | 6abaf0eb72d9f15acb0959d6ae41fbc07d9c4447 (diff) | |
Changements styles filtres
Utilisation d'une coche plutôt qu'un changement de couleur.
Meilleure accessibilité avec ARIA.
Optimisation des sélecteurs CSS.
En particulier, évite les sélecteurs universels * qui sont très couteux
en performances.
https://github.com/marienfressinaud/FreshRSS/issues/277
https://github.com/marienfressinaud/FreshRSS/pull/357
Diffstat (limited to 'p')
| -rw-r--r-- | p/themes/default/global.css | 20 | ||||
| -rw-r--r-- | p/themes/default_dark/global.css | 18 | ||||
| -rw-r--r-- | p/themes/flat-design/global.css | 21 |
3 files changed, 29 insertions, 30 deletions
diff --git a/p/themes/default/global.css b/p/themes/default/global.css index d3a5cc68c..49f3aa4cd 100644 --- a/p/themes/default/global.css +++ b/p/themes/default/global.css @@ -392,28 +392,28 @@ input, select, textarea { font-size: 14px; line-height: 30px; } - .dropdown-menu .item { + .dropdown-menu > .item { display: block; height: 30px; font-size: 90%; line-height: 30px; } - .dropdown-menu .item.selected{ - background: #0062be; - } - .dropdown-menu .item.selected a{ - color: #fff; - } - .dropdown-menu .item > * { + .dropdown-menu > .item > a { display: block; padding: 0 25px; line-height: 30px; } - .dropdown-menu .item:hover { + .dropdown-menu > .item:hover { background: #0062BE; color: #fff; } - .dropdown-menu .item:hover > * { + .dropdown-menu > .item[aria-checked="true"] > a:before { + content: '✓ '; + font-weight: bold; + margin: 0 0 0 -1.2em; + padding: 0 0.2em 0 0; + } + .dropdown-menu > .item:hover > a { color: #fff; text-decoration: none; } diff --git a/p/themes/default_dark/global.css b/p/themes/default_dark/global.css index a9c83d9de..04eb723f1 100644 --- a/p/themes/default_dark/global.css +++ b/p/themes/default_dark/global.css @@ -386,22 +386,22 @@ input, select, textarea { font-size: 90%; line-height: 30px; } - .dropdown-menu .item.selected{ - background: #26303f; - } - .dropdown-menu .item.selected a{ - color: #888; - } - .dropdown-menu .item > * { + .dropdown-menu > .item > a { display: block; padding: 0 25px; line-height: 30px; } - .dropdown-menu .item:hover { + .dropdown-menu > .item:hover { background: #26303F; color: #888; } - .dropdown-menu .item:hover > * { + .dropdown-menu > .item[aria-checked="true"] > a:before { + content: '✓ '; + font-weight: bold; + margin: 0 0 0 -1.2em; + padding: 0 0.2em 0 0; + } + .dropdown-menu > .item:hover > a { color: #888; text-decoration: none; } diff --git a/p/themes/flat-design/global.css b/p/themes/flat-design/global.css index 7686b3662..5fd0a4dcf 100644 --- a/p/themes/flat-design/global.css +++ b/p/themes/flat-design/global.css @@ -381,29 +381,28 @@ input, select, textarea { font-size: 14px; line-height: 30px; } - .dropdown-menu .item { + .dropdown-menu > .item { display: block; height: 30px; font-size: 90%; line-height: 30px; } - .dropdown-menu .item.selected{ - background: #2980b9; - } - .dropdown-menu .item.selected a{ - background: #2980b9; - color: #fff; - } - .dropdown-menu .item > * { + .dropdown-menu > .item > a { display: block; padding: 0 25px; line-height: 30px; } - .dropdown-menu .item:hover { + .dropdown-menu > .item:hover > a { background: #2980b9; color: #fff; } - .dropdown-menu .item:hover > * { + .dropdown-menu > .item[aria-checked="true"] > a:before { + content: '✓ '; + font-weight: bold; + margin: 0 0 0 -1.2em; + padding: 0 0.2em 0 0; + } + .dropdown-menu > .item:hover > a { color: #fff; text-decoration: none; } |
