viniBaxter-spa_landing 0.9 → 10.0

data/lib/viniBaxter/sass/bootstrap/bootstrap.scss

@@ -5,7 +5,6 @@
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  */
 
-@import 'functions';
 @import 'mixins';
 @import 'root';
 @import 'reboot';

data/lib/viniBaxter/sass/bootstrap/mixins/_buttons.scss

@@ -11,7 +11,6 @@
   $active-background: darken($background, 10%),
   $active-border: darken($border, 12.5%)
 ) {
-  print: $background;
   color: color-yiq($background);
   @include gradient-bg($background);
   border-color: $border;

data/lib/viniBaxter/sass/bootstrap/mixins/_grid.scss

@@ -18,13 +18,16 @@
 }
 
 // For each breakpoint, define the maximum width of the container in a media query
-@mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
+@mixin make-container-max-widths(
+  $max-widths: $container-max-widths,
+  $breakpoints: $grid-breakpoints
+) {
   @each $breakpoint, $container-max-width in $max-widths {
     @include media-breakpoint-up($breakpoint, $breakpoints) {
       max-width: $container-max-width;
     }
   }
-  @include deprecate("The `make-container-max-widths` mixin", "v4.5.2", "v5");
+  @include deprecate('The `make-container-max-widths` mixin', 'v4.5.2', 'v5');
 }
 
 @mixin make-col-ready($gutter: $grid-gutter-width) {

data/lib/viniBaxter/sass/spa_landing/theme/_landin-page.scss

@@ -0,0 +1,39 @@
+.lp_jumbo {
+  .container-lp-center {
+    margin-left: auto !important;
+    margin-right: auto !important;
+    width: auto !important;
+    padding-right: 24px !important;
+    padding-left: 24px !important;
+
+    @include media-breakpoint-up(md) {
+      max-width: 696px !important;
+    }
+    .center-up-md {
+      @include media-breakpoint-up(md) {
+        text-align: center !important;
+      }
+    }
+  }
+}
+
+#image-landin-gb {
+  padding-top: 24px !important;
+  padding-bottom: 24px !important;
+  padding-left: 24px !important;
+  padding-right: 24px !important;
+  max-width: 1600px !important;
+  @include media-breakpoint-up(md) {
+    padding-top: 48px !important;
+    padding-bottom: 48px !important;
+    padding-left: 40px !important;
+    padding-right: 40px !important;
+  }
+  @include media-breakpoint-up(xl) {
+    margin: 0 auto !important;
+    position: relative !important;
+    max-width: 1760px !important;
+    padding-right: 80px !important;
+    padding-left: 80px !important;
+  }
+}

data/lib/viniBaxter/sass/spa_landing/theme/_navbar.scss

@@ -9,7 +9,10 @@
     z-index: $zindex-fixed;
 
     &.blured {
-      backdrop-filter: saturate(180%) blur(20px);
+      // // background: $opacity-gray-9;
+      -webkit-backdrop-filter: $backdrop-filter;
+      backdrop-filter: $backdrop-filter;
+      background: $opacity-gray-9;
     }
   }
 

data/lib/viniBaxter/sass/spa_landing/theme/_navbar_creative.scss

@@ -1,7 +1,8 @@
 .navbar {
   padding-top: $navbar-padding-base;
   padding-bottom: $navbar-padding-base;
-  min-height: 53px;
+  // min-height: 53px;
+  height: 90px;
   margin-bottom: 20px;
   box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
   z-index: 1030;
@@ -21,6 +22,30 @@
     font-size: inherit;
   }
 
+  &.relative-top {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    .navbar-nav {
+      .nav-link:not(.btn) {
+        &.nav-underline {
+          @include media-breakpoint-up(lg) {
+            @include navbar-hover-link($light, $border-after-light);
+          }
+        }
+      }
+    }
+    [class^='btn-outline-'],
+    [class*='btn-outline-'] {
+      @include button-outline-variant($white);
+      &:hover {
+        color: $white !important;
+        background-color: transparent !important;
+      }
+    }
+  }
+
   .navbar-nav {
     &.navbar-logo {
       position: absolute;
@@ -82,7 +107,7 @@
 
       &.nav-underline {
         @include media-breakpoint-up(lg) {
-          @include navbar-hover-link;
+          @include navbar-hover-link($dark, $border-after-dark);
         }
       }
     }
@@ -110,7 +135,13 @@
     font-size: $font-size-small;
     padding-top: $padding-base-vertical;
     padding-bottom: $padding-base-vertical;
+    margin-bottom: $navbar-margin-brand-svg;
     line-height: $line-height-nav-link;
+    // text-transform: uppercase;
+    // font-size: 0.75rem;
+    // padding-top: 0rem;
+    // margin-bottom: 0.6rem;
+    // line-height: 1.625rem;
   }
 
   .navbar-toggler {
@@ -152,16 +183,16 @@
 
   &.bg-white:not(.navbar-transparent) {
     a:not(.dropdown-item):not(.btn) {
-      color: $default-color;
+      color: $dark;
 
       &.disabled {
         opacity: 0.5;
-        color: $default-color;
+        color: $dark;
       }
     }
 
     .button-bar {
-      background: $default-color;
+      background: $dark;
     }
 
     .nav-item.active .nav-link:not(.btn),
@@ -172,7 +203,7 @@
     }
 
     .logo-container {
-      border: 1px solid $default-color;
+      border: 1px solid $dark;
     }
   }
 }
@@ -397,7 +428,7 @@
 }
 
 .bg-default {
-  background-color: $default-color !important;
+  background-color: $dark !important;
 }
 
 .bg-primary {

data/lib/viniBaxter/sass/spa_landing/theme/_theme-basic-nav.scss

@@ -48,3 +48,9 @@
 @import 'section';
 @import 'shapes';
 @import 'sidenav';
+
+//
+// iOS
+//
+
+@import 'iOS/index';

data/lib/viniBaxter/sass/spa_landing/theme/_theme.scss

@@ -53,6 +53,13 @@
 @import 'section';
 @import 'shapes';
 @import 'sidenav';
+@import 'landin-page';
+
+//
+// iOS
+//
+
+@import 'iOS/index';
 
 //
 // Tool

data/lib/viniBaxter/sass/spa_landing/theme/_type.scss

@@ -77,23 +77,20 @@ h6,
 
 // Display
 
-.display-1,
-.display-2,
-.display-3,
-.display-4 {
-  letter-spacing: $display-letter-spacing;
-}
-
 .display-1 {
   line-height: $display1-line-height;
+  letter-spacing: $display1-letter-spacing;
 
   @include media-breakpoint-down(md) {
-    font-size: $display1-size-md;
+    font-size: $display1-size-md !important;
+    line-height: $display1-line-height-size-md !important;
+    letter-spacing: $display1-line-letter-spacing-md !important;
   }
 }
 
 .display-2 {
   line-height: $display2-line-height;
+  letter-spacing: $display2-letter-spacing;
 
   @include media-breakpoint-down(md) {
     font-size: $display2-size-md;
@@ -102,6 +99,7 @@ h6,
 
 .display-3 {
   line-height: $display3-line-height;
+  letter-spacing: $display3-letter-spacing;
 
   @include media-breakpoint-down(md) {
     font-size: $display3-size-md;
@@ -110,6 +108,7 @@ h6,
 
 .display-4 {
   line-height: $display4-line-height;
+  letter-spacing: $display4-letter-spacing;
 
   @include media-breakpoint-down(md) {
     font-size: $display4-size-md;

data/lib/viniBaxter/sass/spa_landing/theme/iOS/_1068.scss

@@ -0,0 +1,44 @@
+// 1068
+
+// @media only screen and (max-width: 1068px) {
+@include media-breakpoint-down(lg) {
+  .section-card-tiles .cards-tiles-list {
+    margin-left: 20px;
+    margin-right: 20px;
+    margin-bottom: 20px;
+  }
+}
+
+@media only screen and (max-width: 1068px) {
+  .section-card-tiles .card-tile:nth-child(odd) {
+    border-right: 10px solid #fff;
+  }
+  .section-card-tiles .card-tile:nth-child(even) {
+    border-left: 10px solid #fff;
+  }
+  .section-card-tiles .card-tile {
+    &:nth-child(1),
+    &:nth-child(2) {
+      border-bottom: 10px solid #fff;
+    }
+  }
+  .section-card-tiles .card-tile {
+    &:nth-child(3),
+    &:nth-child(4) {
+      border-top: 10px solid #fff;
+    }
+  }
+  .section-card-tiles .card-tile-set h2 {
+    max-width: 234px;
+  }
+  .section-card-tiles .card-tile-set .cat-tile-bg {
+    background-repeat: no-repeat;
+  }
+  .section-card-tiles .cat-tile-copy {
+    top: 29%;
+  }
+  .section-card-tiles .cat-tile-copy a {
+    margin-top: 22px;
+    font-size: 21px;
+  }
+}

data/lib/viniBaxter/sass/spa_landing/theme/iOS/_735.scss

@@ -0,0 +1,56 @@
+@include media-breakpoint-down(sm) {
+  // @media only screen and (max-width: 735px) {
+  .section-card-tiles {
+    max-width: 414px;
+  }
+  .section-card-tiles .cards-tiles-list {
+    margin-right: auto;
+    margin-bottom: 15px;
+    margin-left: auto;
+  }
+  .section-card-tiles .card-tile {
+    margin: 0 auto 15px;
+    flex-basis: 100%;
+    max-width: 100%;
+    padding-right: 0;
+
+    &:nth-child(odd) {
+      border-right: none;
+    }
+
+    &:nth-child(even) {
+      border-left: none;
+    }
+
+    &:nth-child(1),
+    &:nth-child(2) {
+      border-bottom: none;
+    }
+
+    &:nth-child(3),
+    &:nth-child(4) {
+      border-top: none;
+    }
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+  .section-card-tiles .jump-tile-video {
+    top: 0;
+  }
+  .section-card-tiles .cat-tile-copy {
+    top: 50%;
+    transform: translateY(-50%);
+    h2,
+    a {
+      max-width: 100%;
+    }
+    a {
+      margin-top: 16px;
+    }
+  }
+  .section-card-tiles .card-tile-set .cat-tile-bg {
+    background-repeat: no-repeat;
+  }
+}

data/lib/viniBaxter/sass/spa_landing/theme/iOS/_OS_style.scss

@@ -0,0 +1,211 @@
+// @import url(https://fonts.googleapis.com/css?family=Ek+Mukta:200);
+$cubic: cubic-bezier(0.4, 0.01, 0.165, 0.99);
+// $mukta: 'Ek Mukta', sans-serif;
+$menuItems: 15;
+
+.window {
+  position: relative;
+  display: block;
+  width: 100%;
+  margin: 100px auto 0;
+  overflow: hidden;
+  border-radius: 3px;
+
+  .header {
+    position: absolute;
+    display: block;
+    top: 0;
+    left: 0;
+    height: 60px;
+    width: 100%;
+    // background: rgba(#fff, 1);
+    overflow: hidden;
+    transition: all 0.5s ease-out, background 1s ease-out;
+    transition-delay: 0.2s;
+    z-index: 9999;
+    -webkit-backdrop-filter: saturate(180%) blur(20px);
+    backdrop-filter: saturate(180%) blur(20px);
+
+    .burger-container {
+      position: relative;
+      display: inline-block;
+      height: 60px;
+      width: 60px;
+      cursor: pointer;
+      transform: rotate(0deg);
+      transition: all 0.3s $cubic;
+      user-select: none;
+      -webkit-tap-highlight-color: transparent;
+
+      #burger {
+        width: 18px;
+        height: 8px;
+        position: relative;
+        display: block;
+        margin: -4px auto 0;
+        top: 50%;
+
+        .bar {
+          width: 100%;
+          height: 1px;
+          display: block;
+          position: relative;
+          background: $body-color;
+          transition: all 0.3s $cubic;
+          transition-delay: 0s;
+
+          &.topBar {
+            transform: translateY(0px) rotate(0deg);
+          }
+
+          &.btmBar {
+            transform: translateY(6px) rotate(0deg);
+          }
+        }
+      }
+    }
+
+    .icon {
+      display: inline-block;
+      position: absolute;
+      height: 100%;
+      line-height: 50px;
+      width: 50px;
+      height: 50px;
+      text-align: center;
+      color: $body-color;
+      font-size: 22px;
+      left: 50%;
+      transform: translateX(-50%);
+
+      &.icon_sxmGreatAgain {
+        right: 0;
+        top: 0;
+        left: auto;
+        transform: translateX(0px);
+        transition: transform 0.5s $cubic;
+        transition-delay: 0.65s;
+      }
+    }
+
+    ul.menu {
+      position: relative;
+      display: block;
+      padding: 10% 20% 20%;
+      list-style: none;
+
+      li.menu-item {
+        border-bottom: 1px solid #fff;
+        margin-top: 5px;
+        transform: scale(1.15) translateY(-30px);
+        opacity: 0;
+        transition: transform 0.5s $cubic, opacity 0.6s $cubic;
+
+        @for $i from 1 through $menuItems {
+          &:nth-child(#{$i}) {
+            transition-delay: #{0.56 - ($i * 0.07)}s;
+          }
+        }
+
+        a {
+          display: block;
+          position: relative;
+          color: $light;
+          // font-family: $mukta;
+          font-weight: 100;
+          text-decoration: none;
+          font-size: 22px;
+          line-height: 2.35;
+          font-weight: 500;
+          width: 100%;
+        }
+      }
+    }
+
+    &.menu-opened {
+      height: 100%;
+      // background-color: rgba(255, 255, 255, 0.27);
+      background: $primary-gradient-opacity;
+      transition: all 0.3s ease-in, background 0.3s ease-in;
+      transition-delay: 0.25s;
+      backdrop-filter: saturate(180%) blur(20px);
+
+      .burger-container {
+        transform: rotate(90deg);
+
+        #burger {
+          .bar {
+            transition: all 0.4s $cubic;
+            transition-delay: 0.2s;
+
+            &.topBar {
+              transform: translateY(4px) rotate(45deg);
+            }
+
+            &.btmBar {
+              transform: translateY(3px) rotate(-45deg);
+            }
+          }
+        }
+      }
+
+      ul.menu {
+        li.menu-item {
+          transform: scale(1) translateY(0px);
+          opacity: 1;
+
+          @for $i from 1 through $menuItems {
+            &:nth-child(#{$i}) {
+              transition-delay: #{0.07 * $i + 0.2}s;
+            }
+          }
+        }
+      }
+
+      .icon {
+        &.icon_sxmGreatAgain {
+          transform: translateX(75px);
+          transition-delay: 0.3s;
+        }
+      }
+    }
+  }
+
+  .content {
+    // font-family: $mukta;
+    padding: 67px 4% 0;
+    text-align: justify;
+    overflow: scroll;
+    max-height: 100%;
+
+    &::-webkit-scrollbar {
+      display: none;
+    }
+
+    h2 {
+      margin-bottom: 0px;
+      letter-spacing: 1px;
+    }
+
+    img {
+      width: 95%;
+      position: relative;
+      display: block;
+      margin: 75px auto 75px;
+
+      &:nth-of-type(2) {
+        margin: 75px auto;
+      }
+    }
+  }
+
+  @media (max-width: 3300px) {
+    width: 100%;
+    margin: 0;
+    border-radius: 0px;
+
+    .header {
+      position: fixed;
+    }
+  }
+}