Hide_D
28de73d54e
# Conflicts: # app/game-frontend/src/assets/main.css # docs/frontend-legacy-parity.md
126 lines
2.9 KiB
CSS
126 lines
2.9 KiB
CSS
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
|
|
@import 'tailwindcss';
|
|
@import './styles/tokens.css';
|
|
@import './styles/legacy-controls.css';
|
|
@import './styles/game-shell.css';
|
|
@import './styles/ref-shell.css';
|
|
|
|
@theme {
|
|
--color-sammo-ink: #000;
|
|
--color-sammo-parchment: #fff;
|
|
--color-sammo-gold: #f39c12;
|
|
}
|
|
|
|
html {
|
|
color-scheme: dark;
|
|
}
|
|
|
|
/*
|
|
* Ref's `html, body` contract: the page texture is centred and only tiles
|
|
* vertically, so a wide screen keeps one column of the texture.
|
|
*/
|
|
body {
|
|
min-width: 320px;
|
|
margin: 0;
|
|
background: #000;
|
|
background-position: center;
|
|
background-repeat: repeat-y;
|
|
color: #fff;
|
|
font-family: var(--sammo-font-sans);
|
|
font-size: 14px;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
/*
|
|
* Ref's in-game document never narrows below its 500px mobile column, so the
|
|
* app root keeps that floor. Previously this came from an unscoped `body` rule
|
|
* inside two ranking views, which also leaked their line-height everywhere.
|
|
*/
|
|
#app {
|
|
min-width: 500px;
|
|
}
|
|
|
|
/* These redesigned identity/tournament screens own a true handheld layout. */
|
|
#app:has(.responsive-settings-page),
|
|
#app:has(#tournament-container),
|
|
#app:has(#tournament-betting-container) {
|
|
min-width: 320px;
|
|
}
|
|
|
|
body:has(.battle-page),
|
|
body:has(.chief-page),
|
|
body:has(.global-page),
|
|
body:has(.main-page),
|
|
body:has(.yearbook-page) {
|
|
line-height: 1.5;
|
|
}
|
|
|
|
button,
|
|
input,
|
|
select,
|
|
textarea {
|
|
font: inherit;
|
|
}
|
|
|
|
/*
|
|
* Ref's `.bg0/.bg1/.bg2` set a background image and nothing else, so the
|
|
* element stays transparent where the texture does not cover it. Adding a
|
|
* background colour here paints over whatever the parent shows through.
|
|
*/
|
|
.legacy-bg0 {
|
|
background-image: var(--sammo-texture-walnut);
|
|
}
|
|
|
|
.legacy-bg1 {
|
|
background-image: var(--sammo-texture-green);
|
|
}
|
|
|
|
.legacy-bg2 {
|
|
background-image: var(--sammo-texture-blue);
|
|
}
|
|
|
|
/*
|
|
* Ref emits battle summaries as a classed div inside a single log row, then
|
|
* turns that div into an inline-level box. Without this rule the month prefix,
|
|
* battle summary, and action time are forced onto three separate lines.
|
|
*/
|
|
.small_war_log {
|
|
display: inline-block;
|
|
}
|
|
|
|
/*
|
|
* Ref's common stylesheet keeps diagnostic seeds in the DOM so they remain
|
|
* copyable, while removing them from every normal log rendering surface.
|
|
* This marker can arrive through main, personal, audit, and history log APIs,
|
|
* so the display contract belongs to the app-wide legacy markup boundary.
|
|
*/
|
|
.hidden_but_copyable {
|
|
color: rgba(0, 0, 0, 0) !important;
|
|
font-size: 0;
|
|
}
|
|
|
|
.small_war_log .war_type_attack {
|
|
color: cyan;
|
|
}
|
|
|
|
.small_war_log .war_type_defense {
|
|
color: magenta;
|
|
}
|
|
|
|
.small_war_log .war_type_siege {
|
|
color: white;
|
|
}
|
|
|
|
.small_war_log .name_plate {
|
|
font-size: 0.75em;
|
|
}
|
|
|
|
.small_war_log .name_plate_cover {
|
|
color: yellow;
|
|
}
|
|
|
|
.small_war_log .crew_plate {
|
|
color: orangered;
|
|
font-size: 90%;
|
|
}
|