feat: overflow-auto

css/pico.amber.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.blue.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.amber.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.blue.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.css

@@ -715,6 +715,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.cyan.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.fuchsia.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.green.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.grey.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.indigo.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.jade.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.lime.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.orange.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.pink.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.pumpkin.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.purple.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.red.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.sand.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.slate.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.violet.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.yellow.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.conditional.zinc.min.css

@@ -712,6 +712,13 @@ main {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.pico .overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.css

@@ -715,6 +715,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.cyan.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.fuchsia.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.green.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.grey.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.indigo.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.jade.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.lime.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.orange.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.pink.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.pumpkin.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.purple.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.red.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.sand.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.slate.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.violet.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.yellow.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

css/pico.zinc.min.css

@@ -712,6 +712,13 @@ section {
   min-width: 0;
 }
 
+/**
+ * Overflow auto
+ */
+.overflow-auto {
+  overflow: auto;
+}
+
 /**
  * Link
  */

scss/_index.scss

@@ -12,6 +12,7 @@
 @use "layout/container"; // .container, .container-fluid
 @use "layout/section"; // section
 @use "layout/grid"; // .grid
+@use "layout/overflow-auto"; // .overflow-auto
 
 // Content
 @use "content/link"; // a, role="link"

scss/_settings.scss

@@ -108,6 +108,7 @@ $modules: map.merge(
     "layout/container": true,
     "layout/section": true,
     "layout/grid": true,
+    "layout/overflow-auto": true,
 
     // Content
     "content/link": true,

scss/layout/_overflow-auto.scss

@@ -0,0 +1,12 @@
+@use "sass:map";
+@use "../settings" as *;
+
+@if map.get($modules, "layout/overflow-auto") and $enable-classes {
+  /**
+   * Overflow auto
+   */
+
+  #{$parent-selector} .overflow-auto {
+    overflow: auto;
+  }
+}