beercss 3.13.2 → 3.13.3

package/src/cdn/elements/shapes.css

@@ -1,259 +1,259 @@
-.shape {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--on-primary);
-  background-color: var(--primary);
-  mask-repeat: no-repeat;
-  mask-position: center;
-  mask-size: contain;
-  border-radius: 0;
-  block-size: 3.5rem;
-  inline-size: 3.5rem;
-  margin: 0 !important;
-  padding: 0 !important;
-  border: 0 !important;
-}
-
-.transparent > .shape > i {
-  filter: invert(1);
-}
-
-.shape.tiny-space {
-  mask-size: 90%;
-}
-
-.shape.space,
-.shape.small-space {
-  mask-size: 80%;
-}
-
-.shape.medium-space {
-  mask-size: 70%;
-}
-
-.shape.large-space {
-  mask-size: 60%;
-}
-
-.shape.extra-space {
-  mask-size: 50%;
-}
-
-.shape.tiny {
-  block-size: 2.5rem;
-  inline-size: 2.5rem;
-}
-
-.shape.medium {
-  block-size: 4.5rem;
-  inline-size: 4.5rem;
-}
-
-.shape.large {
-  block-size: 5.5rem;
-  inline-size: 5.5rem;
-}
-
-.shape.extra {
-  block-size: 6.5rem;
-  inline-size: 6.5rem;
-}
-
-.shape.max,
-.shape > .responsive,
-.shape > .responsive > .responsive {
-  position: absolute;
-  inset: 0;
-  block-size: 100%;
-  inline-size: 100%;
-  margin: 0 !important;
-  padding: 0 !important;
-  border: 0 !important;
-}
-
-.shape > .responsive {
-  background: inherit;
-  color: inherit;
-}
-
-.shape.rotate {
-  animation: linear to-shape-rotate infinite 12s;
-}
-
-.shape.rotate > * {
-  animation: linear to-shape-rotate infinite 12s reverse;
-}
-
-.shape.fast-rotate {
-  animation: linear to-shape-rotate infinite 6s;
-}
-
-.shape.fast-rotate > * {
-  animation: linear to-shape-rotate infinite 6s reverse;
-}
-
-.shape.slow-rotate {
-  animation: linear to-shape-rotate infinite 24s;
-}
-
-.shape.slow-rotate > * {
-  animation: linear to-shape-rotate infinite 24s reverse;
-}
-
-:is(button, .button, .chip):has(> .shape) > .responsive {
-  border: none;
-}
-
-.shape.arch {
-  mask-image: url(../shapes/arch.svg);
-}
-
-.shape.arrow {
-  mask-image: url(../shapes/arrow.svg);
-}
-
-.shape.boom {
-  mask-image: url(../shapes/boom.svg);
-}
-
-.shape.bun {
-  mask-image: url(../shapes/bun.svg);
-}
-
-.shape.burst {
-  mask-image: url(../shapes/burst.svg);
-}
-
-.shape.circle {
-  mask-image: url(../shapes/circle.svg);
-}
-
-.shape.clamshell {
-  mask-image: url(../shapes/clamshell.svg);
-}
-
-.shape.diamond {
-  mask-image: url(../shapes/diamond.svg);
-}
-
-.shape.fan {
-  mask-image: url(../shapes/fan.svg);
-}
-
-.shape.flower {
-  mask-image: url(../shapes/flower.svg);
-}
-
-.shape.gem {
-  mask-image: url(../shapes/gem.svg);
-}
-
-.shape.ghost-ish {
-  mask-image: url(../shapes/ghost-ish.svg);
-}
-
-.shape.heart {
-  mask-image: url(../shapes/heart.svg);
-}
-
-.shape.leaf-clover4 {
-  mask-image: url(../shapes/leaf-clover4.svg);
-}
-
-.shape.leaft-clover8 {
-  mask-image: url(../shapes/leaf-clover8.svg);
-}
-
-.shape.loading-indicator {
-  mask-image: url(../shapes/loading-indicator.svg);
-}
-
-.shape.oval {
-  mask-image: url(../shapes/oval.svg);
-}
-
-.shape.pentagon {
-  mask-image: url(../shapes/pentagon.svg);
-}
-
-.shape.pill {
-  mask-image: url(../shapes/pill.svg);
-}
-
-.shape.pixel-circle {
-  mask-image: url(../shapes/pixel-circle.svg);
-}
-
-.shape.pixel-triangle {
-  mask-image: url(../shapes/pixel-triangle.svg);
-}
-
-.shape.puffy {
-  mask-image: url(../shapes/puffy.svg);
-}
-
-.shape.puffy-diamond {
-  mask-image: url(../shapes/puffy-diamond.svg);
-}
-
-.shape.semicircle {
-  mask-image: url(../shapes/semicircle.svg);
-}
-
-.shape.sided-cookie4 {
-  mask-image: url(../shapes/sided-cookie4.svg);
-}
-
-.shape.sided-cookie6 {
-  mask-image: url(../shapes/sided-cookie6.svg);
-}
-
-.shape.sided-cookie7 {
-  mask-image: url(../shapes/sided-cookie7.svg);
-}
-
-.shape.sided-cookie9 {
-  mask-image: url(../shapes/sided-cookie9.svg);
-}
-
-.shape.sided-cookie12 {
-  mask-image: url(../shapes/sided-cookie12.svg);
-}
-
-.shape.slanted {
-  mask-image: url(../shapes/slanted.svg);
-}
-
-.shape.soft-boom {
-  mask-image: url(../shapes/soft-boom.svg);
-}
-
-.shape.soft-burst {
-  mask-image: url(../shapes/soft-burst.svg);
-}
-
-.shape.square {
-  mask-image: url(../shapes/square.svg);
-}
-
-.shape.sunny {
-  mask-image: url(../shapes/sunny.svg);
-}
-
-.shape.triangle {
-  mask-image: url(../shapes/triangle.svg);
-}
-
-.shape.very-sunny {
-  mask-image: url(../shapes/very-sunny.svg);
-}
-
-@keyframes to-shape-rotate {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
+.shape {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--on-primary);
+  background-color: var(--primary);
+  mask-repeat: no-repeat;
+  mask-position: center;
+  mask-size: contain;
+  border-radius: 0;
+  block-size: 3.5rem;
+  inline-size: 3.5rem;
+  margin: 0 !important;
+  padding: 0 !important;
+  border: 0 !important;
+}
+
+.transparent > .shape > i {
+  filter: invert(1);
+}
+
+.shape.tiny-space {
+  mask-size: 90%;
+}
+
+.shape.space,
+.shape.small-space {
+  mask-size: 80%;
+}
+
+.shape.medium-space {
+  mask-size: 70%;
+}
+
+.shape.large-space {
+  mask-size: 60%;
+}
+
+.shape.extra-space {
+  mask-size: 50%;
+}
+
+.shape.tiny {
+  block-size: 2.5rem;
+  inline-size: 2.5rem;
+}
+
+.shape.medium {
+  block-size: 4.5rem;
+  inline-size: 4.5rem;
+}
+
+.shape.large {
+  block-size: 5.5rem;
+  inline-size: 5.5rem;
+}
+
+.shape.extra {
+  block-size: 6.5rem;
+  inline-size: 6.5rem;
+}
+
+.shape.max,
+.shape > .responsive,
+.shape > .responsive > .responsive {
+  position: absolute;
+  inset: 0;
+  block-size: 100%;
+  inline-size: 100%;
+  margin: 0 !important;
+  padding: 0 !important;
+  border: 0 !important;
+}
+
+.shape > .responsive {
+  background: inherit;
+  color: inherit;
+}
+
+.shape.rotate {
+  animation: linear to-shape-rotate infinite 12s;
+}
+
+.shape.rotate > * {
+  animation: linear to-shape-rotate infinite 12s reverse;
+}
+
+.shape.fast-rotate {
+  animation: linear to-shape-rotate infinite 6s;
+}
+
+.shape.fast-rotate > * {
+  animation: linear to-shape-rotate infinite 6s reverse;
+}
+
+.shape.slow-rotate {
+  animation: linear to-shape-rotate infinite 24s;
+}
+
+.shape.slow-rotate > * {
+  animation: linear to-shape-rotate infinite 24s reverse;
+}
+
+:is(button, .button, .chip):has(> .shape) > .responsive {
+  border: none;
+}
+
+.shape.arch {
+  mask-image: url(../shapes/arch.svg);
+}
+
+.shape.arrow {
+  mask-image: url(../shapes/arrow.svg);
+}
+
+.shape.boom {
+  mask-image: url(../shapes/boom.svg);
+}
+
+.shape.bun {
+  mask-image: url(../shapes/bun.svg);
+}
+
+.shape.burst {
+  mask-image: url(../shapes/burst.svg);
+}
+
+.shape.circle {
+  mask-image: url(../shapes/circle.svg);
+}
+
+.shape.clamshell {
+  mask-image: url(../shapes/clamshell.svg);
+}
+
+.shape.diamond {
+  mask-image: url(../shapes/diamond.svg);
+}
+
+.shape.fan {
+  mask-image: url(../shapes/fan.svg);
+}
+
+.shape.flower {
+  mask-image: url(../shapes/flower.svg);
+}
+
+.shape.gem {
+  mask-image: url(../shapes/gem.svg);
+}
+
+.shape.ghost-ish {
+  mask-image: url(../shapes/ghost-ish.svg);
+}
+
+.shape.heart {
+  mask-image: url(../shapes/heart.svg);
+}
+
+.shape.leaf-clover4 {
+  mask-image: url(../shapes/leaf-clover4.svg);
+}
+
+.shape.leaft-clover8 {
+  mask-image: url(../shapes/leaf-clover8.svg);
+}
+
+.shape.loading-indicator {
+  mask-image: url(../shapes/loading-indicator.svg);
+}
+
+.shape.oval {
+  mask-image: url(../shapes/oval.svg);
+}
+
+.shape.pentagon {
+  mask-image: url(../shapes/pentagon.svg);
+}
+
+.shape.pill {
+  mask-image: url(../shapes/pill.svg);
+}
+
+.shape.pixel-circle {
+  mask-image: url(../shapes/pixel-circle.svg);
+}
+
+.shape.pixel-triangle {
+  mask-image: url(../shapes/pixel-triangle.svg);
+}
+
+.shape.puffy {
+  mask-image: url(../shapes/puffy.svg);
+}
+
+.shape.puffy-diamond {
+  mask-image: url(../shapes/puffy-diamond.svg);
+}
+
+.shape.semicircle {
+  mask-image: url(../shapes/semicircle.svg);
+}
+
+.shape.sided-cookie4 {
+  mask-image: url(../shapes/sided-cookie4.svg);
+}
+
+.shape.sided-cookie6 {
+  mask-image: url(../shapes/sided-cookie6.svg);
+}
+
+.shape.sided-cookie7 {
+  mask-image: url(../shapes/sided-cookie7.svg);
+}
+
+.shape.sided-cookie9 {
+  mask-image: url(../shapes/sided-cookie9.svg);
+}
+
+.shape.sided-cookie12 {
+  mask-image: url(../shapes/sided-cookie12.svg);
+}
+
+.shape.slanted {
+  mask-image: url(../shapes/slanted.svg);
+}
+
+.shape.soft-boom {
+  mask-image: url(../shapes/soft-boom.svg);
+}
+
+.shape.soft-burst {
+  mask-image: url(../shapes/soft-burst.svg);
+}
+
+.shape.square {
+  mask-image: url(../shapes/square.svg);
+}
+
+.shape.sunny {
+  mask-image: url(../shapes/sunny.svg);
+}
+
+.shape.triangle {
+  mask-image: url(../shapes/triangle.svg);
+}
+
+.shape.very-sunny {
+  mask-image: url(../shapes/very-sunny.svg);
+}
+
+@keyframes to-shape-rotate {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
 }