Main page/styles.css: Difference between revisions
From Project Rebearth
Program Sam (talk | contribs) Making styling a bit more comparable to the official game styling. also making things a bit more compact |
No edit summary |
||
| Line 1: | Line 1: | ||
.rb- | .rb-infobox-biome { | ||
float: right; | |||
clear: right; | |||
width: 300px; | |||
margin: 0 0 16px 20px; | |||
font-size: 0.9rem; | |||
line-height: 1.5; | |||
color: #3e2318; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-border { | ||
background-color: #e8daa8; | |||
padding: 3px; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-inner { | ||
background-color: #faf4e0; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-header { | ||
background-color: #e8daa8; | background-color: #562c1b; | ||
padding: | color: #e8daa8; | ||
text-align: center; | |||
padding: 10px 14px; | |||
font-size: 1.15rem; | |||
font-weight: 700; | |||
letter-spacing: 0.5px; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-image { | ||
background-color: #562c1b; | background-color: #562c1b; | ||
padding: | text-align: center; | ||
padding: 0 14px 10px; | |||
} | |||
.rb-infobox-biome .rb-ib-image img { | |||
display: block; | |||
margin: 0 auto; | margin: 0 auto; | ||
max-width: 100%; | |||
height: auto; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-caption { | ||
background-color: #562c1b; | background-color: #562c1b; | ||
color: # | color: #c9b57a; | ||
text-align: center; | text-align: center; | ||
padding: | padding: 0 14px 10px; | ||
font-size: 0.82rem; | |||
font-style: italic; | |||
line-height: 1.3; | |||
. | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-section { | ||
background-color: #6e3a24; | |||
color: #e8daa8; | color: #e8daa8; | ||
padding: 5px 14px; | |||
font-weight: 700; | |||
font-size: 0.82rem; | |||
text-transform: uppercase; | |||
letter-spacing: 1px; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-row { | ||
display: flex; | display: flex; | ||
border-bottom: 1px solid #e0d5a6; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-row:last-child { | ||
border-bottom: none; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-label { | ||
flex: 0 0 110px; | |||
padding: 6px 10px; | |||
font-weight: 700; | font-weight: 700; | ||
color: #562c1b; | color: #562c1b; | ||
background-color: #f0e6c2; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-data { | ||
flex: 1; | |||
padding: 6px 10px; | |||
color: #3e2318; | |||
color: | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-fullrow { | ||
padding: 6px 10px; | |||
border-bottom: 1px solid #e0d5a6; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-fullrow:last-child { | ||
border-bottom: none; | |||
} | } | ||
.rb- | .rb-infobox-biome a { | ||
color: #8b4513; | |||
color: # | |||
} | } | ||
.rb- | .rb-infobox-biome a:hover { | ||
color: #ebb933; | |||
color: # | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-badge { | ||
display: | display: inline-block; | ||
background-color: #562c1b; | |||
color: #e8daa8; | |||
padding: 1px 8px; | |||
font-size: 0.78rem; | |||
font-weight: 600; | |||
letter-spacing: 0.3px; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-footer { | ||
background-color: #562c1b; | |||
color: #c9b57a; | |||
text-align: center; | text-align: center; | ||
padding: | padding: 5px 14px; | ||
font-size: 0.78rem; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-footer a { | ||
color: #e8daa8; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-footer a:hover { | ||
color: #ebb933; | color: #ebb933; | ||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-subtable { | ||
width: 100%; | |||
border-collapse: collapse; | |||
font-size: 0.85rem; | font-size: 0.85rem; | ||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-subtable th { | ||
color: # | background-color: #6e3a24; | ||
color: #e8daa8; | |||
padding: 4px 8px; | |||
font-weight: 600; | |||
text-align: left; | |||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-subtable td { | ||
padding: 4px 8px; | padding: 4px 8px; | ||
border-bottom: 1px solid # | border-bottom: 1px solid #e0d5a6; | ||
} | } | ||
.rb- | .rb-infobox-biome .rb-ib-subtable tr:nth-child(even) td { | ||
background-color: #f5edd2; | |||
} | } | ||
.rb- | @media (max-width: 600px) { | ||
.rb-infobox-biome { | |||
float: none; | |||
width: 100%; | |||
margin: 0 0 16px 0; | |||
} | |||
} | } | ||
Revision as of 17:02, 15 February 2026
.rb-infobox-biome {
float: right;
clear: right;
width: 300px;
margin: 0 0 16px 20px;
font-size: 0.9rem;
line-height: 1.5;
color: #3e2318;
}
.rb-infobox-biome .rb-ib-border {
background-color: #e8daa8;
padding: 3px;
}
.rb-infobox-biome .rb-ib-inner {
background-color: #faf4e0;
}
.rb-infobox-biome .rb-ib-header {
background-color: #562c1b;
color: #e8daa8;
text-align: center;
padding: 10px 14px;
font-size: 1.15rem;
font-weight: 700;
letter-spacing: 0.5px;
}
.rb-infobox-biome .rb-ib-image {
background-color: #562c1b;
text-align: center;
padding: 0 14px 10px;
}
.rb-infobox-biome .rb-ib-image img {
display: block;
margin: 0 auto;
max-width: 100%;
height: auto;
}
.rb-infobox-biome .rb-ib-caption {
background-color: #562c1b;
color: #c9b57a;
text-align: center;
padding: 0 14px 10px;
font-size: 0.82rem;
font-style: italic;
line-height: 1.3;
}
.rb-infobox-biome .rb-ib-section {
background-color: #6e3a24;
color: #e8daa8;
padding: 5px 14px;
font-weight: 700;
font-size: 0.82rem;
text-transform: uppercase;
letter-spacing: 1px;
}
.rb-infobox-biome .rb-ib-row {
display: flex;
border-bottom: 1px solid #e0d5a6;
}
.rb-infobox-biome .rb-ib-row:last-child {
border-bottom: none;
}
.rb-infobox-biome .rb-ib-label {
flex: 0 0 110px;
padding: 6px 10px;
font-weight: 700;
color: #562c1b;
background-color: #f0e6c2;
}
.rb-infobox-biome .rb-ib-data {
flex: 1;
padding: 6px 10px;
color: #3e2318;
}
.rb-infobox-biome .rb-ib-fullrow {
padding: 6px 10px;
border-bottom: 1px solid #e0d5a6;
}
.rb-infobox-biome .rb-ib-fullrow:last-child {
border-bottom: none;
}
.rb-infobox-biome a {
color: #8b4513;
}
.rb-infobox-biome a:hover {
color: #ebb933;
}
.rb-infobox-biome .rb-ib-badge {
display: inline-block;
background-color: #562c1b;
color: #e8daa8;
padding: 1px 8px;
font-size: 0.78rem;
font-weight: 600;
letter-spacing: 0.3px;
}
.rb-infobox-biome .rb-ib-footer {
background-color: #562c1b;
color: #c9b57a;
text-align: center;
padding: 5px 14px;
font-size: 0.78rem;
}
.rb-infobox-biome .rb-ib-footer a {
color: #e8daa8;
}
.rb-infobox-biome .rb-ib-footer a:hover {
color: #ebb933;
}
.rb-infobox-biome .rb-ib-subtable {
width: 100%;
border-collapse: collapse;
font-size: 0.85rem;
}
.rb-infobox-biome .rb-ib-subtable th {
background-color: #6e3a24;
color: #e8daa8;
padding: 4px 8px;
font-weight: 600;
text-align: left;
}
.rb-infobox-biome .rb-ib-subtable td {
padding: 4px 8px;
border-bottom: 1px solid #e0d5a6;
}
.rb-infobox-biome .rb-ib-subtable tr:nth-child(even) td {
background-color: #f5edd2;
}
@media (max-width: 600px) {
.rb-infobox-biome {
float: none;
width: 100%;
margin: 0 0 16px 0;
}
}