TickoGrey: Created page with ".template-navpills { display: grid; gap: 0.5rem; /* Adjusted for better spacing / grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); grid-auto-rows: 3rem; font-size: 0.8rem; / Slightly increased for better visibility / } .template-navpill { position: relative; border: 1px solid #444; / A lighter border to increase visibility / border-radius: 0.5rem; / Adjusted for a softer look / font-weight: 600; / Bold text for be..."

2026-04-04T22:17:56Z

Created page with ".template-navpills { display: grid; gap: 0.5rem; Adjusted for better spacing: grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); grid-auto-rows: 3rem; font-size: 0.8rem; Slightly increased for better visibility: } .template-navpill { position: relative; border: 1px solid #444; A lighter border to increase visibility: border-radius: 0.5rem; Adjusted for a softer look: font-weight: 600; /* Bold text for be..."

New page

.template-navpills {
display: grid;
gap: 0.5rem; /* Adjusted for better spacing */
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
grid-auto-rows: 3rem;
font-size: 0.8rem; /* Slightly increased for better visibility */
}

.template-navpill {
position: relative;
border: 1px solid #444; /* A lighter border to increase visibility */
border-radius: 0.5rem; /* Adjusted for a softer look */
font-weight: 600; /* Bold text for better readability */
line-height: 1.5; /* Improved line-height for text */
overflow: hidden;
background-color: #121212; /* Dark background for contrast */
}

.template-navpill-background {
position: absolute;
inset: 0;
}

.template-navpill-background:after {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(to right, #000, transparent);
transition: transform 250ms ease;
}

.template-navpill-background img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 250ms ease;
transition-property: transform;
}

.template-navpill:hover .template-navpill-background::after {
transform: translateX(-100%);
}

.template-navpill:hover .template-navpill-background img {
transform: scale(1.1);
}

.template-navpill > a {
position: relative;
padding: 0 1.5rem; /* Increased padding for better spacing */
display: flex;
align-items: center;
color: #fff; /* Bright text for strong contrast */
text-decoration: none;
height: 100%;
}

.template-navpill > .template-navpill-background + a {
color: #fff;
text-shadow: 0 2px 0.2em #000;
}

.template-navpill:hover {
background: #1e1e1e; /* Slightly lighter background on hover */
}

.template-navpill:active {
background: #2a2a2a; /* Subtle darkening on active state */
}

Navpills/styles.css - Revision history