Template:Race intro/styles.css: Difference between revisions
Template page
More actions
Created page with "→Template:Race intro/styles.css: .wizlords-race-intro--with-examples { display: grid; grid-template-columns: 100px minmax(16rem, 1fr) minmax(240px, 34%); align-items: center; gap: 28px; margin: 18px 0 24px; } .wizlords-race-intro--with-examples .wizlords-race-intro-icon { min-width: 0; } .wizlords-race-intro--with-examples .wizlords-race-intro-icon img { display: block; width: 100px; height: 100px; object-fit: contain; border: 0; background: transparent..." |
No edit summary |
||
| (2 intermediate revisions by the same user not shown) | |||
| Line 2: | Line 2: | ||
.wizlords-race-intro--with-examples { | .wizlords-race-intro--with-examples { | ||
display: grid; | display: grid; | ||
grid-template-columns: 100px minmax(16rem, 1fr) minmax( | grid-template-columns: 100px minmax(16rem, 1fr) minmax(200px, 250px); | ||
align-items: center; | align-items: center; | ||
gap: 28px; | gap: 28px; | ||
| Line 22: | Line 22: | ||
.wizlords-race-intro--with-examples .wizlords-race-quote { | .wizlords-race-intro--with-examples .wizlords-race-quote { | ||
position: relative; | |||
min-width: 0; | min-width: 0; | ||
margin: 0; | |||
padding: 0 34px; | |||
color: var(--wiz-text, #d2d2d2); | |||
font-size: 16px; | |||
font-style: italic; | |||
line-height: 1.6; | |||
} | |||
.wizlords-race-intro--with-examples .wizlords-race-quote::before, | |||
.wizlords-race-intro--with-examples .wizlords-race-quote::after { | |||
position: absolute; | |||
color: #555; | |||
font-size: 42px; | |||
line-height: 1; | |||
} | |||
.wizlords-race-intro--with-examples .wizlords-race-quote::before { | |||
content: "\201C"; | |||
left: 0; | |||
top: -6px; | |||
} | |||
.wizlords-race-intro--with-examples .wizlords-race-quote::after { | |||
content: "\201D"; | |||
right: 0; | |||
bottom: -18px; | |||
} | |||
.wizlords-race-intro--with-examples .wizlords-race-quote-source { | |||
margin-top: 8px; | |||
text-align: right; | |||
font-size: 12px; | |||
font-style: normal; | |||
font-weight: bold; | |||
} | } | ||
.wizlords-race-intro-examples { | .wizlords-race-intro-examples { | ||
min-width: 0; | min-width: 0; | ||
width: 100%; | |||
box-sizing: border-box; | |||
justify-self: end; | |||
margin: 0; | margin: 0; | ||
padding: 4px; | padding: 4px; | ||
| Line 37: | Line 75: | ||
grid-template-columns: repeat(2, minmax(0, 1fr)); | grid-template-columns: repeat(2, minmax(0, 1fr)); | ||
gap: 4px; | gap: 4px; | ||
box-sizing: border-box; | |||
border: 1px solid var(--wiz-content-border, #ff942d); | |||
} | } | ||
.wizlords-race-intro-example-image { | .wizlords-race-intro-example-image { | ||
min-width: 0; | min-width: 0; | ||
aspect-ratio: | aspect-ratio: 4 / 5; | ||
overflow: hidden; | overflow: hidden; | ||
background: rgba(255, 255, 255, 0.04); | background: rgba(255, 255, 255, 0.04); | ||
| Line 85: | Line 125: | ||
width: 100%; | width: 100%; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
justify-self: stretch; | |||
} | } | ||
} | } | ||