mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-21 17:16:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #4 from mwargan/patch-1

Browse source 
Fix details inside drop-down being rendered as dropdown
This commit is contained in:
JWB 2024-11-10 07:39:54 -05:00 • committed by GitHub
commit e1348d054f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 7 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

14
scss/components/_dropdown.scss
View file

@ -14,7 +14,7 @@
// Marker // Marker
// –––––––––––––––––––– // ––––––––––––––––––––
summary, > summary,
> button, > button,
> a { > a {
&::after { &::after {
@ -46,7 +46,7 @@
// Button as a select // Button as a select
// inside container type accordion // inside container type accordion
// –––––––––––––––––––– // ––––––––––––––––––––
#{$parent-selector} details.dropdown summary:not([role]) { #{$parent-selector} details.dropdown > summary:not([role]) {
height: calc( height: calc(
1rem * 1rem *
var(#{$css-var-prefix}line-height) + var(#{$css-var-prefix}line-height) +
@ -126,7 +126,7 @@
display: inline; display: inline;
margin: calc(var(#{$css-var-prefix}nav-element-spacing-vertical) * -1) 0; margin: calc(var(#{$css-var-prefix}nav-element-spacing-vertical) * -1) 0;
summary { > summary {
&::after { &::after {
transform: rotate(0deg) translateX(0rem); transform: rotate(0deg) translateX(0rem);
} }
@ -156,7 +156,7 @@
// Submenu // Submenu
// –––––––––––––––––––– // ––––––––––––––––––––
#{$parent-selector} details.dropdown summary + ul { #{$parent-selector} details.dropdown > summary + ul {
display: flex; display: flex;
z-index: 99; z-index: 99;
position: absolute; position: absolute;
@ -236,14 +236,14 @@
// Button opened // Button opened
// inside container type accordion // inside container type accordion
// –––––––––––––––––––– // ––––––––––––––––––––
#{$parent-selector} details.dropdown[open] summary { #{$parent-selector} details.dropdown[open] > summary {
margin-bottom: 0; margin-bottom: 0;
} }
// Menu opened // Menu opened
// –––––––––––––––––––– // ––––––––––––––––––––
// 1. Inside container type accordion // 1. Inside container type accordion
#{$parent-selector} details.dropdown[open] summary { #{$parent-selector} details.dropdown[open] > summary {
+ ul { + ul {
transform: scaleY(1); transform: scaleY(1);
opacity: 1; opacity: 1;
@ -259,7 +259,7 @@
// Close for dropdown // Close for dropdown
// inside container type accordion // inside container type accordion
// –––––––––––––––––––– // ––––––––––––––––––––
#{$parent-selector} details.dropdown[open] summary { #{$parent-selector} details.dropdown[open] > summary {
&::before { &::before {
display: block; display: block;
z-index: 1; z-index: 1;