sneat_rails 0.1.0

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

@@ -0,0 +1,58 @@
+// List groups
+// *******************************************************************************
+
+// List Group Mixin
+@each $color, $value in $theme-colors {
+  @if $color != primary and $color != light {
+    @include template-list-group-item-variant('.list-group-item-#{$color}', $value);
+  }
+}
+
+.list-group {
+  // Timeline CSS
+  &.list-group-timeline {
+    position: relative;
+    &:before {
+      background-color: $border-color;
+      position: absolute;
+      content: '';
+      width: 1px;
+      height: 100%;
+      top: 0;
+      bottom: 0;
+      left: 0.2rem;
+    }
+    .list-group-item {
+      border: none;
+      padding-left: 1.25rem;
+      &:before {
+        position: absolute;
+        display: block;
+        content: '';
+        width: 7px;
+        height: 7px;
+        left: 0;
+        top: 50%;
+        margin-top: -3.5px;
+        border-radius: 100%;
+      }
+    }
+  }
+
+  .list-group-item.active {
+    h1,
+    .h1,
+    h2,
+    .h2,
+    h3,
+    .h3,
+    h4,
+    .h4,
+    h5,
+    .h5,
+    h6,
+    .h6 {
+      color: $list-group-active-color;
+    }
+  }
+}

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

@@ -0,0 +1,16 @@
+// Mixins
+//
+// Template mixins (custom and overrides)
+@import 'mixins/alert';
+@import 'mixins/badge';
+@import 'mixins/buttons';
+@import 'mixins/list-group';
+@import 'mixins/navs';
+@import 'mixins/pagination';
+@import 'mixins/progress';
+@import 'mixins/toasts';
+@import 'mixins/caret';
+@import 'mixins/dropdown';
+@import 'mixins/forms';
+@import 'mixins/table-variants';
+@import 'mixins/misc'; // layout, text directions & colors

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

@@ -0,0 +1,110 @@
+// Modals
+// *******************************************************************************
+
+// Modal Shadow
+.modal-content {
+  box-shadow: $modal-content-box-shadow-xs;
+}
+
+// Modal Header close btn style
+.modal {
+  .btn-close {
+    background-color: $white;
+    border-radius: $border-radius-lg;
+    opacity: 1;
+    padding: 0.635rem;
+    box-shadow: $box-shadow-sm;
+    transition: all 0.23s ease 0.1s;
+
+    @include ltr-style {
+      transform: translate(23px, -25px);
+    }
+
+    // For hover effect of close btn
+    &:hover,
+    &:focus,
+    &:active {
+      opacity: 1;
+      outline: none;
+
+      @include ltr-style {
+        transform: translate(20px, -20px);
+      }
+    }
+  }
+  .modal-header {
+    .btn-close {
+      margin-top: -1.25rem;
+    }
+  }
+}
+
+// modal footer
+.modal-footer {
+  padding: $modal-footer-padding;
+}
+
+// ! remove close button animation & shadow for .modal-dialog-scrollable, .modal-fullscreen, .modal-top modal
+.modal-dialog-scrollable,
+.modal-fullscreen,
+.modal-top {
+  .btn-close {
+    box-shadow: none;
+    @include ltr-style {
+      transform: translate(0, 0) !important;
+    }
+
+    &:hover {
+      @include ltr-style {
+        transform: translate(0, 0) !important;
+      }
+    }
+  }
+}
+
+// Top modals
+// *******************************************************************************
+
+.modal-top {
+  .modal-dialog {
+    margin-top: 0;
+  }
+
+  .modal-content {
+    @include border-top-radius(0);
+  }
+}
+
+// Responsive
+// *******************************************************************************
+
+@include media-breakpoint-down(lg) {
+  .modal-onboarding .onboarding-horizontal {
+    flex-direction: column;
+  }
+}
+@include media-breakpoint-down(md) {
+  .modal {
+    .modal-dialog:not(.modal-fullscreen) {
+      padding: 0 0.75rem;
+      padding-left: 0.75rem !important;
+    }
+    .carousel-control-prev,
+    .carousel-control-next {
+      display: none;
+    }
+  }
+}
+@include media-breakpoint-up(sm) {
+  .modal-content {
+    box-shadow: $modal-content-box-shadow-sm-up;
+  }
+  .modal-sm .modal-dialog {
+    max-width: $modal-sm;
+  }
+}
+@include media-breakpoint-up(xl) {
+  .modal-xl .modal-dialog {
+    max-width: $modal-xl;
+  }
+}

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

@@ -0,0 +1,327 @@
+// Nav
+// *******************************************************************************
+
+.nav .nav-item,
+.nav .nav-link,
+.tab-pane,
+.tab-pane .card-body {
+  outline: none !important;
+}
+
+.nav-tabs {
+  .nav-item {
+    .nav-link {
+      color: $nav-tabs-btn-color;
+      border: 0;
+      border-radius: 0;
+      &:hover,
+      &:focus {
+        color: $nav-tabs-btn-color;
+      }
+      &:not(.active) {
+        background-color: $nav-tabs-btn-bg;
+      }
+      &.disabled {
+        color: $nav-link-disabled-color;
+      }
+    }
+  }
+}
+
+// Tab and pills style
+.nav-tabs,
+.nav-pills {
+  .nav-link {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    &:not(.active) {
+      &:hover,
+      &:focus {
+        color: $nav-tabs-link-active-color;
+      }
+    }
+  }
+
+  &:not(.nav-fill):not(.nav-justified) .nav-link {
+    width: 100%;
+  }
+}
+
+.nav-pills .nav-link {
+  &:not(.active, .disabled) {
+    color: $headings-color;
+  }
+}
+
+.tab-content {
+  padding: $card-spacer-y;
+  border-radius: $border-radius;
+}
+
+// For scrollable navs/tabs/pills
+.nav-scrollable {
+  display: -webkit-inline-box;
+  display: -moz-inline-box;
+  width: 100%;
+  overflow-y: auto;
+  flex-wrap: nowrap;
+}
+
+// Tab link
+.nav-tabs .nav-link {
+  background-clip: padding-box;
+  &.active {
+    border-bottom-color: $nav-tabs-link-active-bg;
+    &:hover,
+    &:focus {
+      border-bottom-color: $nav-tabs-link-active-bg;
+    }
+  }
+  &:hover,
+  &:focus {
+    border-bottom-color: transparent;
+  }
+}
+
+// Sizing
+// *******************************************************************************
+
+.nav-sm {
+  @include template-nav-size($nav-link-padding-y-sm, $nav-link-padding-x-sm, $font-size-sm, $nav-link-line-height-sm);
+}
+.nav-lg {
+  @include template-nav-size($nav-link-padding-y-lg, $nav-link-padding-x-lg, $font-size-lg, $nav-link-line-height-lg);
+}
+
+// Top, Right, Bottom & Left Tabbed panels
+// *******************************************************************************
+
+.nav-align-top,
+.nav-align-right,
+.nav-align-bottom,
+.nav-align-left {
+  display: flex;
+
+  > .nav,
+  > div > .nav {
+    border: 0;
+    z-index: 1;
+    position: relative;
+  }
+
+  > .nav .nav-link,
+  > div > .nav .nav-link {
+    &:hover,
+    &:focus {
+      isolation: auto;
+    }
+  }
+
+  .row-bordered > [class^='col-'],
+  .row-bordered > [class*=' col-'],
+  .row-bordered > [class^='col '],
+  .row-bordered > [class*=' col '],
+  .row-bordered > [class$=' col'],
+  .row-bordered > [class='col'] {
+    &::before,
+    &::after {
+      border-color: $card-inner-border-color;
+    }
+  }
+}
+
+.nav-align-right,
+.nav-align-left {
+  align-items: stretch;
+
+  > .nav,
+  > div > .nav {
+    flex-grow: 0;
+    flex-direction: column;
+  }
+
+  > .tab-content {
+    flex-grow: 1;
+  }
+}
+
+// Top tabs
+.nav-align-top {
+  flex-direction: column;
+  .nav-tabs {
+    ~ .tab-content {
+      z-index: 1;
+      box-shadow: 0px 6px 7px -1px rgba($black, 0.12);
+    }
+    .nav-item {
+      @include ltr-style {
+        &:first-child .nav-link {
+          border-top-left-radius: $border-radius;
+        }
+        &:last-child .nav-link {
+          border-top-right-radius: $border-radius;
+        }
+        &:not(:first-child) .nav-link {
+          border-left: 1px solid $nav-tabs-border-color;
+        }
+      }
+    }
+    .nav-link {
+      &.active {
+        box-shadow: $card-box-shadow;
+      }
+    }
+  }
+}
+
+// Right tabs
+.nav-align-right {
+  flex-direction: row-reverse;
+
+  > .nav .nav-item,
+  > div > .nav .nav-item {
+    margin-left: -1px;
+    margin-bottom: 0;
+  }
+  .nav-link {
+    text-align: right;
+    justify-content: end;
+  }
+
+  .nav-tabs {
+    ~ .tab-content {
+      box-shadow: $card-box-shadow;
+    }
+    .nav-item {
+      &:not(:first-child) .nav-link {
+        border-top: 1px solid $nav-tabs-border-color;
+      }
+      @include ltr-style {
+        &:first-child .nav-link {
+          border-top-right-radius: $border-radius;
+        }
+        &:last-child .nav-link {
+          border-bottom-right-radius: $border-radius;
+        }
+      }
+    }
+    .nav-link {
+      &.active {
+        @include ltr-style {
+          box-shadow: 5px 4px 6px 0 rgba($black, 0.12);
+        }
+      }
+    }
+  }
+}
+
+// Bottom tabs
+.nav-align-bottom {
+  flex-direction: column-reverse;
+
+  > .nav .nav-item,
+  > div > .nav .nav-item {
+    margin-bottom: 0;
+    margin-top: -1px;
+  }
+
+  .nav-tabs {
+    ~ .tab-content {
+      box-shadow: $card-box-shadow;
+    }
+    .nav-item {
+      @include ltr-style {
+        &:first-child .nav-link {
+          border-bottom-left-radius: $border-radius;
+        }
+        &:last-child .nav-link {
+          border-bottom-right-radius: $border-radius;
+        }
+        &:not(:first-child) .nav-link {
+          border-left: 1px solid $nav-tabs-border-color;
+        }
+      }
+    }
+    .nav-link {
+      &.active {
+        box-shadow: 0 4px 6px 0 rgba($black, 0.12);
+      }
+    }
+  }
+}
+
+// Left tabs
+.nav-align-left {
+  > .nav .nav-item,
+  > div > .nav .nav-item {
+    margin-right: -1px;
+    margin-bottom: 0;
+  }
+  .nav-link {
+    text-align: left;
+    justify-content: start;
+  }
+  .nav-tabs {
+    ~ .tab-content {
+      box-shadow: $card-box-shadow;
+    }
+    .nav-item {
+      &:not(:first-child) .nav-link {
+        border-top: 1px solid $nav-tabs-border-color;
+      }
+      @include ltr-style {
+        &:first-child .nav-link {
+          border-top-left-radius: $border-radius;
+        }
+        &:last-child .nav-link {
+          border-bottom-left-radius: $border-radius;
+        }
+      }
+    }
+    .nav-link {
+      &.active {
+        @include ltr-style {
+          box-shadow: -5px 2px 6px 0 rgba($black, 0.12);
+        }
+      }
+    }
+  }
+}
+
+// Tab content
+.nav-align-top > .tab-content,
+.nav-align-right > .tab-content,
+.nav-align-bottom > .tab-content,
+.nav-align-left > .tab-content {
+  flex-shrink: 1;
+  border: $card-border-width solid $border-color;
+  box-shadow: $card-box-shadow;
+  background-clip: padding-box;
+  background: $nav-tabs-link-active-bg;
+}
+
+.nav-align-top :not(.nav-pills) ~ .tab-content {
+  @include border-radius(0 0 $border-radius $border-radius);
+}
+.nav-align-top .nav-tabs:not(.nav-fill) ~ .tab-content {
+  @include ltr-style {
+    @include border-top-end-radius($border-radius);
+  }
+}
+
+.nav-align-right :not(.nav-pills) ~ .tab-content {
+  @include border-radius($border-radius 0 0 $border-radius);
+}
+
+.nav-align-bottom :not(.nav-pills) ~ .tab-content {
+  @include border-radius($border-radius $border-radius 0 0);
+}
+
+.nav-align-left :not(.nav-pills) ~ .tab-content {
+  @include border-radius(0 $border-radius $border-radius 0);
+}
+
+.nav-align-left > .tab-content {
+  @include border-radius(0 $border-radius $border-radius $border-radius);
+}

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

@@ -0,0 +1,58 @@
+// Navbar
+// *******************************************************************************
+
+.navbar {
+  z-index: 2;
+  // ! Fix: navbar dropdown focus outline
+  .dropdown:focus,
+  .dropdown-toggle:focus {
+    outline: 0;
+  }
+  .navbar-toggler {
+    border: none;
+  }
+  .navbar-toggler:focus {
+    box-shadow: none;
+  }
+}
+
+.fixed-top {
+  z-index: $zindex-fixed;
+}
+
+.navbar.navbar-light {
+  color: $navbar-light-color;
+}
+
+.navbar-light .navbar-nav .nav-link.disabled {
+  color: $navbar-light-disabled-color !important;
+}
+
+.navbar.navbar-dark {
+  color: $navbar-dark-color;
+}
+
+.navbar-dark .navbar-nav .nav-link.disabled {
+  color: $navbar-dark-disabled-color !important;
+}
+
+// IE fix
+.navbar-collapse,
+.navbar-brand,
+.navbar-text {
+  flex-shrink: 1;
+}
+
+// Icons
+// .navbar-icon {
+//   font-size: 130%;
+// }
+
+// Rulers
+.navbar-dark hr {
+  border-color: rgba(255, 255, 255, 0.1);
+}
+
+.navbar-light hr {
+  border-color: $gray-100;
+}

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

@@ -0,0 +1,10 @@
+// Offcanvas
+// *******************************************************************************
+
+.offcanvas-header {
+  padding-bottom: $offcanvas-padding-y * 0.5;
+}
+
+.offcanvas-body {
+  padding-top: $offcanvas-padding-y * 0.5;
+}

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

@@ -0,0 +1,92 @@
+// Pagination
+// *******************************************************************************
+
+// Pagination next, prev, first & last css padding
+.page-item {
+  &.first,
+  &.last,
+  &.next,
+  &.prev,
+  &.previous {
+    .page-link {
+      padding-top: $pagination-padding-y - 0.125rem;
+      padding-bottom: $pagination-padding-y - 0.125rem;
+    }
+  }
+  &.disabled {
+    .page-link {
+      border-color: $pagination-border-color;
+    }
+  }
+  &.active {
+    .page-link {
+      margin: 0 0.1rem 0 0.3rem;
+    }
+  }
+}
+
+// Pagination basic style
+.page-link,
+.page-link > a {
+  @include border-radius($border-radius);
+
+  line-height: $pagination-line-height;
+  text-align: center;
+  min-width: calc(
+    #{'#{($font-size-base * $pagination-line-height) + ($pagination-padding-y * 2)} + calc(#{$pagination-border-width} * 2)'}
+  );
+
+  &:focus {
+    color: $pagination-hover-color;
+  }
+}
+
+.page-link.btn-primary {
+  box-shadow: none !important;
+}
+
+// Sizing
+// *******************************************************************************
+
+// Pagination Large
+.pagination-lg .page-link,
+.pagination-lg > li > a:not(.page-link) {
+  min-width: calc(
+    #{'#{($font-size-lg * $pagination-line-height) + ($pagination-padding-y-lg * 2)} + calc(#{$pagination-border-width} * 2)'}
+  );
+}
+.pagination-lg > .page-item {
+  &.first,
+  &.last,
+  &.next,
+  &.prev,
+  &.previous {
+    .page-link {
+      padding-top: $pagination-padding-y-lg - 0.0845rem;
+      padding-bottom: $pagination-padding-y-lg - 0.0845rem;
+    }
+  }
+}
+
+// Pagination Small
+.pagination-sm .page-link,
+.pagination-sm > li > a:not(.page-link) {
+  min-width: calc(
+    #{'#{($font-size-sm * $pagination-line-height) + ($pagination-padding-y-sm * 2)} + calc(#{$pagination-border-width} * 2)'}
+  );
+  .tf-icon {
+    font-size: $font-size-base;
+  }
+}
+.pagination-sm > .page-item {
+  &.first,
+  &.last,
+  &.next,
+  &.prev,
+  &.previous {
+    .page-link {
+      padding-top: $pagination-padding-y-sm - 0.075rem;
+      padding-bottom: $pagination-padding-y-sm - 0.075rem;
+    }
+  }
+}

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

@@ -0,0 +1,31 @@
+// Popovers
+// *******************************************************************************
+
+.modal-open .popover {
+  z-index: $zindex-modal + 1;
+}
+
+.popover {
+  box-shadow: $popover-box-shadow;
+
+  .popover-arrow {
+    z-index: 1;
+  }
+  &.bs-popover-auto {
+    &[data-popper-placement='bottom'] > .popover-arrow {
+      &::after {
+        border-bottom-color: if(not $dark-style, rgba-to-hex($popover-header-bg), $popover-header-bg);
+        top: 2px;
+      }
+      &:before {
+        top: 1px;
+      }
+    }
+  }
+}
+
+// popover header font size override
+.popover-header {
+  padding: $popover-header-padding-x $popover-header-padding-x $popover-header-padding-y;
+  @include font-size($popover-header-font-size);
+}