Version 1

[yaffs-website] / web / modules / contrib / blazy / css / components / blazy.grid.css

diff --git a/web/modules/contrib/blazy/css/components/blazy.grid.css b/web/modules/contrib/blazy/css/components/blazy.grid.css
new file mode 100644 (file)
index 0000000..b0d352a
--- /dev/null
+++ b/web/modules/contrib/blazy/css/components/blazy.grid.css
@@ -0,0 +1,296 @@
+/**
+ * @file
+ * Block grid based on Foundation 5.
+ *
+ * This is a modified version to be re-usable for divities, not only UL/OL list,
+ * as long as the list item has class "grid".
+ */
+
+[class*="block-grid-"],
+[class*="block-grid-"] * {
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+[class*="block-grid-"],
+.block [class*="block-grid-"],
+.item-list > [class*="block-grid-"] {
+  display: block;
+  list-style: none;
+  padding: 0;
+  margin: 0 -0.625rem;
+}
+
+[class*="block-grid-"]::before,
+[class*="block-grid-"]::after {
+  content: " ";
+  display: table;
+}
+
+[class*="block-grid-"]::after {
+  clear: both;
+}
+
+[class*="block-grid-"] > .grid {
+  display: block;
+  float: left;
+  height: auto;
+  list-style: none;
+  margin: 0;
+  padding: 0 0.625rem 1.25rem;
+}
+
+.block-grid--centered[class*="block-grid"],
+.item-list > .block-grid--centered[class*="block-grid"] {
+  text-align: center;
+}
+
+.block-grid--centered[class*="block-grid"] > .grid,
+.item-list > .block-grid--centered[class*="block-grid"] > .grid {
+  text-align: left;
+  display: inline-block;
+  float: none;
+  vertical-align: top;
+}
+
+@media only screen {
+  .small-block-grid-1 > .grid {
+    width: 100%;
+  }
+
+  .small-block-grid-2 > .grid {
+    width: 50%;
+  }
+
+  .small-block-grid-3 > .grid {
+    width: 33.33333%;
+  }
+
+  .small-block-grid-4 > .grid {
+    width: 25%;
+  }
+
+  .small-block-grid-5 > .grid {
+    width: 20%;
+  }
+
+  .small-block-grid-6 > .grid {
+    width: 16.66667%;
+  }
+
+  .small-block-grid-7 > .grid {
+    width: 14.28571%;
+  }
+
+  .small-block-grid-8 > .grid {
+    width: 12.5%;
+  }
+
+  .small-block-grid-9 > .grid {
+    width: 11.11111%;
+  }
+
+  .small-block-grid-10 > .grid {
+    width: 10%;
+  }
+
+  .small-block-grid-11 > .grid {
+    width: 9.09091%;
+  }
+
+  .small-block-grid-12 > .grid {
+    width: 8.33333%;
+  }
+
+  .small-block-grid-1 > .grid:nth-of-type(1n),
+  .small-block-grid-2 > .grid:nth-of-type(1n),
+  .small-block-grid-3 > .grid:nth-of-type(1n),
+  .small-block-grid-4 > .grid:nth-of-type(1n),
+  .small-block-grid-5 > .grid:nth-of-type(1n),
+  .small-block-grid-6 > .grid:nth-of-type(1n),
+  .small-block-grid-8 > .grid:nth-of-type(1n),
+  .small-block-grid-7 > .grid:nth-of-type(1n),
+  .small-block-grid-9 > .grid:nth-of-type(1n),
+  .small-block-grid-10 > .grid:nth-of-type(1n),
+  .small-block-grid-11 > .grid:nth-of-type(1n),
+  .small-block-grid-12 > .grid:nth-of-type(1n) {
+    clear: none;
+  }
+
+  .small-block-grid-1 > .grid:nth-of-type(1n+1),
+  .small-block-grid-2 > .grid:nth-of-type(2n+1),
+  .small-block-grid-3 > .grid:nth-of-type(3n+1),
+  .small-block-grid-4 > .grid:nth-of-type(4n+1),
+  .small-block-grid-5 > .grid:nth-of-type(5n+1),
+  .small-block-grid-6 > .grid:nth-of-type(6n+1),
+  .small-block-grid-7 > .grid:nth-of-type(7n+1),
+  .small-block-grid-8 > .grid:nth-of-type(8n+1),
+  .small-block-grid-9 > .grid:nth-of-type(9n+1),
+  .small-block-grid-10 > .grid:nth-of-type(10n+1),
+  .small-block-grid-11 > .grid:nth-of-type(11n+1),
+  .small-block-grid-12 > .grid:nth-of-type(12n+1) {
+    clear: both;
+  }
+}
+
+/** 641px with 16px base font. */
+@media only screen and (min-width: 40.063em) {
+  .medium-block-grid-1 > .grid {
+    width: 100%;
+  }
+
+  .medium-block-grid-2 > .grid {
+    width: 50%;
+  }
+
+  .medium-block-grid-3 > .grid {
+    width: 33.33333%;
+  }
+
+  .medium-block-grid-4 > .grid {
+    width: 25%;
+  }
+
+  .medium-block-grid-5 > .grid {
+    width: 20%;
+  }
+
+  .medium-block-grid-6 > .grid {
+    width: 16.66667%;
+  }
+
+  .medium-block-grid-7 > .grid {
+    width: 14.28571%;
+  }
+
+  .medium-block-grid-8 > .grid {
+    width: 12.5%;
+  }
+
+  .medium-block-grid-9 > .grid {
+    width: 11.11111%;
+  }
+
+  .medium-block-grid-10 > .grid {
+    width: 10%;
+  }
+
+  .medium-block-grid-11 > .grid {
+    width: 9.09091%;
+  }
+
+  .medium-block-grid-12 > .grid {
+    width: 8.33333%;
+  }
+
+  .medium-block-grid-1 > .grid:nth-of-type(1n),
+  .medium-block-grid-2 > .grid:nth-of-type(1n),
+  .medium-block-grid-3 > .grid:nth-of-type(1n),
+  .medium-block-grid-4 > .grid:nth-of-type(1n),
+  .medium-block-grid-5 > .grid:nth-of-type(1n),
+  .medium-block-grid-6 > .grid:nth-of-type(1n),
+  .medium-block-grid-7 > .grid:nth-of-type(1n),
+  .medium-block-grid-8 > .grid:nth-of-type(1n),
+  .medium-block-grid-9 > .grid:nth-of-type(1n),
+  .medium-block-grid-10 > .grid:nth-of-type(1n),
+  .medium-block-grid-11 > .grid:nth-of-type(1n),
+  .medium-block-grid-12 > .grid:nth-of-type(1n) {
+    clear: none;
+  }
+
+  .medium-block-grid-1 > .grid:nth-of-type(1n+1),
+  .medium-block-grid-2 > .grid:nth-of-type(2n+1),
+  .medium-block-grid-3 > .grid:nth-of-type(3n+1),
+  .medium-block-grid-4 > .grid:nth-of-type(4n+1),
+  .medium-block-grid-5 > .grid:nth-of-type(5n+1),
+  .medium-block-grid-6 > .grid:nth-of-type(6n+1),
+  .medium-block-grid-7 > .grid:nth-of-type(7n+1),
+  .medium-block-grid-8 > .grid:nth-of-type(8n+1),
+  .medium-block-grid-9 > .grid:nth-of-type(9n+1),
+  .medium-block-grid-10 > .grid:nth-of-type(10n+1),
+  .medium-block-grid-11 > .grid:nth-of-type(11n+1),
+  .medium-block-grid-12 > .grid:nth-of-type(12n+1) {
+    clear: both;
+  }
+}
+
+/** 1025px with 16px base font. */
+@media only screen and (min-width: 64.063em) {
+  .large-block-grid-1 > .grid {
+    width: 100%;
+  }
+
+  .large-block-grid-2 > .grid {
+    width: 50%;
+  }
+
+  .large-block-grid-3 > .grid {
+    width: 33.33333%;
+  }
+
+  .large-block-grid-4 > .grid {
+    width: 25%;
+  }
+
+  .large-block-grid-5 > .grid {
+    width: 20%;
+  }
+
+  .large-block-grid-6 > .grid {
+    width: 16.66667%;
+  }
+
+  .large-block-grid-7 > .grid {
+    width: 14.28571%;
+  }
+
+  .large-block-grid-8 > .grid {
+    width: 12.5%;
+  }
+
+  .large-block-grid-9 > .grid {
+    width: 11.11111%;
+  }
+
+  .large-block-grid-10 > .grid {
+    width: 10%;
+  }
+
+  .large-block-grid-11 > .grid {
+    width: 9.09091%;
+  }
+
+  .large-block-grid-12 > .grid {
+    width: 8.33333%;
+  }
+
+  .large-block-grid-1 > .grid:nth-of-type(1n),
+  .large-block-grid-2 > .grid:nth-of-type(1n),
+  .large-block-grid-3 > .grid:nth-of-type(1n),
+  .large-block-grid-4 > .grid:nth-of-type(1n),
+  .large-block-grid-5 > .grid:nth-of-type(1n),
+  .large-block-grid-6 > .grid:nth-of-type(1n),
+  .large-block-grid-7 > .grid:nth-of-type(1n),
+  .large-block-grid-8 > .grid:nth-of-type(1n),
+  .large-block-grid-9 > .grid:nth-of-type(1n),
+  .large-block-grid-10 > .grid:nth-of-type(1n),
+  .large-block-grid-11 > .grid:nth-of-type(1n),
+  .large-block-grid-12 > .grid:nth-of-type(1n) {
+    clear: none;
+  }
+
+  .large-block-grid-1 > .grid:nth-of-type(1n+1),
+  .large-block-grid-2 > .grid:nth-of-type(2n+1),
+  .large-block-grid-3 > .grid:nth-of-type(3n+1),
+  .large-block-grid-4 > .grid:nth-of-type(4n+1),
+  .large-block-grid-5 > .grid:nth-of-type(5n+1),
+  .large-block-grid-6 > .grid:nth-of-type(6n+1),
+  .large-block-grid-7 > .grid:nth-of-type(7n+1),
+  .large-block-grid-8 > .grid:nth-of-type(8n+1),
+  .large-block-grid-9 > .grid:nth-of-type(9n+1),
+  .large-block-grid-10 > .grid:nth-of-type(10n+1),
+  .large-block-grid-11 > .grid:nth-of-type(11n+1),
+  .large-block-grid-12 > .grid:nth-of-type(12n+1) {
+    clear: both;
+  }
+}