@tailwind base; @tailwind components; @tailwind utilities; @layer components { html { @apply h-full bg-layout; } body { @apply h-full; } #app { @apply h-full; } /* NavBar */ .menu-item { @apply w-full text-left block px-4 py-3 text-base text-gray-800; } .menu-item-active { @apply bg-gray-100 w-full text-left block px-4 py-3 text-base text-gray-800; } .container-menu-item { @apply absolute right-0 z-10 w-48 mt-2 overflow-hidden origin-top-right bg-white rounded-lg shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none; } .container-menu-profile { @apply flex-shrink-0 block px-4 py-2 border-b bg-primary-500 border-gray-50; } /* Aside */ .aside-text{ @apply text-xs; } .aside-single-item { @apply aside-text w-full flex items-center pl-2 pr-4 py-2 rounded-xl; } .aside-single-item-active { @apply aside-single-item bg-primary-500 text-white font-bold; } .aside-single-item-inactive { @apply aside-single-item font-semibold text-gray-600 group-hover:text-white group-hover:bg-primary-500; } .aside-single-item-icon{ @apply h-6 w-6; } .aside-single-item-icon-active{ @apply aside-single-item-icon stroke-white; } .aside-single-item-icon-inactive{ @apply aside-single-item-icon text-aside group-hover:stroke-white; } .custom-table-column { @apply !align-middle text-sm font-medium text-primary-800; } .filter-input-label { @apply block mb-2 text-xs font-semibold text-gray-800 sm:mb-0; } .rich-select-trigger{ @apply bg-gray-200 border-none focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75 focus-visible:ring-offset-2 focus-visible:ring-offset-teal-300 relative flex items-center justify-between w-full focus:z-10 cursor-pointer text-sm transition duration-100 ease-in-out disabled:opacity-50 disabled:cursor-not-allowed px-4 py-2.5; } .rich-select-search-input{ @apply inline-block focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75 focus-visible:ring-offset-2 focus-visible:ring-offset-teal-300 w-full text-sm px-4 py-2.5 text-gray-700 placeholder-gray-500/60 border-0 rounded-lg bg-gray-200; } .rich-select-selected-highlighted-option{ @apply font-semibold bg-teal-600 focus:outline-none text-white; } }