MuhammadIqbalAfandi
/
bambslaundry-new
Tarkkaile 1
Äänestä 0
Fork 0
Koodi Ongelmat 0 Pull-pyynnöt 0 Julkaisut 0 Wiki Activity
74 Commitit
1 Haara
Puu: 65e6e26f6f
Branchit Tagit
${ item.name }
Create branch ${ searchTerm }
from '65e6e26f6f'
${ noResults }
bambslaundry-new/resources/js/assets/styles/sass/_responsive.scss

_responsive.scss 2.0KB
Historia Raaka

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990 
  1. @media (min-width: 992px) {

  2.     .layout-wrapper {

  3.         &.layout-overlay {

  4.             .layout-main-container {

  5.                 margin-left: 0;

  6.                 padding-left: 2rem;

  7.             }

  8. 

  9.             .layout-sidebar {

  10.                 transform: translateX(-100%);

  11.                 left: 0;

  12.                 top: 0;

  13.                 height: 100vh;

  14.                 border-top-left-radius: 0;

  15.                 border-bottom-left-radius: 0;

  16.             }

  17. 

  18.             &.layout-overlay-sidebar-active {

  19.                 .layout-sidebar {

  20.                     transform: translateX(0);

  21.                 }

  22.             }

  23.         }

  24. 

  25.         &.layout-static {

  26.             .layout-main-container {

  27.                 margin-left: 300px;

  28.             }

  29. 

  30.             &.layout-static-sidebar-inactive {

  31.                 .layout-sidebar {

  32.                     transform: translateX(-100%);

  33.                     left: 0;

  34.                 }

  35. 

  36.                 .layout-main-container {

  37.                     margin-left: 0;

  38.                     padding-left: 2rem;

  39.                 }

  40.             }

  41.         }

  42. 

  43.         .layout-mask {

  44.             display: none;

  45.         }

  46.     }

  47. }

  48. 

  49. @media (max-width: 991px) {

  50.     .layout-wrapper {

  51.         .layout-main-container {

  52.             margin-left: 0;

  53.             padding-left: 2rem;

  54.         }

  55. 

  56.         .layout-sidebar {

  57.             transform: translateX(-100%);

  58.             left: 0;

  59.             top: 0;

  60.             height: 100vh;

  61.             border-top-left-radius: 0;

  62.             border-bottom-left-radius: 0;

  63.         }

  64. 

  65.         .layout-mask {

  66.             z-index: 998;

  67.             background-color: var(--maskbg);

  68. 

  69.             &.layout-mask-enter-from,

  70.             &.layout-mask-leave-to {

  71.                 background-color: transparent;

  72.             }

  73.         }

  74. 

  75.         &.layout-mobile-sidebar-active {

  76.             .layout-sidebar {

  77.                 transform: translateX(0);

  78.             }

  79. 

  80.             .layout-mask {

  81.                 display: block;

  82.             }

  83.         }

  84.     }

  85. 

  86.     .body-overflow-hidden {

  87.         overflow: hidden;

  88.     }

  89. }