mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-24 10:26:13 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'll/feature/dropdown' into dev

Browse source
This commit is contained in:
Lucas Larroche 2022-01-23 13:03:54 +07:00 • committed by GitHub
commit 1bf1a8e461
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
36 changed files with 537 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

82
css/pico.css
View file

@ -2037,7 +2037,6 @@ details[open] > summary::after {
article {
margin: var(--block-spacing-vertical) 0;
padding: var(--block-spacing-vertical) var(--block-spacing-horizontal);
overflow: hidden;
border-radius: var(--border-radius);
background: var(--card-background-color);
box-shadow: var(--card-box-shadow);
@ -2343,6 +2342,87 @@ progress::-moz-progress-bar {
background-position: -200% 0;
}
}
details[role=list] {
position: relative;
padding: 0;
border-bottom: none;
}
details[role=list] summary {
margin-bottom: 0;
padding: var(--form-element-spacing-vertical) var(--form-element-spacing-horizontal);
border: var(--border-width) solid var(--form-element-border-color);
border-radius: var(--border-radius);
height: calc(1rem * var(--line-height) + var(--form-element-spacing-vertical) * 2 + var(--border-width) * 2);
line-height: inherit;
cursor: pointer;
}
details[role=list] summary::after {
transform: rotate(0deg);
height: 100%;
}
details[role=list] summary + ul {
z-index: 100;
position: absolute;
top: auto;
right: 0px;
left: 0px;
margin: 0;
padding: 0;
border: var(--border-width) solid var(--form-element-border-color);
border-top: none;
border-bottom-right-radius: var(--border-radius);
border-bottom-left-radius: var(--border-radius);
background-color: var(--background-color);
list-style: none;
}
details[role=list] summary + ul li {
margin-bottom: 0;
}
details[role=list] summary + ul li::marker {
content: "";
}
details[role=list] summary + ul li label {
cursor: pointer;
position: relative;
width: 100%;
margin: 0;
padding: var(--form-element-spacing-vertical) var(--form-element-spacing-horizontal);
}
details[role=list] summary + ul li label:hover {
background-color: var(--secondary-focus);
}
details[role=list] summary + ul li label input[type=radio],
details[role=list] summary + ul li label input[type=checkbox] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
details[role=list][disabled] summary, details[role=list].disabled summary {
color: var(--muted-color);
cursor: not-allowed;
pointer-events: none;
}
details[role=list][open] summary {
margin-bottom: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
details[role=list][open] summary::before {
display: block;
z-index: 80;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: transparent;
content: " ";
cursor: default;
}
details[role=list][open] summary::after {
transform: rotate(180deg);
}
/**
* Loading ([aria-busy=true])
*/