86 lines
1.7 KiB
CSS
86 lines
1.7 KiB
CSS
@import "tailwindcss";
|
|
|
|
@config "../tailwind.config.cjs";
|
|
|
|
/* E-TIB Custom Utilities */
|
|
@layer utilities {
|
|
.text-balance {
|
|
text-wrap: balance;
|
|
}
|
|
|
|
.hide-scrollbar {
|
|
-ms-overflow-style: none; /* IE and Edge */
|
|
scrollbar-width: none; /* Firefox */
|
|
}
|
|
.hide-scrollbar::-webkit-scrollbar {
|
|
display: none; /* Chrome, Safari and Opera */
|
|
}
|
|
|
|
/* Trassen-Hover Effect for Bento Grids */
|
|
.trassen-border {
|
|
position: relative;
|
|
}
|
|
.trassen-border::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 200%;
|
|
height: 200%;
|
|
background: conic-gradient(from 0deg, transparent 70%, #0e7a5c 100%);
|
|
transform: translate(-50%, -50%) rotate(0deg);
|
|
animation: rotate-trasse 3s linear infinite;
|
|
opacity: 0;
|
|
transition: opacity 0.4s ease;
|
|
z-index: 0;
|
|
pointer-events: none;
|
|
}
|
|
.trassen-border:hover::before {
|
|
opacity: 1;
|
|
}
|
|
.trassen-content {
|
|
position: absolute;
|
|
inset: 1px;
|
|
z-index: 1;
|
|
border-radius: inherit;
|
|
background-color: #050B14;
|
|
background-clip: padding-box;
|
|
}
|
|
}
|
|
|
|
@keyframes rotate-trasse {
|
|
from { transform: translate(-50%, -50%) rotate(0deg); }
|
|
to { transform: translate(-50%, -50%) rotate(360deg); }
|
|
}
|
|
|
|
/* Base Styles */
|
|
@layer base {
|
|
html {
|
|
scroll-behavior: smooth;
|
|
}
|
|
body {
|
|
@apply bg-neutral font-sans text-neutral-dark antialiased;
|
|
}
|
|
/* Interactive elements pointer */
|
|
a,
|
|
button,
|
|
[role="button"],
|
|
input[type="button"],
|
|
input[type="submit"],
|
|
input[type="reset"],
|
|
select,
|
|
summary,
|
|
label[for] {
|
|
cursor: pointer;
|
|
}
|
|
|
|
/* Ensure disabled elements don't show pointer */
|
|
button:disabled,
|
|
[role="button"]:disabled,
|
|
input:disabled,
|
|
select:disabled,
|
|
button[disabled] {
|
|
cursor: not-allowed;
|
|
}
|
|
}
|