Template:Infobox town/styles.css: Difference between revisions
Template page
More actions
Create Template:Infobox town |
m Create Template:Infobox town |
||
| Line 4: | Line 4: | ||
width: 300px; | width: 300px; | ||
margin: 0 0 1em 1em; | margin: 0 0 1em 1em; | ||
background: rgba(20, 16, 12, .45); | |||
border: 1px solid rgba(255, 255, 255, .15); | |||
} | } | ||
.loka-town-name { | .loka-town-name { | ||
text-align: center; | |||
font-size: 1.25em; | |||
font-weight: 700; | font-weight: 700; | ||
padding: .6em; | |||
border-bottom: 1px solid rgba(255, 255, 255, .15); | |||
} | } | ||
| Line 20: | Line 19: | ||
line-height: 0; | line-height: 0; | ||
text-align: center; | text-align: center; | ||
padding: 10px; | |||
} | } | ||
| Line 30: | Line 29: | ||
.loka-town-row { | .loka-town-row { | ||
display: flex; | display: flex; | ||
padding: .4em .6em; | padding: .4em .6em; | ||
border-top: 1px solid | border-top: 1px solid rgba(255, 255, 255, .15); | ||
font-size: .9em; | font-size: .9em; | ||
} | } | ||
.loka-town-row-key { | .loka-town-row-key { | ||
flex: 0 0 38%; | |||
font-weight: 700; | font-weight: 700; | ||
text-align: left; | |||
} | } | ||
.loka-town-row-value { | .loka-town-row-value { | ||
text-align: | flex: 1; | ||
text-align: left; | |||
} | } | ||
.loka-town-location { | .loka-town-location { | ||
position: relative; | position: relative; | ||
border-top: 1px solid | border-top: 1px solid rgba(255, 255, 255, .15); | ||
overflow: hidden; | overflow: hidden; | ||
min-height: 140px; | min-height: 140px; | ||
| Line 83: | Line 82: | ||
.loka-town-location-row { | .loka-town-location-row { | ||
display: flex; | display: flex; | ||
padding: .2em 0; | padding: .2em 0; | ||
color: #ffffff; | color: #ffffff; | ||
font-size: .85em; | font-size: .85em; | ||
text-shadow: 0 1px 3px rgba(0, 0, 0, .9); | text-shadow: 0 1px 3px rgba(0, 0, 0, .9); | ||
} | } | ||
.loka-town-location-key { | .loka-town-location-key { | ||
flex: 0 0 38%; | |||
opacity: .8; | opacity: .8; | ||
text-align: left; | |||
} | } | ||
.loka-town-location-value { | .loka-town-location-value { | ||
flex: 1; | |||
text-align: left; | |||
font-weight: 700; | font-weight: 700; | ||
} | } | ||
| Line 106: | Line 102: | ||
/* Flat fallback: no biome backdrop found, plain panel instead of a photo */ | /* Flat fallback: no biome backdrop found, plain panel instead of a photo */ | ||
.loka-town-location--flat { | .loka-town-location--flat { | ||
background: | background: rgba(255, 255, 255, .03); | ||
min-height: 0; | min-height: 0; | ||
} | } | ||
| Line 112: | Line 108: | ||
.loka-town-location--flat .loka-town-location-content { | .loka-town-location--flat .loka-town-location-content { | ||
position: static; | position: static; | ||
} | |||
.loka-town-location--flat .loka-town-location-row { | |||
text-shadow: none; | |||
} | } | ||
Revision as of 21:11, 17 August 2026
.loka-town-infobox {
float: right;
clear: right;
width: 300px;
margin: 0 0 1em 1em;
background: rgba(20, 16, 12, .45);
border: 1px solid rgba(255, 255, 255, .15);
}
.loka-town-name {
text-align: center;
font-size: 1.25em;
font-weight: 700;
padding: .6em;
border-bottom: 1px solid rgba(255, 255, 255, .15);
}
.loka-town-image {
line-height: 0;
text-align: center;
padding: 10px;
}
.loka-town-image img {
max-width: 100%;
height: auto;
}
.loka-town-row {
display: flex;
padding: .4em .6em;
border-top: 1px solid rgba(255, 255, 255, .15);
font-size: .9em;
}
.loka-town-row-key {
flex: 0 0 38%;
font-weight: 700;
text-align: left;
}
.loka-town-row-value {
flex: 1;
text-align: left;
}
.loka-town-location {
position: relative;
border-top: 1px solid rgba(255, 255, 255, .15);
overflow: hidden;
min-height: 140px;
}
.loka-town-location > span img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.loka-town-location-scrim {
position: absolute;
inset: 0;
background: rgba(8, 6, 3, .62);
}
.loka-town-location-content {
position: relative;
padding: .5em .6em .6em;
}
.loka-town-location-heading {
font-size: .7em;
font-weight: 700;
color: #f0cf8e;
text-transform: uppercase;
letter-spacing: .04em;
margin-bottom: .4em;
}
.loka-town-location-row {
display: flex;
padding: .2em 0;
color: #ffffff;
font-size: .85em;
text-shadow: 0 1px 3px rgba(0, 0, 0, .9);
}
.loka-town-location-key {
flex: 0 0 38%;
opacity: .8;
text-align: left;
}
.loka-town-location-value {
flex: 1;
text-align: left;
font-weight: 700;
}
/* Flat fallback: no biome backdrop found, plain panel instead of a photo */
.loka-town-location--flat {
background: rgba(255, 255, 255, .03);
min-height: 0;
}
.loka-town-location--flat .loka-town-location-content {
position: static;
}
.loka-town-location--flat .loka-town-location-row {
text-shadow: none;
}