diff options
| author |  maTh <math-home@web.de>
| 2022-01-11 23:53:40 +0100 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2022-01-11 23:53:40 +0100 |
| commit | f94ec779e66ca7203cd3cf1e807bcf3c983ed736 (patch) | |
| tree | 2e0c0133937d92217cecc8bb2c8d0c16de54338e /p/themes/Mapco | |
| parent | 9cd9e9a0930a04f594394a8dc6a95791134521a3 (diff) | |
Improve dropdown menu mobile (#4141)
* Theme template.css
* theme adark
* theme ansum
* theme bluelagoon
* theme dark
* theme template.css RTL fix
* theme flat
* theme Origine
* theme Origine-compact
* theme Pafat
* theme Screwdriver
* theme Swage
* theme Mapco
* dropdown menu with thin scrollbar
* Fix CI foundings
* Fix RTL
* Fix CSS semicolons
* Fix CSS RTL
* Fix SCSS
* Update _mobile.scss
Diffstat (limited to 'p/themes/Mapco')
| -rw-r--r-- | p/themes/Mapco/_components.scss | 7 | ||||
| -rw-r--r-- | p/themes/Mapco/_mobile.scss | 20 | ||||
| -rw-r--r-- | p/themes/Mapco/mapco.css | 21 | ||||
| -rw-r--r-- | p/themes/Mapco/mapco.rtl.css | 21 |
4 files changed, 60 insertions, 9 deletions
diff --git a/p/themes/Mapco/_components.scss b/p/themes/Mapco/_components.scss index 840da5258..6441ac0fb 100644 --- a/p/themes/Mapco/_components.scss +++ b/p/themes/Mapco/_components.scss @@ -20,7 +20,7 @@ /*=== Dropdown */ .dropdown-menu { - margin: 0; + margin: 9px 0 0 0; padding: 0.5rem 0 1rem 0; background: $grey-lighter; font-size: 1rem; @@ -30,13 +30,14 @@ text-align: left; &::after { - background: white; + background: $grey-lighter; width: 10px; height: 10px; content: ""; position: absolute; top: -4px; - right: 13px; + right: 18px; + bottom: -14px; z-index: -10; transform: rotate(45deg); // border-top: 1px solid #95a5a6; diff --git a/p/themes/Mapco/_mobile.scss b/p/themes/Mapco/_mobile.scss index 65b31fb89..068cb1d18 100644 --- a/p/themes/Mapco/_mobile.scss +++ b/p/themes/Mapco/_mobile.scss @@ -147,7 +147,27 @@ } } + .dropdown-target:target { + ~ .dropdown-toggle::after { + background-color: $grey-lighter; + border-top: 1px solid $grey-light; + border-left: 1px solid $grey-light; + right: 21px; + bottom: -14px; + } + + ~ a.dropdown-toggle { + &:not(.btn) { + ~ .dropdown-menu { + margin-top: 0; + } + &::after { + bottom: -17px; + } + } + } + } .day { text-align: center; diff --git a/p/themes/Mapco/mapco.css b/p/themes/Mapco/mapco.css index 8edaf81c4..a050cc32d 100644 --- a/p/themes/Mapco/mapco.css +++ b/p/themes/Mapco/mapco.css @@ -228,7 +228,7 @@ form th { /*=== Dropdown */ .dropdown-menu { - margin: 0; + margin: 9px 0 0 0; padding: 0.5rem 0 1rem 0; background: #f9fafb; font-size: 1rem; @@ -238,13 +238,14 @@ form th { text-align: left; } .dropdown-menu::after { - background: white; + background: #f9fafb; width: 10px; height: 10px; content: ""; position: absolute; top: -4px; - right: 13px; + right: 18px; + bottom: -14px; z-index: -10; transform: rotate(45deg); } @@ -1566,6 +1567,20 @@ form th { padding: 0.5rem 0; } + .dropdown-target:target ~ .dropdown-toggle::after { + background-color: #f9fafb; + border-top: 1px solid #eff0f2; + border-left: 1px solid #eff0f2; + right: 21px; + bottom: -14px; + } + .dropdown-target:target ~ a.dropdown-toggle:not(.btn) ~ .dropdown-menu { + margin-top: 0; + } + .dropdown-target:target ~ a.dropdown-toggle:not(.btn)::after { + bottom: -17px; + } + .day { text-align: center; padding: 1rem 0; diff --git a/p/themes/Mapco/mapco.rtl.css b/p/themes/Mapco/mapco.rtl.css index 868766236..23fc886db 100644 --- a/p/themes/Mapco/mapco.rtl.css +++ b/p/themes/Mapco/mapco.rtl.css @@ -228,7 +228,7 @@ form th { /*=== Dropdown */ .dropdown-menu { - margin: 0; + margin: 9px 0 0 0; padding: 0.5rem 0 1rem 0; background: #f9fafb; font-size: 1rem; @@ -238,13 +238,14 @@ form th { text-align: right; } .dropdown-menu::after { - background: white; + background: #f9fafb; width: 10px; height: 10px; content: ""; position: absolute; top: -4px; - left: 13px; + left: 18px; + bottom: -14px; z-index: -10; transform: rotate(-45deg); } @@ -1566,6 +1567,20 @@ form th { padding: 0.5rem 0; } + .dropdown-target:target ~ .dropdown-toggle::after { + background-color: #f9fafb; + border-top: 1px solid #eff0f2; + border-right: 1px solid #eff0f2; + left: 21px; + bottom: -14px; + } + .dropdown-target:target ~ a.dropdown-toggle:not(.btn) ~ .dropdown-menu { + margin-top: 0; + } + .dropdown-target:target ~ a.dropdown-toggle:not(.btn)::after { + bottom: -17px; + } + .day { text-align: center; padding: 1rem 0; |