pico-rails 1.4.4 → 1.5.3

data/app/assets/stylesheets/{scss → pico/scss}/content/_typography.scss

@@ -4,7 +4,7 @@
 
 // Reboot based on :
 // - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
-// - sanitize.css v12.0.1 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
 // ––––––––––––––––––––
 
 // Add the correct font weight in Chrome, Edge, and Safari
@@ -28,23 +28,6 @@ sup {
   top: -0.5em;
 }
 
-// Remove the margin on nested lists in Chrome, Edge, IE, and Safari
-dl dl,
-dl ol,
-dl ul,
-ol dl,
-ul dl {
-  margin: 0;
-}
-
-// Remove the margin on nested lists in Edge 18- and IE
-ol ol,
-ol ul,
-ul ol,
-ul ul {
-  margin: 0;
-}
-
 // Pico
 // ––––––––––––––––––––
 
@@ -68,7 +51,8 @@ ul {
 
 // Links
 // 1. Remove the gray background on active links in IE 10
-a {
+a,
+[role="link"] {
   --color: var(--primary);
   --background-color: transparent;
   outline: none;
@@ -81,9 +65,7 @@ a {
       text-decoration var(--transition), box-shadow var(--transition);
   }
 
-  &:hover,
-  &:active,
-  &:focus {
+  &:is([aria-current], :hover, :active, :focus) {
     --color: var(--primary-hover);
     --text-decoration: underline;
   }
@@ -97,9 +79,7 @@ a {
     &.secondary {
       --color: var(--secondary);
 
-      &:hover,
-      &:active,
-      &:focus {
+      &:is([aria-current], :hover, :active, :focus) {
         --color: var(--secondary-hover);
       }
 
@@ -112,9 +92,7 @@ a {
     &.contrast {
       --color: var(--contrast);
 
-      &:hover,
-      &:active,
-      &:focus {
+      &:is([aria-current], :hover, :active, :focus) {
         --color: var(--contrast-hover);
       }
 
@@ -160,22 +138,8 @@ h6 {
 }
 
 // Margin-top for headings after a typography block
-address,
-blockquote,
-dl,
-figure,
-form,
-ol,
-p,
-pre,
-table,
-ul {
-  & ~ h1,
-  & ~ h2,
-  & ~ h3,
-  & ~ h4,
-  & ~ h5,
-  & ~ h6 {
+:where(address, blockquote, dl, figure, form, ol, p, pre, table, ul) {
+  ~ :is(h1, h2, h3, h4, h5, h6) {
     margin-top: var(--typography-spacing-vertical);
   }
 }
@@ -227,8 +191,7 @@ small {
 }
 
 // Lists
-ul,
-ol {
+:where(dl, ol, ul) {
   padding-right: 0;
   padding-left: var(--spacing);
   padding-inline-start: var(--spacing);
@@ -239,6 +202,15 @@ ol {
   }
 }
 
+// Margin-top for nested lists
+// 1. Remove the margin on nested lists in Chrome, Edge, IE, and Safari
+:where(dl, ol, ul) {
+  :is(dl, ol, ul) {
+    margin: 0; // 1
+    margin-top: calc(var(--typography-spacing-vertical) * 0.25);
+  }
+}
+
 ul li {
   list-style: square;
 }

data/app/assets/stylesheets/{scss → pico/scss}/layout/_document.scss

@@ -5,14 +5,16 @@
 
 // Reboot based on :
 // - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
-// - sanitize.css v12.0.1 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
 // ––––––––––––––––––––
 
-// Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`
+// 1. Add border box sizing in all browsers (opinionated)
+// 2. Backgrounds do not repeat by default (opinionated)
 *,
 *::before,
 *::after {
   box-sizing: border-box; // 1
+  background-repeat: no-repeat; // 2
 }
 
 // 1. Add text decoration inheritance in all browsers (opinionated)
@@ -23,23 +25,24 @@
   vertical-align: inherit; // 2
 }
 
-// 1. Correct the line height in all browsers
-// 2. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS
-// 3. Change the default tap highlight to be completely transparent in iOS
-// 4. Use the default cursor in all browsers (opinionated)
-// 5. Use a 4-space tab width in all browsers (opinionated)
-// 6. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS
-html {
-  -webkit-text-size-adjust: 100%; // 2
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); // 3
-  -ms-text-size-adjust: 100%; // 6
+// 1. Use the default cursor in all browsers (opinionated)
+// 2. Change the line height in all browsers (opinionated)
+// 3. Breaks words to prevent overflow in all browsers (opinionated)
+// 4. Use a 4-space tab width in all browsers (opinionated)
+// 5. Remove the grey highlight on links in iOS (opinionated)
+// 6. Prevent adjustments of font size after orientation changes in iOS
+:where(:root) {
+  -webkit-tap-highlight-color: transparent; // 5
+  -webkit-text-size-adjust: 100%; // 6
+  text-size-adjust: 100%; // 6
   text-rendering: optimizeLegibility;
   background-color: var(--background-color);
   color: var(--color);
   font-weight: var(--font-weight);
   font-size: var(--font-size);
-  line-height: var(--line-height); // 1
+  line-height: var(--line-height); // 2
   font-family: var(--font-family);
-  cursor: default; // 4
-  tab-size: 4; // 5
+  overflow-wrap: break-word; // 3
+  cursor: default; // 1
+  tab-size: 4; // 4
 }

data/app/assets/stylesheets/{scss → pico/scss}/layout/_sectioning.scss

@@ -5,7 +5,7 @@
 
 // Reboot based on :
 // - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
-// - sanitize.css v12.0.1 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
 // ––––––––––––––––––––
 
 // Render the `main` element consistently in IE
@@ -16,9 +16,10 @@ main {
 // Pico
 // ––––––––––––––––––––
 
+// 1. Remove the margin in all browsers (opinionated)
 body {
   width: 100%;
-  margin: 0;
+  margin: 0; // 1
 
   > header,
   > main,

data/app/assets/stylesheets/{scss → pico/scss}/themes/default/_dark.scss

@@ -105,13 +105,28 @@
   --accordion-open-summary-color: var(--muted-color);
 
   // Card (<article>)
+  $box-shadow-elevation: 1rem;
+  $box-shadow-blur-strengh: 6rem;
+  $box-shadow-opacity: 0.06;
   --card-background-color: #{mix($black, $grey-900, 25%)};
-  --card-border-color: #{mix($black, $grey-900, 37.5%)};
-  --card-box-shadow: 0 0.125rem 1rem #{rgba($black, 0.06)},
-    0 0.125rem 2rem #{rgba($black, 0.12)},
-    0 0 0 0.0625rem #{rgba($black, 0.036)};
+  --card-border-color: var(--card-background-color);
+  --card-box-shadow:
+    #{($box-shadow-elevation * 0.5 * 0.029)} #{($box-shadow-elevation * 0.029)} #{($box-shadow-blur-strengh * 0.029)} #{rgba($black, ($box-shadow-opacity * 0.283))},
+    #{($box-shadow-elevation * 0.5 * 0.067)} #{($box-shadow-elevation * 0.067)} #{($box-shadow-blur-strengh * 0.067)} #{rgba($black, ($box-shadow-opacity * 0.4))},
+    #{($box-shadow-elevation * 0.5 * 0.125)} #{($box-shadow-elevation * 0.125)} #{($box-shadow-blur-strengh * 0.125)} #{rgba($black, ($box-shadow-opacity * 0.5))},
+    #{($box-shadow-elevation * 0.5 * 0.225)} #{($box-shadow-elevation * 0.225)} #{($box-shadow-blur-strengh * 0.225)} #{rgba($black, ($box-shadow-opacity * 0.6))},
+    #{($box-shadow-elevation * 0.5 * 0.417)} #{($box-shadow-elevation * 0.417)} #{($box-shadow-blur-strengh * 0.417)} #{rgba($black, ($box-shadow-opacity * 0.717))},
+    #{($box-shadow-elevation * 0.5)} #{$box-shadow-elevation} #{$box-shadow-blur-strengh} #{rgba($black, $box-shadow-opacity)},
+    0 0 0 0.0625rem #{rgba($black, ($box-shadow-opacity * 0.25) )};
   --card-sectionning-background-color: #{mix($black, $grey-900, 12.5%)};
 
+  // Dropdown (<details role="list">)
+  --dropdown-background-color: #{$grey-900};
+  --dropdown-border-color: #{mix($grey-900, $grey-800)};
+  --dropdown-box-shadow: var(--card-box-shadow);
+  --dropdown-color: var(--color);
+  --dropdown-hover-background-color: #{rgba(mix($grey-900, $grey-800), 0.75)};
+
   // Modal (<dialog>)
   --modal-overlay-background-color: #{rgba(mix($grey-900, $grey-800), 0.9)};
 
@@ -129,6 +144,8 @@
   // Icons
   --icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
   --icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($grey-300, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron-button: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($white, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron-button-inverse: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($black, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
   --icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($grey-500, .999)}' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
   --icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($grey-300, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
   --icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($red-900, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");

data/app/assets/stylesheets/{scss → pico/scss}/themes/default/_light.scss

@@ -105,12 +105,27 @@
   --accordion-open-summary-color: var(--muted-color);
 
   // Card (<article>)
+  $box-shadow-elevation: 1rem;
+  $box-shadow-blur-strengh: 6rem;
+  $box-shadow-opacity: 0.06;
   --card-background-color: var(--background-color);
   --card-border-color: var(--muted-border-color);
-  --card-box-shadow: 0 0.125rem 1rem #{rgba($grey-900, 0.04)},
-    0 0.125rem 2rem #{rgba($grey-900, 0.08)},
-    0 0 0 0.0625rem #{rgba($grey-900, 0.024)};
-  --card-sectionning-background-color: #{mix($grey-50, $white, 25%)};
+  --card-box-shadow:
+    #{($box-shadow-elevation * 0.5 * 0.029)} #{($box-shadow-elevation * 0.029)} #{($box-shadow-blur-strengh * 0.029)} #{rgba($grey-900, ($box-shadow-opacity * 0.283))},
+    #{($box-shadow-elevation * 0.5 * 0.067)} #{($box-shadow-elevation * 0.067)} #{($box-shadow-blur-strengh * 0.067)} #{rgba($grey-900, ($box-shadow-opacity * 0.4))},
+    #{($box-shadow-elevation * 0.5 * 0.125)} #{($box-shadow-elevation * 0.125)} #{($box-shadow-blur-strengh * 0.125)} #{rgba($grey-900, ($box-shadow-opacity * 0.5))},
+    #{($box-shadow-elevation * 0.5 * 0.225)} #{($box-shadow-elevation * 0.225)} #{($box-shadow-blur-strengh * 0.225)} #{rgba($grey-900, ($box-shadow-opacity * 0.6))},
+    #{($box-shadow-elevation * 0.5 * 0.417)} #{($box-shadow-elevation * 0.417)} #{($box-shadow-blur-strengh * 0.417)} #{rgba($grey-900, ($box-shadow-opacity * 0.717))},
+    #{($box-shadow-elevation * 0.5)} #{$box-shadow-elevation} #{$box-shadow-blur-strengh} #{rgba($grey-900, $box-shadow-opacity)},
+    0 0 0 0.0625rem #{rgba($grey-900, ($box-shadow-opacity * 0.25) )};
+--card-sectionning-background-color: #{mix($grey-50, $white, 25%)};
+
+  // Dropdown (<details role="list">)
+  --dropdown-background-color: #{mix($grey-50, $white, 25%)};
+  --dropdown-border-color: #{mix($grey-100, $grey-50)};
+  --dropdown-box-shadow: var(--card-box-shadow);
+  --dropdown-color: var(--color);
+  --dropdown-hover-background-color: #{$grey-50};
 
   // Modal (<dialog>)
   --modal-overlay-background-color: #{rgba($grey-100, 0.8)};
@@ -129,6 +144,8 @@
   // Icons
   --icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
   --icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($grey-700, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron-button: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($white, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+  --icon-chevron-button-inverse: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($white, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
   --icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($grey-500, .999)}' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
   --icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($grey-700, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
   --icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='#{rgba($red-800, .999)}' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");

data/app/assets/stylesheets/{scss → pico/scss}/themes/default/_styles.scss

@@ -59,6 +59,12 @@
   --form-element-spacing-vertical: 0.75rem;
   --form-element-spacing-horizontal: 1rem;
 
+  // Spacings for nav component
+  --nav-element-spacing-vertical: 1rem;
+  --nav-element-spacing-horizontal: 0.5rem;
+  --nav-link-spacing-vertical: 0.5rem;
+  --nav-link-spacing-horizontal: 0.5rem;
+
   // Font weight for form labels & fieldsets legend
   --form-label-font-weight: var(--font-weight);
 

data/app/assets/stylesheets/{scss → pico/scss}/utilities/_accessibility.scss

@@ -2,10 +2,9 @@
  * Accessibility & User interaction
  */
 
-
 // Based on :
 // - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
-// - sanitize.css v12.0.1 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
 // ––––––––––––––––––––
 
 // Accessibility
@@ -45,7 +44,6 @@ textarea,
   -ms-touch-action: manipulation;
 }
 
-
 // Pico
 // ––––––––––––––––––––
 

data/app/assets/stylesheets/{scss → pico/scss}/utilities/_loading.scss

@@ -18,7 +18,7 @@
     border: 0.1875em solid currentColor;
     border-radius: 1em;
     border-right-color: transparent;
-    content: '';
+    content: "";
     vertical-align: text-bottom;
     vertical-align: -.125em; // Visual alignment
     animation: spinner 0.75s linear infinite;

data/app/assets/stylesheets/{scss → pico/scss}/utilities/_reduce-motion.scss

@@ -1,12 +1,10 @@
 @if $enable-transitions and $enable-important {
-
-/**
+  /**
  * Reduce Motion Features
  */
 
-
   // Based on :
-  // - sanitize.css v12.0.1 | CC0 1.0 Universal | github.com/csstools/sanitize.css
+  // - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css
   // ––––––––––––––––––––
 
   // 1. Remove animations when motion is reduced (opinionated)

data/app/assets/stylesheets/{scss → pico/scss}/utilities/_tooltip.scss

@@ -44,7 +44,7 @@
     border-left: .3rem solid transparent;
     border-radius: 0;
     background-color: transparent;
-    content: '';
+    content: "";
     color: var(--tooltip-background-color);
   }
 

data/app/assets/stylesheets/pico.scss

@@ -1,42 +1,42 @@
 /*!
- * Pico.css v1.4.4 (https://picocss.com)
- * Copyright 2019-2021 - Licensed under MIT
+ * Pico.css v1.5.3 (https://picocss.com)
+ * Copyright 2019-2022 - Licensed under MIT
  */
 
 // Config
-@import "scss/variables";
+@import "pico/scss/variables";
 
 // Theming
-@import "scss/themes/default";
+@import "pico/scss/themes/default";
 
 // Layout
-@import "scss/layout/document"; // html
-@import "scss/layout/sectioning"; // body, header, main, footer
-@import "scss/layout/container"; // .container, .container-fluid
-@import "scss/layout/section"; // section
-@import "scss/layout/grid"; // .grid
-@import "scss/layout/scroller"; // figure
+@import "pico/scss/layout/document"; // html
+@import "pico/scss/layout/sectioning"; // body, header, main, footer
+@import "pico/scss/layout/container"; // .container, .container-fluid
+@import "pico/scss/layout/section"; // section
+@import "pico/scss/layout/grid"; // .grid
+@import "pico/scss/layout/scroller"; // figure
 
 // Content
-@import "scss/content/typography"; // a, headings, p, ul, blockquote, ...
-@import "scss/content/embedded"; // audio, canvas, iframe, img, svg, video
-@import "scss/content/button"; // button, a[role=button], type=button, type=submit ...
-@import "scss/content/form"; // input, select, textarea, label, fieldset, legend
-@import "scss/content/form-checkbox-radio"; // type=checkbox, type=radio, role=switch
-@import "scss/content/form-alt-input-types"; // type=color, type=date, type=file, type=search, ...
-@import "scss/content/table"; // table, tr, td, ...
-@import "scss/content/code"; // pre, code, ...
-@import "scss/content/miscs"; // hr, template, [hidden], dialog, canvas
+@import "pico/scss/content/typography"; // a, headings, p, ul, blockquote, ...
+@import "pico/scss/content/embedded"; // audio, canvas, iframe, img, svg, video
+@import "pico/scss/content/button"; // button, a[role=button], type=button, type=submit ...
+@import "pico/scss/content/form"; // input, select, textarea, label, fieldset, legend
+@import "pico/scss/content/form-checkbox-radio"; // type=checkbox, type=radio, role=switch
+@import "pico/scss/content/form-alt-input-types"; // type=color, type=date, type=file, type=search, ...
+@import "pico/scss/content/table"; // table, tr, td, ...
+@import "pico/scss/content/code"; // pre, code, ...
+@import "pico/scss/content/miscs"; // hr, template, [hidden], dialog, canvas
 
 // Components
-@import "scss/components/accordion"; // details, summary
-@import "scss/components/card"; // article
-@import "scss/components/modal"; // dialog
-@import "scss/components/nav"; // nav
-@import "scss/components/progress"; // progress
+@import "pico/scss/components/accordion"; // details, summary
+@import "pico/scss/components/card"; // article
+@import "pico/scss/components/modal"; // dialog
+@import "pico/scss/components/nav"; // nav
+@import "pico/scss/components/progress"; // progress
 
 // Utilities
-@import "scss/utilities/loading"; // aria-busy=true
-@import "scss/utilities/tooltip"; // data-tooltip
-@import "scss/utilities/accessibility"; // -ms-touch-action, aria-*
-@import "scss/utilities/reduce-motion"; // prefers-reduced-motion
+@import "pico/scss/utilities/loading"; // aria-busy=true
+@import "pico/scss/utilities/tooltip"; // data-tooltip
+@import "pico/scss/utilities/accessibility"; // -ms-touch-action, aria-*
+@import "pico/scss/utilities/reduce-motion"; // prefers-reduced-motion

data/app/assets/stylesheets/pico.slim.scss

@@ -1,6 +1,6 @@
 /*!
- * Pico.css v1.4.4 (https://picocss.com)
- * Copyright 2019-2021 - Licensed under MIT
+ * Pico.css v1.5.3 (https://picocss.com)
+ * Copyright 2019-2022 - Licensed under MIT
  *
  * Slim version example
  * You can export only the modules you need
@@ -22,26 +22,26 @@ $enable-important: false;
 // --------------------
 
 // Config
-@import "scss/variables";
+@import "pico/scss/variables";
 
 // Theming
-@import "scss/themes/default";
+@import "pico/scss/themes/default";
 
 // Layout
-@import "scss/layout/document"; // html
-@import "scss/layout/sectioning"; // body, header, main, footer
-@import "scss/layout/container"; // .container, .container-fluid
-@import "scss/layout/section"; // section
-@import "scss/layout/grid"; // .grid
-@import "scss/layout/scroller"; // figure
+@import "pico/scss/layout/document"; // html
+@import "pico/scss/layout/sectioning"; // body, header, main, footer
+@import "pico/scss/layout/container"; // .container, .container-fluid
+@import "pico/scss/layout/section"; // section
+@import "pico/scss/layout/grid"; // .grid
+@import "pico/scss/layout/scroller"; // figure
 
 // Content
-@import "scss/content/typography"; // a, headings, p, ul, blockquote, ...
-@import "scss/content/embedded"; // audio, canvas, iframe, img, svg, video
-@import "scss/content/button"; // button, a[role=button], type=button, type=submit ...
-@import "scss/content/form"; // input, select, textarea, label, fieldset, legend
-@import "scss/content/table"; // table, tr, td, ...
+@import "pico/scss/content/typography"; // a, headings, p, ul, blockquote, ...
+@import "pico/scss/content/embedded"; // audio, canvas, iframe, img, svg, video
+@import "pico/scss/content/button"; // button, a[role=button], type=button, type=submit ...
+@import "pico/scss/content/form"; // input, select, textarea, label, fieldset, legend
+@import "pico/scss/content/table"; // table, tr, td, ...
 
 // Utilities
-@import "scss/utilities/accessibility"; // -ms-touch-action, aria-*
-@import "scss/utilities/reduce-motion"; // prefers-reduced-motion
+@import "pico/scss/utilities/accessibility"; // -ms-touch-action, aria-*
+@import "pico/scss/utilities/reduce-motion"; // prefers-reduced-motion

data/lib/pico/version.rb

@@ -1,3 +1,3 @@
 module PicoRails
-  VERSION = "1.4.4"
+  VERSION = "1.5.3"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: pico-rails
 version: !ruby/object:Gem::Version
-  version: 1.4.4
+  version: 1.5.3
 platform: ruby
 authors:
 - xzgyb
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2022-01-24 00:00:00.000000000 Z
+date: 2022-06-24 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sassc
@@ -36,36 +36,37 @@ files:
 - app/assets/stylesheets/pico.fluid.classless.scss
 - app/assets/stylesheets/pico.scss
 - app/assets/stylesheets/pico.slim.scss
-- app/assets/stylesheets/scss/_variables.scss
-- app/assets/stylesheets/scss/components/_accordion.scss
-- app/assets/stylesheets/scss/components/_card.scss
-- app/assets/stylesheets/scss/components/_modal.scss
-- app/assets/stylesheets/scss/components/_nav.scss
-- app/assets/stylesheets/scss/components/_progress.scss
-- app/assets/stylesheets/scss/content/_button.scss
-- app/assets/stylesheets/scss/content/_code.scss
-- app/assets/stylesheets/scss/content/_embedded.scss
-- app/assets/stylesheets/scss/content/_form-alt-input-types.scss
-- app/assets/stylesheets/scss/content/_form-checkbox-radio.scss
-- app/assets/stylesheets/scss/content/_form.scss
-- app/assets/stylesheets/scss/content/_miscs.scss
-- app/assets/stylesheets/scss/content/_table.scss
-- app/assets/stylesheets/scss/content/_typography.scss
-- app/assets/stylesheets/scss/layout/_container.scss
-- app/assets/stylesheets/scss/layout/_document.scss
-- app/assets/stylesheets/scss/layout/_grid.scss
-- app/assets/stylesheets/scss/layout/_scroller.scss
-- app/assets/stylesheets/scss/layout/_section.scss
-- app/assets/stylesheets/scss/layout/_sectioning.scss
-- app/assets/stylesheets/scss/themes/default.scss
-- app/assets/stylesheets/scss/themes/default/_colors.scss
-- app/assets/stylesheets/scss/themes/default/_dark.scss
-- app/assets/stylesheets/scss/themes/default/_light.scss
-- app/assets/stylesheets/scss/themes/default/_styles.scss
-- app/assets/stylesheets/scss/utilities/_accessibility.scss
-- app/assets/stylesheets/scss/utilities/_loading.scss
-- app/assets/stylesheets/scss/utilities/_reduce-motion.scss
-- app/assets/stylesheets/scss/utilities/_tooltip.scss
+- app/assets/stylesheets/pico/scss/_variables.scss
+- app/assets/stylesheets/pico/scss/components/_accordion.scss
+- app/assets/stylesheets/pico/scss/components/_card.scss
+- app/assets/stylesheets/pico/scss/components/_dropdown.scss
+- app/assets/stylesheets/pico/scss/components/_modal.scss
+- app/assets/stylesheets/pico/scss/components/_nav.scss
+- app/assets/stylesheets/pico/scss/components/_progress.scss
+- app/assets/stylesheets/pico/scss/content/_button.scss
+- app/assets/stylesheets/pico/scss/content/_code.scss
+- app/assets/stylesheets/pico/scss/content/_embedded.scss
+- app/assets/stylesheets/pico/scss/content/_form-alt-input-types.scss
+- app/assets/stylesheets/pico/scss/content/_form-checkbox-radio.scss
+- app/assets/stylesheets/pico/scss/content/_form.scss
+- app/assets/stylesheets/pico/scss/content/_miscs.scss
+- app/assets/stylesheets/pico/scss/content/_table.scss
+- app/assets/stylesheets/pico/scss/content/_typography.scss
+- app/assets/stylesheets/pico/scss/layout/_container.scss
+- app/assets/stylesheets/pico/scss/layout/_document.scss
+- app/assets/stylesheets/pico/scss/layout/_grid.scss
+- app/assets/stylesheets/pico/scss/layout/_scroller.scss
+- app/assets/stylesheets/pico/scss/layout/_section.scss
+- app/assets/stylesheets/pico/scss/layout/_sectioning.scss
+- app/assets/stylesheets/pico/scss/themes/default.scss
+- app/assets/stylesheets/pico/scss/themes/default/_colors.scss
+- app/assets/stylesheets/pico/scss/themes/default/_dark.scss
+- app/assets/stylesheets/pico/scss/themes/default/_light.scss
+- app/assets/stylesheets/pico/scss/themes/default/_styles.scss
+- app/assets/stylesheets/pico/scss/utilities/_accessibility.scss
+- app/assets/stylesheets/pico/scss/utilities/_loading.scss
+- app/assets/stylesheets/pico/scss/utilities/_reduce-motion.scss
+- app/assets/stylesheets/pico/scss/utilities/_tooltip.scss
 - lib/pico-rails.rb
 - lib/pico/engine.rb
 - lib/pico/version.rb