viniBaxter-desk_front 0.2.0

data/lib/viniBaxter/sass/desk_front/dashkit/utilities/_background.scss

@@ -0,0 +1,80 @@
+//
+// background.scss
+//
+
+
+// Fixed at the bottom
+
+.bg-fixed-bottom {
+  background-repeat: no-repeat;
+  background-position: right bottom;
+  background-size: 100% auto;
+  background-attachment: fixed;
+}
+
+// Calculate the width of the main container because 
+// the background-attachment property will use 100vw instead
+
+.navbar-vertical ~ .main-content.bg-fixed-bottom {
+  background-size: 100%;
+
+  @include media-breakpoint-up(md) {
+    background-size: calc(100% - #{$navbar-vertical-width});
+  }
+}
+
+
+// Cover
+
+.bg-cover {
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-size: cover;
+}
+
+
+// Auth
+
+.bg-auth {
+  background-color: $auth-bg;
+}
+
+
+// Ellipses
+
+@each $color, $value in $theme-colors {
+
+  .bg-ellipses.bg-#{$color} {
+    background-color: transparent !important;
+    background-repeat: no-repeat;
+    background-image: radial-gradient(#{$value}, #{$value} 70%, transparent 70.1%);
+    background-size: 200% 150%;
+    background-position: center bottom;
+  }
+}
+
+
+// Hero
+
+.bg-hero {
+  background-image: linear-gradient(to bottom, fade-out($black, .15), fade-out($black, .15)), url(#{$path-to-img}/covers/header-cover.jpg);
+  background-repeat: no-repeat, no-repeat;
+  background-position: center center, center center;
+  background-size: cover, cover;
+}
+
+
+// Colors
+
+.bg-lighter {
+  background-color: $lighter !important;
+}
+
+
+// Soft colors
+
+@each $color, $value in $theme-colors {
+  .bg-#{$color}-soft {
+    background-color: theme-color-level($color, $bg-soft-level) !important;
+  }
+}

data/lib/viniBaxter/sass/desk_front/dashkit/utilities/_borders.scss

@@ -0,0 +1,48 @@
+//
+// borders.scss
+//
+
+
+// Sizing
+
+$border-sizing: () !default;
+$border-sizing: map-merge((
+  "2": 2,
+  "3": 3,
+  "4": 4,
+  "5": 5
+), $border-sizing);
+
+@each $size, $value in $border-sizing {
+
+  .border-#{$size} {
+    border-width: $border-width * $value !important;
+  }
+
+  .border-top-#{$size} {
+    border-top-width: $border-width * $value !important;
+  }
+
+  .border-right-#{$size} {
+    border-right-width: $border-width * $value !important;
+  }
+
+  .border-bottom-#{$size} {
+    border-bottom-width: $border-width * $value !important;
+  }
+
+  .border-left-#{$size} {
+    border-left-width: $border-width * $value !important;
+  } 
+}
+
+
+// Contextual classes
+
+.border-body {
+  border-color: $body-bg !important;
+}
+
+.border-card {
+  border-color: $card-bg !important;
+}

data/lib/viniBaxter/sass/desk_front/dashkit/utilities/_lift.scss

@@ -0,0 +1,20 @@
+//
+// lift.scss
+// Theme utility
+//
+
+.lift {
+  transition: box-shadow .25s ease, transform .25s ease;
+}
+
+.lift:hover,
+.lift:focus {
+  box-shadow: $box-shadow-lift !important;
+  transform: translate3d(0, -3px, 0);
+}
+
+.lift-lg:hover,
+.lift-lg:focus {
+  box-shadow: $box-shadow-lift-lg !important;
+  transform: translate3d(0, -5px, 0);
+}

data/lib/viniBaxter/sass/desk_front/dashkit/utilities/_sizing.scss

@@ -0,0 +1,10 @@
+//
+// sizing.scss
+//
+
+.vw-100 {
+  width: 100vw !important;
+}
+.vh-100 {
+  height: 100vh !important;
+}

data/lib/viniBaxter/sass/desk_front/dashkit/utilities/_type.scss

@@ -0,0 +1,34 @@
+//
+// type.scss
+// Extended from Bootstrap
+//
+
+// Font size
+
+.font-size-base {
+  font-size: $font-size-base !important;
+}
+
+.font-size-sm {
+  font-size: $font-size-sm !important;
+}
+
+.font-size-lg {
+  font-size: $font-size-lg !important;
+}
+
+
+// Decoration
+
+.text-decoration-underline {
+  text-decoration: underline !important;
+}
+
+
+// Gray colors
+
+@each $color, $value in $grays {
+  .text-gray-#{$color} {
+    color: $value !important;
+  }
+}

data/lib/viniBaxter/sass/desk_front/dashkit/vendors/_dropzone.scss

@@ -0,0 +1,75 @@
+//
+// dropzone.scss
+// Dropzone plugin overrides
+//
+
+.dropzone {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+}
+
+.dz-message {
+  padding: 5rem 1rem;
+  background-color: $input-bg;
+  border: $input-border-width dashed $input-border-color;
+  border-radius: $border-radius;
+  text-align: center;
+  color: $text-muted;
+  transition: $transition-base;
+  order: -1;
+  cursor: pointer;
+  z-index: 999;
+
+  &:hover {
+    border-color: $text-muted;
+    color: $body-color;
+  }
+}
+
+.dz-drag-hover .dz-message {
+  border-color: $primary;
+  color: $primary;
+}
+
+.dropzone-multiple .dz-message {
+  padding-top: 2rem;
+  padding-bottom: 2rem;
+}
+
+.dropzone-single.dz-max-files-reached .dz-message {
+  background-color: fade-out($black, .1);
+  color: white;
+  opacity: 0;
+
+  &:hover {
+    opacity: 1;
+  }
+}
+
+.dz-preview-single {
+  position: absolute;
+  top: 0; right: 0; bottom: 0; left: 0;
+  border-radius: $border-radius;
+}
+
+.dz-preview-cover {
+  position: absolute;
+  top: 0; right: 0; bottom: 0; left: 0;
+  border-radius: $border-radius;
+}
+
+.dz-preview-img {
+  object-fit: cover;
+  width: 100%; height: 100%;
+  border-radius: $border-radius;
+}
+
+.dz-preview-multiple .list-group-item:last-child {
+  padding-bottom: 0;
+  border-bottom: 0;
+}
+
+[data-dz-size] strong {
+  font-weight: $font-weight-normal;
+}

data/lib/viniBaxter/sass/desk_front/dashkit/vendors/_flatpickr.scss

@@ -0,0 +1,69 @@
+//
+// flatpickr.scss
+// Flatpickr plugin overrides
+//
+
+.flatpickr-calendar {
+  background-color: $input-bg;
+  border: $input-border-width solid $input-border-color;
+  color: $input-color;
+  box-shadow: none;
+
+  * {
+    color: inherit !important;
+    fill: currentColor !important;
+  }
+
+  &.arrowTop:before {
+    border-bottom-color: $input-border-color;
+  }
+
+  &.arrowTop:after {
+    border-bottom-color: $input-bg;
+  }
+
+  .flatpickr-months {
+    padding-top: .625rem;
+    padding-bottom: .625rem;
+  }
+
+  .flatpickr-prev-month,
+  .flatpickr-next-month {
+    top: .625rem;
+  }
+
+  .flatpickr-current-month {
+    font-size: 115%;
+  }
+
+  .flatpickr-day {
+    border-radius: $border-radius;
+
+    &:hover {
+      background-color: $light;
+      border-color: $input-border-color;
+    }
+  }
+
+  .flatpickr-day.prevMonthDay {
+    color: $text-muted !important;
+  }
+
+  .flatpickr-day.today {
+    border-color: $border-color;
+  }
+
+  .flatpickr-day.selected {
+    background-color: $primary;
+    border-color: $primary;
+    color: $white !important;
+  }
+
+  .flatpickr-day.inRange {
+    background-color: $light;
+    border: none;
+    border-radius: 0;
+    box-shadow: -5px 0 0 $light, 5px 0 0 $light;
+  }
+
+}

data/lib/viniBaxter/sass/desk_front/dashkit/vendors/_list.scss

@@ -0,0 +1,11 @@
+//
+// list.scss
+//
+
+[data-toggle="lists"] .pagination > li {
+  @extend .page-item;
+}
+
+[data-toggle="lists"] .pagination .page {
+  @extend .page-link;
+}

data/lib/viniBaxter/sass/desk_front/dashkit/vendors/_quill.scss

@@ -0,0 +1,283 @@
+//
+// quill.scss
+// Quill plugin overrides
+//
+
+.ql-container {
+  font-family: $font-family-base;
+}
+
+.ql-toolbar {
+  position: relative;
+  padding: $input-padding-y $input-padding-x;
+  background-color: $input-bg;
+  border: $input-border-width solid $input-border-color;
+  border-radius: $input-border-radius $input-border-radius 0 0;
+  color: $input-color;
+}
+
+.ql-toolbar + .ql-container {
+  margin-top: -$border-width;
+}
+
+.ql-toolbar + .ql-container .ql-editor {
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.ql-editor {
+  min-height: $line-height-base * $font-size-base * 4;
+  display: block;
+  width: 100%;
+  padding: $input-padding-y $input-padding-x;
+  font-size: $font-size-base;
+  line-height: $input-line-height;
+  color: $input-color;
+  background-color: $input-bg;
+  background-clip: padding-box;
+  border: $input-border-width solid $input-border-color;
+
+  // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
+  @if $enable-rounded {
+    // Manually use the if/else instead of the mixin to account for iOS override
+    border-radius: $input-border-radius;
+  }
+
+  @else {
+    // Otherwise undo the iOS default
+    border-radius: 0;
+  }
+
+  @include box-shadow($input-box-shadow);
+  @include transition($input-transition);
+
+  // Unstyle the caret on `<select>`s in IE10+.
+  &::-ms-expand {
+    background-color: transparent;
+    border: 0;
+  }
+
+  // Customize the `:focus` state to imitate native WebKit styles.
+  @include form-control-focus($ignore-warning: true);
+}
+
+.ql-hidden {
+  position: absolute;
+  transform: scale(0);
+}
+
+
+// Placeholder
+
+.ql-editor.ql-blank::before {
+  top: $input-padding-y;
+  left: $input-padding-x;
+  font-style: normal;
+  color: $input-placeholder-color;
+}
+
+.ql-editor:focus::before {
+  display: none;
+}
+
+
+// Toolbar
+
+.ql-formats {
+  padding-left: .5rem;
+  padding-right: .5rem;
+
+  &:first-child {
+    padding-left: 0;
+  }
+
+  &:last-child {
+    padding-right: 0;
+  }
+}
+
+.ql-toolbar button {
+  padding: 0 .25rem;
+  background: none;
+  border: none;
+  color: $body-color;
+  cursor: pointer;
+  transition: $transition-base;
+
+  &:hover {
+    color: $primary;
+  }
+
+  &:first-child {
+    margin-left: -.25rem;
+  }
+}
+
+.ql-toolbar .ql-active {
+  color: $primary;
+}
+
+.ql-toolbar button svg {
+  height: $font-size-lg;
+  width: $font-size-lg;
+}
+
+.ql-toolbar .ql-stroke {
+  stroke: currentColor;
+  stroke-width: 2;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  fill: none;
+}
+
+.ql-toolbar .ql-thin {
+  stroke-width: 1;
+}
+
+.ql-toolbar .ql-fill {
+  fill: currentColor;
+}
+
+.ql-toolbar input.ql-image {
+  position: absolute;
+  transform: scale(0);
+}
+
+
+// Tooltip
+
+.ql-tooltip {
+  position: absolute;
+  display: flex;
+  flex-wrap: nowrap;
+  width: 18.5rem;
+  background-color: $popover-bg;
+  border: $popover-border-width solid $popover-border-color;
+  border-radius: $popover-border-radius;
+  padding: $input-padding-y $input-padding-x;
+  margin-top: .6rem; // arrow width
+  box-shadow: $popover-box-shadow;
+
+  // Arrow
+
+  &:before, &:after {
+    content: '';
+    position: absolute;
+    left: 50%;
+    bottom: 100%;
+    transform: translateX(-50%);
+  }
+
+  &:before {
+    border-bottom: .6rem solid $popover-border-color;
+    border-left: .6rem solid transparent;
+    border-right: .6rem solid transparent;
+  }
+
+  &:after {
+    border-bottom: .5rem solid $popover-bg;
+    border-left: .5rem solid transparent;
+    border-right: .5rem solid transparent;
+  }
+}
+
+.ql-container .ql-tooltip:hover {
+  display: flex !important;
+}
+
+.ql-tooltip .ql-preview {
+  width: 100%;
+  @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
+  @include transition($btn-transition);
+}
+
+.ql-tooltip.ql-editing .ql-preview {
+  display: none;
+}
+
+.ql-tooltip input {
+  display: none;
+  width: 100%;
+  padding-top: calc(#{$input-padding-y-sm} + #{$input-border-width});
+  padding-bottom: calc(#{$input-padding-y-sm} + #{$input-border-width});
+  background-color: transparent;
+  font-size: $font-size-sm;
+  line-height: $input-line-height-sm;
+  border: none;
+  color: $input-color;
+
+  &:focus {
+    outline: none;
+  }
+}
+
+.ql-tooltip.ql-editing input {
+  display: block;
+}
+
+
+.ql-tooltip .ql-action,
+.ql-tooltip .ql-remove {
+  margin-left: .25rem;
+}
+
+.ql-tooltip .ql-action::before,
+.ql-tooltip .ql-remove::before {
+  display: inline-block;
+  font-weight: $btn-font-weight;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: middle;
+  user-select: none;
+  border: $btn-border-width solid transparent;
+  cursor: pointer;
+  @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
+  @include transition($btn-transition);
+
+  // Share hover and focus styles
+  @include hover-focus {
+    text-decoration: none;
+  }
+
+  &:focus,
+  &.focus {
+    outline: 0;
+    box-shadow: $btn-focus-box-shadow;
+  }
+}
+
+.ql-tooltip .ql-action::before,
+.ql-tooltip.ql-editing .ql-action::before {
+  @include button-variant($primary, $primary);
+}
+
+.ql-tooltip .ql-action::before {
+  content: 'Edit';
+}
+
+.ql-tooltip.ql-editing .ql-action::before {
+  content: 'Save';
+}
+
+.ql-tooltip .ql-remove::before {
+  @include button-variant($white, $white);
+  content: 'Remove';
+  border-color: $gray-300;
+}
+
+.ql-tooltip.ql-editing .ql-remove::before {
+  display: none;
+}
+
+
+// Formatting
+
+.ql-editor blockquote {
+  margin-bottom: $spacer;
+  font-size: $blockquote-font-size;
+}
+
+.ql-editor img {
+  max-width: 100%;
+  height: auto;
+}