(Take the infobox code from Wikipedia) |
Tag: Undo |
||
(11 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
.infobox { | .infobox { | ||
border-radius:var(--border-radius--medium); | |||
background-color:var(--color-surface-2); | |||
padding: 20px; | |||
width: 100%; | |||
margin-top: 1em; | |||
} | |||
.infobox-title { | |||
color:var(--color-base--emphasized); | |||
font-weight:var(--font-weight-semibold); | |||
font-size:calc(var(--font-size-h3)*1.5); | |||
text-align:center; | |||
} | } | ||
.infobox-image { | |||
max-width:100%; | |||
height:auto; | |||
.infobox-image | |||
} | } | ||
.infobox-table td { | |||
padding-block:3px; | |||
.infobox- | |||
} | } | ||
.infobox-table th { | |||
color:var(--color-base--subtle); | |||
font-weight:var(--font-weight-semibold); | |||
text-align:left; | |||
padding-right: 15px; | |||
} | } | ||
.infobox-table th { | |||
.infobox- | width: 40%; | ||
} | } | ||
.infobox-table td { | |||
width: 60%; | |||
} | } | ||
@media screen and (min-width:720px) { | |||
.infobox | .infobox { | ||
max-width: 400px; | |||
float:right; | |||
} | |||
} | } |
Latest revision as of 21:32, 21 January 2024
.infobox { border-radius:var(--border-radius--medium); background-color:var(--color-surface-2); padding: 20px; width: 100%; margin-top: 1em; } .infobox-title { color:var(--color-base--emphasized); font-weight:var(--font-weight-semibold); font-size:calc(var(--font-size-h3)*1.5); text-align:center; } .infobox-image { max-width:100%; height:auto; } .infobox-table td { padding-block:3px; } .infobox-table th { color:var(--color-base--subtle); font-weight:var(--font-weight-semibold); text-align:left; padding-right: 15px; } .infobox-table th { width: 40%; } .infobox-table td { width: 60%; } @media screen and (min-width:720px) { .infobox { max-width: 400px; float:right; } }