Files
MineGeo/app/polish.css

276 lines
5.2 KiB
CSS

/* Responsive corrections shared by both languages. */
.language-switcher {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--muted);
}
.language-switcher select {
color: var(--text);
background: #151e28;
border: 1px solid var(--line);
border-radius: 8px;
padding: 8px 28px 8px 10px;
max-width: 100%;
cursor: pointer;
}
.language-switcher select:focus-visible,
textarea:focus-visible,
select:focus-visible {
outline: 2px solid var(--green);
outline-offset: 3px;
}
@font-face {
font-family: MineGeoPixelCyrillic;
src: url("/fonts/Monocraft.ttf") format("truetype");
font-weight: 400;
font-style: normal;
font-display: swap;
}
html[lang="ru"] h1,
html[lang="ru"] h2,
html[lang="ru"] h3,
html[lang="ru"] .button,
html[lang="ru"] .header-account,
html[lang="ru"] .site-header nav,
html[lang="ru"] .world-stats strong {
font-family: MineGeoPixelCyrillic, monospace;
line-height: 1.45;
}
html[lang="ru"] h1 {
font-size: clamp(28px, 3vw, 42px);
letter-spacing: -1px;
}
html[lang="ru"] h2 {
font-size: clamp(22px, 2.1vw, 30px);
letter-spacing: -0.5px;
}
html[lang="ru"] h3 {
font-size: 18px;
letter-spacing: 0;
}
html[lang="ru"] .button,
html[lang="ru"] .header-account {
font-size: 14px;
}
html[lang="ru"] .site-header nav {
font-size: 12px;
gap: 24px;
}
html[lang="ru"] .world-stats strong {
font-size: 24px;
}
html[lang="ru"] .leaderboard-preview-copy h2 {
font-size: clamp(27px, 3.2vw, 42px);
}
html[lang="ru"] .mode-row h3 {
font-size: 14px;
flex-wrap: wrap;
}
html[lang="ru"] .mode-row h3 span {
font-family: Arial, sans-serif;
}
.header-inner > *,
.hero > *,
.section-heading > *,
.home-panels > *,
.contribute-banner > *,
.site-footer > * {
min-width: 0;
}
.site-footer > div:last-of-type {
flex-wrap: wrap;
align-items: center;
}
.site-footer .disclaimer {
color: var(--muted);
}
.card-body h3,
.podium-player h2 {
overflow-wrap: anywhere;
}
.board-heading {
gap: 12px;
flex-wrap: wrap;
}
.mode-row h3 {
flex-wrap: wrap;
}
.tool-card {
display: flex;
flex-direction: column;
}
.tool-card pre,
.token-box code {
max-width: 100%;
overflow-x: auto;
}
.tool-card .button {
align-self: flex-start;
}
.leaderboard-filters {
flex-wrap: wrap;
}
.hero-notes > span:last-child {
min-width: 0;
}
.round-blocks {
flex-shrink: 0;
}
.button,
.header-account {
text-align: center;
}
.auth-tabs button {
border-radius: var(--radius-control);
}
/* Keep catalog cards readable instead of squeezing long map names. */
.cards-grid {
grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
}
.map-card .card-body .map-credit {
display: block;
overflow: visible;
min-height: 0;
-webkit-line-clamp: unset;
}
.map-card .card-body .eyebrow {
overflow-wrap: anywhere;
}
.search-field:focus-within {
outline: 2px solid var(--green);
outline-offset: 4px;
}
.dashboard-toolbar {
flex-wrap: wrap;
}
.dashboard-toolbar > * {
min-width: 0;
}
@media (max-width: 850px) {
.site-header {
height: auto;
}
.header-inner {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
padding: 14px 20px;
gap: 14px;
}
.header-inner nav {
grid-column: 1 / -1;
grid-row: 2;
width: 100%;
display: flex;
flex-wrap: wrap;
gap: 12px 22px;
padding: 12px 0 2px;
border-top: 1px solid var(--line);
justify-content: flex-start;
}
html[lang="ru"] .header-inner nav {
gap: 12px 20px;
font-size: 11px;
}
.header-account {
justify-self: end;
white-space: nowrap;
}
.site-header nav a {
padding-block: 6px;
}
.site-header nav a[aria-current="page"]::after {
bottom: 0;
}
}
@media (max-width: 700px) {
.section-heading {
flex-wrap: wrap;
align-items: flex-start;
gap: 12px;
}
.section-heading .text-link {
white-space: normal;
}
.world-stats {
margin-inline: auto;
}
.world-stats > div {
padding-left: 0;
}
.home-page .map-art-frame {
width: min(256px, 76vw);
height: auto;
aspect-ratio: 1;
}
.site-footer {
gap: 24px;
}
.site-footer > div:last-of-type {
width: 100%;
gap: 16px 24px;
}
.language-switcher {
flex-basis: 100%;
}
html[lang="ru"] .hero h1 {
font-size: clamp(26px, 7vw, 34px);
}
html[lang="ru"] .world-stats strong {
font-size: 20px;
}
html[lang="ru"] .card-body h3 {
font-size: 15px;
}
html[lang="ru"] .card-type {
font-size: 8px;
}
.hero-actions .text-link {
font-size: 12px;
}
.home-panel + .home-panel {
min-width: 0;
}
.map-card .card-body p {
display: -webkit-box;
}
.map-card .card-meta span:last-child {
display: flex;
}
}
.moderator-settings {
margin-bottom: 28px;
}
.moderation-page :is(.tool-card, .draft-row) {
margin-bottom: 32px;
}
.staff-page-switch {
display: flex;
flex-wrap: wrap;
gap: 20px;
margin: 24px 0 32px;
}
.moderator-setting-row {
display: flex;
gap: 24px;
justify-content: space-between;
align-items: center;
margin-top: 24px;
}
.moderator-setting-row h3 {
margin: 0 0 8px;
}
.moderator-setting-row p {
margin: 6px 0;
}
.moderator-setting-row .button {
flex-shrink: 0;
}
@media (max-width: 600px) {
.moderator-setting-row {
align-items: stretch;
flex-direction: column;
}
}