Files
site-profile/src/styles/utilities-cards.css
T
alexlebens f71b28adf0
test-build / guarddog (push) Successful in 1m12s
test-build / build (push) Successful in 1m30s
feat: update background colors
2026-05-21 15:57:34 -05:00

80 lines
1.9 KiB
CSS

@utility card-base {
@apply transition-all duration-300
rounded-xl
border border-mist-100/20 dark:border-mist-700/20
bg-background-card hover:bg-neutral-100 dark:hover:bg-mist-900/70
shadow-xs hover:shadow-md dark:shadow-md dark:hover:shadow-lg
}
@utility card-base-hidden {
@apply transition-all duration-300
rounded-2xl
border border-transparent
hover:bg-mist-400/20 dark:hover:bg-mist-800/40
}
@utility card-hover-icon-color {
@apply transition-all duration-300
text-primary
group-hover:text-main
}
@utility card-hover-icon-scale {
@apply transition-transform duration-300 will-change-transform
drop-shadow-md dark:drop-shadow-xl dark:drop-shadow-mist-500/60
group-hover:scale-3d group-hover:scale-105
}
@utility card-text-header {
@apply text-header
text-4xl md:text-5xl
font-bold leading-tight tracking-tight text-balance
}
@utility card-text-header-minor {
@apply text-header
text-2xl md:text-3xl
font-semibold leading-tight tracking-tight text-balance
}
@utility card-text-header-description {
@apply text-primary
text-lg
text-pretty leading-relaxed
}
@utility card-text-title {
@apply text-primary
font-bold
}
@utility card-text-title-major {
@apply text-header
text-4xl md:text-3xl
font-bold leading-tight tracking-tight text-balance
}
@utility card-hover-text-title {
@apply transition-all duration-300
group-hover:text-main
}
@utility card-hover-text-neutral {
@apply transition-all duration-300
group-hover:text-primary-hover
}
@utility card-hover-text-gitea {
@apply transition-all duration-300
group-hover:text-gitea-primary
}
@utility card-text-description {
@apply text-secondary
}
@utility card-hover-text-description {
@apply transition-all duration-300
text-secondary-hover
}