67 lines
1.8 KiB
CSS
67 lines
1.8 KiB
CSS
@layer utilities {
|
|
.content-auto {
|
|
content-visibility: auto;
|
|
}
|
|
.scrollbar-hide {
|
|
scrollbar-width: none;
|
|
-ms-overflow-style: none;
|
|
}
|
|
.scrollbar-hide::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.transition-height {
|
|
transition: max-height 0.3s ease-in-out;
|
|
}
|
|
.file-item-hover {
|
|
@apply hover:bg-gray-100 dark:hover:bg-dark-100 transition-all duration-200;
|
|
}
|
|
.btn-primary {
|
|
@apply bg-primary text-white px-4 py-2 rounded-lg hover:bg-primary/90 transition-all duration-200 shadow-md hover:shadow-lg;
|
|
}
|
|
.btn-secondary {
|
|
@apply bg-white dark:bg-dark-200 text-gray-700 dark:text-gray-200 border border-gray-300 dark:border-dark-100 px-4 py-2 rounded-lg hover:bg-gray-50 dark:hover:bg-dark-100 transition-all duration-200;
|
|
}
|
|
.page {
|
|
@apply transition-all duration-300 ease-in-out transform;
|
|
opacity: 0;
|
|
transform: translateY(20px);
|
|
}
|
|
|
|
.page.active {
|
|
@apply opacity-100 translate-y-0;
|
|
}
|
|
|
|
/* 模态框动画 */
|
|
.modal-enter {
|
|
@apply opacity-0 scale-95;
|
|
}
|
|
|
|
.modal-enter-active {
|
|
@apply opacity-100 scale-100 transition-all duration-300 ease-out;
|
|
}
|
|
|
|
.modal-exit {
|
|
@apply opacity-100 scale-100;
|
|
}
|
|
|
|
.modal-exit-active {
|
|
@apply opacity-0 scale-95 transition-all duration-300 ease-in;
|
|
}
|
|
|
|
/* 侧边栏动画 */
|
|
.sidebar-enter {
|
|
@apply -translate-x-full;
|
|
}
|
|
|
|
.sidebar-enter-active {
|
|
@apply translate-x-0 transition-transform duration-300 ease-out;
|
|
}
|
|
|
|
.sidebar-exit {
|
|
@apply translate-x-0;
|
|
}
|
|
|
|
.sidebar-exit-active {
|
|
@apply -translate-x-full transition-transform duration-300 ease-in;
|
|
}
|
|
} |