Unified Diff: static/scss/components/_select.scss
Issue 29559620:
Issue 5692 - Create Browser Selector with Browser Detection Component for help.eyeo.com (Closed)
Base URL: https://hg.adblockplus.org/help.eyeo.com
Patch Set: Remove test class names from body
Created Oct. 23, 2017, 4:14 p.m.
Use n/p to move between diff chunks;
N/P to move between comments.
« static/js/main.js ('K')
|
« static/scss/components/_browser-select.scss ('k')
|
static/scss/main.scss » ('j')
|
templates/article.tmpl » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
| Index: static/scss/components/_select.scss |
| =================================================================== |
| --- a/static/scss/components/_select.scss |
| +++ b/static/scss/components/_select.scss |
| @@ -47,16 +47,17 @@ |
| margin-bottom: 0.5em; |
| padding: 0.7em; |
| border: 1px solid $gray-medium; |
| border-radius: 4px; |
| box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3); |
| color: $black; |
| background: $white; |
| list-style: none; |
| + z-index: 2; |
| a |
| { |
| color: $black; |
| } |
| } |
| .custom-select-options[aria-hidden="true"] |
| @@ -97,8 +98,73 @@ |
| content: none; |
| } |
| a |
| { |
| color: inherit; |
| } |
| } |
| + |
| +// Custom Dropdown (extends the custom select element) |
| + |
|
juliandoucette
2017/10/24 12:12:29
NIT/Suggest: Move the padding left/right from the
ire
2017/10/27 10:22:58
Done.
|
| +.custom-select-dropdown img |
| +{ |
| + @extend .heading-icon; |
| +} |
| + |
| +.custom-select-dropdown .custom-select-selected, |
| +.custom-select-dropdown .custom-select-options |
| +{ |
| + width: 100%; |
| +} |
| + |
| +.custom-select-dropdown .custom-select-selected |
| +{ |
| + position: relative; |
| + height: 2.5em; |
| + padding-right: 3.5em; |
| + color: $primary; |
| + text-align: left; |
| +} |
| + |
| +[dir="rtl"] .custom-select-dropdown .custom-select-selected |
| +{ |
| + padding-right: 0.7em; |
|
juliandoucette
2017/10/24 12:12:29
NIT/TOL: It's strange that you are padding-right h
ire
2017/10/27 10:22:58
Done.
|
| + padding-left: 3.5em; |
| + text-align: right; |
| +} |
| + |
| +.custom-select-dropdown .custom-select-selected:after |
| +{ |
| + position: absolute; |
| + top: 0; |
| + right: 0; |
| + width: 3em; |
| + height: 100%; |
| + border-left: 2px solid $gray-medium; |
| + background-image: url(/img/png/arrow-icon-down-secondary.png); |
| + background-image: linear-gradient(transparent, transparent), |
| + url(/img/svg/arrow-icon-down-secondary.svg); |
| + background-repeat: no-repeat; |
| + background-position: center; |
| + background-size: 0.7em; |
| + content: ""; |
| +} |
| + |
| +[dir="rtl"] .custom-select-dropdown .custom-select-selected:after |
| +{ |
| + right: auto; |
| + left: 0; |
| + border-right: 2px solid $gray-medium; |
| + border-left: 0; |
| +} |
| + |
| +.custom-select-dropdown .custom-select-options |
| +{ |
| + top: 100%; |
| + bottom: auto; |
| +} |
| + |
| +.custom-select-dropdown .custom-select-options li |
| +{ |
| + line-height: 2.5em; |
| +} |
« static/js/main.js ('K')
|
« static/scss/components/_browser-select.scss ('k')
|
static/scss/main.scss » ('j')
|
templates/article.tmpl » ('J')
