Content added Content deleted
MarbleNiter (talk | contribs) mNo edit summary |
MarbleNiter (talk | contribs) mNo edit summary |
||
Line 8: | Line 8: | ||
.weapon-infobox { |
.weapon-infobox { |
||
grid-auto-flow: column; |
|||
grid-row: auto/span 2; |
grid-row: auto/span 2; |
||
background: var(--color-surface-2); |
background: var(--color-surface-2); |
||
border: 1px solid #ffffff1a; |
border: 1px solid #ffffff1a; |
||
border-radius: 8px; |
border-radius: 8px; |
||
} |
|||
.weapon-image { |
|||
padding: 16px; |
|||
} |
} |
||
.weapon-details { |
.weapon-details { |
||
display:grid; |
display: grid; |
||
grid-gap: 16px; |
grid-gap: 16px; |
||
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); |
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); |
||
padding: 16px; |
|||
} |
} |
||
.section-item { |
.section-item { |
||
display:grid; |
display: grid; |
||
grid-auto-flow: row; |
grid-auto-flow: row; |
||
} |
} |
||
Line 33: | Line 39: | ||
.info-data { |
.info-data { |
||
font-size: |
font-size: 0.9em; |
||
color: var(--color-base--emphasized); |
color: var(--color-base--emphasized); |
||
} |
} |
||
Line 42: | Line 48: | ||
.info-data img { |
.info-data img { |
||
vertical-align: bottom; |
vertical-align: text-bottom; |
||
} |
} |
Revision as of 15:07, 19 June 2024
/* Weapon Infobox */
.page-grid {
display: grid;
grid-template-columns: repeat(auto-fit,minmax(360px,1fr));
grid-gap: 1em 2em;
margin-bottom: 4em;
}
.weapon-infobox {
grid-auto-flow: column;
grid-row: auto/span 2;
background: var(--color-surface-2);
border: 1px solid #ffffff1a;
border-radius: 8px;
}
.weapon-image {
padding: 16px;
}
.weapon-details {
display: grid;
grid-gap: 16px;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
padding: 16px;
}
.section-item {
display: grid;
grid-auto-flow: row;
}
.info-label {
font-weight: 600;
font-size: 0.8em;
letter-spacing: 0.02em;
color: var(--color-base--subtle);
}
.info-data {
font-size: 0.9em;
color: var(--color-base--emphasized);
}
p, li {
font-size: 0.9em;
}
.info-data img {
vertical-align: text-bottom;
}