beercss 1.2.6 → 1.3.0

package/src/cdn/helpers/others.css

@@ -0,0 +1,90 @@
+body {
+  color: var(--color-2);
+  background-color: var(--color-5);
+  margin: 0;
+  overflow-x: hidden;
+}
+
+* {
+  -webkit-tap-highlight-color: transparent;
+  position: relative;
+  vertical-align: middle;
+  color: var(--color-2);
+}
+
+* > * {
+  color: inherit;
+}
+ 
+a,
+button,
+.button {
+  cursor: pointer;
+  text-decoration: none;
+  display: inline-flex;
+  align-items: center;
+  border: none;
+  font-family: inherit;
+  outline: inherit;
+  justify-content: center;
+}
+
+label {
+  font-size: 12rem;
+  color: #9e9e9e;
+}
+
+.wrap {
+  display: block;
+}
+
+.scroll {
+  overflow: auto;
+}
+
+.no-scroll {
+  overflow: hidden;
+}
+
+.responsive {
+  margin: 0;
+  width: -webkit-fill-available;
+  width: -moz-available;
+}
+
+.responsive > :not(.dropdown, .badge) {
+  margin: 0;
+}
+
+@media only screen and (max-width: 600px) {
+  .medium-device:not(.small-device),
+  .large-device:not(.small-device),
+  .medium-device.large-device:not(.small-device),
+  .m:not(.s),
+  .l:not(.s),
+  .m.l:not(.s) {
+    display: none !important;
+  }
+}
+
+@media only screen and (min-width: 601px) and (max-width: 992px) {
+  .small-device:not(.medium-device),
+  .large-device:not(.medium-device),
+  .small-device.large-device:not(.medium-device),
+  .s:not(.m),
+  .l:not(.m),
+  .s.l:not(.m) {
+    display: none !important;
+  }
+}
+
+@media only screen and (min-width: 993px) {
+  .medium-device:not(.large-device),
+  .small-device:not(.large-device),
+  .medium-device.small-device:not(.large-device),
+  .m:not(.l),
+  .s:not(.l),
+  .m.s:not(.l) {
+    display: none !important;
+  }
+}

package/src/cdn/helpers/paddings.css

@@ -0,0 +1,16 @@
+.no-padding {
+    padding: 0 !important;
+  }
+  
+  .small-padding {
+    padding: 8rem !important;
+  }
+  
+  .medium-padding,
+  .padding {
+    padding: 16rem !important;
+  }
+  
+  .large-padding {
+    padding: 24rem !important;
+  }

package/src/cdn/helpers/positions.css

@@ -0,0 +1,37 @@
+.front {
+  z-index: 10!important;
+}
+
+.back {
+  z-index: -10!important;
+}
+
+.left {
+  left: 0;
+}
+
+.right {
+  right: 0;
+}
+
+.top {
+  top: 0;
+}
+
+.bottom {
+  bottom: 0;
+}
+
+.center {
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.middle {
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.middle.center {
+  transform: translate(-50%, -50%);
+}

package/src/cdn/helpers/shadows.css

@@ -0,0 +1,28 @@
+.shadow {
+  background-color: #00000050 !important;
+  box-shadow: none !important;
+}
+
+.left-shadow {
+  background-color: transparent !important;
+  box-shadow: none !important;
+  background-image: linear-gradient(to right, black, transparent) !important;
+}
+
+.right-shadow {
+  background-color: transparent !important;
+  box-shadow: none !important;
+  background-image: linear-gradient(to left, black, transparent) !important;
+}
+
+.bottom-shadow {
+  background-color: transparent !important;
+  box-shadow: none !important;
+  background-image: linear-gradient(to top, black, transparent) !important;
+}
+
+.top-shadow {
+  background-color: transparent !important;
+  box-shadow: none !important;
+  background-image: linear-gradient(to bottom, black, transparent) !important;
+}

package/src/cdn/helpers/sizes.css

@@ -0,0 +1,26 @@
+.small-width {
+  width: 192rem !important;
+  max-width: 100%;
+}
+
+.medium-width {
+  width: 384rem !important;
+  max-width: 100%;
+}
+
+.large-width {
+  width: 576rem !important;
+  max-width: 100%;
+}
+
+.small-height {
+  height: 192rem !important;
+}
+
+.medium-height {
+  height: 384rem !important;
+}
+
+.large-height {
+  height: 576rem !important;
+}

package/src/cdn/helpers/spaces.css

@@ -0,0 +1,15 @@
+.space:not(.menu, nav, .row),
+.small-space:not(.menu, nav, .row) {
+  height: 16rem;
+  display: block;
+}
+
+.medium-space:not(.menu, nav, .row) {
+  height: 32rem;
+  display: block;
+}
+
+.large-space:not(.menu, nav, .row) {
+  height: 48rem;
+  display: block;
+}

package/src/cdn/{shared → helpers}/typography.css

@@ -3,7 +3,7 @@ html {
 }
 
 body {
-  font-family: "Roboto", BlinkMacSystemFont, -apple-system, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+  font-family: var(--fonts);
   font-size: 14rem;
 }
 

package/src/cdn/{shared → helpers}/waves.css

@@ -53,7 +53,7 @@ button:hover::after,
 button:focus::after {
   background-size: 15000%;
   opacity: 1;
-  transition: 0.2s background-size linear;
+  transition: var(--speed-2) background-size linear;
 }
 
 .wave:active::after,

package/src/cdn/{shared → settings}/dark.css

@@ -12,4 +12,9 @@
   --shadow-1: 0 2rem 2rem 0 rgba(0, 0, 0, 0.14), 0 1rem 5rem 0 rgba(0, 0, 0, 0.12), 0 3rem 1rem -2rem rgba(0, 0, 0, 0.2);
   --shadow-2: 0 6rem 10rem 0 rgba(0, 0, 0, 0.14), 0 1rem 18rem 0 rgba(0, 0, 0, 0.12), 0 3rem 5rem -1rem rgba(0, 0, 0, 0.3);
   --size: 1px;
+  --fonts: "Roboto", BlinkMacSystemFont, -apple-system, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+  --speed-1: 0.1s;
+  --speed-2: 0.2s;
+  --speed-3: 0.3s;
+  --speed-4: 0.4s;
 }

package/src/cdn/{shared → settings}/light.css

@@ -12,4 +12,9 @@
   --shadow-1: 0 2rem 2rem 0 rgba(0, 0, 0, 0.14), 0 1rem 5rem 0 rgba(0, 0, 0, 0.12), 0 3rem 1rem -2rem rgba(0, 0, 0, 0.2);
   --shadow-2: 0 6rem 10rem 0 rgba(0, 0, 0, 0.14), 0 1rem 18rem 0 rgba(0, 0, 0, 0.12), 0 3rem 5rem -1rem rgba(0, 0, 0, 0.3);
   --size: 1px;
+  --fonts: "Roboto", BlinkMacSystemFont, -apple-system, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+  --speed-1: 0.1s;
+  --speed-2: 0.2s;
+  --speed-3: 0.3s;
+  --speed-4: 0.4s;
 }

package/src/cdn/shared/cards.css

@@ -1,41 +0,0 @@
-.card {
-  box-shadow: var(--shadow-1);
-  background-color: var(--color-4);
-  padding: 16rem;
-  border-radius: 4rem;
-  display: block;
-  transition: 0.3s transform, 0.3s border-radius, 0.3s padding;
-}
-
-.card + .card {
-  margin-top: 16rem;
-}
-
-.row.medium-space > .col > .card + .card {
-  margin-top: 24rem;
-}
-
-.row.large-space > .col > .card + .card {
-  margin-top: 32rem;
-}
-
-.card.small {
-  height: 192rem;
-}
-
-.card.medium {
-  height: 320rem;
-}
-
-.card.large {
-  height: 512rem;
-}
-
-.card.border {
-  border: 1rem solid var(--color-2b);
-  box-shadow: none;
-}
-
-.card.round {
-  border-radius: 24rem;
-}

package/src/cdn/shared/fixed.css

@@ -1,71 +0,0 @@
-.fixed {
-  position: fixed;
-  border-radius: inherit;
-  float: none;
-}
-
-.fixed.round {
-  border-radius: 24rem;
-}
-
-.fixed.border {
-  border: 1rem solid var(--color-2b);
-}
-
-.fixed.middle {
-  top: 50%;
-  transform: translateY(-50%);
-}
-
-.fixed.center {
-  left: 50%;
-  transform: translateX(-50%);
-}
-
-.fixed.middle.center {
-  transform: translate(-50%, -50%);
-}
-
-.fixed.top {
-  top: 0;
-}
-
-.fixed.left {
-  left: 0;
-}
-
-.fixed.right {
-  right: 0;
-}
-
-.fixed.bottom {
-  bottom: 0;
-}
-
-.fixed.left.right {
-  width: auto;
-}
-
-.fixed.left.right.small {
-  height: 320rem;
-}
-
-.fixed.left.right.medium {
-  height: 448rem;
-}
-
-.fixed.left.right.large {
-  height: 704rem;
-}
-
-.fixed.top.bottom.small {
-  width: 320rem;
-}
-
-.fixed.top.bottom.medium {
-  width: 448rem;
-}
-
-.fixed.top.bottom.large {
-  width: 704rem;
-}