viniBaxter-desk_front 0.5.0 → 12.0.0

data/lib/viniBaxter/sass/desk_front/landing/spa_landing/theme/_buttons.scss

@@ -0,0 +1,115 @@
+//
+// buttons.scss
+// Extended from Bootstrap
+//
+
+.btn > img {
+  max-height: 1em;
+  width: auto;
+}
+
+.btn:not([class*="btn-outline"]) {
+  border-color: transparent !important;
+}
+
+
+// Custom colors
+
+.btn-white {
+  background-color: $white;
+  color: $primary;
+
+  @include hover-focus {
+    background-color: $white;
+    color: darken($primary, 5%);
+  }
+
+  &.active {
+    background-color: darken($white, 5%);
+    color: darken($primary, 5%);
+  }
+}
+
+.btn-group .btn-white {
+  border-color: $gray-300 !important;
+  color: $text-muted;
+
+  &.active {
+    background-color: darken($white, 5%);
+    color: darken($text-muted, 5%);
+    box-shadow: none;
+  }
+}
+
+.btn-gray-400 {
+  background-color: $gray-400;
+  color: $white;
+
+  @include hover-focus {
+    background-color: darken($gray-400, 5%);
+    color: darken($white, 5%);
+  }
+
+  &.active {
+    background-color: darken($gray-400, 5%);
+    color: darken($white, 5%);
+  }
+}
+
+.btn-outline-gray-300 {
+  border-color: $gray-300;
+  color: $primary;
+
+  @include hover-focus {
+    background-color: $primary;
+    border-color: $primary;
+    color: $white;
+  }
+
+  &.active {
+    background-color: $primary;
+    border-color: $primary;
+    color: $white;
+  }
+}
+
+
+// Soft variants
+
+@each $color, $value in $theme-colors {
+  .btn-#{$color}-soft {
+    @include btn-variant-soft(rgba($value, $btn-soft-bg-opacity), $value);
+  }
+}
+
+
+// Pill
+
+.btn-pill {
+  border-radius: $rounded-pill;
+}
+
+
+// Rounded circle
+
+.btn-rounded-circle {
+  padding-left: $btn-padding-y;
+  padding-right: $btn-padding-y;
+  border-radius: $rounded-pill;
+
+  > * {
+    display: block;
+    line-height: 1;
+    width: 1em;
+  }
+}
+
+.btn-rounded-circle.btn-lg {
+  padding-left: $btn-padding-y-lg;
+  padding-right: $btn-padding-y-lg;
+}
+
+.btn-rounded-circle.btn-sm {
+  padding-left: $btn-padding-y-sm;
+  padding-right: $btn-padding-y-sm;
+}

data/lib/viniBaxter/sass/desk_front/landing/spa_landing/theme/_card.scss

@@ -0,0 +1,219 @@
+//
+// card.scss
+// Extended from Bootstrap
+//
+
+// Card resets
+
+.card {
+  position: relative;
+  width: 100%;
+}
+.love-card {
+  font-size: 41px;
+  letter-spacing: 0px;
+  font-weight: 800;
+  font-family: circular;
+}
+
+.card-body {
+  display: block;
+  flex-grow: 0;
+}
+
+.card-footer {
+  background-color: unset;
+}
+
+.card-body,
+.card-footer,
+.card-meta,
+.card-img,
+.card-img-top,
+.card-img-left,
+.card-img-right {
+  position: relative;
+  min-height: 1px;
+}
+
+// Card action
+
+a.card,
+a.card-body,
+a.card-footer,
+a.card-meta {
+  color: inherit;
+
+  @include hover {
+    text-decoration: none;
+  }
+}
+
+// Card flush
+
+.card-flush {
+  background-color: unset;
+}
+
+.card-flush > *:not(.card-btn) {
+  padding-left: 0;
+  padding-right: 0;
+}
+
+// Card border
+
+.card-border {
+  position: relative;
+}
+
+.card-border::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 100%;
+  border-top-width: $border-width * 2;
+  border-bottom-width: calc(#{$card-border-radius} - #{$border-width * 2});
+  border-top-style: solid;
+  border-bottom-style: solid;
+  border-top-color: inherit;
+  border-bottom-color: transparent;
+  border-top-left-radius: $card-border-radius;
+  border-top-right-radius: $card-border-radius;
+}
+
+.card-border-lg::after {
+  border-top-width: $border-width * 3;
+  border-bottom-width: calc(#{$card-border-radius} - #{$border-width * 3});
+}
+
+.card-border-xl::after {
+  border-top-width: $border-width * 4;
+  border-bottom-width: calc(#{$card-border-radius} - #{$border-width * 3});
+}
+
+// Card row
+
+.card-row {
+  .card-body {
+    @include media-breakpoint-up(md) {
+      padding: $card-row-spacer-y $card-row-spacer-x;
+    }
+  }
+
+  .card-meta {
+    @include media-breakpoint-up(md) {
+      padding-left: $card-row-spacer-x;
+      padding-right: $card-row-spacer-x;
+    }
+  }
+}
+
+// Card image
+
+.card-img-right {
+  border-radius: $border-radius $border-radius 0 0;
+
+  @include media-breakpoint-up(md) {
+    border-radius: 0 $border-radius $border-radius 0;
+  }
+}
+
+.card-img-left {
+  border-radius: $border-radius $border-radius 0 0;
+
+  @include media-breakpoint-up(md) {
+    border-radius: $border-radius 0 0 $border-radius;
+  }
+}
+
+// Card image slider
+
+.card-img-slider {
+  @include media-breakpoint-up(md) {
+    height: 100%;
+    width: 100%;
+
+    * {
+      height: inherit !important;
+      width: inherit !important;
+    }
+  }
+}
+
+// Card image overlay
+
+.card-img-overlay {
+  display: flex;
+  flex-direction: column;
+  padding: $card-spacer-x;
+}
+
+.card-img-overlay .card-body {
+  margin: -$card-spacer-x;
+  margin-top: auto;
+  border-bottom-right-radius: $card-inner-border-radius;
+  border-bottom-left-radius: $card-inner-border-radius;
+}
+
+.card-img-overlay-hover {
+  overflow: hidden;
+}
+
+.card-img-overlay-hover .card-body {
+  transform: translateY(110%);
+  transition: all 0.3s ease;
+}
+
+.card-img-overlay-hover:hover .card-body {
+  transform: translateY(0);
+}
+
+// Card group
+
+.card-group {
+  @include media-breakpoint-only(sm) {
+    flex-direction: column !important;
+
+    > .card {
+      flex: auto;
+    }
+  }
+}
+
+// Card meta
+
+.card-meta {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  padding: 0 $card-spacer-x $card-meta-spacer-y;
+}
+
+.card-meta-divider {
+  width: 100%;
+  margin: 0 0 $card-meta-spacer-y;
+}
+
+// Card button
+
+.card-btn:last-child {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+
+// Zoom
+
+.card-zoom {
+  overflow: hidden !important;
+  border-radius: inherit;
+}
+
+.card-zoom > [class*='card-img'] {
+  transition: all 0.3s ease;
+  transform-origin: center center;
+}
+
+.card:hover > .card-zoom > [class*='card-img'] {
+  transform: scale(1.1);
+}

data/lib/viniBaxter/sass/desk_front/landing/spa_landing/theme/_close.scss

@@ -0,0 +1,11 @@
+//
+// close.scss
+// Extended from Bootstrap
+//
+
+.close {
+
+  @include hover-focus {
+    outline: none;
+  }
+}

data/lib/viniBaxter/sass/desk_front/landing/spa_landing/theme/_collapse.scss

@@ -0,0 +1,15 @@
+//
+// collapse.scss
+// Theme component
+//
+
+.collapse-chevron {
+  display: inline-block;
+  transition: $transition-base;
+}
+
+// Expanded
+
+[aria-expanded="true"] .collapse-chevron {
+  transform: rotate(-180deg);
+}

data/lib/viniBaxter/sass/desk_front/landing/spa_landing/theme/_custom-forms.scss

@@ -0,0 +1,65 @@
+//
+// custom-forms.scss
+// Extended from Bootstrap
+//
+
+//
+// Custom switch
+//
+
+.custom-switch {
+  min-height: $custom-switch-height;
+
+  .custom-control-label {
+
+    &::before {
+      top: (($font-size-base * $line-height-base - $custom-switch-height) / 2);
+      height: $custom-switch-height;
+      border-radius: $custom-switch-height / 2;
+    }
+
+    &::after {
+      top: (($font-size-base * $line-height-base - $custom-switch-height) / 2 + $custom-switch-spacing);
+      left: $custom-switch-spacing - $custom-control-gutter - $custom-switch-width;
+      background-color: $custom-switch-indicator-bg;
+    }
+  }
+
+  .custom-control-input:checked ~ .custom-control-label {
+
+    &::after {
+      background-color: $custom-switch-indicator-active-bg;
+      transform: translateX($custom-switch-width - $custom-switch-spacing * 2 - $custom-switch-indicator-size);
+    }
+  }
+}
+
+
+//
+// Dark version
+//
+
+.custom-switch-dark {
+
+  .custom-control-label {
+
+    &::before {
+      background-color: $custom-switch-bg-dark;
+    }
+
+    &::after {
+      background-color: $custom-switch-indicator-bg-dark;
+    }
+  }
+
+  .custom-control-input:checked ~ .custom-control-label {
+
+    &::before {
+      background-color: $custom-switch-active-bg-dark;
+    }
+
+    &::after {
+      background-color: $custom-switch-active-indicator-bg-dark;
+    }
+  }
+}

data/lib/viniBaxter/sass/desk_front/landing/spa_landing/theme/_device.scss

@@ -0,0 +1,103 @@
+//
+// device.scss
+// Theme component
+//
+
+.device {
+  position: relative;
+
+  > .img-fluid {
+    position: relative;
+  }
+}
+
+.device::before {
+  content: "";
+  background-color: $light;
+}
+
+.device::before,
+.device-screen {
+  position: absolute;
+  object-fit: cover;
+}
+
+
+//
+// Single devices
+//
+
+.device-iphonex::before,
+.device-iphonex > .device-screen {
+  top: 7.784431138%; left: 16.4021164%;
+  width: 66.137566137%; height: 80.838323353%;
+}
+
+.device-macbook::before,
+.device-macbook > .device-screen {
+  top: 11.53846154%; left: 13.38709677%;
+  width: 73.548387096%; height: 73.076923076%;
+}
+
+
+//
+// Combos
+//
+
+.device-combo {
+  position: relative;
+}
+
+.device-combo > .device {
+  position: absolute;
+}
+
+.device-combo-iphonex-iphonex {
+  padding-bottom: 130.250482%;
+}
+
+.device-combo-iphonex-iphonex > .device-iphonex {
+  
+  &:first-child {
+    bottom: 0; left: 0;
+    width: 65.5260116%;
+    z-index: 1;
+  }
+
+  &:last-child {
+    top: 0; right: 0;
+    width: 72.8323699%;
+  }
+}
+
+.device-combo-macbook-iphonex,
+.device-combo-iphonex-macbook {
+  padding-bottom: 62.4260355%;
+}
+
+.device-combo-macbook-iphonex > .device-macbook,
+.device-combo-iphonex-macbook > .device-macbook {
+  width: 91.7159763%;
+}
+
+.device-combo-macbook-iphonex > .device-iphonex,
+.device-combo-iphonex-macbook > .device-iphonex {
+  width: 27.9585799%;
+  z-index: 1;
+}
+
+.device-combo-macbook-iphonex > .device-macbook {
+  top: 0; left: 0;
+}
+
+.device-combo-iphonex-macbook > .device-macbook {
+  top: 0; right: 0;
+}
+
+.device-combo-macbook-iphonex > .device-iphonex {
+  bottom: 0; right: 0;
+}
+
+.device-combo-iphonex-macbook > .device-iphonex {
+  bottom: 0; left: 0;
+}