sneat_rails 0.1.0

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_button-group.scss

@@ -0,0 +1,59 @@
+// Button groups
+// *******************************************************************************
+
+// * Split button
+// *******************************************************************************
+
+.dropdown-toggle-split,
+.btn-lg + .dropdown-toggle-split,
+.btn-group-lg > .btn + .dropdown-toggle-split,
+.input-group-lg .btn + .dropdown-toggle-split,
+.btn-xl + .dropdown-toggle-split,
+.btn-group-xl > .btn + .dropdown-toggle-split {
+  padding-right: 0.7em;
+  padding-left: 0.7em;
+}
+
+.btn-sm + .dropdown-toggle-split,
+.btn-group-sm > .btn + .dropdown-toggle-split,
+.input-group-sm .btn + .dropdown-toggle-split {
+  padding-right: 0.6em;
+  padding-left: 0.6em;
+}
+
+.btn-xs + .dropdown-toggle-split,
+.btn-group-xs > .btn + .dropdown-toggle-split {
+  padding-right: 0.5em;
+  padding-left: 0.5em;
+}
+
+// * Sizing
+// *******************************************************************************
+
+.btn-group-xs > .btn {
+  @extend .btn-xs;
+}
+
+.btn-group-xl > .btn {
+  @extend .btn-xl;
+}
+
+// Button groups border
+
+.btn-group > .btn-group:first-child > .btn:not([class*='btn-outline-']):first-child,
+.input-group > .btn:not([class*='btn-outline-']):first-child,
+:not(.btn-group):not(.input-group) > .btn-group > .btn:not([class*='btn-outline-']):first-child,
+.input-group > .btn-group:first-child > .btn:not([class*='btn-outline-']):first-child {
+  @include ltr-style {
+    border-left-color: transparent;
+  }
+}
+
+.btn-group > .btn-group:last-child > .btn:not([class*='btn-outline-']):last-of-type,
+.input-group > .btn:not([class*='btn-outline-']):last-of-type,
+:not(.btn-group):not(.input-group) > .btn-group > .btn:not([class*='btn-outline-']):last-of-type,
+.input-group > .btn-group:last-child > .btn:not([class*='btn-outline-']):last-of-type {
+  @include ltr-style {
+    border-right-color: transparent;
+  }
+}

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_buttons.scss

@@ -0,0 +1,127 @@
+// Buttons
+// *******************************************************************************
+
+.btn {
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  .bx {
+    line-height: 1.15;
+  }
+  &.disabled,
+  &:disabled {
+    cursor: default;
+  }
+}
+
+// Badge within button
+.btn .badge {
+  @include transition($btn-transition);
+}
+
+label.btn {
+  margin-bottom: 0;
+}
+
+// Button Sizes
+
+.btn-xl {
+  @include button-size($btn-padding-y-xl, $btn-padding-x-xl, $btn-font-size-xl, $btn-border-radius-xl);
+}
+
+.btn-xs {
+  @include button-size($btn-padding-y-xs, $btn-padding-x-xs, $btn-font-size-xs, $btn-border-radius-xs);
+}
+
+// Buttons Variant
+
+@each $color, $value in $theme-colors {
+  @if $color != primary {
+    @include template-button-variant('.btn-#{$color}', $value);
+    @include template-button-outline-variant('.btn-outline-#{$color}', $value);
+  }
+}
+
+// Icon button
+
+.btn-icon {
+  $btn-icon-size: ($btn-font-size * $btn-line-height) + ($btn-padding-y * 2);
+  $btn-icon-size-xl: ($btn-font-size-xl * $btn-line-height-xl) + ($btn-padding-y-xl * 2);
+  $btn-icon-size-lg: ($btn-font-size-lg * $btn-line-height-lg) + ($btn-padding-y-lg * 2);
+  $btn-icon-size-sm: ($btn-font-size-sm * $btn-line-height-sm) + ($btn-padding-y-sm * 2);
+  $btn-icon-size-xs: ($btn-font-size-xs * $btn-line-height-xs) + ($btn-padding-y-xs * 2);
+  $borders-width: calc(#{$btn-border-width} * 2);
+  --#{$prefix}btn-active-border-color: transparent;
+
+  padding: 0;
+  width: calc(#{$btn-icon-size} + #{$borders-width});
+  height: calc(#{$btn-icon-size} + #{$borders-width});
+  display: inline-flex;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+
+  &.btn-xl {
+    width: calc(#{$btn-icon-size-xl} + #{$borders-width});
+    height: calc(#{$btn-icon-size-xl} + #{$borders-width});
+    > span {
+      font-size: $btn-font-size-xl;
+    }
+  }
+
+  &.btn-lg {
+    width: calc(#{$btn-icon-size-lg} + #{$borders-width});
+    height: calc(#{$btn-icon-size-lg} + #{$borders-width});
+    font-size: $btn-font-size-lg;
+  }
+
+  &.btn-sm {
+    width: calc(#{$btn-icon-size-sm} + #{$borders-width});
+    height: calc(#{$btn-icon-size-sm} + #{$borders-width});
+    font-size: $btn-font-size-sm;
+  }
+
+  &.btn-xs {
+    width: calc(#{$btn-icon-size-xs} + #{$borders-width});
+    height: calc(#{$btn-icon-size-xs} + #{$borders-width});
+    font-size: $btn-font-size-xs;
+  }
+}
+
+// Without border
+
+.btn.borderless {
+  &:not(.active):not(:active):not(:hover):not(:focus),
+  :not(.show) > &.dropdown-toggle:not(:hover):not(:focus) {
+    border-color: transparent;
+    box-shadow: none;
+  }
+}
+
+// Link buttons
+.btn.btn-link {
+  font-size: inherit;
+}
+
+.btn-pinned {
+  position: absolute;
+  top: 0.75rem;
+  @include ltr-style {
+    right: 0.75rem;
+  }
+}
+
+// Button focus
+button:focus,
+button:focus-visible {
+  outline: none;
+}
+
+// Table Action Dropdown fix
+.btn:not([class*='btn-']):active,
+.btn:not([class*='btn-']).active,
+.btn:not([class*='btn-']).show,
+.btn:not([class*='btn-']) {
+  border: none;
+}

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_card.scss

@@ -0,0 +1,197 @@
+// Cards
+// *******************************************************************************
+
+.card {
+  background-clip: padding-box;
+  box-shadow: $card-box-shadow;
+  .card-link {
+    display: inline-block;
+  }
+  // ! FIX: To remove padding top from first card-body if used with card-header
+  .card-header + .card-body,
+  .card-header + .card-content > .card-body:first-of-type {
+    padding-top: 0;
+  }
+}
+
+// Card action
+.card-action {
+  // Expand card(fullscreen)
+  &.card-fullscreen {
+    display: block;
+    z-index: 9999;
+    position: fixed;
+    width: 100% !important;
+    height: 100% !important;
+    top: 0;
+    right: 0;
+    left: 0;
+    bottom: 0;
+    overflow: auto;
+    border: none;
+    border-radius: 0;
+  }
+  // Alert
+  .card-alert {
+    position: absolute;
+    width: 100%;
+    z-index: 999;
+    .alert {
+      border-bottom-right-radius: 0px;
+      border-bottom-left-radius: 0px;
+    }
+  }
+  // Collapsed
+  .card-header {
+    &.collapsed {
+      border-bottom: 0;
+    }
+  }
+
+  // Card header
+  .card-header {
+    display: flex;
+    line-height: $component-line-height;
+    .card-action-title {
+      flex-grow: 1;
+      margin-right: 0.5rem;
+    }
+    .card-action-element {
+      flex-shrink: 0;
+      background-color: inherit;
+      top: 1rem;
+      right: 1.5rem;
+      color: $body-color;
+      a {
+        color: $body-color;
+        .collapse-icon::after {
+          margin-top: -0.15rem;
+        }
+      }
+    }
+  }
+  // Block UI loader
+  .blockUI {
+    .sk-fold {
+      margin: 0 auto;
+    }
+    h5 {
+      color: $body-color;
+      margin: 1rem 0 0 0;
+    }
+  }
+}
+
+// Card inner borders
+.card-header,
+.card-footer {
+  border-color: $card-inner-border-color;
+}
+.card hr {
+  color: $card-inner-border-color;
+}
+
+.card .row-bordered > [class*=' col '],
+.card .row-bordered > [class^='col '],
+.card .row-bordered > [class*=' col-'],
+.card .row-bordered > [class^='col-'],
+.card .row-bordered > [class='col'] {
+  .card .row-bordered > [class$=' col'],
+  &::before,
+  &::after {
+    border-color: $card-inner-border-color;
+  }
+}
+
+//Card header elements
+.card-header.header-elements,
+.card-title.header-elements {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.card-header {
+  &.card-header-elements {
+    padding-top: $card-spacer-y * 0.5;
+    padding-bottom: $card-spacer-y * 0.5;
+  }
+  .card-header-elements {
+    padding-top: 0.25rem;
+    padding-bottom: 0.25rem;
+  }
+}
+
+.card-header-elements,
+.card-title-elements {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  & + &,
+  > * + * {
+    margin-left: 0.25rem;
+  }
+}
+
+.card-title {
+  &:not(:is(h1, h2, h3, h4, h5, h6)) {
+    color: $body-color;
+  }
+}
+
+.card-title {
+  &:not(:is(h1, h2, h3, h4, h5, h6)) {
+    color: $body-color;
+  }
+}
+
+// * Horizontal card radius issue fix
+.card-img-left {
+  @include border-start-radius($card-inner-border-radius);
+  @include border-end-radius(0);
+  @include media-breakpoint-down(md) {
+    @include border-top-radius($card-inner-border-radius);
+    @include border-bottom-radius(0);
+  }
+}
+
+.card-img-right {
+  @include border-end-radius($card-inner-border-radius);
+  @include border-start-radius(0);
+  @include media-breakpoint-down(md) {
+    @include border-bottom-radius($card-inner-border-radius);
+    @include border-top-radius(0);
+  }
+}
+
+// List groups
+// *******************************************************************************
+
+.card > .list-group .list-group-item {
+  padding-left: $card-spacer-x;
+  padding-right: $card-spacer-x;
+}
+
+// Card Statistics specific separator
+// *******************************************************************************
+.card {
+  .card-separator {
+    @include ltr-style {
+      border-right: $border-width solid $card-border-color;
+    }
+  }
+}
+
+@include media-breakpoint-down(md) {
+  .card {
+    .card-separator {
+      border-bottom: $border-width solid $card-border-color;
+      padding-bottom: $card-spacer-y;
+
+      @include ltr-style {
+        border-right-width: 0 !important;
+      }
+    }
+  }
+}

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_carousel.scss

@@ -0,0 +1,42 @@
+// Carousel
+// *******************************************************************************
+
+//
+.carousel {
+  .carousel-item.active,
+  .carousel-item.carousel-item-start {
+    h1,
+    .h1,
+    h2,
+    .h2,
+    h3,
+    .h3,
+    h4,
+    .h4,
+    h5,
+    .h5,
+    h6,
+    .h6 {
+      color: $carousel-caption-color;
+    }
+  }
+}
+.carousel.carousel-dark {
+  .carousel-item.active,
+  .carousel-item.carousel-item-start {
+    h1,
+    .h1,
+    h2,
+    .h2,
+    h3,
+    .h3,
+    h4,
+    .h4,
+    h5,
+    .h5,
+    h6,
+    .h6 {
+      color: $carousel-dark-caption-color;
+    }
+  }
+}

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_close.scss

@@ -0,0 +1,6 @@
+// Close buttons
+// *******************************************************************************
+
+.close:focus {
+  outline: 0;
+}

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_dropdown.scss

@@ -0,0 +1,63 @@
+// Dropdowns
+// *****************************************************************
+
+// On hover outline
+[data-trigger='hover'] {
+  outline: 0;
+}
+
+.dropdown-menu {
+  box-shadow: $dropdown-box-shadow;
+
+  // Mega dropdown inside the dropdown menu
+  .mega-dropdown > & {
+    left: 0 !important;
+    right: 0 !important;
+  }
+
+  // Badge within dropdown menu
+  .badge[class^='float-'],
+  .badge[class*=' float-'] {
+    position: relative;
+    top: 0.071em;
+  }
+}
+// Dropdown item line height
+.dropdown-item {
+  line-height: $dropdown-link-line-height;
+}
+
+// Hidden dropdown toggle arrow
+.dropdown-toggle.hide-arrow,
+.dropdown-toggle-hide-arrow > .dropdown-toggle {
+  &::before,
+  &::after {
+    display: none;
+  }
+}
+
+// Dropdown caret icon
+
+@if $enable-caret {
+  // Dropdown arrow
+  .dropdown-toggle::after {
+    @include caret-down($caret-width);
+  }
+  // Dropend arrow
+  .dropend .dropdown-toggle::after {
+    @include caret-right($caret-width);
+  }
+  // Dropstart arrow
+  .dropstart .dropdown-toggle::before {
+    @include caret-left($caret-width);
+  }
+  // Dropup arrow
+  .dropup .dropdown-toggle::after {
+    @include caret-up($caret-width);
+  }
+
+  .dropstart .dropdown-toggle::before,
+  .dropend .dropdown-toggle::after {
+    vertical-align: $caret-vertical-align;
+  }
+}

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_forms.scss

@@ -0,0 +1,10 @@
+// Forms
+// *****************************************************************
+
+@import 'forms/labels';
+@import 'forms/form-control';
+@import 'forms/form-select';
+@import 'forms/form-range';
+@import 'forms/input-group';
+@import 'forms/floating-labels';
+@import 'forms/validation';

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_functions.scss

@@ -0,0 +1,147 @@
+// Functions
+// *******************************************************************************
+
+// Lists
+// *******************************************************************************
+@function slice-list($list, $start: 1, $end: length($list)) {
+  $result: null;
+
+  @if type-of($start) != number or type-of($end) != number {
+    @warn "Either $start or $end are not a number for `slice`.";
+  } @else if $start > $end {
+    @warn "The start index has to be lesser than or equals to the end index for `slice`.";
+  } @else if $start < 1 or $end < 1 {
+    @warn "List indexes must be non-zero integers for `slice`.";
+  } @else if $start > length($list) {
+    @warn "List index is #{$start} but list is only #{length($list)} item long for `slice`.";
+  } @else if $end > length($list) {
+    @warn "List index is #{$end} but list is only #{length($list)} item long for `slice`.";
+  } @else {
+    $result: ();
+
+    @for $i from $start through $end {
+      $result: append($result, nth($list, $i));
+    }
+  }
+
+  @return $result;
+}
+
+// * Units
+// *******************************************************************************
+
+// Remove the unit of a length
+@function strip-unit($number) {
+  @if type-of($number) == 'number' and not unitless($number) {
+    @return divide($number, ($number * 0 + 1));
+  }
+
+  @return $number;
+}
+
+// Convert size px to rem
+@function px-to-rem($value) {
+  // Assumes the browser default font size = `16px`
+  @return (divide(strip-unit($value), 16)) * 1rem;
+}
+
+// Convert size rem to px
+@function rem-to-px($value) {
+  // Assumes the browser default font size = `16px`
+  @return (strip-unit($value) * 16) * 1px;
+}
+
+// * Colors
+// *******************************************************************************
+
+// ? Override shade, tint and shift function with custom background color option i.e $card-bg to make it similar like design
+// Shade a color: mix a color with background/white
+@function tint-color($color, $weight, $background: null) {
+  $background: if($background, $background, white);
+  @return mix($background, $color, $weight);
+}
+
+// Shade a color: mix a color with background/black
+@function shade-color($color, $weight, $background: null) {
+  $background: if($background, $background, black);
+  @return mix($background, $color, $weight);
+}
+
+// Shade the color if the weight is positive, else tint it
+@function shift-color($color, $weight, $background: null) {
+  @return if($weight > 0, shade-color($color, $weight, $background), tint-color($color, -$weight));
+}
+
+//RGBA to HEX
+@function rgba-to-hex($color, $background: #fff) {
+  @if $color and alpha($color) != 1 {
+    $percent: alpha($color) * 100%;
+    $opaque: opacify($color, 1);
+
+    @return mix($opaque, $background, $percent);
+  } @else {
+    @return $color;
+  }
+}
+
+// Calculating Color Contrast
+@function contrast-value($color) {
+  @if $color == transparent {
+    @return $body-color;
+  } @else if alpha($color) != 1 {
+    $color: rgba-to-hex($color);
+  }
+
+  $r: red($color);
+  $g: green($color);
+  $b: blue($color);
+
+  @return divide((($r * 299) + ($g * 587) + ($b * 114)), 1000);
+}
+
+// * Utilities
+// *******************************************************************************
+
+// Return Nav opacity, contrast-percent, contrast-percent-inverted, bg, color, active-color, disabled-color, muted-color, border
+@function get-navbar-prop($bg, $active-color: null, $inactive-color: null, $border: null) {
+  $bg: rgba-to-hex($bg);
+
+  $active-color: rgba-to-hex($active-color);
+  $active-color: if($active-color, $active-color, color-contrast($bg));
+
+  $contrast-percent: divide(contrast-value($bg), 255);
+  $contrast-percent-inverted: 1 - $contrast-percent;
+
+  $opacity: if($active-color == #fff, 0.6 + (0.4 * $contrast-percent), 0.6 + (0.4 * (1 - $contrast-percent)));
+
+  $color: if(
+    $inactive-color,
+    rgba-to-hex($inactive-color, $bg),
+    rgba-to-hex(rgba($active-color, if($contrast-percent < 0.25, $opacity + 0.2, $opacity)), $bg)
+  );
+  $disabled-color: rgba-to-hex(rgba($color, 0.6), $bg);
+  $muted-color: rgba-to-hex(rgba($color, 0.75), $bg);
+  $border: if(
+    $border,
+    $border,
+    if(
+      $contrast-percent > 0.75,
+      rgba($active-color, divide($opacity, 8)),
+      if($contrast-percent < 0.25, rgba($active-color, 0.06), rgba($active-color, 0.15))
+    )
+  );
+
+  @return (
+    // Metadata
+    opacity: $opacity,
+    contrast-percent: $contrast-percent,
+    contrast-percent-inverted: $contrast-percent-inverted,
+    // Colors
+    bg: $bg,
+    color: $color,
+    active-color: $active-color,
+    disabled-color: $disabled-color,
+    muted-color: $muted-color,
+    border: $border
+  );
+}

data/app/assets/stylesheets/sneat_rails/_bootstrap-extended/_include.scss

@@ -0,0 +1,13 @@
+//Functions
+@import 'bootstrap/scss/functions'; // Bootstrap core functions
+@import 'functions'; // Bootstrap extended functions
+
+//Variables
+@import '../_custom-variables/bootstrap-extended'; // Bootstrap extended custom variable (for customization purpose)
+@import 'variables'; // Bootstrap extended variable
+@import 'bootstrap/scss/variables'; // Bootstrap core variable
+@import 'bootstrap/scss/maps'; // Bootstrap core variable
+
+//Mixins
+@import 'bootstrap/scss/mixins'; // Bootstrap core mixins
+@import 'mixins'; // Bootstrap extended mixins