activeadmin_blaze_theme 0.5.16 → 0.6.0

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/blaze.scss

@@ -1,41 +1,49 @@
-@import "generics.global";
-@import "objects.containers";
-@import "objects.grid";
-@import "objects.grid.responsive";
-@import "objects.images";
-@import "objects.panels";
-@import "objects.media";
-@import "objects.forms";
-@import "objects.modals";
-@import "objects.drawers";
-@import "components.typography";
-@import "components.badges";
-@import "components.headings";
-@import "components.addresses";
-@import "components.tables";
-@import "components.cards";
-@import "components.buttons";
-@import "components.links";
-@import "components.lists";
-@import "components.breadcrumbs";
-@import "components.trees";
-@import "components.tabs";
-@import "components.inputs";
-@import "components.input-groups";
-@import "components.hints";
-@import "components.toggles";
-@import "components.tags";
-@import "components.ranges";
-@import "components.pagination";
-@import "components.overlays";
-@import "components.bubbles";
-@import "components.tooltips";
-@import "components.alerts";
-@import "components.calendars";
-@import "components.navs";
-@import "components.progress";
-@import "components.avatars";
-@import "utilities.alignment";
-@import "utilities.boxing";
-@import "utilities.elevation";
-@import "utilities.sizes";
+// @blaze/css - version: 9.2.0
+@import 'variables';
+@import 'generics.global';
+@import 'components.addresses';
+@import 'components.alerts';
+@import 'components.avatars';
+@import 'components.back-to-top';
+@import 'components.badges';
+@import 'components.breadcrumbs';
+@import 'components.buttons';
+@import 'components.calendars';
+@import 'components.cards';
+@import 'components.divider';
+@import 'components.github-buttons';
+@import 'components.file-upload';
+@import 'components.headings';
+@import 'components.hints';
+@import 'components.inputs';
+@import 'components.input-groups';
+@import 'components.links';
+@import 'components.lists';
+@import 'components.overlays';
+@import 'components.navs';
+@import 'components.pagination';
+@import 'components.progress';
+@import 'components.ranges';
+@import 'components.tabs';
+@import 'components.tables';
+@import 'components.tags';
+@import 'components.timelines';
+@import 'components.toggles';
+@import 'components.tooltips';
+@import 'components.trees';
+@import 'objects.containers';
+@import 'objects.grid';
+@import 'objects.grid.responsive';
+@import 'objects.images';
+@import 'objects.panels';
+@import 'objects.media';
+@import 'objects.forms';
+@import 'objects.modals';
+@import 'objects.drawers';
+@import 'utilities.alignment';
+@import 'utilities.boxing';
+@import 'utilities.elevation';
+@import 'utilities.radius';
+@import 'utilities.sizes';
+@import 'utilities.typography';
+@import 'utilities.visibility';

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.buttons.scss

@@ -1,83 +1,122 @@
-@import "settings.global";
+@import 'utilities.states';
 
-@mixin button-color($background-color: $button-background-color, $color: $button-color) {
-  border: $button-border;
-  background-color: $background-color;
-  color: $color;
+@mixin button-color {
+  color: var(--button-color);
+  background-color: var(--button-background-color);
+  border: 1px solid transparent;
 
   &.c-button--active {
-    background-color: darken($background-color, $color-tint);
+    filter: brightness(0.95);
   }
 
-  &:not(:disabled) {
-    &:hover {
-      background-color: lighten($background-color, $color-tint);
+  &:not(:disabled):not([disabled]) {
+    &:not(:active) {
+      &:hover {
+        filter: brightness(0.95);
+      }
     }
 
     &:focus {
-      border-color: $button-focus-border-color;
-      box-shadow: $button-focus-box-shadow;
+      border-color: var(--border-color-focus);
+      box-shadow: var(--box-shadow-focus);
     }
 
     &:active {
-      background-color: darken($background-color, $color-tint);
+      filter: brightness(0.9);
     }
   }
 }
 
-@mixin button-ghost($color: $button-ghost-color, $color-hover: $button-ghost-hover-color) {
-  border: $button-ghost-border-width $button-ghost-border-style $color;
-  background-color: transparent;
-  color: $color;
+@mixin button-ghost {
+  --button-background-color: transparent;
+
+  border: 1px solid var(--button-color);
 
   &.c-button--active {
-    border-color: darken($color, $color-tint);
-    background-color: darken($color, $color-tint);
-    color: $color-hover;
+    color: #fff;
+    background-color: var(--button-color);
+    border-color: 1px solid transparent;
   }
 
-  &:not(:disabled) {
-    &:hover {
-      background-color: $color;
-      color: $color-hover;
+  &:not(:disabled):not([disabled]) {
+    &:not(:active) {
+      &:hover {
+        color: #fff;
+        background-color: var(--button-color);
+        border-color: 1px solid transparent;
+      }
     }
 
     &:focus {
-      border-color: $button-focus-border-color;
-      box-shadow: $button-focus-box-shadow;
+      border-color: var(--border-color-focus);
+      box-shadow: var(--box-shadow-focus);
     }
 
-    &:active {
-      border-color: darken($color, $color-tint);
-      background-color: darken($color, $color-tint);
-      color: $color-hover;
+    &:active,
+    &[aria-current] {
+      color: #fff;
+      background-color: var(--button-color);
+      border-color: 1px solid transparent;
     }
   }
 }
 
 @mixin button {
   @include button-color;
+  @include disabled;
   display: inline-block;
   max-width: 100%;
-  margin: $button-margin;
-  padding: $button-padding;
-  border-radius: $button-border-radius;
-  outline: 0;
-  font-family: $button-font-family;
-  font-size: $button-font-size;
-  line-height: $button-line-height;
-  text-align: $button-text-align;
+  margin: 0;
+  padding: var(--spacing-small);
+  overflow: hidden;
+  font-size: 1em;
+  font-family: inherit;
+  line-height: normal;
+  white-space: nowrap;
+  text-align: center;
   text-decoration: none;
   text-overflow: ellipsis;
-  white-space: $button-white-space;
-  cursor: pointer;
-  overflow: hidden;
   vertical-align: middle;
+  border-radius: var(--border-radius);
+  outline: 0;
+  -webkit-appearance: none;
   appearance: none;
   user-select: none;
+}
 
-  &:disabled {
-    cursor: not-allowed;
-    opacity: $button-disabled-opacity;
+@mixin button-nude {
+  @include disabled;
+  width: auto;
+  margin: 0;
+  padding: 0;
+  overflow: visible;
+  color: inherit;
+  font: inherit;
+  line-height: normal;
+  text-align: inherit;
+  text-decoration: inherit;
+  vertical-align: inherit;
+  background: inherit;
+  border: 0;
+  border-radius: 0;
+  outline: 0;
+  -webkit-appearance: none;
+  appearance: none;
+
+  &:not(:disabled):not([disabled]) {
+    &:active {
+      background-color: transparent;
+    }
+
+    &:not(:active) {
+      &:focus {
+        border-color: var(--border-color-focus);
+        box-shadow: var(--box-shadow-focus);
+      }
+
+      &:hover {
+        background-color: transparent;
+      }
+    }
   }
 }

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.inputs.scss

@@ -1,45 +1,7 @@
-@import "settings.global";
+@import 'utilities.states';
 
 @mixin label {
   display: block;
   width: 100%;
-  padding: $label-padding;
-  cursor: pointer;
-}
-
-@mixin field {
-  display: block;
-  width: 100%;
-  margin: $field-margin;
-  padding: $field-padding;
-  border: $field-border;
-  border-radius: $field-border-radius;
-  outline: 0;
-  background-color: $field-background-color;
-  font-family: inherit;
-  font-size: $field-font-size-medium;
-  font-weight: $field-font-weight;
-  resize: vertical;
-  appearance: none;
-
-  &:focus {
-    border-color: $field-focus-border-color;
-    box-shadow: $field-focus-box-shadow;
-  }
-}
-
-@mixin label__field {
-  @include field;
-  margin: $label-field-margin;
-}
-
-@mixin disabled {
-  color: $field-disabled-color;
-  cursor: not-allowed;
-}
-
-@mixin field--disabled {
-  @include disabled;
-  border-color: $field-disabled-border-color;
-  background-color: $field-disabled-background-color;
+  padding: var(--spacing-medium) 0;
 }

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.grid.scss

@@ -1,4 +1,29 @@
-@import "settings.global";
+@import 'utilities.visibility';
+
+$grid-widths: (
+  5: 5 / 100,
+  10: 1 / 10,
+  15: 15 / 100,
+  20: 1 / 5,
+  25: 1 / 4,
+  30: 3 / 10,
+  33: 1 / 3,
+  35: 35 / 100,
+  40: 2 / 5,
+  45: 45 / 100,
+  50: 1 / 2,
+  55: 55 / 100,
+  60: 3 / 5,
+  65: 65 / 100,
+  66: 2 / 3,
+  70: 7 / 10,
+  75: 3 / 4,
+  80: 4 / 5,
+  85: 85 / 100,
+  90: 9 / 10,
+  95: 95 / 100,
+  100: 1,
+) !default;
 
 @mixin grid {
   display: flex;
@@ -22,13 +47,13 @@
 
 @mixin grid__cell {
   flex: 1;
-  padding-right: $grid-gutter;
-  padding-left: $grid-gutter;
+  padding-right: var(--grid-gutter);
+  padding-left: var(--grid-gutter);
 }
 
 @mixin grid__cell--no-gutter {
-  padding-right: .001em;
-  padding-left: .001em;
+  padding-right: 0.001em;
+  padding-left: 0.001em;
 }
 
 @mixin grid__cell--top {
@@ -61,6 +86,10 @@
   margin-left: 0;
 }
 
+@mixin grid__cell--auto {
+  flex: auto;
+}
+
 @mixin grid__cell--hidden {
   display: none;
 }
@@ -89,7 +118,7 @@
 @mixin grid__responsive-cells($screen-width) {
   @each $width, $fraction in $grid-widths {
     &--hidden\@#{$screen-width} {
-      @include grid__cell--hidden
+      @include grid__cell--hidden;
     }
 
     &--visible\@#{$screen-width} {

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_tools.mediaqueries.scss

@@ -1,37 +1,16 @@
-@import "settings.global";
-
-@mixin screen--xsmall-and-up {
-  @media (min-width: #{map-get($screen-limits, xsmall)}) {
-    @content;
-  }
-}
-
-@mixin screen--small-and-up {
-  @media (min-width: #{map-get($screen-limits, small)}) {
-    @content;
-  }
-}
-
-@mixin screen--medium-and-up {
-  @media (min-width: #{map-get($screen-limits, medium)}) {
-    @content;
-  }
-}
-
-@mixin screen--large-and-up {
-  @media (min-width: #{map-get($screen-limits, large)}) {
-    @content;
-  }
-}
-
-@mixin screen--xlarge-and-up {
-  @media (min-width: #{map-get($screen-limits, xlarge)}) {
-    @content;
-  }
-}
-
-@mixin screen--super-and-up {
-  @media (min-width: #{map-get($screen-limits, super)}) {
+$screen-limits: (
+  xsmall: 20em,
+  small: 30em,
+  medium: 48em,
+  large: 64em,
+  xlarge: 78em,
+  super: 116em,
+);
+
+$screen-adjustment: 0.01 !default;
+
+@mixin screen-and-up($size) {
+  @media (min-width: #{map-get($screen-limits, $size)}) {
     @content;
   }
 }

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.alignment.scss

@@ -2,6 +2,18 @@
   text-align: center;
 }
 
+@mixin justified {
+  text-align: justify;
+}
+
+@mixin left {
+  text-align: left;
+}
+
+@mixin right {
+  text-align: right;
+}
+
 @mixin center-block {
   position: relative;
 }

data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.states.scss

@@ -0,0 +1,7 @@
+@mixin disabled {
+  &:disabled,
+  &[disabled] {
+    cursor: not-allowed;
+    opacity: var(--disabled-opacity);
+  }
+}