2024-05-19 21:20:42 +08:00
|
|
|
@tailwind base;
|
|
|
|
@tailwind components;
|
|
|
|
@tailwind utilities;
|
2024-05-28 23:38:36 +08:00
|
|
|
|
2024-05-19 21:20:42 +08:00
|
|
|
@layer base {
|
|
|
|
html {
|
|
|
|
@apply font-sans;
|
|
|
|
}
|
|
|
|
}
|
2024-05-28 23:38:36 +08:00
|
|
|
|
2024-05-29 22:13:31 +08:00
|
|
|
@layer components {
|
2024-05-28 23:53:15 +08:00
|
|
|
.flex-center {
|
|
|
|
@apply flex items-center justify-center;
|
|
|
|
}
|
|
|
|
|
|
|
|
.flex-col-center {
|
|
|
|
@apply flex flex-col items-center justify-center;
|
|
|
|
}
|
|
|
|
|
2024-05-19 21:20:42 +08:00
|
|
|
.outline-box {
|
2024-06-01 23:15:29 +08:00
|
|
|
@apply outline-border relative cursor-pointer rounded-md p-1 outline outline-1;
|
2024-06-02 20:47:50 +08:00
|
|
|
}
|
2024-05-28 23:53:15 +08:00
|
|
|
|
2024-06-02 20:47:50 +08:00
|
|
|
.outline-box::after {
|
|
|
|
@apply absolute left-1/2 top-1/2 z-20 h-0 w-[1px] rounded-sm opacity-0 outline outline-2 outline-transparent transition-all duration-300 content-[""];
|
|
|
|
}
|
2024-05-19 21:20:42 +08:00
|
|
|
|
2024-06-02 20:47:50 +08:00
|
|
|
.outline-box.outline-box-active {
|
|
|
|
@apply outline-primary outline outline-2;
|
|
|
|
}
|
2024-05-28 23:53:15 +08:00
|
|
|
|
2024-06-02 20:47:50 +08:00
|
|
|
.outline-box.outline-box-active::after {
|
|
|
|
display: none;
|
|
|
|
}
|
2024-05-19 21:20:42 +08:00
|
|
|
|
2024-06-02 20:47:50 +08:00
|
|
|
.outline-box:not(.outline-box-active):hover::after {
|
|
|
|
@apply outline-primary left-0 top-0 h-full w-full p-1 opacity-100;
|
2024-05-19 21:20:42 +08:00
|
|
|
}
|
|
|
|
}
|