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

Added submenus to work with hamburger menu

Browse source
This commit is contained in:
Yohn 2025-01-17 04:45:55 -05:00
parent 39da3b69cc
commit ddd46d9875
254 changed files with 2946 additions and 398 deletions
Download patch file Download diff file Expand all files Collapse all files

64
css/pico.fluid.classless.css
View file

@ -203,18 +203,18 @@ input:not([type=submit],
color-scheme: light;
--pico-background-color: #fff;
--pico-color: #373c44;
--pico-text-selection-color: rgba(0, 166, 110, 0.25);
--pico-text-selection-color: rgba(2, 154, 232, 0.25);
--pico-muted-color: #646b79;
--pico-muted-border-color: rgb(231, 234, 239.5);
--pico-primary: #007a50;
--pico-primary-background: #007a50;
--pico-primary: #0172ad;
--pico-primary-background: #0172ad;
--pico-primary-border: var(--pico-primary-background);
--pico-primary-underline: rgba(0, 122, 80, 0.5);
--pico-primary-hover: #005f3d;
--pico-primary-hover-background: #006d46;
--pico-primary-underline: rgba(1, 114, 173, 0.5);
--pico-primary-hover: #015887;
--pico-primary-hover-background: #02659a;
--pico-primary-hover-border: var(--pico-primary-hover-background);
--pico-primary-hover-underline: var(--pico-primary-hover);
--pico-primary-focus: rgba(0, 166, 110, 0.5);
--pico-primary-focus: rgba(2, 154, 232, 0.5);
--pico-primary-inverse: #fff;
--pico-secondary: #5d6b89;
--pico-secondary-background: #525f7a;
@ -343,18 +343,18 @@ input:not([type=submit],
color-scheme: dark;
--pico-background-color: rgb(19, 22.5, 30.5);
--pico-color: #c2c7d0;
--pico-text-selection-color: rgba(0, 180, 120, 0.1875);
--pico-text-selection-color: rgba(1, 170, 255, 0.1875);
--pico-muted-color: #7b8495;
--pico-muted-border-color: #202632;
--pico-primary: #00b478;
--pico-primary-background: #007a50;
--pico-primary: #01aaff;
--pico-primary-background: #0172ad;
--pico-primary-border: var(--pico-primary-background);
--pico-primary-underline: rgba(0, 180, 120, 0.5);
--pico-primary-hover: #00cc88;
--pico-primary-hover-background: #00895a;
--pico-primary-underline: rgba(1, 170, 255, 0.5);
--pico-primary-hover: #79c0ff;
--pico-primary-hover-background: #017fc0;
--pico-primary-hover-border: var(--pico-primary-hover-background);
--pico-primary-hover-underline: var(--pico-primary-hover);
--pico-primary-focus: rgba(0, 180, 120, 0.375);
--pico-primary-focus: rgba(1, 170, 255, 0.375);
--pico-primary-inverse: #fff;
--pico-secondary: #969eaf;
--pico-secondary-background: #525f7a;
@ -473,18 +473,18 @@ input:not([type=submit],
color-scheme: dark;
--pico-background-color: rgb(19, 22.5, 30.5);
--pico-color: #c2c7d0;
--pico-text-selection-color: rgba(0, 180, 120, 0.1875);
--pico-text-selection-color: rgba(1, 170, 255, 0.1875);
--pico-muted-color: #7b8495;
--pico-muted-border-color: #202632;
--pico-primary: #00b478;
--pico-primary-background: #007a50;
--pico-primary: #01aaff;
--pico-primary-background: #0172ad;
--pico-primary-border: var(--pico-primary-background);
--pico-primary-underline: rgba(0, 180, 120, 0.5);
--pico-primary-hover: #00cc88;
--pico-primary-hover-background: #00895a;
--pico-primary-underline: rgba(1, 170, 255, 0.5);
--pico-primary-hover: #79c0ff;
--pico-primary-hover-background: #017fc0;
--pico-primary-hover-border: var(--pico-primary-hover-background);
--pico-primary-hover-underline: var(--pico-primary-hover);
--pico-primary-focus: rgba(0, 180, 120, 0.375);
--pico-primary-focus: rgba(1, 170, 255, 0.375);
--pico-primary-inverse: #fff;
--pico-secondary: #969eaf;
--pico-secondary-background: #525f7a;
@ -2915,7 +2915,7 @@ nav[role=navigation] {
z-index: 1;
align-items: center;
width: 100%;
overflow: hidden;
overflow: visible;
}
nav[role=navigation][data-position=start] {
/* remove the 'flex-direction' to move menu to the right */
@ -2938,6 +2938,10 @@ nav[role=navigation] > label {
@media (max-width: 510px) {
nav[role=navigation] {
flex-wrap: wrap;
overflow: hidden;
}
nav[role=navigation]:has(input[type=checkbox]:checked) {
overflow: visible;
}
nav[role=navigation] label {
display: block;
@ -2975,6 +2979,10 @@ nav[role=navigation] > label {
@media (max-width: 700px) {
nav[role=navigation][data-breakpoint=md] {
flex-wrap: wrap;
overflow: hidden;
}
nav[role=navigation][data-breakpoint=md]:has(input[type=checkbox]:checked) {
overflow: visible;
}
nav[role=navigation][data-breakpoint=md] label {
display: block;
@ -3012,6 +3020,10 @@ nav[role=navigation] > label {
@media (max-width: 950px) {
nav[role=navigation][data-breakpoint=lg] {
flex-wrap: wrap;
overflow: hidden;
}
nav[role=navigation][data-breakpoint=lg]:has(input[type=checkbox]:checked) {
overflow: visible;
}
nav[role=navigation][data-breakpoint=lg] label {
display: block;
@ -3049,6 +3061,10 @@ nav[role=navigation] > label {
@media (max-width: 1200px) {
nav[role=navigation][data-breakpoint=xl] {
flex-wrap: wrap;
overflow: hidden;
}
nav[role=navigation][data-breakpoint=xl]:has(input[type=checkbox]:checked) {
overflow: visible;
}
nav[role=navigation][data-breakpoint=xl] label {
display: block;
@ -3086,6 +3102,10 @@ nav[role=navigation] > label {
@media (max-width: 1450px) {
nav[role=navigation][data-breakpoint=xxl] {
flex-wrap: wrap;
overflow: hidden;
}
nav[role=navigation][data-breakpoint=xxl]:has(input[type=checkbox]:checked) {
overflow: visible;
}
nav[role=navigation][data-breakpoint=xxl] label {
display: block;