This repository has no description
Something went wrong. Try again.
968 B · 43 lines
CSS
at main
1234567891011121314151617181920212223242526272829303132333435363738394041424344/* Like that fancy expanding/contracting splash screen I have in the main page? Now you can have it too! Just uh... this is not really that adaptable Good luck!!! JavaScript *is* required. There's no way you can do this in CSS without some seriously evil crimes*/
.splash { transition: padding 0.5s ease-out;
.intro { padding: calc(50vh - 3 * 4rem) 0; transition: padding 0.5s ease-out;
@media (max-width: 1024px) { padding: 0; } }
&.compact .intro { padding: 0; }
.scroll-down { @apply text-main-fg-sub transition absolute; bottom: 3rem; left: 50%; transform: translate(-50%, 0); animation: 0.75s infinite alternate bob;
&::after { @apply mx-auto block h-6 w-6 border-2 border-main-fg-sub border-l-0 border-t-0 origin-center; transform: scale(1.5, 1.25) rotate(45deg); content: ""; } } .bottom-detector { position: absolute; bottom: -5rem; }}