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 66: Line 66:
min-height: 31rem;
min-height: 31rem;
overflow: hidden;
overflow: hidden;
padding: clamp(2rem, 6vw, 5.5rem);
padding: clamp(1rem, 4vw, 3.5rem) 0;
border: 1px solid var(--nl-line);
border: 0;
border-radius: clamp(1.5rem, 3vw, 2.75rem);
border-radius: 0;
background: linear-gradient(135deg, var(--nl-accent-soft), transparent 58%), var(--nl-surface);
background: none;
isolation: isolate;
isolation: isolate;
}
}


.nl-hero::before {
.nl-hero::before {
position: absolute;
display: none;
inset: 0;
content: none;
z-index: -1;
background-image: linear-gradient(var(--nl-line) 1px, transparent 1px), linear-gradient(90deg, var(--nl-line) 1px, transparent 1px);
background-size: 4rem 4rem;
content: "";
opacity: 0.18;
mask-image: linear-gradient(90deg, transparent 20%, black);
}
}


Line 90: Line 84:
max-width: 46rem;
max-width: 46rem;
animation: nl-rise 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
animation: nl-rise 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
.nl-kicker {
margin-bottom: 1.5rem;
color: var(--nl-accent-strong);
font-size: 0.78rem;
font-weight: 750;
letter-spacing: 0.13em;
text-transform: uppercase;
}
}


Line 104: Line 89:
min-height: 6.5rem;
min-height: 6.5rem;
margin-bottom: 1.5rem;
margin-bottom: 1.5rem;
}
.nl-wordmark .theme-image {
display: inline-block;
}
}


Line 565: Line 546:


@media (max-width: 600px) {
@media (max-width: 600px) {
.nl-hero { padding: 1.5rem; border-radius: 1.5rem; }
.nl-hero { padding: 1rem 0; }
.nl-wordmark { min-height: 4.5rem; }
.nl-wordmark { min-height: 4.5rem; }
.nl-wordmark img { width: min(18rem, 100%); }
.nl-wordmark img { width: min(18rem, 100%); }
Cookies help us deliver our services. By using our services, you agree to our use of cookies.