pccv_front/src/assets/index.css
2025-06-17 17:50:29 +08:00

68 lines
1.7 KiB
CSS

@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
.arrow {
@apply relative triangle flex justify-center items-center text-lg;
box-shadow: inset 0px 6px 10px -10px rgba(255, 255, 255, 0.8),
inset 0px -6px 10px -10px rgba(255, 255, 255, 0.8);
}
.triangle {
@apply after:block after:absolute after:bottom-0 after:left-[100%]
after:border-t-[1rem] after:border-b-[1rem] after:border-l-[2rem]
after:border-t-transparent after:border-b-transparent after:z-50;
}
.triangle-dark {
@apply after:border-l-info;
}
.triangle-light {
@apply after:border-l-success;
}
.item button {
@apply hover:bg-active !important;
}
/* table */
.content-box-background {
background: linear-gradient(
180deg,
rgba(127, 237, 193, 0.1),
rgba(0, 0, 0, 0),
rgba(127, 237, 193, 0.1)
);
}
}
@layer utilities {
.btn{
@apply px-4 py-1;
text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.9);
box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.8);
}
.btn-success {
@apply text-white border border-active bg-active hover:bg-[theme("colors.green.500")]
}
.btn-info {
@apply text-white border border-info bg-info hover:bg-[theme("colors.sky.400")]
}
.btn-outline-success {
@apply text-white border border-active hover:bg-active bg-transparent
}
.btn-outline-info {
@apply text-white border border-info hover:bg-info bg-transparent
}
.custom-border {
@apply border border-info rounded-md;
}
.btn-text-without-border {
@apply active:border-0 focus:border-0 focus-visible:border-0 active:outline-none focus:outline-none focus-visible:outline-none;
}
}