Jump to content
Toggle menu
  • 8 articles
  • 75 files
  • 7 users
  • 37.8K edits
Neodyland Wiki
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Template:Neodyland Wiki/styles.css: Difference between revisions

Template page
Add responsive homepage styles for Neodyland Wiki
Add responsive homepage styles for Neodyland Wiki
Line 83: Line 83:
align-self: center;
align-self: center;
max-width: 46rem;
max-width: 46rem;
animation: nl-rise 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
}


Line 198: Line 197:
width: min(26rem, 100%);
width: min(26rem, 100%);
aspect-ratio: 1;
aspect-ratio: 1;
animation: nl-settle 1s cubic-bezier(0.16, 1, 0.3, 1) both;
}
}


Line 279: Line 277:
padding-block: 1.35rem;
padding-block: 1.35rem;
border-top: 1px solid var(--nl-line);
border-top: 1px solid var(--nl-line);
transition: background-color 180ms ease, padding-inline 180ms ease;
}
}


Line 310: Line 307:
color: var(--nl-muted);
color: var(--nl-muted);
font-size: 1.25rem;
font-size: 1.25rem;
transition: transform 180ms ease;
}
.nl-directory__item:hover .nl-directory__arrow {
transform: translateX(0.25rem);
}
}


Line 517: Line 509:
border-radius: 50%;
border-radius: 50%;
background: var(--nl-accent);
background: var(--nl-accent);
}
@keyframes nl-rise {
from { opacity: 0; transform: translateY(1.25rem); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes nl-settle {
from { opacity: 0; transform: scale(0.88) rotate(-5deg); }
to { opacity: 1; transform: scale(1) rotate(0); }
}
}


Line 560: Line 542:


@media (prefers-reduced-motion: reduce) {
@media (prefers-reduced-motion: reduce) {
.nl-hero__copy,
.nl-orbit,
.nl-orbit__ring--two { animation: none; }
.nl-orbit__ring--two { animation: none; }
.nl-directory__item,
.nl-directory__arrow { transition: none; }
}
}
Cookies help us deliver our services. By using our services, you agree to our use of cookies.