spaceship-monolith
Version:
Astro UI for Obsidian Vaults
45 lines (35 loc) • 1.13 kB
CSS
@import "spaceship-monolith/journey";
:root {
touch-action: pan-x pan-y;
height: 100%
}
@utility main {
@apply p-0;
&::before {
@apply content-none;
}
}
@utility map-container {
@apply z-0 absolute w-full h-full;
}
@utility logo-container {
@apply hidden md:flex absolute left-[50%] top-[75%] -translate-x-[50%] -translate-y-[50%];
}
@utility logo {
@apply mx-auto h-[33vh] w-auto transition-all group-hover:scale-110;
}
@utility title-container {
@apply absolute bottom-[20px] left-[50%] -translate-x-[50%] flex flex-col gap-3 md:gap-6 items-center transition-all group-hover:-rotate-x-25;
}
@utility title {
@apply text-shadow-lg text-6xl lg:text-8xl font-title bg-gradient-to-r from-primary via-[oklch(.83_.058_83.6)] to-[oklch(.41_.077_78.9)] inline-block text-transparent bg-clip-text;
}
@utility subtitle {
@apply text-shadow-lg text-xl lg:text-3xl text-balance text-center font-heading text-[hsl(21,_61%,_26%)];
}
@source inline("map-container");
@source inline("logo-container");
@source inline("logo");
@source inline("title-container");
@source inline("title");
@source inline("subtitle");