/* Start Icon-Click Styles */ [data-nav-style="icon-click"][data-nav-layout="horizontal"] { @extend .icon-click; @media (min-width: 992px) { .app-sidebar { .slide.side-menu__label1 { @apply block pt-1 pb-3 px-7 border-b border-gray-200 mb-3 mx-0; } .side-menu__item { @apply px-4; } .side-menu__icon { @apply mb-0 #{!important}; } .slide.has-sub .slide-menu.child1 { &.active { @apply inset-x-auto #{!important}; } } } &.dark { .app-sidebar { .slide.side-menu__label1 { @apply border-white/10; } } } } } [data-nav-style="icon-click"][toggled="icon-click-closed"] { &:not([data-nav-layout="horizontal"]) { @extend .icon-click; @media (min-width: 992px) { .main-menu { @apply px-[1.219rem]; } #sidebar-scroll { @apply overflow-y-visible h-auto; } .app-sidebar { @apply w-20 absolute; .slide.has-sub .slide-menu { @apply py-2; } .main-sidebar-header { .header-logo { .desktop-logo, .desktop-dark { @apply hidden; } .toggle-logo { @apply block; } .toggle-dark { @apply hidden; } } } .side-menu__item { @apply px-0; } .slide-menu { &.child1, &.child2, &.child3 { .slide { @apply px-3; } } } .slide.side-menu__label1 { @apply block py-3 px-7 border-b border-gray-200 mb-3; } .slide.side-menu__label1 { @apply py-3 px-7 #{!important}; } } &.dark { .app-sidebar { .main-sidebar-header { .header-logo { .toggle-logo { @apply hidden; } .toggle-dark { @apply block; } } } .slide.side-menu__label1 { @apply border-white/10; } } } &[dir="ltr"] { .header { @apply pl-20; } .content { @apply ml-20; } .app-sidebar { .slide { &.has-sub { @apply grid; } } .slide-menu { &.child1, &.child2, &.child3 { @apply rounded-r-md; .slide { @apply left-0; .side-menu__item { @apply pl-8 pr-4; &:before { @apply left-3; } } } .side-menu__angle { @apply right-4; } } } .slide.has-sub .slide-menu { @apply left-[3.25rem] #{!important}; &.child2, &.child3 { @apply left-[12.2rem] #{!important}; } } } } &[dir="rtl"] { .header { @apply pr-20; } .content { @apply mr-20; } .app-sidebar { .slide { &.has-sub { @apply grid; } } .slide-menu { &.child1, &.child2, &.child3 { @apply rounded-l-md; .slide { @apply right-0; .side-menu__item { @apply pr-8 pl-4; &:before { @apply right-3; } } } .side-menu__angle { @apply left-4; } } } .slide.has-sub .slide-menu { @apply right-[3.25rem] #{!important}; &.child2, &.child3 { @apply right-[12.2rem] #{!important}; } } } } .content { @apply min-h-[1275px]; } } } } .icon-click { @media (min-width: 992px) { .app-sidebar { .main-sidebar { @apply overflow-visible h-[90%]; } .main-sidebar-header { @apply w-[4.95rem]; } .side-menu__icon { @apply mx-auto; } .slide { @apply p-0; } .slide-menu { @apply top-auto #{!important}; &.child1, &.child2, &.child3 { @apply w-56; .slide { .side-menu__item { @apply text-start flex; &:before { @apply top-[0.938rem]; } } } @apply mt-0 #{!important}; .side-menu__angle { @apply block top-[0.65rem]; } } } .slide__category, .side-menu__angle { @apply hidden; } .side-menu__item { @apply text-center flex; } .side-menu__label { @apply hidden; } .slide.has-sub .slide-menu { @apply bg-white dark:bg-bgdark shadow-md transition-none; @apply absolute #{!important}; } .simplebar-content-wrapper { position: initial; } .simplebar-mask { position: inherit; } } &.dark .app-sidebar .slide.has-sub .slide-menu { @apply bg-bgdark; } } } /*End Icon-Click Styles */