41 lines
700 B
CSS
41 lines
700 B
CSS
:root {
|
|
--pointer-scale-factor: 0.025;
|
|
/* 2.5% of viewport height */
|
|
}
|
|
|
|
.cursor-dot,
|
|
.cursor-dot-outline {
|
|
pointer-events: none;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
opacity: 0;
|
|
transform: translate(-30%, 0%);
|
|
transition: opacity 0.4s ease-in-out;
|
|
z-index: 99;
|
|
}
|
|
|
|
.cursor-dot {
|
|
font-family: "Font Awesome 6 Free", "Font Awesome 6 Brands", "Font Awesome 5 Free", "Font Awesome 5 Brands";
|
|
font-weight: 900;
|
|
color: red;
|
|
font-size: calc(var(--pointer-scale-factor) * 100vh);
|
|
}
|
|
|
|
.cursor-dot.visible {
|
|
opacity: 0.8 !important;
|
|
}
|
|
|
|
.cursor-dot.hidden {
|
|
opacity: 0 !important;
|
|
}
|
|
|
|
.no-cursor {
|
|
cursor: none;
|
|
}
|
|
|
|
.no-cursor a,
|
|
.no-cursor div,
|
|
.no-cursor span {
|
|
cursor: none;
|
|
} |