Template:PatchHighlights/styles.css: Difference between revisions
Template page
More actions
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* | /* container */ | ||
.sv-highlights-wrap { | .sv-highlights-wrap { | ||
border: 2px solid #372b54; | border: 2px solid #372b54; | ||
| Line 7: | Line 7: | ||
} | } | ||
/* | /* grid */ | ||
.sv-highlights { | .sv-highlights { | ||
display: grid; | display: grid; | ||
| Line 15: | Line 15: | ||
align-items: start; | align-items: start; | ||
width: 100%; | width: 100%; | ||
direction: rtl; | |||
} | } | ||
/* | /* empty */ | ||
.sv-empty { | .sv-empty { | ||
grid-column: 1 / -1; | grid-column: 1 / -1; | ||
| Line 26: | Line 27: | ||
} | } | ||
/* | /* card */ | ||
.sv-card { | .sv-card { | ||
text-align: left; | text-align: left; | ||
| Line 36: | Line 37: | ||
} | } | ||
/* | /* bits */ | ||
.sv-card__title { | .sv-card__title { font-size: 1.4em; font-weight: 700; line-height: 1.2; margin: -0.2em 0 0.3em 0; } | ||
.sv-card__divider { height: 1px; background: rgba(55,43,84,.25); margin: .35rem 0 .5rem 0; } | |||
.sv-card__date { margin: .1em 0; font-size: .85em; font-style: italic; color: var(--text-color); } | |||
.sv-card__blurb { font-size: .9em; line-height: 1.75em; color: var(--text-color); margin: .3em 0 0 0; } | |||
} | |||
.sv-card__divider { | |||
} | |||
.sv-card__date { | |||
} | |||
.sv-card__blurb { | |||
} | |||
/* | /* mobile */ | ||
@media (max-width: 640px) { | @media (max-width: 640px) { | ||
.sv-highlights { grid-template-columns: 1fr; } | .sv-highlights { grid-template-columns: 1fr; direction: ltr; } | ||
.sv-highlights > div.sv-card:nth-of-type(n+2) { display: none; } | .sv-highlights > div.sv-card:nth-of-type(n+2) { display: none; } | ||
} | } | ||
Revision as of 03:14, 2 October 2025
/* container */
.sv-highlights-wrap {
border: 2px solid #372b54;
border-radius: 10px;
padding: 0.75rem;
background: transparent;
}
/* grid */
.sv-highlights {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 1rem;
grid-auto-rows: auto;
align-items: start;
width: 100%;
direction: rtl;
}
/* empty */
.sv-empty {
grid-column: 1 / -1;
opacity: .75;
text-align: center;
padding: 1rem;
direction: ltr;
}
/* card */
.sv-card {
text-align: left;
padding: 1rem 1.5rem 0.75rem;
direction: ltr;
border-radius: 8px;
min-width: 0;
word-wrap: break-word;
}
/* bits */
.sv-card__title { font-size: 1.4em; font-weight: 700; line-height: 1.2; margin: -0.2em 0 0.3em 0; }
.sv-card__divider { height: 1px; background: rgba(55,43,84,.25); margin: .35rem 0 .5rem 0; }
.sv-card__date { margin: .1em 0; font-size: .85em; font-style: italic; color: var(--text-color); }
.sv-card__blurb { font-size: .9em; line-height: 1.75em; color: var(--text-color); margin: .3em 0 0 0; }
/* mobile */
@media (max-width: 640px) {
.sv-highlights { grid-template-columns: 1fr; direction: ltr; }
.sv-highlights > div.sv-card:nth-of-type(n+2) { display: none; }
}