RootZanli & NinjaCr3

: / home / o5t6x7pgljbm / public_html / admin_new2 / public / src / sass / theme-components /
Filename : customizer.scss
back
/*---------------------------------
    Theme Customizer
-----------------------------------*/

.btn-customizer {
   padding: 0 1rem;
   i {
      animation: fa-spin 2s infinite linear;
   }
}
@keyframes fa-spin {
   0% {
      transform: rotate(0deg);
   }

   100% {
      transform: rotate(359deg);
   }
}
.theme-cutomizer {
   top: 0;
   width: 360px;
   z-index: 99999;
   .sidenav-close {
      position: absolute;
      right: 10px;
      top: 5px;
   }
   .customize-devider {
      border: 1px solid #e4e4e4;
   }
   .menu-options,
   .navbar-options {
      .menu-color-option,
      .menu-bg-color-option,
      .navbar-color-option {
         height: 24px;
         width: 24px;
         display: inline-block;
         border-radius: 12px;
         margin-right: 8px;
         margin-bottom: 10px;
         cursor: pointer;
         border: 3px solid $white;
         &.selected {
            box-shadow: 0px 0px 10px 3px color("light-blue", "base");
         }
      }
   }
}

// Buy now button 
.btn-buy-now {
    position: fixed;
    top: 50%;
    right: -2px;
    padding: 0 1rem;
    z-index: 99;
 }
 
 .buy-now-animated {
    animation-duration: 1.5s;
    animation-fill-mode: both;
    animation-iteration-count: infinite;
 }
 
 @keyframes tada {
    0% {
       transform: scale3d(1, 1, 1);
    }
 
    10%,
    20% {
       transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }
 
    30%,
    50%,
    70%,
    90% {
       transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }
 
    40%,
    60%,
    80% {
       transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }
 
    100% {
       transform: scale3d(1, 1, 1);
    }
 }
 
 .tada {
    animation-name: tada;
 }
 
 .theme-cutomizer-trigger {
    position: fixed;
    top: 40%;
    right: -2px;
    z-index: 99;
 }