mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
10067 lines
284 KiB
CSS
10067 lines
284 KiB
CSS
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;700&family=Noto+Sans:wght@400;700&display=swap');
|
|
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&icon_names=arrow_upload_ready,expand_more,settings,star_shine');
|
|
|
|
/* Esper Genesis Character Sheet */
|
|
|
|
/* ============================================================
|
|
COLOR TOKENS - light palette (current look, unchanged).
|
|
CSE sheet: :root is reachable and cascades to BOTH the sheet
|
|
and chat roll templates. Defined here so body.sheet-darkmode
|
|
(an ancestor closer to elements than :root) can override them.
|
|
Dark-mode overrides live at the END of the file (search "DARK MODE").
|
|
============================================================ */
|
|
:root {
|
|
/* Brand */
|
|
--eg-gold: #ab8b57;
|
|
--eg-gold-rgb: 171, 139, 87;
|
|
--eg-gold-light: #e2c285;
|
|
--eg-blue: #245485;
|
|
--eg-blue-rgb: 36, 84, 133;
|
|
--eg-blue-fill: #245485;
|
|
--eg-blue-bright: #066dce;
|
|
--eg-blue-bright-rgb: 6, 109, 206;
|
|
--eg-hp-green: #00ba73;
|
|
--eg-success: #27ae60;
|
|
--eg-danger: #c0392b;
|
|
/* Neutrals (role-based) */
|
|
--eg-text: #111111;
|
|
--eg-text-muted: #888888;
|
|
--eg-text-faint: #a0a0a0;
|
|
--eg-bg: #ffffff;
|
|
--eg-bg-alt: #f0f0f0;
|
|
--eg-bg-tint: #f4fafd;
|
|
--eg-bg-input: #ffffff;
|
|
--eg-border: #d3d3d3;
|
|
--eg-border-faint: #e8e8e8;
|
|
}
|
|
|
|
/* ROLL TEMPLATE TOKENS (light). Templates render in the chat pane, where :root
|
|
does NOT cascade under CSE -- so every var(--eg-X) a template used resolved to
|
|
nothing, wiping backgrounds, borders, and font colors (text fell back to the
|
|
chat default 404040). The legacy build defined the tokens directly on each
|
|
template root; restore here. Dark override lives in the DARK MODE section. */
|
|
.sheet-rolltemplate-simple,
|
|
.sheet-rolltemplate-atk,
|
|
.sheet-rolltemplate-dmg,
|
|
.sheet-rolltemplate-atkdmg,
|
|
.sheet-rolltemplate-desc,
|
|
.sheet-rolltemplate-spell,
|
|
.sheet-rolltemplate-traits,
|
|
.sheet-rolltemplate-npc,
|
|
.sheet-rolltemplate-npcatk,
|
|
.sheet-rolltemplate-npcdmg,
|
|
.sheet-rolltemplate-npcaction,
|
|
.sheet-rolltemplate-mancerroll,
|
|
.sheet-rolltemplate-mancerhproll {
|
|
--eg-gold: #ab8b57;
|
|
--eg-gold-rgb: 171, 139, 87;
|
|
--eg-gold-light: #e2c285;
|
|
--eg-blue: #245485;
|
|
--eg-blue-rgb: 36, 84, 133;
|
|
--eg-blue-fill: #245485;
|
|
--eg-blue-bright: #066dce;
|
|
--eg-blue-bright-rgb: 6, 109, 206;
|
|
--eg-hp-green: #00ba73;
|
|
--eg-success: #27ae60;
|
|
--eg-danger: #c0392b;
|
|
--eg-text: #111111;
|
|
--eg-text-muted: #888888;
|
|
--eg-text-faint: #a0a0a0;
|
|
--eg-bg: #ffffff;
|
|
--eg-bg-alt: #f0f0f0;
|
|
--eg-bg-tint: #f4fafd;
|
|
--eg-bg-input: #ffffff;
|
|
--eg-border: #d3d3d3;
|
|
--eg-border-faint: #e8e8e8;
|
|
}
|
|
|
|
.pc, .npc {
|
|
display: none;
|
|
}
|
|
|
|
.npc_toggle[value="0"] ~ .pc, .npc_toggle[value="1"] ~ .npc {
|
|
display: block;
|
|
}
|
|
|
|
/* CSE wrapper reset - Roll20 CSE adds default padding to .charsheet that Legacy
|
|
did not. That padding caused the sheet to overflow the viewport and showed as
|
|
white bands (top/left) in dark mode. Mirrors the OGL CSE sheet's reset. */
|
|
.charsheet {
|
|
position: relative;
|
|
padding: 0 !important;
|
|
background-color: var(--eg-bg);
|
|
}
|
|
|
|
/* GLOBAL BOX-MODEL RESTORE - EG was authored under Roll20 Legacy, whose default
|
|
box model is content-box. CSE's platform CSS forces border-box on '*', which
|
|
folds padding/border into declared widths and makes the whole sheet render
|
|
tighter than the original design. Re-assert content-box as the sheet default.
|
|
Specificity is (0,1,0) - it beats the platform's bare '*' (0,0,0) but LOSES to
|
|
every one of EG's 47 explicit 'box-sizing: border-box' rules (all (0,1,0)+ and
|
|
later in the file), so intentional border-box elements are preserved.
|
|
Scoped under .charsheet so Roll20's own page chrome is untouched. */
|
|
.charsheet *,
|
|
.charsheet *::before,
|
|
.charsheet *::after {
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
/* SHIP SUBTREE - re-assert border-box. The starship layout is modern grid/flex
|
|
authored against CSE's native border-box; the global content-box restore above
|
|
(needed by the legacy PC core) made its fixed-px circle/grid tracks add
|
|
padding+border outside their width, ballooning the stat circles and overflowing
|
|
the sheet. Higher specificity (0,3,0) beats the global '.charsheet *' (0,1,0). */
|
|
.charsheet .pc .sheet-pc-ship,
|
|
.charsheet .pc .sheet-pc-ship *,
|
|
.charsheet .pc .sheet-pc-ship *::before,
|
|
.charsheet .pc .sheet-pc-ship *::after {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* GLOBAL TEXT-COLOR RESTORE - EG never set a base text color; under Legacy it
|
|
inherited a dark default. CSE's platform default '.charsheet' text color is
|
|
light, so any text EG didn't explicitly color (e.g. the '.subcontainer span.label'
|
|
"TP REMAINING") inherited light and vanished on the white sheet. Re-assert the
|
|
base text color via the theme token (auto-flips in dark mode). Explicit EG color
|
|
rules are higher specificity and still win. */
|
|
.charsheet .pc,
|
|
.charsheet .npc {
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.charsheet .container {
|
|
width: 860px;
|
|
background-color: var(--eg-bg);
|
|
position: relative;
|
|
/* CSE: '.container' is a Bootstrap class in Roll20's platform CSS - it adds a
|
|
horizontal gutter (padding-left/right) that offset the sheet to the right.
|
|
Zero ONLY the horizontal gutter - '.container' shares its element with '.pc',
|
|
so 'padding:0' would also kill '.pc { padding-top:32px }' (the clearance that
|
|
keeps the absolute top-bar off the header). Mirrors OGL's container reset. */
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
/* CSE: keep the PC character sheet as one centered 860px unit. The body
|
|
(.container.pc) is already 860px, but its siblings - the full-width .top-bar
|
|
and the absolutely-positioned Sheet Settings button (anchored to the relative
|
|
.licensecontainer) - otherwise drift to the viewport edges when the dialog is
|
|
widened. Constraining the shared .licensecontainer to 860px centered glues
|
|
them to the body. Scoped to PC character mode only via :is(): NPC (npc_toggle
|
|
!= 0) and Starship (pc-type = starship) stay fluid/full-width as designed. */
|
|
/* PC 860px-pin removed: required the has-selector (styles the outer .licensecontainer
|
|
wrapper from inner attribute values), which Roll20's CSS filter rejects. PC stays fluid. */
|
|
|
|
/* Paint the whole sheet wrapper with the theme bg. Our '.charsheet' bg rule is
|
|
only (0,1,0) and loses to the platform's dark-mode '.charsheet' background in
|
|
the areas not covered by '.container.pc' (the top-bar and the logo footer),
|
|
which showed as a lighter gray. '.charsheet .licensecontainer' (0,2,0) the
|
|
platform doesn't style, so the fills those bars with --eg-bg in both modes. */
|
|
.charsheet .licensecontainer {
|
|
background-color: var(--eg-bg);
|
|
}
|
|
|
|
input[type=radio].tab-button {
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 290px;
|
|
right: 0px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
}
|
|
/* All page/type tab inputs - hidden; CSS ~ combinator still reaches sibling elements */
|
|
input[type=radio].tab-button.core,
|
|
input[type=radio].tab-button.bio,
|
|
input[type=radio].tab-button.spells,
|
|
input[type=radio].tab-button.type-pc,
|
|
input[type=radio].tab-button.type-starship {
|
|
display: none;
|
|
}
|
|
input[type=radio].tab-button + span {
|
|
position: absolute;
|
|
top: 290px;
|
|
right: 0px;
|
|
width: 17px;
|
|
height: 18px;
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 5px;
|
|
background-color: var(--eg-bg-alt);
|
|
color: var(--eg-text);
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-family: 'Noto Sans', sans-serif;
|
|
padding: 0.5px;
|
|
}
|
|
input[type=radio].npc-button {
|
|
opacity: 0;
|
|
top: 5px;
|
|
position: absolute;
|
|
right: 0px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
}
|
|
input[type=radio].npc-button + span {
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 0px;
|
|
width: 17px;
|
|
height: 18px;
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 5px;
|
|
background-color: var(--eg-bg-alt);
|
|
color: var(--eg-text);
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-family: 'Noto Sans', sans-serif;
|
|
padding: 0.5px;
|
|
}
|
|
|
|
/* Advantage / Whisper toggle groups - flex row of label buttons */
|
|
.advantagetoggle {
|
|
position: absolute;
|
|
top: 3px;
|
|
left: 160px;
|
|
display: none;
|
|
align-items: center;
|
|
gap: 3px;
|
|
z-index: 3;
|
|
}
|
|
.whispertoggle {
|
|
left: 5px;
|
|
}
|
|
/* Radio inputs hidden - labels handle appearance and clicks via for= */
|
|
.advantagetoggle input[type=radio] {
|
|
display: none;
|
|
}
|
|
/* Toggle button labels */
|
|
.advantagetoggle input[type=radio] + label {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
background-color: var(--eg-bg-alt);
|
|
color: var(--eg-text);
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 11px;
|
|
padding: 2px 10px;
|
|
cursor: pointer;
|
|
white-space: nowrap;
|
|
line-height: 18px;
|
|
display: inline-block;
|
|
}
|
|
/* Active button - gold */
|
|
.advantagetoggle input[type=radio]:checked + label {
|
|
color: #fff;
|
|
background-color: var(--eg-gold);
|
|
border-color: var(--eg-gold);
|
|
}
|
|
/* NPC button keeps green */
|
|
input[type=radio].npc-button:checked + span {
|
|
color: #FFFFFF;
|
|
background-color: var(--eg-hp-green);
|
|
}
|
|
/* NPC mode: reposition toggles */
|
|
.npc_toggle[value="1"] ~ .advantagetoggle {
|
|
top: -10px;
|
|
left: 390px;
|
|
}
|
|
.npc_toggle[value="1"] ~ .advantagetoggle.whispertoggle {
|
|
top: -10px;
|
|
left: 120px;
|
|
}
|
|
/* Show toggle groups when enabled in sheet settings */
|
|
.toggleflag[value*=advantagetoggle] + .advantagetoggle,
|
|
.toggleflag[value*=whispertoggle] + .whispertoggle {
|
|
display: flex;
|
|
}
|
|
.toggleflag[value="1"] + .hidden, .toggleflag[value="1"] + :is(.sheet-row, .row).hidden {
|
|
display: block;
|
|
}
|
|
|
|
.npc_toggle[value="1"] + .npcspellcastingflag[value="1"] ~ .pc {
|
|
display: block;
|
|
visibility: hidden;
|
|
width: 0px;
|
|
top: -150px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
.npc_toggle[value="1"] + .npcspellcastingflag[value="1"] ~ .pc .page.spells {
|
|
display: block;
|
|
}
|
|
.npc_toggle[value="1"] + .npcspellcastingflag[value="1"] ~ .pc .page.spells .header {
|
|
display: block;
|
|
visibility: hidden;
|
|
width: 0px;
|
|
top: -150px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
.npc_toggle[value="1"] + .npcspellcastingflag[value="1"] ~ .pc .page.core, .npc_toggle[value="1"] + .npcspellcastingflag[value="1"] ~ .pc .page.bio {
|
|
display: none;
|
|
}
|
|
.npc_toggle[value="1"] + .npcspellcastingflag[value="1"] ~ .pc .page.spells .body {
|
|
visibility: visible;
|
|
}
|
|
.hidden, :is(.sheet-options, .options) :is(.sheet-row, .row).hidden, .settings-modal-body :is(.sheet-row, .row).hidden {
|
|
display: none;
|
|
}
|
|
|
|
.npc_toggle[value="1"] ~ .advantagetoggle input[type=radio] + label {
|
|
text-transform: lowercase;
|
|
font-variant: small-caps;
|
|
font-weight: normal;
|
|
background: transparent;
|
|
border: none;
|
|
}
|
|
.npc_toggle[value="1"] ~ .advantagetoggle input[type=radio] + label:first-letter,
|
|
.npc_toggle[value="1"] ~ .advantagetoggle input[type=radio] + label .togm {
|
|
text-transform: uppercase;
|
|
}
|
|
.npc_toggle[value="1"] ~ .advantagetoggle input[type=radio]:checked + label {
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
background: transparent;
|
|
}
|
|
|
|
.page {
|
|
display: none;
|
|
}
|
|
|
|
input[type=radio].tab-button.core:checked ~ .page.core, input[type=radio].tab-button.bio:checked ~ .page.bio, input[type=radio].tab-button.spells:checked ~ .page.spells {
|
|
display: block;
|
|
}
|
|
|
|
.page.npcs, .page.ships {
|
|
display: none;
|
|
}
|
|
|
|
input[type=radio].npc-button.npcs:checked ~ .page.npcs, input[type=radio].npc-button.ships:checked ~ .page.ships {
|
|
display: block;
|
|
}
|
|
/* Bio tab - Personality/Ideals/Bonds/Flaws 2x2 grid */
|
|
.page.bio .bio-background {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 4px;
|
|
margin-bottom: 4px;
|
|
}
|
|
/* Tab row - in document flow, sits between abilities bar and body */
|
|
.tab-row {
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: row;
|
|
padding: 2px 0 0;
|
|
align-items: flex-end;
|
|
min-height: 28px;
|
|
margin-top: -4.5px;
|
|
margin-bottom: 12px;
|
|
z-index: 1;
|
|
}
|
|
/* Shared label style for both groups */
|
|
.tab-row .tab-label,
|
|
.ship-tab-row .tab-label {
|
|
/* CSE forces border-box globally; EG was authored for content-box. Restore it
|
|
here so min-width:100px + padding render as the wider Legacy/preview tab. */
|
|
box-sizing: content-box;
|
|
border: 1px solid var(--eg-border);
|
|
border-radius: 0 0 6px 6px;
|
|
background-color: var(--eg-bg-alt);
|
|
color: var(--eg-text-muted);
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 13px;
|
|
padding: 3px 12px;
|
|
cursor: pointer;
|
|
white-space: nowrap;
|
|
}
|
|
/* Main group: CORE / GEAR & BIO / POWERS - absolutely centered on the row */
|
|
.tab-main-group {
|
|
position: absolute;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
bottom: 0;
|
|
display: flex;
|
|
gap: 4px;
|
|
}
|
|
.tab-main-group .tab-label {
|
|
min-width: 100px;
|
|
}
|
|
/* Type group: PC / STARSHIP - right-aligned */
|
|
.tab-type-group {
|
|
margin-left: auto;
|
|
display: flex;
|
|
gap: 4px;
|
|
}
|
|
/* Ship sheet tab row */
|
|
.ship-tab-row {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
gap: 4px;
|
|
margin-top: -20px;
|
|
margin-bottom: 12px;
|
|
}
|
|
.ship-tab-row .tab-label {
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
}
|
|
/* Active tab - gold */
|
|
input[type=radio].tab-button.core:checked ~ .page.core .tab-row .tab-label.core,
|
|
input[type=radio].tab-button.bio:checked ~ .page.bio .tab-row .tab-label.bio,
|
|
input[type=radio].tab-button.spells:checked ~ .page.spells .tab-row .tab-label.spells {
|
|
color: #fff;
|
|
background-color: var(--eg-gold);
|
|
border-color: var(--eg-gold);
|
|
}
|
|
/* PC label gold by default - since PC is the initial state and attr_pc_sheet_type
|
|
may be unset on existing characters, we highlight PC unless STARSHIP is checked */
|
|
.tab-row .tab-label.type-pc,
|
|
.ship-tab-row .tab-label.type-pc {
|
|
color: #fff;
|
|
background-color: var(--eg-gold);
|
|
border-color: var(--eg-gold);
|
|
}
|
|
/* When STARSHIP is explicitly checked: un-highlight PC, highlight STARSHIP */
|
|
input[type=radio].tab-button.type-starship:checked ~ .page.core .tab-row .tab-label.type-pc,
|
|
input[type=radio].tab-button.type-starship:checked ~ .page.bio .tab-row .tab-label.type-pc,
|
|
input[type=radio].tab-button.type-starship:checked ~ .page.spells .tab-row .tab-label.type-pc {
|
|
color: var(--eg-text-muted);
|
|
background-color: var(--eg-bg-alt);
|
|
border-color: var(--eg-border);
|
|
}
|
|
input[type=radio].tab-button.type-starship:checked ~ .page.core .tab-row .tab-label.type-starship,
|
|
input[type=radio].tab-button.type-starship:checked ~ .page.bio .tab-row .tab-label.type-starship,
|
|
input[type=radio].tab-button.type-starship:checked ~ .page.spells .tab-row .tab-label.type-starship {
|
|
color: #fff;
|
|
background-color: var(--eg-gold);
|
|
border-color: var(--eg-gold);
|
|
}
|
|
/* Ship tab-row: PC highlighted by default, STARSHIP overrides */
|
|
input[type=radio].tab-button.type-starship:checked ~ .ship-tab-row .tab-label.type-pc {
|
|
color: var(--eg-text-muted);
|
|
background-color: var(--eg-bg-alt);
|
|
border-color: var(--eg-border);
|
|
}
|
|
input[type=radio].tab-button.type-starship:checked ~ .ship-tab-row .tab-label.type-starship {
|
|
color: #fff;
|
|
background-color: var(--eg-gold);
|
|
border-color: var(--eg-gold);
|
|
}
|
|
/* Hover - gold highlight on inactive tabs */
|
|
.tab-row .tab-label:hover,
|
|
.ship-tab-row .tab-label:hover {
|
|
background-color: var(--eg-gold);
|
|
border-color: var(--eg-gold);
|
|
color: #fff;
|
|
}
|
|
/* Sheet Settings - Modal */
|
|
input[type=checkbox].settings-modal-toggle {
|
|
display: none;
|
|
}
|
|
input[type=checkbox].settings-modal-toggle:checked ~ .settings-modal-overlay {
|
|
display: block;
|
|
}
|
|
label.settings-modal-btn {
|
|
position: absolute;
|
|
right: 5px;
|
|
top: 3px;
|
|
width: 130px;
|
|
height: 24px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center !important;
|
|
padding: 0 !important;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 10px;
|
|
letter-spacing: 0.5px;
|
|
text-transform: uppercase;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 3px;
|
|
color: var(--eg-blue);
|
|
background-color: var(--eg-bg);
|
|
cursor: pointer;
|
|
z-index: 3;
|
|
box-sizing: border-box;
|
|
}
|
|
label.settings-modal-btn:hover {
|
|
background-color: var(--eg-blue-fill);
|
|
color: #fff;
|
|
border-color: var(--eg-blue);
|
|
}
|
|
/* Hide Sheet Settings button when NPC/Ship mode is active */
|
|
.npc-mode-mirror:checked ~ label.settings-modal-btn {
|
|
display: none;
|
|
}
|
|
.npc-mode-mirror {
|
|
display: none;
|
|
}
|
|
.settings-modal-overlay {
|
|
display: none;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 200;
|
|
}
|
|
.settings-modal-overlay > label.settings-modal-backdrop {
|
|
display: block;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.5);
|
|
cursor: pointer;
|
|
}
|
|
.settings-modal-panel {
|
|
position: absolute;
|
|
top: 30px;
|
|
left: 10px;
|
|
right: 10px;
|
|
max-height: calc(100% - 40px);
|
|
background: var(--eg-bg);
|
|
border: 2px solid var(--eg-gold);
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
z-index: 201;
|
|
}
|
|
.settings-modal-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 6px 12px;
|
|
background: var(--eg-blue-fill);
|
|
flex-shrink: 0;
|
|
}
|
|
.settings-modal-title {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
font-variant: small-caps;
|
|
letter-spacing: 1px;
|
|
color: #fff;
|
|
}
|
|
label.settings-modal-close {
|
|
width: 22px;
|
|
height: 22px;
|
|
/* CSE: pin so the platform doesn't flex-grow the <label>, and zero the platform's
|
|
label padding (padding-right) which, with content-box, widened the 22px circle
|
|
into an oval. box-sizing:border-box keeps it a true 22px circle. */
|
|
flex: 0 0 22px !important;
|
|
padding: 0 !important;
|
|
box-sizing: border-box !important;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 50%;
|
|
background: rgba(255, 255, 255, 0.2);
|
|
color: #fff;
|
|
font-size: 13px;
|
|
cursor: pointer;
|
|
line-height: 1;
|
|
}
|
|
label.settings-modal-close:hover {
|
|
background: rgba(255, 255, 255, 0.4);
|
|
}
|
|
.settings-modal-body {
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
padding: 10px;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: flex-start;
|
|
gap: 8px;
|
|
flex: 1;
|
|
}
|
|
input[type=radio].npc-button.npcs {
|
|
right: 65px;
|
|
width: 30px;
|
|
}
|
|
input[type=radio].npc-button.npcs + span {
|
|
right: 65px;
|
|
width: 30px;
|
|
}
|
|
input[type=radio].npc-button.ships {
|
|
right: 20px;
|
|
width: 40px;
|
|
}
|
|
input[type=radio].npc-button.ships + span {
|
|
right: 20px;
|
|
width: 40px;
|
|
}
|
|
|
|
.header :is(.sheet-top, .top) {
|
|
height: 42px;
|
|
}
|
|
.header .part {
|
|
width: 157px;
|
|
display: inline-block;
|
|
text-align: center;
|
|
}
|
|
.header .part input[type=text], .header .part select {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
height: 56px;
|
|
width: 110px;
|
|
text-align: center;
|
|
}
|
|
.header .header-info select {
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
}
|
|
.header .part input[type=text] {
|
|
font-size: 30px;
|
|
}
|
|
.header .part span:is(.sheet-display, .display) {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
height: 54px;
|
|
width: 110px;
|
|
text-align: center;
|
|
margin: 0px;
|
|
display: inline-block;
|
|
line-height: 54px;
|
|
font-size: 25px;
|
|
}
|
|
.header input, .header select {
|
|
border-bottom: 1px solid var(--eg-border);
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
}
|
|
.header input {
|
|
padding: 0px;
|
|
}
|
|
.header select {
|
|
margin-bottom: 0px;
|
|
}
|
|
.header input[type=number] {
|
|
text-align: center;
|
|
margin-bottom: -9px;
|
|
-moz-appearance: textfield;
|
|
}
|
|
.header input[type=number]::-webkit-inner-spin-button, .header input[type=number]::-webkit-outer-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
.header span {
|
|
display: block;
|
|
font-size: 9px;
|
|
line-height: 12px;
|
|
}
|
|
.header .name-container span.label {
|
|
text-align: left;
|
|
font-weight: normal;
|
|
margin-top: 0;
|
|
}
|
|
|
|
/* Push ALL PC page content below the top bar */
|
|
.pc {
|
|
padding-top: 32px;
|
|
}
|
|
|
|
/* Header two-panel flex layout */
|
|
.header {
|
|
display: flex;
|
|
align-items: stretch;
|
|
gap: 8px;
|
|
}
|
|
|
|
/* -- LEFT PANEL: character info -- */
|
|
.header-left {
|
|
flex: 1;
|
|
min-width: 0;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 8px;
|
|
padding: 5px 7px;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
}
|
|
|
|
/* name-container = portrait (left) + char-info-right (flex column) */
|
|
.name-container {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: stretch;
|
|
gap: 8px;
|
|
}
|
|
.name-container :is(.sheet-token-frame, .token-frame) {
|
|
width: 100px;
|
|
height: 100px;
|
|
flex-shrink: 0;
|
|
border: 3px solid var(--eg-gold);
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
background: var(--eg-bg);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.name-container :is(.sheet-char-avatar, .char-avatar) {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
display: block;
|
|
}
|
|
|
|
/* Right column: name row + toggle + edit/display panels */
|
|
.char-info-right {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 2px;
|
|
min-width: 0;
|
|
position: relative;
|
|
}
|
|
.char-info-right .name-fields {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-right: 22px; /* reserve the top-right corner for the gear toggle so the name field doesn't cover it */
|
|
}
|
|
.char-info-right .name-fields input {
|
|
font-size: 16px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-blue) !important;
|
|
border: none !important;
|
|
border-bottom: 1px solid var(--eg-border) !important;
|
|
background: none !important;
|
|
padding: 0 !important;
|
|
width: 100% !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.char-info-right .name-fields .label {
|
|
font-size: 8px !important;
|
|
color: var(--eg-text-muted) !important;
|
|
text-align: left !important;
|
|
font-weight: normal !important;
|
|
line-height: 1.2 !important;
|
|
display: block !important;
|
|
}
|
|
|
|
/* Edit/display panels - no border, fills right column */
|
|
.header-info {
|
|
width: 100%;
|
|
margin-left: 0;
|
|
display: block;
|
|
border: none;
|
|
border-radius: 0;
|
|
padding: 1px 0 0 0;
|
|
max-height: none;
|
|
}
|
|
.header-info:is(.sheet-options, .options) input,
|
|
.header-info:is(.sheet-options, .options) select {
|
|
width: 58px;
|
|
font-size: 10px;
|
|
}
|
|
|
|
/* -- RIGHT PANEL: HP + death saves -- */
|
|
.header-right {
|
|
flex: 1;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 6px;
|
|
padding: 4px 8px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 2px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* HP title */
|
|
.hp-panel-label {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 9px !important;
|
|
font-weight: bold;
|
|
color: var(--eg-gold);
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
line-height: 1.2 !important;
|
|
display: block !important;
|
|
}
|
|
|
|
/* Main row: [hp-left-cluster] [dmg/heal] [death saves] */
|
|
.hp-main-row {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
flex: 1;
|
|
}
|
|
.hp-left-cluster {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 6px;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
/* Current/Max group - curmax-box has border with bar at bottom */
|
|
.hp-curmax-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
flex-shrink: 0;
|
|
}
|
|
.hp-curmax-box {
|
|
border: 1px solid var(--eg-border);
|
|
border-radius: 4px;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 42px;
|
|
}
|
|
.hp-curmax-box .hp-cm-inputs {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0 4px;
|
|
gap: 2px;
|
|
}
|
|
.hp-curmax-box .hp-cm-inputs input[type=number],
|
|
.hp-curmax-box .hp-cm-inputs input[type=text] {
|
|
width: 44px !important;
|
|
font-size: 20px !important;
|
|
font-weight: bold !important;
|
|
text-align: center !important;
|
|
background: none !important;
|
|
border: none !important;
|
|
border-radius: 0 !important;
|
|
box-shadow: none !important;
|
|
color: var(--eg-text) !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
}
|
|
.hp-sep {
|
|
font-size: 16px !important;
|
|
color: var(--eg-text-faint);
|
|
line-height: 1 !important;
|
|
flex-shrink: 0;
|
|
display: inline-block !important;
|
|
}
|
|
.hp-bar-track {
|
|
width: 100%;
|
|
height: 6px;
|
|
background: #ddd;
|
|
border-radius: 0;
|
|
overflow: hidden;
|
|
margin: 0;
|
|
flex-shrink: 0;
|
|
}
|
|
.hp-bar-fill {
|
|
width: 100%;
|
|
height: 100%;
|
|
background: var(--eg-success);
|
|
}
|
|
.hp-cm-labels {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
margin-top: 2px;
|
|
}
|
|
.hp-cm-labels span {
|
|
font-size: 8px !important;
|
|
color: var(--eg-text-muted);
|
|
font-family: 'Oxanium', sans-serif;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.3px;
|
|
line-height: 1 !important;
|
|
display: inline-block !important;
|
|
}
|
|
|
|
/* Temp HP - same height as curmax-box */
|
|
.hp-temp-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 2px;
|
|
flex-shrink: 0;
|
|
}
|
|
.hp-temp-group input[type=number] {
|
|
width: 44px !important;
|
|
height: 42px !important;
|
|
font-size: 20px !important;
|
|
font-weight: bold !important;
|
|
text-align: center !important;
|
|
background: none !important;
|
|
border: 1px solid var(--eg-border) !important;
|
|
border-radius: 4px !important;
|
|
box-shadow: none !important;
|
|
color: var(--eg-text-muted) !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
box-sizing: border-box !important;
|
|
}
|
|
.hp-temp-group > span {
|
|
font-size: 8px !important;
|
|
color: var(--eg-text-muted);
|
|
font-family: 'Oxanium', sans-serif;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.3px;
|
|
line-height: 1 !important;
|
|
display: block !important;
|
|
}
|
|
|
|
/* Damage / Heal - change input same size as HP boxes */
|
|
.hp-dmgheal-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 2px;
|
|
flex-shrink: 0;
|
|
}
|
|
.hp-dmgheal-controls {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 3px;
|
|
}
|
|
.hp-dmg-btn,
|
|
.hp-heal-btn {
|
|
width: 26px !important;
|
|
height: 26px !important;
|
|
border-radius: 50% !important;
|
|
border: none !important;
|
|
font-size: 18px !important;
|
|
font-weight: bold !important;
|
|
line-height: 1 !important;
|
|
cursor: pointer !important;
|
|
box-shadow: none !important;
|
|
text-shadow: none !important;
|
|
padding: 0 !important;
|
|
flex-shrink: 0;
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
justify-content: center !important;
|
|
}
|
|
.hp-dmg-btn {
|
|
background: var(--eg-danger) !important;
|
|
color: white !important;
|
|
}
|
|
.hp-heal-btn {
|
|
background: var(--eg-success) !important;
|
|
color: white !important;
|
|
}
|
|
.hp-change-input {
|
|
width: 44px !important;
|
|
height: 42px !important;
|
|
font-size: 20px !important;
|
|
font-weight: bold !important;
|
|
text-align: center !important;
|
|
background: none !important;
|
|
border: 1px solid var(--eg-border) !important;
|
|
border-radius: 4px !important;
|
|
box-shadow: none !important;
|
|
color: var(--eg-text) !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
box-sizing: border-box !important;
|
|
}
|
|
.hp-dmgheal-labels {
|
|
display: flex;
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
}
|
|
.hp-dmgheal-labels span {
|
|
font-size: 8px !important;
|
|
color: var(--eg-text-muted);
|
|
font-family: 'Oxanium', sans-serif;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.3px;
|
|
line-height: 1 !important;
|
|
display: inline-block !important;
|
|
}
|
|
|
|
/* Death Saves */
|
|
.death-saves-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 3px;
|
|
flex-shrink: 0;
|
|
justify-content: center;
|
|
}
|
|
/* DEATH SAVES roll button (replaces plain title) */
|
|
.ds-roll-btn {
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-size: 8px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-blue) !important;
|
|
background: transparent !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
text-shadow: none !important;
|
|
text-transform: uppercase !important;
|
|
letter-spacing: 0.5px !important;
|
|
padding: 0 !important;
|
|
cursor: pointer !important;
|
|
text-align: left !important;
|
|
line-height: 1 !important;
|
|
display: block !important;
|
|
width: 100% !important;
|
|
}
|
|
.ds-roll-btn::before {
|
|
content: "" !important;
|
|
}
|
|
/* Pip box with light gray background */
|
|
.ds-pip-box {
|
|
background: var(--eg-bg-alt);
|
|
border-radius: 4px;
|
|
padding: 4px 6px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 5px;
|
|
}
|
|
.ds-row {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
}
|
|
.ds-label {
|
|
font-size: 8px !important;
|
|
color: var(--eg-text-muted);
|
|
width: 52px;
|
|
flex-shrink: 0;
|
|
display: inline-block !important;
|
|
line-height: 1.2 !important;
|
|
}
|
|
.ds-pip {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
width: 13px !important;
|
|
height: 13px !important;
|
|
border-radius: 50% !important;
|
|
border: 2px solid !important;
|
|
cursor: pointer !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
flex-shrink: 0;
|
|
box-shadow: none !important;
|
|
background: transparent !important;
|
|
}
|
|
.ds-success {
|
|
border-color: var(--eg-success) !important;
|
|
}
|
|
.ds-success:checked {
|
|
background: var(--eg-success) !important;
|
|
}
|
|
.ds-failure {
|
|
border-color: var(--eg-danger) !important;
|
|
}
|
|
.ds-failure:checked {
|
|
background: var(--eg-danger) !important;
|
|
}
|
|
|
|
/* Hit Dice row */
|
|
.hp-hitdice-row {
|
|
display: flex;
|
|
align-items: stretch;
|
|
gap: 4px;
|
|
border-top: 1px solid #ececec;
|
|
padding-top: 3px;
|
|
flex-shrink: 0;
|
|
flex-wrap: wrap;
|
|
}
|
|
.hd-mc1-flag, .hd-mc2-flag, .hd-mc3-flag { display: none; }
|
|
.hd-group-mc1, .hd-group-mc2, .hd-group-mc3 { display: none !important; }
|
|
.hd-mc1-flag:checked ~ .hd-group-mc1 { display: flex !important; }
|
|
.hd-mc2-flag:checked ~ .hd-group-mc2 { display: flex !important; }
|
|
.hd-mc3-flag:checked ~ .hd-group-mc3 { display: flex !important; }
|
|
.hd-label {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 8px !important;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
flex-shrink: 0;
|
|
align-self: center;
|
|
display: inline-block !important;
|
|
line-height: 1 !important;
|
|
}
|
|
.hd-count-input {
|
|
width: 26px !important;
|
|
font-size: 14px !important;
|
|
font-weight: bold !important;
|
|
text-align: center !important;
|
|
background: none !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
color: var(--eg-text) !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
}
|
|
.hd-sep {
|
|
font-size: 12px !important;
|
|
color: var(--eg-text-faint);
|
|
flex-shrink: 0;
|
|
display: inline-block !important;
|
|
line-height: 1 !important;
|
|
}
|
|
.hd-max-input {
|
|
width: 26px !important;
|
|
font-size: 14px !important;
|
|
text-align: center !important;
|
|
background: none !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
color: var(--eg-text-muted) !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
}
|
|
.hd-group {
|
|
display: flex;
|
|
align-items: stretch;
|
|
gap: 0;
|
|
}
|
|
.hd-type-btn {
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-size: 11px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-text) !important;
|
|
background: var(--eg-bg-alt) !important;
|
|
border: 1px solid var(--eg-gold) !important;
|
|
border-radius: 4px 0 0 4px !important;
|
|
box-shadow: none !important;
|
|
text-shadow: none !important;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
letter-spacing: 0.3px !important;
|
|
padding: 3px 8px !important;
|
|
cursor: pointer !important;
|
|
flex-shrink: 0;
|
|
white-space: nowrap;
|
|
display: inline-flex !important;
|
|
flex-direction: row !important;
|
|
align-items: center !important;
|
|
gap: 0 !important;
|
|
margin: 0 !important;
|
|
}
|
|
.charsheet .hd-type-btn:hover,
|
|
.charsheet .hd-type-btn:hover .hd-btn-label,
|
|
.charsheet .hd-type-btn:hover .hd-btn-label span {
|
|
background: var(--eg-blue-bright) !important;
|
|
color: #fff !important;
|
|
}
|
|
.hd-type-btn::before {
|
|
content: "" !important;
|
|
}
|
|
.hd-btn-label {
|
|
font-size: 11px !important;
|
|
font-weight: bold !important;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
display: inline !important;
|
|
color: inherit !important;
|
|
}
|
|
.hd-btn-label span {
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
display: inline !important;
|
|
font-size: 11px !important;
|
|
color: inherit !important;
|
|
}
|
|
.hd-count-box {
|
|
display: flex;
|
|
align-items: center;
|
|
border: 1px solid var(--eg-gold);
|
|
border-left: none;
|
|
border-radius: 0 4px 4px 0;
|
|
background: var(--eg-bg);
|
|
padding: 2px 6px;
|
|
gap: 2px;
|
|
}
|
|
|
|
/* The base .spells span rule applies width:100%, margin-top:5px, text-align:center,
|
|
font-weight:bold to ALL spans in the spells page. Reset width/margin/text-align for the
|
|
header (font-weight is left alone so bold labels stay bold). Abilities-bar spans are
|
|
handled separately below with explicit margin-top:0 / margin-top:6px rules. */
|
|
.charsheet .pc .page.spells .header span {
|
|
width: auto !important;
|
|
margin-top: 0 !important;
|
|
text-align: inherit !important;
|
|
}
|
|
/* DS label needs explicit width so pips stay on the same flex row */
|
|
.charsheet .pc .page.spells .header .ds-label {
|
|
width: 52px !important;
|
|
font-weight: normal !important;
|
|
}
|
|
/* .spells span sets font-weight:bold - reset to normal for labels that should be light */
|
|
.charsheet .pc .page.spells .header .hp-cm-labels span,
|
|
.charsheet .pc .page.spells .header .hp-temp-group > span,
|
|
.charsheet .pc .page.spells .header .hp-dmgheal-labels span {
|
|
font-weight: normal !important;
|
|
}
|
|
|
|
/* Bio tab - description fields (generic fallback, mostly overridden by scoped rule below) */
|
|
.bio-description-row {
|
|
margin-bottom: 8px;
|
|
}
|
|
.bio-description-row .hlabel-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
/* ============================================================
|
|
Gear & Bio Tab - Two-Column Layout (2026-05-18)
|
|
Left: Gear column (375px fixed) | Right: Bio column (flex 1)
|
|
============================================================ */
|
|
|
|
/* Body: two-column flex row */
|
|
.page.bio .body {
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 14px;
|
|
align-items: flex-start;
|
|
padding: 4px 0;
|
|
}
|
|
|
|
/* Left / Gear column */
|
|
.page.bio .gear-col {
|
|
flex: 0 0 375px;
|
|
min-width: 0;
|
|
}
|
|
|
|
/* Right / Bio column */
|
|
.page.bio .bio-col {
|
|
flex: 1;
|
|
min-width: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
}
|
|
|
|
/* --- Equipment section in Gear column --- */
|
|
|
|
/* Gear column: explicit width to beat .col { width: 32.97% } */
|
|
.page.bio .gear-col {
|
|
width: 375px !important;
|
|
}
|
|
|
|
/* Override global equipment size / position defaults */
|
|
.page.bio .equipment {
|
|
min-height: unset;
|
|
padding-bottom: 6px;
|
|
}
|
|
|
|
/* .complex has width: 160px by default - expand to fill the column */
|
|
.page.bio .equipment .complex {
|
|
width: 100% !important;
|
|
display: block !important;
|
|
vertical-align: initial;
|
|
padding-top: 0 !important;
|
|
margin-bottom: 0 !important;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* Section label: static at top instead of absolute at bottom */
|
|
.page.bio .equipment > span.label {
|
|
position: static !important;
|
|
display: block !important;
|
|
bottom: auto !important;
|
|
margin-top: 0 !important;
|
|
text-align: center;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-weight: bold;
|
|
font-size: 11px;
|
|
color: var(--eg-blue);
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
padding: 6px 8px 5px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
border-radius: 4px 4px 0 0;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* Money row: layout properties (no display here - toggle rules control visibility) */
|
|
.page.bio .money {
|
|
flex-direction: row;
|
|
width: 100%;
|
|
gap: 5px;
|
|
padding: 6px 8px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.2);
|
|
box-sizing: border-box;
|
|
}
|
|
/* EG currency: shown by default as flex (0,3,0 specificity beats 0,2,0 default) */
|
|
.page.bio .gear-col .eg-currency {
|
|
display: flex;
|
|
}
|
|
/* 5e currency: shown as flex in 5e mode (overrides inline-block from existing toggle rule) */
|
|
.page.bio input[name="attr_currency_mode"][value="5e"] ~ .fivee-currency {
|
|
display: flex;
|
|
}
|
|
|
|
/* Coin box: stacked value-over-label */
|
|
.page.bio .coin {
|
|
flex: 1;
|
|
display: flex !important;
|
|
flex-direction: column !important;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 5px 3px;
|
|
margin-top: 0 !important;
|
|
left: 0 !important;
|
|
position: static !important;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
gap: 2px;
|
|
}
|
|
.page.bio .coin span.label {
|
|
display: block !important;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-weight: bold;
|
|
font-size: 9px;
|
|
color: var(--eg-blue);
|
|
text-transform: uppercase;
|
|
width: auto !important;
|
|
margin: 0 !important;
|
|
letter-spacing: 0.5px;
|
|
text-align: center;
|
|
}
|
|
.page.bio .coin input {
|
|
width: 100% !important;
|
|
text-align: center;
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
border: none !important;
|
|
background: transparent !important;
|
|
padding: 0 !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
/* Inventory column header - same padding/gap as item rows for pixel alignment */
|
|
.page.bio .inv-header {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 4px 8px;
|
|
gap: 4px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.4);
|
|
background: rgba(var(--eg-blue-rgb),0.04);
|
|
}
|
|
.page.bio .inv-col-count,
|
|
.page.bio .inv-col-weight {
|
|
width: 32px;
|
|
flex-shrink: 0;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted);
|
|
text-transform: uppercase;
|
|
text-align: center;
|
|
font-family: 'Oxanium', sans-serif;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
.page.bio .inv-col-name {
|
|
flex: 1;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
font-family: 'Oxanium', sans-serif;
|
|
}
|
|
|
|
/* Inventory rows: taller, more breathing room, wrap for subitem */
|
|
.page.bio .equipment .item {
|
|
display: flex !important;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
min-height: 34px;
|
|
margin-bottom: 0 !important;
|
|
padding: 3px 30px 3px 8px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.12);
|
|
gap: 4px;
|
|
position: relative;
|
|
}
|
|
.page.bio .equipment .item:nth-child(even) {
|
|
background: rgba(var(--eg-blue-rgb),0.03);
|
|
}
|
|
.page.bio .equipment .item input.name {
|
|
flex: 1 !important;
|
|
width: auto !important;
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
border: none !important;
|
|
background: transparent !important;
|
|
padding: 2px 4px !important;
|
|
box-shadow: none !important;
|
|
text-align: left !important;
|
|
}
|
|
.page.bio .equipment .item input[type=text].weight {
|
|
width: 32px !important;
|
|
flex-shrink: 0;
|
|
text-align: center;
|
|
font-size: 12px;
|
|
}
|
|
|
|
/* span i (expand toggle): absolutely positioned at right edge, out of flex flow */
|
|
.page.bio .equipment .inventorysubflag + span {
|
|
position: absolute !important;
|
|
right: 4px;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
width: 22px;
|
|
height: 22px;
|
|
display: flex !important;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 11px;
|
|
color: var(--eg-gold);
|
|
opacity: 0.65;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
left: auto !important;
|
|
background: transparent !important;
|
|
font-family: 'Noto Sans', sans-serif !important;
|
|
}
|
|
/* Invisible click-target checkbox: small, same position, stays transparent */
|
|
.page.bio .equipment .inventorysubflag {
|
|
left: auto !important;
|
|
right: 4px !important;
|
|
top: 50% !important;
|
|
transform: translateY(-50%);
|
|
width: 22px !important;
|
|
height: 22px !important;
|
|
opacity: 0 !important;
|
|
cursor: pointer;
|
|
}
|
|
/* Active state: blue toggle */
|
|
.page.bio .equipment .inventorysubflag:checked + span {
|
|
color: var(--eg-blue-bright) !important;
|
|
opacity: 1;
|
|
}
|
|
|
|
/* Subitem panel: wraps to full-width row below the item fields */
|
|
.page.bio .equipment .item .subitem {
|
|
flex: 0 0 100%;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
border-top: 1px dashed rgba(var(--eg-gold-rgb),0.4);
|
|
padding: 8px;
|
|
background: rgba(255,255,255,0.6);
|
|
}
|
|
.page.bio .equipment .inventorysubflag:checked ~ .subitem {
|
|
display: flex !important;
|
|
flex-wrap: wrap;
|
|
gap: 6px 10px;
|
|
align-items: center;
|
|
}
|
|
|
|
/* Weighttotal: two-column layout */
|
|
.page.bio .equipment .weighttotal {
|
|
position: static !important;
|
|
display: flex !important;
|
|
align-items: stretch;
|
|
gap: 0;
|
|
padding: 0;
|
|
border-top: 1px solid rgba(var(--eg-gold-rgb),0.3);
|
|
margin-top: 4px;
|
|
width: auto !important;
|
|
flex-wrap: wrap;
|
|
}
|
|
.page.bio .equipment .weighttotal .weight-col {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
padding: 5px 8px;
|
|
gap: 2px;
|
|
}
|
|
.page.bio .equipment .weighttotal .weight-col + .weight-col {
|
|
border-left: 1px solid rgba(var(--eg-gold-rgb),0.3);
|
|
}
|
|
.page.bio .equipment .weighttotal input {
|
|
width: 60px !important;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-size: 16px;
|
|
pointer-events: auto;
|
|
border: none !important;
|
|
background: transparent !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.page.bio .equipment .weighttotal input[name="attr_carrying_capacity"] {
|
|
pointer-events: none;
|
|
color: var(--eg-text-muted);
|
|
}
|
|
.page.bio .equipment .weighttotal span.label {
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
.page.bio .equipment .weighttotal .encumb {
|
|
flex: 0 0 100%;
|
|
text-align: center;
|
|
}
|
|
|
|
/* Enhanced Item Affinity textarea */
|
|
.page.bio .item-affinity {
|
|
margin-top: 6px;
|
|
}
|
|
.page.bio .item-affinity textarea {
|
|
min-height: 70px;
|
|
height: 70px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* --- Bio column layout --- */
|
|
|
|
/* Description row (Age/Size/Height/Weight/Alignment) - scoped to bio-col */
|
|
.page.bio .bio-col .bio-description-row {
|
|
position: relative;
|
|
border: 1px solid rgba(var(--eg-gold-rgb),0.6);
|
|
border-radius: 6px;
|
|
background: transparent !important;
|
|
padding: 0 !important;
|
|
margin-bottom: 8px;
|
|
display: block !important;
|
|
}
|
|
/* Header bar */
|
|
.page.bio .bio-col .bio-desc-header {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
padding: 4px 8px;
|
|
min-height: 22px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.4);
|
|
}
|
|
.page.bio .bio-col .bio-desc-title {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-weight: bold;
|
|
font-size: 10px;
|
|
color: var(--eg-blue);
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
white-space: nowrap;
|
|
pointer-events: none;
|
|
display: block !important;
|
|
text-align: center !important;
|
|
width: auto !important;
|
|
}
|
|
/* Gear icon toggle */
|
|
.page.bio .bio-col .bio-description-row > .bio-desc-cb {
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 8px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
opacity: 0;
|
|
margin: 0;
|
|
cursor: pointer;
|
|
}
|
|
.page.bio .bio-col .bio-description-row > .bio-desc-gear-icon {
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 8px;
|
|
z-index: 1;
|
|
cursor: pointer;
|
|
}
|
|
.page.bio .bio-col .bio-desc-gear-icon {
|
|
font-family: 'Material Symbols Outlined';
|
|
font-size: 14px;
|
|
color: var(--eg-gold);
|
|
opacity: 0.6;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
display: inline-block !important;
|
|
line-height: 1;
|
|
user-select: none;
|
|
transition: opacity 0.2s, color 0.2s;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
}
|
|
.page.bio .bio-col .bio-desc-cb:hover + .bio-desc-gear-icon {
|
|
opacity: 1;
|
|
}
|
|
.page.bio .bio-col .bio-desc-cb:checked + .bio-desc-gear-icon {
|
|
color: var(--eg-blue-bright);
|
|
opacity: 1;
|
|
font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
}
|
|
/* Display area - read-only value + label */
|
|
.page.bio .bio-col .bio-desc-display {
|
|
display: flex !important;
|
|
flex-wrap: nowrap;
|
|
padding: 4px 8px;
|
|
justify-content: space-between;
|
|
align-items: stretch;
|
|
}
|
|
.page.bio .bio-col .bio-field {
|
|
flex: 1 1 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 1px;
|
|
padding: 2px 2px;
|
|
position: relative;
|
|
}
|
|
/* Vertical dividers between fields */
|
|
.page.bio .bio-col .bio-field::after {
|
|
content: '';
|
|
position: absolute;
|
|
right: 0;
|
|
top: 15%;
|
|
bottom: 15%;
|
|
width: 1px;
|
|
background: rgba(var(--eg-gold-rgb),0.4);
|
|
}
|
|
.page.bio .bio-col .bio-field:last-child::after {
|
|
display: none;
|
|
}
|
|
/* Em-dash placeholder for empty attribute spans */
|
|
.page.bio .bio-col .bio-val:empty::before {
|
|
content: '-';
|
|
color: var(--eg-text-faint);
|
|
font-weight: normal;
|
|
font-size: 14px;
|
|
}
|
|
.page.bio .bio-col .bio-val {
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
min-height: 18px;
|
|
min-width: 30px;
|
|
display: inline-block !important;
|
|
text-align: center !important;
|
|
width: auto !important;
|
|
}
|
|
.page.bio .bio-col .bio-label {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
display: block !important;
|
|
text-align: center !important;
|
|
width: auto !important;
|
|
}
|
|
/* Edit panel - shown when gear is clicked */
|
|
.page.bio .bio-col .bio-desc-edit {
|
|
display: none;
|
|
flex-wrap: wrap;
|
|
gap: 6px 12px;
|
|
padding: 6px 10px;
|
|
background: rgba(var(--eg-blue-rgb),0.04);
|
|
border-top: 1px solid rgba(var(--eg-gold-rgb),0.3);
|
|
}
|
|
.page.bio .bio-col .bio-desc-cb:checked ~ .bio-desc-edit {
|
|
display: flex;
|
|
}
|
|
|
|
/* Character Appearance: shorter textarea */
|
|
.page.bio .appearance-box textarea {
|
|
min-height: 60px;
|
|
height: 60px;
|
|
}
|
|
|
|
/* Background traits grid: inherit 1fr 1fr from .bio-background rule */
|
|
|
|
/* Character History: generous textarea */
|
|
.page.bio .history-box textarea {
|
|
min-height: 200px;
|
|
height: 200px;
|
|
}
|
|
|
|
/* Bio col textbox labels - Oxanium blue styling */
|
|
.page.bio .bio-col .textbox span.label,
|
|
.page.bio .bio-col .bio-background .textbox span.label {
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-weight: bold !important;
|
|
font-size: 9px !important;
|
|
color: var(--eg-blue) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
}
|
|
/* Enhanced Item Affinity label - gear col */
|
|
.page.bio .gear-col .item-affinity span.label {
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-weight: bold !important;
|
|
font-size: 9px !important;
|
|
color: var(--eg-blue) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
}
|
|
|
|
/* Powers tab - power settings row */
|
|
.powers-info-row {
|
|
position: relative;
|
|
border: 1px solid rgba(var(--eg-gold-rgb),0.6);
|
|
border-radius: 6px;
|
|
background: transparent !important;
|
|
padding: 0 !important;
|
|
margin-bottom: 8px;
|
|
display: block !important;
|
|
}
|
|
/* Header bar */
|
|
.charsheet .powers-info-row .powers-info-header {
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
padding: 4px 8px !important;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.4) !important;
|
|
min-height: 28px !important;
|
|
height: auto !important;
|
|
visibility: visible !important;
|
|
overflow: visible !important;
|
|
}
|
|
/* Left spacer - mirrors gear icon width to keep title visually centred */
|
|
.charsheet .powers-info-row .powers-info-spacer {
|
|
width: 20px !important;
|
|
flex-shrink: 0 !important;
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
}
|
|
.charsheet .powers-info-row .powers-info-title {
|
|
flex: 1 !important;
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-weight: bold !important;
|
|
font-size: 12px !important;
|
|
color: var(--eg-blue) !important;
|
|
text-transform: uppercase !important;
|
|
letter-spacing: 1px !important;
|
|
white-space: nowrap !important;
|
|
display: block !important;
|
|
text-align: center !important;
|
|
width: auto !important;
|
|
visibility: visible !important;
|
|
}
|
|
/* Gear icon toggle - right end. CSE: the <label> grew to fill the flex header
|
|
(~852px) because the platform applies flex-grow to labels and the (0,1,0) width:20px
|
|
lost. Pin it with high specificity so it can't grow - the title then fills + centers. */
|
|
.charsheet .powers-info-row > .powers-info-cb {
|
|
position: absolute;
|
|
top: 6px;
|
|
right: 8px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
opacity: 0;
|
|
margin: 0;
|
|
cursor: pointer;
|
|
}
|
|
.charsheet .powers-info-row .powers-info-header .powers-info-gear-icon {
|
|
flex: 0 0 18px;
|
|
cursor: pointer;
|
|
text-align: center;
|
|
}
|
|
.powers-info-gear-icon {
|
|
font-family: 'Material Symbols Outlined';
|
|
font-size: 14px !important; /* match the Character Info (charinfo-gear) icon */
|
|
color: var(--eg-gold);
|
|
opacity: 0.6;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
display: inline-block !important;
|
|
line-height: 1;
|
|
user-select: none;
|
|
transition: opacity 0.2s, color 0.2s;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
}
|
|
.powers-info-cb:hover ~ .powers-info-header .powers-info-gear-icon { opacity: 1; }
|
|
.powers-info-cb:checked ~ .powers-info-header .powers-info-gear-icon {
|
|
color: var(--eg-blue-bright);
|
|
opacity: 1;
|
|
font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
}
|
|
/* Display area */
|
|
.powers-info-display {
|
|
display: flex !important;
|
|
flex-wrap: nowrap;
|
|
padding: 4px 8px;
|
|
justify-content: space-between;
|
|
align-items: stretch;
|
|
}
|
|
.powers-info-field {
|
|
flex: 1 1 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 1px;
|
|
padding: 2px 2px;
|
|
position: relative;
|
|
}
|
|
/* Vertical dividers */
|
|
.powers-info-field::after {
|
|
content: '';
|
|
position: absolute;
|
|
right: 0;
|
|
top: 15%;
|
|
bottom: 15%;
|
|
width: 1px;
|
|
background: rgba(var(--eg-gold-rgb),0.4);
|
|
}
|
|
.powers-info-field:last-child::after { display: none; }
|
|
/* Value spans and select in display mode */
|
|
.charsheet .powers-info-field :is(.sheet-display, .display),
|
|
.charsheet .powers-info-field select {
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
height: 22px;
|
|
line-height: 22px;
|
|
display: inline-block !important;
|
|
text-align: center !important;
|
|
width: auto !important;
|
|
}
|
|
.powers-info-field select {
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
background: transparent !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
pointer-events: none;
|
|
cursor: default;
|
|
padding: 0 !important;
|
|
margin: 4px 0 0 0 !important;
|
|
max-width: 100%;
|
|
height: 22px !important;
|
|
line-height: 22px !important;
|
|
vertical-align: middle;
|
|
}
|
|
/* Select becomes interactive when gear is open */
|
|
.powers-info-cb:checked ~ .powers-info-display .powers-info-field select {
|
|
-webkit-appearance: auto;
|
|
appearance: auto;
|
|
background: var(--eg-bg) !important;
|
|
border: 1px solid rgba(var(--eg-gold-rgb),0.6) !important;
|
|
border-radius: 4px;
|
|
pointer-events: auto;
|
|
cursor: pointer;
|
|
padding: 2px 4px;
|
|
font-size: 12px;
|
|
color: var(--eg-text);
|
|
font-weight: normal;
|
|
}
|
|
/* Em-dash for empty calculated spans */
|
|
.powers-info-field :is(.sheet-display, .display):empty::before {
|
|
content: '-';
|
|
color: var(--eg-text-faint);
|
|
font-weight: normal;
|
|
}
|
|
/* Labels */
|
|
.powers-info-label {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
display: block !important;
|
|
text-align: center !important;
|
|
width: auto !important;
|
|
}
|
|
|
|
/* -- Powers tab: Talent Points / Talent Slots / Esper Mastery section headers -- */
|
|
|
|
/* Three-column stats row - flex container spanning full width */
|
|
.powers-stats-row {
|
|
display: flex !important;
|
|
flex-direction: row !important;
|
|
gap: 8px;
|
|
width: 100%;
|
|
margin-bottom: 8px;
|
|
}
|
|
.powers-stats-row .col {
|
|
flex: 1 !important;
|
|
width: auto !important;
|
|
margin-bottom: 0 !important;
|
|
padding: 0 !important;
|
|
}
|
|
.powers-stats-row .tp,
|
|
.powers-stats-row .talent-slots-block,
|
|
.powers-stats-row .class_options {
|
|
margin: 0 !important;
|
|
width: 100% !important;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* Shared header bar - same pattern as Power Settings */
|
|
.charsheet .tp .tp-section-header,
|
|
.charsheet .talent-slots-block .ts-section-header,
|
|
.charsheet .esper-mastery .em-section-header {
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
padding: 4px 8px !important;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.4) !important;
|
|
min-height: 26px !important;
|
|
height: auto !important;
|
|
visibility: visible !important;
|
|
}
|
|
/* Shared title span */
|
|
.charsheet .tp-section-title,
|
|
.charsheet .ts-section-title,
|
|
.charsheet .em-section-title {
|
|
flex: 1 !important;
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-weight: bold !important;
|
|
font-size: 10px !important;
|
|
color: var(--eg-blue) !important;
|
|
text-transform: uppercase !important;
|
|
letter-spacing: 1px !important;
|
|
display: block !important;
|
|
text-align: center !important;
|
|
visibility: visible !important;
|
|
}
|
|
/* Body padding */
|
|
.tp-section-body {
|
|
padding: 4px 4px 6px;
|
|
}
|
|
/* TP Remaining label - Oxanium gray, matches Power Settings label style */
|
|
.tp-section-body span.label {
|
|
display: block !important;
|
|
text-align: center !important;
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-size: 9px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-text-muted) !important;
|
|
text-transform: uppercase !important;
|
|
letter-spacing: 0.5px !important;
|
|
margin-top: 2px !important;
|
|
}
|
|
/* Talent Slots wrapper - outer gold border to unify the two subcontainers */
|
|
.talent-slots-block {
|
|
width: 100%;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
margin-bottom: 10px;
|
|
}
|
|
/* hdice-dsaves-container inside talent-slots: flex row, centered */
|
|
.talent-slots-block .hdice-dsaves-container {
|
|
display: flex !important;
|
|
flex-direction: row !important;
|
|
justify-content: space-around !important;
|
|
align-items: flex-start !important;
|
|
width: 100% !important;
|
|
padding: 4px 0 6px !important;
|
|
}
|
|
/* Remove double-border on subcontainers nested inside the new wrapper */
|
|
.talent-slots-block .subcontainer {
|
|
border: none !important;
|
|
border-radius: 0 !important;
|
|
float: none !important;
|
|
display: flex !important;
|
|
flex-direction: column !important;
|
|
align-items: center !important;
|
|
flex: 1;
|
|
}
|
|
/* Add a right divider between the two subcontainers instead */
|
|
.talent-slots-block .subcontainer:not(:last-child) {
|
|
border-right: 1px solid rgba(var(--eg-gold-rgb),0.4) !important;
|
|
}
|
|
/* Center .top row (Rank label + input) */
|
|
.talent-slots-block :is(.sheet-top, .top) {
|
|
display: flex !important;
|
|
flex-direction: column !important;
|
|
align-items: center !important;
|
|
width: 100% !important;
|
|
}
|
|
.talent-slots-block :is(.sheet-top, .top) span {
|
|
text-align: center !important;
|
|
margin-left: 0 !important;
|
|
}
|
|
/* Center .speed wrapper */
|
|
.talent-slots-block .speed {
|
|
display: flex !important;
|
|
flex-direction: column !important;
|
|
align-items: center !important;
|
|
width: 100% !important;
|
|
}
|
|
/* Center numbers and labels */
|
|
.talent-slots-block input[type=number],
|
|
.talent-slots-block input[type=text] {
|
|
text-align: center !important;
|
|
margin: 0 auto !important;
|
|
}
|
|
.talent-slots-block span.label {
|
|
text-align: center !important;
|
|
display: block !important;
|
|
margin: 2px 0 0 !important;
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-size: 9px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-text-muted) !important;
|
|
text-transform: uppercase !important;
|
|
letter-spacing: 0.5px !important;
|
|
}
|
|
/* Esper Mastery - remove old bottom-label margin hacks */
|
|
.em-section-body {
|
|
padding: 4px 0 6px;
|
|
}
|
|
/* Remove stale margin-top from .tp now that header handles spacing */
|
|
.page.powers .tp {
|
|
margin-top: 0 !important;
|
|
}
|
|
.page.powers .class_options.esper-mastery {
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
/* Character name - Oxanium small-caps bold */
|
|
.char-info-right .name-fields input {
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-variant: small-caps !important;
|
|
font-size: 20px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-blue) !important;
|
|
border: none !important;
|
|
border-bottom: none !important;
|
|
background: none !important;
|
|
padding: 0 !important;
|
|
width: 100% !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.char-info-right .name-fields .label {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Info display: stacked column layout */
|
|
.header-info:is(.sheet-display, .display) .hlabel-container {
|
|
display: flex !important;
|
|
flex-direction: column !important;
|
|
width: 100% !important;
|
|
min-width: 0 !important;
|
|
margin-left: 0 !important;
|
|
}
|
|
/* Info display fields - small, bold, no underlines, no labels */
|
|
.header-info:is(.sheet-display, .display) input {
|
|
width: 100% !important;
|
|
font-size: 10px !important;
|
|
font-weight: bold !important;
|
|
border: none !important;
|
|
background: none !important;
|
|
box-shadow: none !important;
|
|
padding: 0 !important;
|
|
box-sizing: border-box !important;
|
|
}
|
|
.header-info:is(.sheet-display, .display) .label {
|
|
display: none !important;
|
|
}
|
|
/* XP row - full width, left-aligned with "Exp:" prefix */
|
|
.header-info:is(.sheet-display, .display) .xp-row {
|
|
display: flex !important;
|
|
flex-direction: row !important;
|
|
align-items: baseline !important;
|
|
gap: 3px !important;
|
|
margin-top: 1px !important;
|
|
}
|
|
.header-info:is(.sheet-display, .display) .xp-row .xp-prefix {
|
|
font-size: 10px !important;
|
|
font-weight: bold !important;
|
|
color: inherit !important;
|
|
white-space: nowrap !important;
|
|
display: inline !important;
|
|
}
|
|
.header-info:is(.sheet-display, .display) .xp-row input {
|
|
width: auto !important;
|
|
flex: 1 !important;
|
|
}
|
|
|
|
.hlabel-container {
|
|
display: inline-block;
|
|
margin-left: -4px;
|
|
}
|
|
.hlabel-container.multiclass-container {
|
|
vertical-align: top;
|
|
}
|
|
.hlabel-container:first-child {
|
|
margin-left: 0px;
|
|
}
|
|
|
|
.body {
|
|
width: 860px;
|
|
margin-top: 40px;
|
|
}
|
|
|
|
.page.core .body {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 10px;
|
|
}
|
|
.page.core .body .col2 {
|
|
flex: 1.30;
|
|
}
|
|
.page.core .body .col1,
|
|
.page.core .body .col3 {
|
|
flex: 0.85;
|
|
}
|
|
|
|
/* Powers page body: flex layout with gap between spell columns only */
|
|
.page.spells .body {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
column-gap: 12px;
|
|
align-items: flex-start;
|
|
}
|
|
/* Full-width rows (Power Settings, ESPER POWERS header) stay full-width.
|
|
display:block !important overrides Roll20's inline-block on .col.
|
|
!important on flex beats the .col rule (same specificity, later cascade). */
|
|
.page.spells .body > .col-full {
|
|
flex: 0 0 100% !important;
|
|
width: 100% !important;
|
|
display: block !important;
|
|
}
|
|
/* powers-stats-row also spans full width but must stay display:flex
|
|
so Talent Points / Talent Slots / Esper Mastery remain in a flex row. */
|
|
.page.spells .body > .powers-stats-row {
|
|
flex: 0 0 100% !important;
|
|
width: 100% !important;
|
|
}
|
|
/* Spell columns share available width equally; override Roll20 inline-block */
|
|
.page.spells .body > .col {
|
|
flex: 1;
|
|
width: auto !important;
|
|
display: block !important;
|
|
vertical-align: unset;
|
|
}
|
|
|
|
/* .charsheet prefix needed in CSE to beat Roll20's platform `.charsheet .col`
|
|
(display:inline-block) rule - otherwise the settings-modal columns collapse. */
|
|
.charsheet .col {
|
|
width: 32.97%;
|
|
flex: 1;
|
|
}
|
|
|
|
/* CSE: '.row' is a Bootstrap class in Roll20's platform CSS - it adds negative
|
|
side margins (margin-left/right: -15px) that push rows wider than their ancestor
|
|
and visibly shift/uncenter content. Zero the margin globally to restore the
|
|
Legacy layout (mirrors OGL's '.charsheet .row { margin: 0 }'). Display:flex from
|
|
Bootstrap is left intact - EG's '.col { flex:1 }' depends on it. */
|
|
.charsheet .row {
|
|
margin: 0;
|
|
}
|
|
|
|
.col-full {
|
|
width: 100%;
|
|
}
|
|
|
|
.col2-3 {
|
|
width: 490px;
|
|
margin-left: 5px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.attributes-container {
|
|
width: 70px;
|
|
margin-right: 5px;
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
}
|
|
|
|
:is(.sheet-attr-container, .attr-container) {
|
|
width: 70px;
|
|
border: 1.5px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
position: relative;
|
|
padding-bottom: 10px;
|
|
margin-bottom: 19px;
|
|
height: 64px;
|
|
text-align: center;
|
|
}
|
|
:is(.sheet-attr-container, .attr-container) button[type=roll] {
|
|
background-color: transparent;
|
|
color: var(--eg-text);
|
|
border: none;
|
|
font-size: 9px;
|
|
line-height: 12px;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
width: 100%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.saving-throw button[type=roll], .skill button[type=roll], .subcontainer button[type=roll], .npc button[type=roll] {
|
|
background-color: transparent;
|
|
color: var(--eg-text);
|
|
border: none;
|
|
font-size: 9px;
|
|
line-height: 12px;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
width: 100%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
:is(.sheet-attr-container, .attr-container) button[type=roll]::before, .saving-throw button[type=roll]::before, .skill button[type=roll]::before, .subcontainer button[type=roll]::before, .npc button[type=roll]::before {
|
|
content: "" !important;
|
|
}
|
|
|
|
:is(.sheet-attr-container, .attr-container) button[type=roll] {
|
|
overflow: hidden;
|
|
}
|
|
|
|
button[type=roll]:hover {
|
|
color: var(--eg-blue-bright);
|
|
}
|
|
button[type=roll]:hover * {
|
|
color: var(--eg-blue-bright);
|
|
}
|
|
|
|
.spell button[type=roll]:hover input[type=text], .action :is(.sheet-display, .display) button[type=roll]:hover * {
|
|
color: var(--eg-blue-bright);
|
|
}
|
|
|
|
button[type=roll] * {
|
|
pointer-events: none;
|
|
}
|
|
|
|
:is(.sheet-attr-container, .attr-container) input {
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
margin-top: 3px;
|
|
}
|
|
|
|
.attr {
|
|
font-size: 30px;
|
|
line-height: 40px;
|
|
}
|
|
|
|
.col-full .spell-header > span {
|
|
font-size: 14px;
|
|
display: inline-block;
|
|
text-align: left;
|
|
min-width: 30px;
|
|
}
|
|
|
|
.spell-header {
|
|
line-height: 20px;
|
|
margin-bottom: 15px;
|
|
border-bottom: 1px solid var(--eg-gold);
|
|
border-bottom-width: 100%;
|
|
}
|
|
|
|
.attr-mod {
|
|
width: 40px;
|
|
height: 20px;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 25%;
|
|
z-index: 2;
|
|
position: absolute;
|
|
top: 62px;
|
|
left: 0;
|
|
right: 0;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
background-color: var(--eg-bg);
|
|
}
|
|
.attr-mod input {
|
|
text-align: center;
|
|
/* width: 100%;
|
|
* *height: 20px; */
|
|
font-size: 20px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
vertical-align: middle;
|
|
line-height: 22px;
|
|
}
|
|
|
|
.skills-saves-container {
|
|
width: 100%;
|
|
display: block;
|
|
}
|
|
|
|
.insp-prof-container {
|
|
margin-bottom: 10px;
|
|
}
|
|
.insp-prof-container .value {
|
|
display: inline-block;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 35%;
|
|
width: 35px;
|
|
height: 35px;
|
|
background-color: var(--eg-bg);
|
|
position: relative;
|
|
}
|
|
.insp-prof-container .value input[type=checkbox] {
|
|
height: 100%;
|
|
width: 100%;
|
|
border-radius: 50%;
|
|
opacity: 0;
|
|
z-index: 2;
|
|
position: relative;
|
|
}
|
|
.insp-prof-container .value input[type=checkbox] ~ span {
|
|
height: 100%;
|
|
width: 100%;
|
|
border-radius: 50%;
|
|
background: url("https://raw.githubusercontent.com/skydawn1/esper_genesis/master/EG-inspiration.gif") left top no-repeat;
|
|
background-size: contain;
|
|
cursor: pointer;
|
|
position: absolute;
|
|
top: 0px;
|
|
display: none;
|
|
}
|
|
.insp-prof-container .value input[type=checkbox]:checked ~ span {
|
|
display: block;
|
|
}
|
|
.insp-prof-container .value span {
|
|
font-size: 20px;
|
|
font-weight: normal;
|
|
line-height: 34px;
|
|
}
|
|
.insp-prof-container .label {
|
|
width: calc(100% - 29px);
|
|
height: 30px;
|
|
margin-left: -15px;
|
|
margin-top: 3px;
|
|
display: inline-block;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
vertical-align: top;
|
|
}
|
|
.insp-prof-container span {
|
|
display: block;
|
|
font-size: 9px;
|
|
line-height: 12px;
|
|
width: 100%;
|
|
text-align: center;
|
|
line-height: 30px;
|
|
font-weight: bold;
|
|
}
|
|
.insp-prof-container .value input {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
/* Passive Wisdom (Perception) - restyled to match Proficiency Bonus display */
|
|
.passive-wis-display {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 4px 8px;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 6px;
|
|
margin-bottom: 4px;
|
|
box-sizing: border-box;
|
|
}
|
|
.passive-wis-display .value {
|
|
display: flex;
|
|
align-items: center;
|
|
width: auto;
|
|
height: auto;
|
|
border: none;
|
|
background: transparent;
|
|
border-radius: 0;
|
|
position: static;
|
|
flex-shrink: 0;
|
|
order: 2;
|
|
}
|
|
.passive-wis-display .value span {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 16px !important;
|
|
font-weight: bold;
|
|
color: var(--eg-gold) !important;
|
|
line-height: 1.2 !important;
|
|
width: auto;
|
|
text-align: right;
|
|
}
|
|
.passive-wis-display .label {
|
|
flex: 1;
|
|
width: auto;
|
|
height: auto;
|
|
margin-left: 0;
|
|
margin-top: 0;
|
|
border: none;
|
|
background: transparent;
|
|
vertical-align: baseline;
|
|
display: flex;
|
|
align-items: center;
|
|
order: 1;
|
|
}
|
|
.passive-wis-display .label span {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 9px !important;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
line-height: 1.2 !important;
|
|
width: auto;
|
|
text-align: left;
|
|
}
|
|
/* ---- Inspiration + Initiative row ---- */
|
|
.insp-init-row {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 6px;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
/* Inspiration toggle button */
|
|
.insp-button {
|
|
flex: 1 1 0;
|
|
width: 100% !important;
|
|
box-sizing: border-box !important;
|
|
margin: 0 !important;
|
|
display: flex !important;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 7px;
|
|
background: var(--eg-bg-alt);
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 6px;
|
|
padding: 4px 12px;
|
|
cursor: pointer;
|
|
transition: background 0.2s, border-color 0.2s;
|
|
user-select: none;
|
|
box-sizing: border-box;
|
|
}
|
|
#insp-cb {
|
|
display: none !important;
|
|
position: absolute !important;
|
|
width: 0 !important;
|
|
height: 0 !important;
|
|
overflow: hidden !important;
|
|
pointer-events: none !important;
|
|
}
|
|
/* Material Symbols icon - default gold, hollow (FILL=0) */
|
|
.eg-icon {
|
|
font-family: 'Material Symbols Outlined';
|
|
font-size: 22px;
|
|
flex-shrink: 0;
|
|
color: var(--eg-gold);
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
display: inline-block !important;
|
|
vertical-align: middle;
|
|
line-height: 1;
|
|
user-select: none;
|
|
}
|
|
/* Inspiration label text */
|
|
.insp-text {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
color: var(--eg-gold);
|
|
font-variant: small-caps;
|
|
letter-spacing: 1px;
|
|
display: inline !important;
|
|
line-height: 1;
|
|
}
|
|
/* CHECKED STATE - gold background, white text + white icon */
|
|
#insp-cb:checked ~ .insp-button {
|
|
background: var(--eg-gold);
|
|
border-color: var(--eg-gold);
|
|
}
|
|
#insp-cb:checked ~ .insp-button .insp-text {
|
|
color: #fff;
|
|
}
|
|
#insp-cb:checked ~ .insp-button .eg-icon {
|
|
color: #fff;
|
|
font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
}
|
|
|
|
/* Initiative roll button */
|
|
.init-button {
|
|
flex: 1 1 0;
|
|
width: 100% !important;
|
|
box-sizing: border-box !important;
|
|
margin: 0 !important;
|
|
background: var(--eg-blue-bright) !important;
|
|
border: none !important;
|
|
border-radius: 6px;
|
|
color: #fff !important;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 14px !important;
|
|
font-weight: bold;
|
|
padding: 4px 4px !important;
|
|
cursor: pointer;
|
|
font-variant: small-caps;
|
|
letter-spacing: 1px;
|
|
display: flex !important;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 3px;
|
|
box-shadow: none !important;
|
|
text-shadow: none !important;
|
|
box-sizing: border-box;
|
|
white-space: nowrap;
|
|
}
|
|
.init-button::before {
|
|
content: "" !important;
|
|
}
|
|
.init-button span {
|
|
display: inline !important;
|
|
font-size: 14px !important;
|
|
color: #fff !important;
|
|
font-weight: bold;
|
|
}
|
|
.init-button:hover {
|
|
background: #0558b0 !important;
|
|
}
|
|
|
|
/* PB + Level Up row */
|
|
.pb-levelup-row {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 6px;
|
|
margin-bottom: 8px;
|
|
}
|
|
/* Proficiency Bonus compact display */
|
|
.pb-display {
|
|
flex: 1 1 0;
|
|
width: 100% !important;
|
|
box-sizing: border-box !important;
|
|
margin: 0 !important;
|
|
display: flex !important;
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 4px 8px;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 6px;
|
|
}
|
|
.pb-value {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 16px !important;
|
|
font-weight: bold;
|
|
color: var(--eg-gold) !important;
|
|
display: inline-block !important;
|
|
line-height: 1.2;
|
|
}
|
|
.pb-label {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 9px !important;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
display: inline !important;
|
|
line-height: 1.2;
|
|
}
|
|
/* Level Up button */
|
|
.levelup-button {
|
|
flex: 1 1 0;
|
|
width: 100% !important;
|
|
box-sizing: border-box !important;
|
|
margin: 0 !important;
|
|
display: flex !important;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: var(--eg-bg-alt);
|
|
border: 1px solid var(--eg-blue-bright);
|
|
border-radius: 6px;
|
|
padding: 4px 8px;
|
|
cursor: pointer;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue-bright);
|
|
font-variant: small-caps;
|
|
letter-spacing: 1px;
|
|
transition: background 0.2s, color 0.2s, box-shadow 0.2s;
|
|
box-sizing: border-box;
|
|
box-shadow: none !important;
|
|
text-shadow: none !important;
|
|
}
|
|
.levelup-button::before {
|
|
content: "" !important;
|
|
}
|
|
.levelup-button:hover {
|
|
background: var(--eg-blue-bright) !important;
|
|
color: #fff !important;
|
|
border-color: var(--eg-blue-bright) !important;
|
|
box-shadow: 0 0 8px rgba(var(--eg-blue-bright-rgb), 0.6) !important;
|
|
}
|
|
.levelup-icon {
|
|
font-family: 'Material Symbols Outlined' !important;
|
|
font-size: 22px !important;
|
|
font-weight: 300 !important;
|
|
font-style: normal !important;
|
|
line-height: 1 !important;
|
|
vertical-align: middle !important;
|
|
margin-left: 4px !important;
|
|
font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 20 !important;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
letter-spacing: normal !important;
|
|
}
|
|
|
|
.saving-throw input[type=text], .skill input[type=text], .hp input, .tp input, .exhaustion input {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.charsheet .hdice-dsaves-container input[type=text], .charsheet .hdice-dsaves-container input[type=number] {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.attacks input, .equipment input, .tool input, .proficiencies input, .pc .traits input, .spell input, :is(.sheet-options, .options) .body input, .settings-modal-body input {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
/* .charsheet prefix: beat platform '.ui-dialog .charsheet input[type=number] { width:3.5em }' (0,3,1) */
|
|
.charsheet .resources input[type=number] {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
padding-right: 0px;
|
|
padding-left: 10px;
|
|
}
|
|
|
|
.hdice-dsaves-container input[type=number] {
|
|
padding-right: 0px;
|
|
padding-left: 10px;
|
|
}
|
|
|
|
.saving-throw-container, .skills-container {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
margin-bottom: 10px;
|
|
padding-top: 5px;
|
|
}
|
|
|
|
.saving-throw, .skill {
|
|
width: 100%;
|
|
height: 18px;
|
|
}
|
|
|
|
.saving-throw input[type=checkbox], .skill input[type=checkbox] {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.saving-throw input[type=text], .skill input[type=text] {
|
|
font-size: 12px;
|
|
width: 21px;
|
|
}
|
|
|
|
.col1 .saving-throw > span, .col1 .skill > span {
|
|
font-size: 12px;
|
|
display: inline-block;
|
|
text-align: center;
|
|
min-width: 21px;
|
|
}
|
|
|
|
.saving-throw button[type=roll], .skill button[type=roll] {
|
|
width: calc(100% - 72px);
|
|
overflow: hidden;
|
|
word-wrap: break-word;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
text-align: left;
|
|
}
|
|
|
|
.saving-throw-container .label span, .skills-container .label span, .textbox-container .label span, .ac-init-speed-container span.label, .hp span, .tp span, .exhaustion span.label, .hdice-dsaves-container span, .attacks span, .globalattack span, .equipment span, .textbox span, .tool_proficiencies span, .proficiencies span, .traits span, .spells span, :is(.sheet-options, .options) .body span, .settings-modal-body span {
|
|
display: block;
|
|
font-size: 9px;
|
|
line-height: 12px;
|
|
width: 100%;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.globalattack span {
|
|
margin-top: 2px;
|
|
}
|
|
.globalattack.acmod :is(.sheet-display, .display) span span {
|
|
display: inline;
|
|
}
|
|
.globalattack.acmod label {
|
|
font-weight: normal;
|
|
font-size: 1em;
|
|
}
|
|
.globalattack.acmod label input {
|
|
font-weight: normal;
|
|
font-size: 1em;
|
|
}
|
|
.globalattack.acmod label input[type=number] {
|
|
width: 3.5em;
|
|
}
|
|
|
|
/* ---- Exhaustion Level section redesign ---- */
|
|
.exhaustion {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 10px;
|
|
padding: 8px 12px 10px 12px;
|
|
padding-top: 32px;
|
|
}
|
|
.exhaustion span.label {
|
|
position: absolute !important;
|
|
top: 0 !important;
|
|
bottom: auto !important;
|
|
left: 0;
|
|
right: 0;
|
|
display: block !important;
|
|
text-align: center;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
border-radius: 4px 4px 0 0;
|
|
padding: 5px 0;
|
|
box-sizing: border-box;
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-size: 10px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-blue) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
width: auto !important;
|
|
margin-top: 0 !important;
|
|
}
|
|
.charsheet .exhaustion input[type=number] {
|
|
flex: 0 0 80px;
|
|
width: 80px;
|
|
display: block;
|
|
vertical-align: unset;
|
|
font-size: 28px;
|
|
font-weight: bold;
|
|
}
|
|
.exhaustion div.ex-descriptions {
|
|
flex: 1;
|
|
display: block;
|
|
padding-top: 3px;
|
|
}
|
|
.exhaustion div span.ex-description {
|
|
width: 100% !important;
|
|
font-size: 10px;
|
|
line-height: 13px;
|
|
text-align: left;
|
|
display: block;
|
|
}
|
|
|
|
.exhaustion-toggle[value="0"] ~ .exhaustion {
|
|
display: none;
|
|
}
|
|
|
|
.skill button span, :is(.sheet-options, .options) .body .skill span span, .settings-modal-body .skill span span, .sheet-rolltemplate-spell .sheet-grey {
|
|
color: var(--eg-text-faint);
|
|
font-weight: normal;
|
|
}
|
|
|
|
.textbox-container {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.tool_proficiencies {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding-bottom: 10px;
|
|
padding-top: 28px;
|
|
}
|
|
/* ---- Tool Proficiencies section redesign ---- */
|
|
/* Section title - repositioned to top, styled like Attacks label */
|
|
.tool_proficiencies > .label {
|
|
top: 0 !important;
|
|
bottom: auto !important;
|
|
left: 0;
|
|
right: 0;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
border-radius: 4px 4px 0 0;
|
|
padding: 5px 0;
|
|
box-sizing: border-box;
|
|
}
|
|
.tool_proficiencies > .label span {
|
|
display: inline !important;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 10px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-blue) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
width: auto !important;
|
|
margin-top: 0 !important;
|
|
}
|
|
/* Column header row (TOOL / PRO / ATTRIBUTE) - flex, left-aligned with data */
|
|
.tool_proficiencies :is(.sheet-top, .top) {
|
|
display: flex !important;
|
|
align-items: center;
|
|
background: transparent;
|
|
padding: 7px 6px 3px 6px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.2);
|
|
box-sizing: border-box;
|
|
}
|
|
.tool_proficiencies :is(.sheet-top, .top) span[data-i18n="tool-u"] {
|
|
display: inline-block !important;
|
|
flex: 1 !important;
|
|
width: auto !important;
|
|
font-size: 9px !important;
|
|
color: var(--eg-text-muted) !important;
|
|
font-weight: normal !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
text-align: left !important;
|
|
margin-top: 0 !important;
|
|
line-height: normal !important;
|
|
}
|
|
.tool_proficiencies :is(.sheet-top, .top) span[data-i18n="pro-u"] {
|
|
display: inline-block !important;
|
|
width: 44px !important;
|
|
flex-shrink: 0;
|
|
font-size: 9px !important;
|
|
color: var(--eg-text-muted) !important;
|
|
font-weight: normal !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
text-align: center !important;
|
|
margin-top: 0 !important;
|
|
line-height: normal !important;
|
|
}
|
|
.tool_proficiencies :is(.sheet-top, .top) span[data-i18n="attr-u"] {
|
|
display: inline-block !important;
|
|
width: 80px !important;
|
|
flex-shrink: 0;
|
|
font-size: 9px !important;
|
|
color: var(--eg-text-muted) !important;
|
|
font-weight: normal !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
text-align: center !important;
|
|
margin-top: 0 !important;
|
|
line-height: normal !important;
|
|
}
|
|
/* Roll button - flex row layout + clear Roll20 green */
|
|
.charsheet .tool_proficiencies .tool :is(.sheet-display, .display) button[type=roll] {
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
background-color: transparent !important;
|
|
background-image: none !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
color: var(--eg-text) !important;
|
|
padding: 3px 6px !important;
|
|
width: 100% !important;
|
|
box-sizing: border-box !important;
|
|
}
|
|
/* Kill green mouseover highlight */
|
|
.charsheet .tool_proficiencies .tool :is(.sheet-display, .display) button[type=roll]:hover {
|
|
color: var(--eg-text) !important;
|
|
background: transparent !important;
|
|
background-color: transparent !important;
|
|
}
|
|
.charsheet .tool_proficiencies .tool :is(.sheet-display, .display) button[type=roll]:hover * {
|
|
color: inherit !important;
|
|
background: transparent !important;
|
|
}
|
|
/* Tool name span - expands to fill remaining width */
|
|
.tool_proficiencies .tool :is(.sheet-display, .display) button span {
|
|
flex: 1 !important;
|
|
width: auto !important;
|
|
font-size: 12px !important;
|
|
font-weight: bold !important;
|
|
text-align: left;
|
|
background: transparent !important;
|
|
}
|
|
/* Bonus display (first text input) - 44px, centered */
|
|
.tool_proficiencies .tool :is(.sheet-display, .display) button input[type=text]:first-of-type {
|
|
width: 44px !important;
|
|
flex-shrink: 0;
|
|
text-align: center !important;
|
|
font-size: 12px !important;
|
|
font-weight: normal !important;
|
|
background: transparent !important;
|
|
border: none !important;
|
|
}
|
|
/* Attribute input (last text input) - 80px, centered */
|
|
.tool_proficiencies .tool :is(.sheet-display, .display) button input[type=text]:last-of-type {
|
|
width: 80px !important;
|
|
flex-shrink: 0;
|
|
text-align: center !important;
|
|
font-size: 12px !important;
|
|
font-weight: normal !important;
|
|
background: transparent !important;
|
|
border: none !important;
|
|
}
|
|
/* Subtle blue row-hover tint */
|
|
.tool_proficiencies .tool:hover :is(.sheet-display, .display) {
|
|
background: rgba(var(--eg-blue-rgb), 0.04) !important;
|
|
}
|
|
/* Gear icon - Material Symbols gold gear */
|
|
.tool_proficiencies .tool .options-flag + span {
|
|
font-family: 'Material Symbols Outlined' !important;
|
|
font-size: 14px !important;
|
|
color: var(--eg-gold) !important;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24 !important;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
line-height: 1;
|
|
user-select: none;
|
|
opacity: 0.6;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.tool_proficiencies .tool:hover .options-flag + span {
|
|
opacity: 1;
|
|
}
|
|
|
|
.attacks {
|
|
padding-bottom: 10px;
|
|
}
|
|
|
|
.textbox-container textarea {
|
|
width: calc(100% - 10px);
|
|
resize: vertical;
|
|
border: none;
|
|
}
|
|
|
|
.ac-init-speed-container, .hp, .tp, .exhaustion, .hdice-dsaves-container, .attacks, .equipment {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
/* === AC / Speed - two independent boxes === */
|
|
.ac-init-speed-container {
|
|
display: flex;
|
|
gap: 6px;
|
|
}
|
|
.ac-box, .speed-box {
|
|
flex: 1 1 0;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 6px;
|
|
padding: 4px 8px 6px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 2px;
|
|
box-sizing: border-box;
|
|
position: relative; /* anchor for the absolutely-positioned gear toggle */
|
|
}
|
|
.ac-box-header, .speed-box-header {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
}
|
|
.ac-box-header::before, .speed-box-header::before {
|
|
content: '';
|
|
width: 16px;
|
|
flex-shrink: 0;
|
|
}
|
|
.ac-box-label, .speed-box-label {
|
|
flex: 1;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
text-align: center;
|
|
}
|
|
/* CSE: the base AC/Speed header rules above are (0,1,0) and lose to platform
|
|
'.ui-dialog .charsheet div/span' rules (0,2,1), which collapses the flex layout
|
|
so the label + gear cluster to the left. Re-assert flex centering at (0,3,0). */
|
|
.charsheet .ac-box .ac-box-header,
|
|
.charsheet .speed-box .speed-box-header {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
}
|
|
.charsheet .ac-box .ac-box-label,
|
|
.charsheet .speed-box .speed-box-label {
|
|
flex: 1 1 0;
|
|
text-align: center;
|
|
}
|
|
/* CSE: give the label the FULL box width so "ARMOR CLASS" fits one line and centers
|
|
across the whole box. Reclaim the 32px the flex layout reserved for the left
|
|
spacer + inline gear by hiding the spacer and floating the gear out of flow.
|
|
High specificity (0,3,x) to beat platform '.ui-dialog .charsheet label/div'. */
|
|
.charsheet .ac-box .ac-box-header::before,
|
|
.charsheet .speed-box .speed-box-header::before {
|
|
display: none;
|
|
}
|
|
/* OGL/Equipment bare-checkbox toggle: transparent checkbox on top (z-index:2) is the
|
|
click target; the visible .ac-gear-icon sits underneath (z-index:1). No has-selector, no id/for. */
|
|
.charsheet .ac-box .ac-expand-cb,
|
|
.charsheet .speed-box .speed-expand-cb {
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 7px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
margin: 0;
|
|
cursor: pointer;
|
|
}
|
|
.charsheet .ac-box .ac-gear-icon,
|
|
.charsheet .speed-box .speed-gear-icon {
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 7px;
|
|
z-index: 1;
|
|
cursor: pointer;
|
|
}
|
|
.ac-gear-icon, .speed-gear-icon {
|
|
font-family: 'Material Symbols Outlined';
|
|
font-size: 14px;
|
|
color: var(--eg-gold);
|
|
opacity: 0.6;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
display: inline-block !important;
|
|
line-height: 1;
|
|
user-select: none;
|
|
transition: opacity 0.2s, color 0.2s;
|
|
}
|
|
.ac-expand-cb:hover + .ac-gear-icon,
|
|
.speed-expand-cb:hover + .speed-gear-icon { opacity: 1; }
|
|
.ac-expand-cb:checked + .ac-gear-icon,
|
|
.speed-expand-cb:checked + .speed-gear-icon {
|
|
color: var(--eg-blue-bright);
|
|
opacity: 1;
|
|
font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
}
|
|
/* Main value */
|
|
.ac-box > input[type=text],
|
|
.speed-box > input[type=text] {
|
|
font-size: 28px !important;
|
|
font-weight: bold;
|
|
color: var(--eg-text) !important;
|
|
background: none !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
text-align: center;
|
|
width: 100% !important;
|
|
padding: 0;
|
|
line-height: 1.1;
|
|
}
|
|
/* Details panel */
|
|
.ac-details, .speed-details {
|
|
display: none;
|
|
flex-direction: row;
|
|
gap: 4px;
|
|
width: 100%;
|
|
padding-top: 6px;
|
|
border-top: 1px solid rgba(var(--eg-gold-rgb),0.3);
|
|
}
|
|
.ac-expand-cb:checked ~ .ac-details { display: flex; }
|
|
.speed-expand-cb:checked ~ .speed-details { display: flex; }
|
|
/* Detail items */
|
|
.detail-item {
|
|
flex: 1 1 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
background: rgba(var(--eg-gold-rgb),0.08);
|
|
border-radius: 4px;
|
|
padding: 4px 2px;
|
|
gap: 2px;
|
|
}
|
|
.detail-item input[type=text], .detail-value {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 12px !important;
|
|
font-weight: bold;
|
|
color: var(--eg-text) !important;
|
|
background: none !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
text-align: center;
|
|
width: 100% !important;
|
|
padding: 0;
|
|
line-height: 1.2;
|
|
display: block !important;
|
|
}
|
|
.detail-label {
|
|
font-size: 8px !important;
|
|
color: var(--eg-text-muted) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
display: block !important;
|
|
text-align: center;
|
|
line-height: 1;
|
|
}
|
|
|
|
.hp, .tp, .exhaustion, .subcontainer, .attacks, .equipment {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.hp input, .tp input {
|
|
font-size: 30px;
|
|
}
|
|
|
|
.exhaustion input {
|
|
font-size: 20px;
|
|
}
|
|
|
|
.charsheet .hp input[type=number], .charsheet .tp input[type=number] {
|
|
width: 100%;
|
|
padding-right: 10px;
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.charsheet .tp input[type=number] {
|
|
font-size: 24px;
|
|
}
|
|
|
|
.hp span.label, .tp span.label, .exhuastion span .label, .hdice-dsaves-container span.label {
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.hp :is(.sheet-top, .top) span, .tp :is(.sheet-top, .top) span, .hdice-dsaves-container :is(.sheet-top, .top) span, .attacks :is(.sheet-top, .top) span, .tool_proficiencies :is(.sheet-top, .top) span, .proficiencies :is(.sheet-top, .top) span, .traits :is(.sheet-top, .top) span {
|
|
text-align: left;
|
|
margin-left: 5px;
|
|
color: var(--eg-text-faint);
|
|
font-weight: normal;
|
|
display: inline-block;
|
|
width: initial;
|
|
}
|
|
|
|
.hp :is(.sheet-top, .top) input, .hdice-dsaves-container :is(.sheet-top, .top) input[type=text] {
|
|
border-bottom: 1px solid var(--eg-border);
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
width: 150px;
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
padding: 0px;
|
|
}
|
|
|
|
.tp :is(.sheet-top, .top) input {
|
|
border-bottom: 1px solid var(--eg-border);
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
width: 140px;
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
padding: 0px;
|
|
}
|
|
|
|
.hdice-dsaves-container :is(.sheet-top, .top) input[type=text] {
|
|
width: 80px;
|
|
}
|
|
|
|
.subcontainer {
|
|
width: 116px;
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
height: 64px;
|
|
}
|
|
.subcontainer input[type=text].label,
|
|
.subcontainer span.label {
|
|
display: block;
|
|
font-size: 9px;
|
|
line-height: 12px;
|
|
width: 100%;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-variant: small-caps;
|
|
text-transform: uppercase;
|
|
/* Set color directly on the label: it was inheriting Roll20's platform white
|
|
'.charsheet' default (a platform rule on an intermediate container blocks the
|
|
'.charsheet .pc' base color from cascading down the branch). A directly-matched
|
|
color always beats an inherited one. Token flips correctly in dark mode. */
|
|
color: var(--eg-text);
|
|
}
|
|
.subcontainer span.label {
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.hdice-dsaves-container .row-container {
|
|
float: right;
|
|
margin-right: 5px;
|
|
margin-top: 5px;
|
|
}
|
|
.hdice-dsaves-container .row-container span {
|
|
display: inline-block;
|
|
width: inherit;
|
|
}
|
|
|
|
.money {
|
|
width: 70px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.coin {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
margin-top: 10px;
|
|
background-color: var(--eg-bg);
|
|
position: relative;
|
|
left: -5px;
|
|
}
|
|
.coin span {
|
|
display: inline-block;
|
|
color: var(--eg-text-faint);
|
|
margin-top: 0px;
|
|
margin-left: 5px;
|
|
width: 15px;
|
|
}
|
|
.coin input {
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
padding: 0px;
|
|
width: 40px;
|
|
}
|
|
|
|
.equipment {
|
|
position: relative;
|
|
min-height: 276px;
|
|
}
|
|
.equipment textarea {
|
|
width: calc(100% - 69px);
|
|
margin: 0px 0px 0px -5px;
|
|
resize: vertical;
|
|
border: none;
|
|
display: inline-block;
|
|
padding: 0px;
|
|
min-height: 264px;
|
|
}
|
|
.equipment span {
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.textbox {
|
|
width: 100%;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
.textbox span {
|
|
margin-top: 0px;
|
|
}
|
|
.textbox textarea {
|
|
width: calc(100% - 10px);
|
|
resize: vertical;
|
|
border: none;
|
|
margin: 0px;
|
|
padding-bottom: 0px;
|
|
min-height: 48px;
|
|
height: 48px;
|
|
}
|
|
|
|
/*.col3 {
|
|
* * width: 245px;
|
|
* * margin-left: -3px;
|
|
* *} */
|
|
.footer {
|
|
-webkit-user-select: auto;
|
|
-moz-user-select: text;
|
|
font-size: 10px;
|
|
color: var(--eg-text-faint);
|
|
margin-top: 10px;
|
|
/* Hidden per request - old SRD/OGL attribution disclaimers. SRD is now under
|
|
Creative Commons so the OGL attribution isn't required; kept hidden in the DOM
|
|
(not deleted) in case the footer is repurposed later. Reversible: remove the line. */
|
|
display: none;
|
|
}
|
|
.footer div {
|
|
width: 45%;
|
|
display: inline-block;
|
|
}
|
|
|
|
.attacks {
|
|
min-height: 150px;
|
|
margin-bottom: 10px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* ---- Attacks section redesign ---- */
|
|
.attacks .global-dmg > span.label,
|
|
.attacks > span.label {
|
|
font-family: 'Oxanium', sans-serif;
|
|
color: var(--eg-blue);
|
|
letter-spacing: 1px;
|
|
position: static;
|
|
text-align: left;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
padding: 4px 8px 2px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.3);
|
|
margin-top: 0;
|
|
}
|
|
.attacks .attack {
|
|
position: relative !important;
|
|
}
|
|
.attacks :is(.sheet-top, .top).atk-header {
|
|
display: flex;
|
|
align-items: center;
|
|
width: calc(100% + 10px);
|
|
padding: 5px 4px 5px 8px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
box-sizing: border-box;
|
|
}
|
|
.attacks .atk-col-name {
|
|
flex: 1;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
display: block !important;
|
|
width: auto !important;
|
|
}
|
|
.attacks .atk-col-range,
|
|
.attacks .atk-col-hit,
|
|
.attacks .atk-col-dmg {
|
|
flex-shrink: 0;
|
|
text-align: center;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
color: var(--eg-text-muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
width: 60px !important;
|
|
}
|
|
.attacks .atk-col-dmg { width: 96px !important; }
|
|
.attacks .attack + .attack :is(.sheet-display, .display) {
|
|
border-top: 1px solid rgba(var(--eg-gold-rgb),0.2);
|
|
}
|
|
.attacks .attack:nth-child(even) :is(.sheet-display, .display) {
|
|
background: rgba(0,0,0,0.02);
|
|
}
|
|
.attacks .repitem:nth-child(even) {
|
|
background-color: var(--eg-bg-tint);
|
|
}
|
|
.attacks :is(.sheet-display, .display) {
|
|
position: relative;
|
|
}
|
|
.attacks :is(.sheet-display, .display) button[type=roll] {
|
|
display: inline-flex !important;
|
|
flex-direction: row !important;
|
|
align-items: center !important;
|
|
width: calc(100% - 22px) !important;
|
|
padding: 4px 4px 4px 8px !important;
|
|
min-height: 32px;
|
|
}
|
|
.attacks :is(.sheet-display, .display) .atk-name-cell,
|
|
.attacks :is(.sheet-display, .display) .atk-range-cell,
|
|
.attacks :is(.sheet-display, .display) .atk-bonus-cell,
|
|
.attacks :is(.sheet-display, .display) .atk-dmg-cell {
|
|
background: none !important;
|
|
border-radius: 0 !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
min-height: 0 !important;
|
|
vertical-align: middle !important;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.attacks :is(.sheet-display, .display) .atk-name-cell {
|
|
flex: 1;
|
|
text-align: left;
|
|
font-size: 12px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-text);
|
|
}
|
|
.attacks :is(.sheet-display, .display) .atk-range-cell {
|
|
width: 60px;
|
|
flex-shrink: 0;
|
|
text-align: center;
|
|
font-size: 11px !important;
|
|
font-weight: normal !important;
|
|
color: var(--eg-text-muted);
|
|
}
|
|
.attacks :is(.sheet-display, .display) .atk-bonus-cell {
|
|
width: 60px;
|
|
flex-shrink: 0;
|
|
text-align: center;
|
|
font-size: 11px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-blue-bright);
|
|
}
|
|
.attacks :is(.sheet-display, .display) .atk-dmg-cell {
|
|
width: 96px;
|
|
flex-shrink: 0;
|
|
text-align: center;
|
|
font-size: 11px !important;
|
|
color: var(--eg-text);
|
|
}
|
|
.attacks .options-flag {
|
|
right: 0 !important;
|
|
width: 22px !important;
|
|
height: 32px !important;
|
|
}
|
|
.attacks .options-flag + span {
|
|
right: 0 !important;
|
|
width: 22px !important;
|
|
height: 32px !important;
|
|
display: none;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: 'Material Symbols Outlined' !important;
|
|
font-size: 14px !important;
|
|
color: var(--eg-gold) !important;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24 !important;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
line-height: 1;
|
|
user-select: none;
|
|
}
|
|
.attacks .attack:hover :is(.sheet-display, .display) {
|
|
background: rgba(var(--eg-blue-rgb), 0.06) !important;
|
|
}
|
|
.attacks :is(.sheet-display, .display) button[type=roll]:hover * {
|
|
color: inherit !important;
|
|
}
|
|
.attacks :is(.sheet-display, .display) button[type=roll]:hover input[type=text] {
|
|
color: inherit !important;
|
|
}
|
|
|
|
.equipment.hidden {
|
|
min-height: 50px;
|
|
}
|
|
|
|
.attacks :is(.sheet-display, .display) button[type=roll], .tool :is(.sheet-display, .display) button[type=roll], .proficiency :is(.sheet-display, .display) button[type=roll] {
|
|
background-color: transparent;
|
|
color: var(--eg-text);
|
|
border: none;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
width: 100%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.attacks :is(.sheet-display, .display) button[type=roll]::before, .tool :is(.sheet-display, .display) button[type=roll]::before, .proficiency :is(.sheet-display, .display) button[type=roll]::before {
|
|
content: "" !important;
|
|
}
|
|
|
|
.attacks :is(.sheet-display, .display) input, .tool :is(.sheet-display, .display) input, .equipment .item input, .attacks :is(.sheet-display, .display) span, .tool :is(.sheet-display, .display) span, .equipment .item span, .proficiencies :is(.sheet-display, .display) span {
|
|
font-size: 12px;
|
|
line-height: 12px;
|
|
border-top-left-radius: 5px;
|
|
border-bottom-right-radius: 5px;
|
|
background-color: var(--eg-bg-alt);
|
|
cursor: pointer;
|
|
text-align: left;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.attacks :is(.sheet-display, .display) span, .tool :is(.sheet-display, .display) span, .equipment .item span, .proficiencies :is(.sheet-display, .display) span {
|
|
min-height: 12px;
|
|
display: inline-block;
|
|
margin-top: 0px;
|
|
padding: 4px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
vertical-align: bottom;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.traits :is(.sheet-display, .display) .title {
|
|
font-family: "Source Sans Pro", "Varta", arial, sans-serif;
|
|
font-size: 16px;
|
|
text-transform: capitalize;
|
|
font-variant: small-caps;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
}
|
|
.traits :is(.sheet-display, .display) .subheader {
|
|
font-style: italic;
|
|
color: var(--eg-text-faint);
|
|
margin-top: -3px;
|
|
}
|
|
.traits :is(.sheet-display, .display) .subheader span {
|
|
font-size: 10px;
|
|
display: inline;
|
|
}
|
|
|
|
/* ---- Features & Traits section - header to top ---- */
|
|
.textbox.traits {
|
|
position: relative;
|
|
padding-top: 28px;
|
|
padding-bottom: 10px;
|
|
}
|
|
.textbox.traits > span.label {
|
|
position: absolute !important;
|
|
top: 0 !important;
|
|
bottom: auto !important;
|
|
left: 0;
|
|
right: 0;
|
|
display: block !important;
|
|
text-align: center;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
border-radius: 4px 4px 0 0;
|
|
padding: 5px 0;
|
|
box-sizing: border-box;
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-size: 10px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-blue) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
width: auto !important;
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
.spell .details-flag, .attacks .options-flag, .spell .options-flag, .tool .options-flag, .npc .npc_options-flag, .npcs .npc_options-flag, .ships .npc_options-flag {
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 0px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
}
|
|
|
|
.pc .trait .options-flag, .pc .global-mod .options-flag {
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 0px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
}
|
|
|
|
.action .options-flag, .textbox .options-flag, .proficiencies .options-flag, .traits .options-flag, .equipment .inventorysubflag, .header .options-flag {
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 0px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
}
|
|
|
|
.spell .details-flag + span, .attacks .options-flag + span, .spell .options-flag + span, .tool .options-flag + span, .npc .npc_options-flag + span, .npcs .npc_options-flag + span, .ships .npc_options-flag + span, .trait .options-flag + span, .global-mod .options-flag + span, .action .options-flag + span, .textbox .options-flag + span, .proficiencies .options-flag + span, .traits .options-flag + span, .equipment .inventorysubflag + span, .header .options-flag + span {
|
|
align-items: center;
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 0px;
|
|
white-space: nowrap;
|
|
width: 18px;
|
|
height: 18px;
|
|
font-size: 20px;
|
|
font-family: pictos;
|
|
color: var(--eg-text-faint);
|
|
cursor: pointer;
|
|
margin-top: 0px;
|
|
display: none;
|
|
}
|
|
|
|
.spell .details-flag:hover + span, .attacks .options-flag:hover + span, .spell .options-flag:hover + span, .tool .options-flag:hover + span, .npc .npc_options-flag:hover + span, .npcs .npc_options-flag:hover + span, .ships .npc_options-flag:hover + span, .trait .options-flag:hover + span, .global-mod .options-flag:hover + span, .action .options-flag:hover + span, .textbox .options-flag:hover + span, .proficiencies .options-flag:hover + span, .traits .options-flag:hover + span, .equipment .inventorysubflag:hover + span, .header .options-flag:hover + span {
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.pc .global-mod .options-flag:not(:checked) ~ :is(.sheet-display, .display) {
|
|
width: 80%;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
}
|
|
.pc .global-mod .options-flag:checked ~ :is(.sheet-options, .options) {
|
|
width: 80%;
|
|
display: inline-block;
|
|
}
|
|
|
|
.spell .details-flag:checked + span, .attacks .options-flag:checked + span, .spell .options-flag:checked + span, .tool .options-flag:checked + span, .npc .npc_options-flag:checked + span, .npcs .npc_options-flag:checked + span, .ships .npc_options-flag:checked + span, .trait .options-flag:checked + span, .global-mod .options-flag:checked + span, .action .options-flag:checked + span, .textbox .options-flag:checked + span, .proficiencies .options-flag:checked + span, .traits .options-flag:checked + span, .equipment .inventorysubflag:checked + span, .header .options-flag:checked + span {
|
|
color: var(--eg-text);
|
|
display: flex;
|
|
}
|
|
|
|
.spell:hover .details-flag + span, .spell:hover .options-flag + span {
|
|
display: flex;
|
|
}
|
|
|
|
.attacks .attack:hover .options-flag + span, .tool:hover .options-flag + span, .npc:hover > .npc_options-flag + span, .npcs:hover > .npc_options-flag + span, .ships:hover > .npc_options-flag + span, .trait:hover .options-flag + span, .global-mod:hover .options-flag + span, .action:hover .npc_options-flag + span, .textbox:hover > .options-flag + span, .proficiency:hover .options-flag + span, .item:hover .inventorysubflag + span {
|
|
display: flex;
|
|
}
|
|
|
|
.pc .trait:hover .output {
|
|
display: flex;
|
|
color: var(--eg-blue) !important;
|
|
}
|
|
.pc .trait:hover .output:hover {
|
|
color: #1a3d64 !important;
|
|
}
|
|
/* Gear icon - Material Symbols outlined gold gear (span text is "y"/pictos, hidden via font-size:0;
|
|
::before injects the "settings" ligature in Material Symbols Outlined) */
|
|
.pc .trait .options-flag + span {
|
|
font-family: 'Material Symbols Outlined' !important;
|
|
font-size: 0 !important;
|
|
color: var(--eg-gold) !important;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24 !important;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
opacity: 0.6;
|
|
}
|
|
.pc .trait .options-flag + span::before {
|
|
content: 'settings';
|
|
font-size: 14px;
|
|
line-height: 18px;
|
|
}
|
|
.pc .trait:hover .options-flag + span {
|
|
color: var(--eg-gold) !important;
|
|
opacity: 1;
|
|
}
|
|
.pc .trait:hover .options-flag:hover + span {
|
|
color: #8a6d3e !important;
|
|
}
|
|
.pc .header:hover .options-flag + span {
|
|
display: flex;
|
|
}
|
|
.pc .header .options-flag {
|
|
top: 8px;
|
|
right: 4px;
|
|
z-index: 10;
|
|
cursor: pointer;
|
|
}
|
|
.pc .header .options-flag + span {
|
|
top: 8px;
|
|
right: 4px;
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* Header char-info edit toggle - label-based (clicking the label toggles the
|
|
hidden checkbox; reliable in CSE, mirrors the working AC/Speed gear). */
|
|
/* OGL bare-checkbox: transparent .options-flag on top is the click target;
|
|
gear drawn by .charinfo-gear-icon::before underneath. */
|
|
.pc .header .char-info-right > .options-flag {
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 4px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 11;
|
|
opacity: 0;
|
|
margin: 0;
|
|
cursor: pointer;
|
|
}
|
|
.pc .header .char-info-right > .charinfo-gear-icon {
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 4px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 10;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
pointer-events: none;
|
|
font-size: 0 !important; /* hide the raw pictos "y"; gear is drawn via ::before */
|
|
}
|
|
.charinfo-gear-icon::before {
|
|
content: 'settings';
|
|
font-family: 'Material Symbols Outlined';
|
|
font-size: 14px;
|
|
color: var(--eg-gold);
|
|
opacity: 0.6;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
|
}
|
|
.char-info-right > .options-flag:checked ~ .header-info:is(.sheet-options, .options) {
|
|
display: inline-block;
|
|
min-height: 74px;
|
|
vertical-align: top;
|
|
}
|
|
.char-info-right > .options-flag:checked ~ .header-info:is(.sheet-display, .display) {
|
|
display: none;
|
|
}
|
|
|
|
.pc .global-mod .display-flag, .pc .trait .display-flag {
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.pc .global-mod .options-flag:checked ~ .display-flag {
|
|
width: 0px;
|
|
height: 0px;
|
|
}
|
|
.pc .trait .options-flag:checked ~ .display-flag {
|
|
width: 0px;
|
|
height: 0px;
|
|
}
|
|
.pc .trait .display-flag:checked ~ :is(.sheet-display, .display) .desc {
|
|
display: none;
|
|
}
|
|
.pc .trait .output {
|
|
position: absolute;
|
|
top: -8px;
|
|
right: 30px;
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
background: none;
|
|
border: none;
|
|
font-family: pictos;
|
|
font-size: 20px;
|
|
display: none;
|
|
}
|
|
/* CSE: '.charsheet' prefix to beat the platform d20 icon
|
|
'.ui-dialog .charsheet button[type=roll]:before { content:"t" }' (0,3,2) which
|
|
otherwise re-appears next to the trait's custom speech-bubble button. */
|
|
.charsheet .pc .trait .output::before {
|
|
content: "" !important;
|
|
}
|
|
|
|
.textbox :is(.sheet-display, .display) .desc {
|
|
white-space: pre-wrap;
|
|
word-break: break-word;
|
|
}
|
|
|
|
.licensecontainer, .attack, .spell, .tool, .npc, .action, .textbox, .proficiencies, .traits, .proficiency, .trait {
|
|
position: relative;
|
|
}
|
|
|
|
.attack :is(.sheet-options, .options), .spell :is(.sheet-options, .options), .tool :is(.sheet-options, .options), .npc .npc_options, .trait :is(.sheet-options, .options), .global-mod :is(.sheet-options, .options), .action :is(.sheet-options, .options), .textbox :is(.sheet-options, .options), .proficiencies :is(.sheet-options, .options), .trait :is(.sheet-options, .options) {
|
|
display: none;
|
|
border-top: 2px dashed gold;
|
|
}
|
|
|
|
.item .subitem, .header :is(.sheet-options, .options) {
|
|
display: none;
|
|
}
|
|
|
|
.col3 .textbox :is(.sheet-display, .display) {
|
|
padding: 5px 5px 5px 10px;
|
|
}
|
|
|
|
.textbox :is(.sheet-display, .display) span {
|
|
font-weight: normal;
|
|
font-size: 12px;
|
|
text-align: left;
|
|
line-height: 16px;
|
|
}
|
|
.textbox.pibf span {
|
|
white-space: pre-wrap;
|
|
word-break: break-word;
|
|
}
|
|
|
|
.attacks .options-flag:checked ~ :is(.sheet-options, .options), .tool .options-flag:checked ~ :is(.sheet-options, .options), .npc .npc_options-flag:checked ~ .npc_options, .trait .options-flag:checked ~ :is(.sheet-options, .options), .global-mod .options-flag:checked ~ :is(.sheet-options, .options), .action .options-flag:checked ~ :is(.sheet-options, .options), .textbox .options-flag:checked ~ :is(.sheet-options, .options), .proficiencies .options-flag:checked ~ :is(.sheet-options, .options), .traits .options-flag:checked ~ :is(.sheet-options, .options), .item .inventorysubflag:checked ~ .subitem {
|
|
display: inherit;
|
|
}
|
|
|
|
/* Header char-info: hide the edit (options) panel by default; the
|
|
:checked rule below reveals it. Mirrors OGL `.header .options{display:none}`. */
|
|
.header .header-info:is(.sheet-options, .options) {
|
|
display: none;
|
|
}
|
|
.header .options-flag:checked ~ :is(.sheet-options, .options) {
|
|
min-height: 74px;
|
|
vertical-align: top;
|
|
display: inline-block;
|
|
}
|
|
|
|
.textbox .options-flag:checked ~ :is(.sheet-display, .display), .header .options-flag:checked ~ :is(.sheet-display, .display) {
|
|
display: none;
|
|
}
|
|
|
|
.spell-level {
|
|
position: relative;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.header-info:is(.sheet-options, .options) span {
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
font-size: 9px;
|
|
}
|
|
.header-info:is(.sheet-options, .options) input,
|
|
.header-info:is(.sheet-options, .options) select {
|
|
width: 58px;
|
|
font-size: 10px;
|
|
}
|
|
.header-info:is(.sheet-options, .options) :is(.sheet-row, .row) {
|
|
line-height: 1.4;
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
.level {
|
|
width: 20px;
|
|
display: inline-block;
|
|
}
|
|
.level:after {
|
|
border-top: 20px solid transparent;
|
|
border-bottom: 20px solid transparent;
|
|
border-left: 20px solid var(--eg-bg);
|
|
left: 0px;
|
|
top: -6px;
|
|
content: "";
|
|
position: absolute;
|
|
}
|
|
.level:before {
|
|
border-top: 20px solid transparent;
|
|
border-bottom: 20px solid transparent;
|
|
border-left: 20px solid var(--eg-bg);
|
|
left: 0px;
|
|
top: -6px;
|
|
content: "";
|
|
position: absolute;
|
|
border-top: 23px solid transparent;
|
|
border-bottom: 23px solid transparent;
|
|
border-left: 24px solid;
|
|
border-left-color: inherit;
|
|
left: -2px;
|
|
top: -9px;
|
|
}
|
|
.level span {
|
|
z-index: 3;
|
|
margin-left: -3px;
|
|
position: relative;
|
|
font-size: 16px;
|
|
top: 2px;
|
|
}
|
|
|
|
.primes {
|
|
display: inline-block;
|
|
border: 1px solid var(--eg-text);
|
|
height: 25px;
|
|
border-radius: 5px;
|
|
width: 238px;
|
|
text-align: center;
|
|
margin-left: -20px;
|
|
}
|
|
.primes span {
|
|
display: block;
|
|
font-size: 9px;
|
|
line-height: 12px;
|
|
width: 100%;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
margin-top: 8px;
|
|
}
|
|
|
|
.spell-labels {
|
|
color: var(--eg-text-faint);
|
|
display: none;
|
|
}
|
|
.slot_type[value="tech"] ~ .body .spell-labels {
|
|
display: block;
|
|
}
|
|
.spell-labels span {
|
|
display: inline;
|
|
font-weight: normal;
|
|
font-size: 8px;
|
|
}
|
|
|
|
.spell-level input {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: textfield;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
padding: 0px;
|
|
margin: 2px;
|
|
height: 100%;
|
|
}
|
|
.spell-level .total, .spell-level .expended {
|
|
display: inline-block;
|
|
border: 1px solid var(--eg-text);
|
|
height: 25px;
|
|
border-radius: 5px;
|
|
text-align: center;
|
|
margin-left: -20px;
|
|
background-color: var(--eg-bg);
|
|
}
|
|
.spell-level .total {
|
|
width: 114px;
|
|
vertical-align: bottom;
|
|
}
|
|
.spell-level .total span {
|
|
font-size: 20px;
|
|
font-weight: normal;
|
|
position: relative;
|
|
top: 3px;
|
|
}
|
|
.spell-level .expended {
|
|
width: 139px;
|
|
border-top-left-radius: 0px;
|
|
border-bottom-left-radius: 0px;
|
|
}
|
|
|
|
.spell {
|
|
margin-bottom: 5px;
|
|
width: 245px;
|
|
}
|
|
.spell .wrapper {
|
|
position: relative;
|
|
}
|
|
.spell .wrapper button.spell_link {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 5px;
|
|
border: none;
|
|
background: none;
|
|
color: var(--eg-text-faint);
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.spell .wrapper button.spell_link::before {
|
|
content: "|";
|
|
}
|
|
.spell .wrapper button.spell_link:hover {
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.charsheet .spells .details span {
|
|
font-size: 12px;
|
|
}
|
|
.charsheet .spells .details span[name=attr_spelldescription] {
|
|
white-space: pre-line;
|
|
}
|
|
.charsheet .spells .details > .italics span:nth-last-child(3) {
|
|
display: inline-block;
|
|
width: 120px;
|
|
text-align: left;
|
|
text-transform: lowercase;
|
|
}
|
|
.charsheet .spells .details > .italics span:nth-last-child(3)::first-letter {
|
|
text-transform: uppercase;
|
|
}
|
|
.charsheet .spells .details > .italics span:not(:first-child) {
|
|
margin-left: 3px;
|
|
}
|
|
.charsheet .spells .details span[data-i18n=concentration] {
|
|
margin-left: -3px;
|
|
}
|
|
.charsheet .spells .details span[data-i18n=concentration]:after {
|
|
content: ", ";
|
|
}
|
|
|
|
/* CSE: spell "i" info toggle is now a <label> (bare checkbox didn't receive clicks).
|
|
Flag is inside the label, so ':checked ~' sibling rules don't match - use :is(). */
|
|
.repcontainer .spell .details-flag:not(:checked) ~ .wrapper {
|
|
display: none;
|
|
}
|
|
|
|
.spell .wrapper .options-flag {
|
|
display: inherit;
|
|
}
|
|
.spell .wrapper .options-flag + span {
|
|
display: inherit;
|
|
}
|
|
|
|
.repcontainer .spell .details-flag:not(:checked) ~ .wrapper input.spell_desc + .options-flag {
|
|
display: none;
|
|
}
|
|
.repcontainer .spell .details-flag:not(:checked) ~ .wrapper input.spell_desc + .options-flag + span {
|
|
display: none;
|
|
}
|
|
.repcontainer .spell .wrapper :is(.sheet-options, .options) .options-flag + span {
|
|
right: 23.5px;
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
.repcontainer .spell .wrapper input.spell_desc[value] + .options-flag:not(:checked) ~ :is(.sheet-options, .options), .repcontainer .spell .wrapper .options-flag:not(:checked) ~ :is(.sheet-options, .options) {
|
|
display: none;
|
|
}
|
|
|
|
.spell .wrapper .options-flag {
|
|
z-index: 10;
|
|
right: 23.5px;
|
|
width: 18px !important;
|
|
height: 18px !important;
|
|
}
|
|
.spell .wrapper .options-flag:checked ~ .details {
|
|
display: none;
|
|
}
|
|
.spell .wrapper .options-flag:checked ~ :is(.sheet-options, .options) {
|
|
display: inherit;
|
|
}
|
|
.spell .wrapper .options-flag + span {
|
|
right: 23.5px;
|
|
}
|
|
.spell .details span:not(.innate) {
|
|
display: inline;
|
|
font-weight: normal;
|
|
}
|
|
.spell .details span.bold {
|
|
font-weight: bold;
|
|
margin-right: 3px;
|
|
}
|
|
.spell .details .italics {
|
|
font-style: italic;
|
|
}
|
|
.spell .details input[type=checkbox] {
|
|
display: none;
|
|
}
|
|
.spell .details input[type=checkbox] + span {
|
|
display: none;
|
|
}
|
|
.spell .details input[type=checkbox]:checked + span {
|
|
display: inline;
|
|
}
|
|
.spell .details input[type=checkbox]:checked ~ input[type=checkbox]:checked + span::before {
|
|
content: ", ";
|
|
}
|
|
.spell .details span[name=attr_spellname] {
|
|
font-family: "Source Sans Pro", "Varta", arial, sans-serif;
|
|
font-size: 16px;
|
|
text-transform: capitalize;
|
|
font-variant: small-caps;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
}
|
|
.spell .details input[name=attr_spellcomp_materials][value=""] + span, .spell .details input[name=attr_spellathigherlevels][value=""] + div {
|
|
display: none;
|
|
}
|
|
.spell :is(.sheet-options, .options) {
|
|
border-top: none;
|
|
border-bottom: 2px dashed gold;
|
|
padding-bottom: 40px;
|
|
}
|
|
.spell .options-done {
|
|
display: inline-block;
|
|
margin-top: 5px;
|
|
padding: 3px 10px;
|
|
width: auto;
|
|
border-radius: 1em;
|
|
color: #ffffff;
|
|
background-color: #000000;
|
|
font-size: 1em;
|
|
float: right;
|
|
cursor: pointer;
|
|
}
|
|
.spell .options-done:hover {
|
|
opacity: 0.6;
|
|
}
|
|
.spell .options-done::before {
|
|
content: "3";
|
|
font-family: pictos;
|
|
}
|
|
.spell .options-done input[type=checkbox] {
|
|
display: none;
|
|
}
|
|
.spell .options-done span.label {
|
|
margin-top: 0;
|
|
}
|
|
.spell :is(.sheet-display, .display) {
|
|
position: relative;
|
|
}
|
|
.spell :is(.sheet-display, .display) button[type=roll] {
|
|
background-color: transparent;
|
|
color: var(--eg-text);
|
|
border-top: none;
|
|
border-left: none;
|
|
border-right: none;
|
|
border-bottom: 1px solid var(--eg-border);
|
|
background-image: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
width: 100%;
|
|
font-weight: bold;
|
|
text-align: left;
|
|
}
|
|
.spell :is(.sheet-display, .display) button[type=roll]::before {
|
|
content: "" !important;
|
|
}
|
|
|
|
span.spellritual, span.spellconcentration {
|
|
display: none;
|
|
font-size: 8px;
|
|
font-weight: normal;
|
|
margin-top: 0px;
|
|
color: white;
|
|
background-color: black;
|
|
position: absolute;
|
|
width: 10px;
|
|
height: 10px;
|
|
top: 0px;
|
|
line-height: 10px;
|
|
}
|
|
|
|
.spellicon_flag:not([value=none]) + .body .spell :is(.sheet-display, .display) .spellritual:not([value="0"]) ~ span.spellritual {
|
|
display: inline-block;
|
|
right: 11px;
|
|
}
|
|
.spellicon_flag:not([value=none]) + .body .spell :is(.sheet-display, .display) .spellconcentration:not([value="0"]) ~ span.spellconcentration {
|
|
border-radius: 100%;
|
|
display: inline-block;
|
|
right: 0;
|
|
}
|
|
|
|
.spell :is(.sheet-display, .display) .componentscontainer {
|
|
position: absolute;
|
|
top: 3px;
|
|
right: 0;
|
|
width: auto;
|
|
}
|
|
.spell :is(.sheet-display, .display) .v, .spell :is(.sheet-display, .display) .s, .spell :is(.sheet-display, .display) .m {
|
|
display: none;
|
|
}
|
|
|
|
.spellicon_flag[value=all] + .body .spell :is(.sheet-display, .display) input.v:not([value="0"]) ~ .componentscontainer span.v, .spellicon_flag[value=all] + .body .spell :is(.sheet-display, .display) input.s:not([value="0"]) ~ .componentscontainer span.s, .spellicon_flag[value=all] + .body .spell :is(.sheet-display, .display) input.m:not([value="0"]) ~ .componentscontainer span.m {
|
|
display: inline;
|
|
width: initial;
|
|
font-size: 8px;
|
|
}
|
|
|
|
.spell :is(.sheet-display, .display) input[type=text] {
|
|
font-size: 12px;
|
|
line-height: 12px;
|
|
cursor: pointer;
|
|
text-align: left;
|
|
padding: none;
|
|
margin: none;
|
|
background-color: transparent;
|
|
color: var(--eg-text);
|
|
border: none;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
width: 100%;
|
|
}
|
|
.spell :is(.sheet-display, .display) span.spellname {
|
|
font-size: 12px;
|
|
text-align: left;
|
|
font-weight: normal;
|
|
margin-right: -4px;
|
|
margin-left: 4px;
|
|
display: inline;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
max-width: 220px;
|
|
}
|
|
.spell :is(.sheet-display, .display) .prep ~ span.spellname {
|
|
margin-left: 14px;
|
|
}
|
|
|
|
.repcontrol {
|
|
min-height: 27px;
|
|
}
|
|
.repcontrol .btn {
|
|
border: medium none;
|
|
/* Hide the default Roll20 "Add"/"Modify" button text by size, not color. The old
|
|
'color: white' hid it only on the light background - in dark mode the white text
|
|
became visible. font-size:0 hides it in both modes; the +/lock icons set their
|
|
own font-size on ::before/::after so they stay visible. */
|
|
font-size: 0 !important;
|
|
background: none;
|
|
box-shadow: none;
|
|
}
|
|
.repcontrol .btn:focus {
|
|
outline: 0;
|
|
}
|
|
|
|
.saving-throw-container .repcontrol .repcontrol_edit, .saving-throw-container .repcontrol .repcontrol_add {
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.repcontrol .repcontrol_edit:after {
|
|
content: "(";
|
|
visibility: visible;
|
|
font-family: pictos;
|
|
background-color: var(--eg-bg);
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 2px;
|
|
font-size: 12px;
|
|
height: 12px;
|
|
width: 12px;
|
|
padding: 2px 4px 2px 4px;
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.editmode ~ .repcontrol .repcontrol_edit:after {
|
|
content: ")";
|
|
}
|
|
|
|
.repcontrol .repcontrol_add:before {
|
|
content: "&";
|
|
visibility: visible;
|
|
font-family: pictos;
|
|
background-color: var(--eg-bg);
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 2px;
|
|
font-size: 12px;
|
|
height: 12px;
|
|
width: 12px;
|
|
padding: 2px 4px 2px 4px;
|
|
color: var(--eg-text);
|
|
}
|
|
.repcontrol .repcontrol_edit:hover:after, .repcontrol .repcontrol_add:hover:before {
|
|
background-color: var(--eg-bg-alt);
|
|
}
|
|
|
|
.resources .repcontrol {
|
|
margin-top: -10px;
|
|
}
|
|
|
|
.itemcontrol {
|
|
z-index: 10;
|
|
}
|
|
.itemcontrol .repcontrol_del, .itemcontrol .repcontrol_move {
|
|
font-size: 10px;
|
|
margin-top: 3px;
|
|
padding: 0px;
|
|
height: 18px;
|
|
width: 18px;
|
|
}
|
|
|
|
.tool :is(.sheet-options, .options), .attack :is(.sheet-options, .options), .spell :is(.sheet-options, .options), .proficiencies :is(.sheet-options, .options), .traits :is(.sheet-options, .options), .global-mod :is(.sheet-options, .options) {
|
|
padding-left: 5px;
|
|
}
|
|
|
|
.tool :is(.sheet-options, .options) span, .attack :is(.sheet-options, .options) span, .spell :is(.sheet-options, .options) span, :is(.sheet-options, .options) .body span, .settings-modal-body span, .proficiencies :is(.sheet-options, .options) span, .traits :is(.sheet-options, .options) span, .global-mod :is(.sheet-options, .options) span {
|
|
width: initial;
|
|
display: inline-block;
|
|
text-align: left;
|
|
}
|
|
/* Settings section headers: flex the box so the .title row can float to the top, styled like the sheet's section headers (blue Oxanium + gold underline) */
|
|
.settings-modal-body :is(.class_options, .skill_options, .attribute_options, .save_options, .general_options) {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.charsheet .settings-modal-body :is(.sheet-row, .row).title {
|
|
order: -1;
|
|
width: auto;
|
|
margin: -5px -5px 6px -5px;
|
|
padding: 4px 8px 3px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
border-radius: 4px 4px 0 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.settings-modal-body :is(.sheet-row, .row).title span {
|
|
display: block;
|
|
text-align: center;
|
|
width: 100%;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-weight: bold;
|
|
font-size: 10px;
|
|
color: var(--eg-blue);
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
/* Dynamic class name in the CLASS OPTIONS header: match the header so it stays on one line */
|
|
.settings-modal-body :is(.sheet-row, .row).title span span {
|
|
display: inline;
|
|
width: auto;
|
|
font-size: inherit;
|
|
font-family: inherit;
|
|
font-weight: inherit;
|
|
text-transform: inherit;
|
|
}
|
|
|
|
/* Breathing room between a setting's label and its control (both label-before-input and checkbox-before-label rows) */
|
|
.settings-modal-body :is(.sheet-row, .row):not(.title) > span {
|
|
margin-right: 6px;
|
|
}
|
|
.settings-modal-body :is(.sheet-row, .row):not(.title) > input[type=checkbox] {
|
|
margin-right: 6px;
|
|
}
|
|
/* Skill Options rows lead with the Normal/Expertise select; space it off the skill name */
|
|
.settings-modal-body .skill > select {
|
|
margin-right: 6px;
|
|
}
|
|
|
|
.tool :is(.sheet-options, .options) input, .attack :is(.sheet-options, .options) input[type=text], .spell :is(.sheet-options, .options) input[type=text], :is(.sheet-options, .options) .body input[type=text], .settings-modal-body input[type=text], .settings-modal-body input[type=number], .proficiencies :is(.sheet-options, .options) input[type=text], .traits :is(.sheet-options, .options) input[type=text], .global-mod :is(.sheet-options, .options) input[type=text] {
|
|
display: inline-block;
|
|
text-align: left;
|
|
font-size: 12px;
|
|
border-bottom: 1px solid var(--eg-border);
|
|
padding: 0px;
|
|
width: initial;
|
|
}
|
|
|
|
.tool :is(.sheet-options, .options) select, .attack :is(.sheet-options, .options) select, .spell :is(.sheet-options, .options) select, :is(.sheet-options, .options) .body select, .settings-modal-body select, .proficiencies :is(.sheet-options, .options) select, .traits :is(.sheet-options, .options) select {
|
|
border-bottom: 1px solid var(--eg-border);
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
width: initial;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
line-height: 18px;
|
|
height: 18px;
|
|
}
|
|
|
|
.tool :is(.sheet-options, .options) input[type=checkbox], .attack :is(.sheet-options, .options) input[type=checkbox], .spell :is(.sheet-options, .options) input[type=checkbox], :is(.sheet-options, .options) .body input[type=checkbox], .settings-modal-body input[type=checkbox], .npc .npc_options input[type=checkbox], .proficiencies :is(.sheet-options, .options) input[type=checkbox], .traits :is(.sheet-options, .options) input[type=checkbox], .global-mod :is(.sheet-options, .options) input[type=checkbox] {
|
|
width: 13px;
|
|
font-size: initial;
|
|
-webkit-appearance: checkbox;
|
|
-moz-appearance: checkbox;
|
|
}
|
|
|
|
.attack :is(.sheet-options, .options) input[type=text].num, :is(.sheet-options, .options) input[type=text].num, .settings-modal-body input[type=text].num {
|
|
width: 15px;
|
|
text-align: center;
|
|
}
|
|
|
|
.spell :is(.sheet-options, .options) textarea {
|
|
width: calc(100% - 10px);
|
|
resize: vertical;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.spell-container {
|
|
min-height: 60px;
|
|
margin-bottom: 1px;
|
|
}
|
|
.spell-container input[name=attr_spellcastingtime] {
|
|
width: 168px;
|
|
}
|
|
.spell-container input[name=attr_spellrange] {
|
|
width: 201px;
|
|
}
|
|
.spell-container input[name=attr_spelltarget] {
|
|
width: 199px;
|
|
}
|
|
.spell-container .spell :is(.sheet-options, .options) input[name=attr_spellcomp_materials] {
|
|
margin-left: 17px;
|
|
width: 223px;
|
|
}
|
|
.spell-container input[name=attr_spellduration] {
|
|
width: 186px;
|
|
}
|
|
|
|
:is(.sheet-options, .options) :is(.sheet-row, .row) {
|
|
display: block;
|
|
width: 100%;
|
|
}
|
|
/* Settings modal boxes are `.class_options` etc. (not `.options`), so the rule
|
|
above doesn't match them and the rows fell through to Roll20's platform
|
|
`.charsheet .row` (negative margin). Override it, modal-scoped. */
|
|
.charsheet .settings-modal-body :is(.sheet-row, .row) {
|
|
display: block;
|
|
width: 100%;
|
|
margin: 0;
|
|
}
|
|
/* Even columns: min-width:0 lets long labels wrap so all three share width
|
|
equally (flex items default to min-width:auto, which held col1/col3 wider). */
|
|
.charsheet .settings-modal-body .col {
|
|
min-width: 0;
|
|
}
|
|
:is(.sheet-options, .options) .title {
|
|
text-align: center;
|
|
}
|
|
:is(.sheet-options, .options) .title input[type=text] {
|
|
width: 82px;
|
|
border: none;
|
|
text-align: center;
|
|
color: var(--eg-text-faint);
|
|
}
|
|
|
|
.class_options, .skill_options {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
padding: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.general_options {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
padding: 5px;
|
|
margin-bottom: 5px;
|
|
position: relative;
|
|
}
|
|
|
|
.hlabel-container .showing, .hlabel-container .hiding {
|
|
display: none;
|
|
}
|
|
|
|
.header .showing, .header input[value="1"]:is(.sheet-flag, .flag) ~ .hiding {
|
|
display: none;
|
|
}
|
|
|
|
.hlabel-container input[value="1"]:is(.sheet-flag, .flag) ~ .showing, .hlabel-container input[value="0"]:is(.sheet-flag, .flag) ~ .hiding {
|
|
display: inline-block;
|
|
}
|
|
|
|
.header input[value="1"]:is(.sheet-flag, .flag) ~ .showing {
|
|
display: inline-block;
|
|
}
|
|
|
|
:is(.sheet-options, .options) :is(.sheet-row, .row) > span {
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.spell .details-flag {
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 23px;
|
|
width: 18px;
|
|
height: 18px !important;
|
|
opacity: 0;
|
|
z-index: 5;
|
|
}
|
|
.spell .details-flag + span {
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 23px;
|
|
width: 18px;
|
|
height: 18px;
|
|
white-space: nowrap;
|
|
font-size: 20px;
|
|
font-family: pictos;
|
|
color: var(--eg-text-faint);
|
|
cursor: pointer;
|
|
margin-top: 0px;
|
|
display: none;
|
|
line-height: 18px;
|
|
}
|
|
.spell .options-flag {
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 23px;
|
|
width: 18px;
|
|
height: 18px;
|
|
opacity: 0;
|
|
z-index: 2;
|
|
}
|
|
.spell .options-flag + span {
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 23px;
|
|
width: 18px;
|
|
height: 18px;
|
|
white-space: nowrap;
|
|
font-size: 20px;
|
|
font-family: pictos;
|
|
color: var(--eg-text-faint);
|
|
cursor: pointer;
|
|
margin-top: 0px;
|
|
}
|
|
.spell .details button.spell_link {
|
|
float: right;
|
|
border: none;
|
|
background: none;
|
|
color: var(--eg-text-faint);
|
|
}
|
|
.spell .details button.spell_link::before {
|
|
content: "|";
|
|
}
|
|
.spell .details button.spell_link:hover {
|
|
color: var(--eg-text);
|
|
}
|
|
.spell .details-flag:checked + span {
|
|
display: block;
|
|
color: var(--eg-text);
|
|
}
|
|
.spell:hover .details-flag + span {
|
|
display: block;
|
|
}
|
|
.spell .details-flag:not(:checked) ~ .details {
|
|
display: none;
|
|
}
|
|
.spell .details-flag:checked ~ .details {
|
|
display: block;
|
|
}
|
|
.spell .details {
|
|
margin: 15px 10px;
|
|
}
|
|
.spell :is(.sheet-options, .options) {
|
|
margin: 15px 10px;
|
|
padding: 0;
|
|
overflow-x: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.spell .details span:not(.innate) {
|
|
display: inline;
|
|
font-weight: normal;
|
|
}
|
|
.spell .details span.bold {
|
|
font-weight: bold;
|
|
}
|
|
.spell .details .italics {
|
|
font-style: italic;
|
|
}
|
|
.spell .details input[type=checkbox] {
|
|
display: none;
|
|
}
|
|
.spell .details input[type=checkbox] + span {
|
|
display: none;
|
|
}
|
|
.spell .details input[type=checkbox]:checked + span {
|
|
display: inline;
|
|
}
|
|
.spell .details input[type=checkbox]:checked ~ input[type=checkbox]:checked + span::before {
|
|
content: ", ";
|
|
}
|
|
.spell .details span[name=attr_spellname] {
|
|
font-family: "Source Sans Pro", "Varta", arial, sans-serif;
|
|
font-size: 16px;
|
|
text-transform: capitalize;
|
|
font-variant: small-caps;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
}
|
|
.spell .details input[name=attr_spellcomp_materials][value=""] + span, .spell .details input[name=attr_spellathigherlevels][value=""] + div {
|
|
display: none;
|
|
}
|
|
.spell :is(.sheet-display, .display) {
|
|
position: relative;
|
|
}
|
|
.spell .prep {
|
|
width: 10px;
|
|
height: 10px;
|
|
border-radius: 50%;
|
|
position: absolute;
|
|
top: 0px;
|
|
border: 1px solid var(--eg-text);
|
|
}
|
|
.spell input[type=checkbox]:checked ~ span.prep {
|
|
background-color: #066dce;
|
|
}
|
|
.spell .sheet-prep-box {
|
|
-webkit-appearance: checkbox;
|
|
-moz-appearance: checkbox;
|
|
opacity: 0;
|
|
z-index: 2;
|
|
position: relative;
|
|
width: 12px;
|
|
}
|
|
|
|
.charsheet .spell :is(.sheet-display, .display) button[type=roll].powercard {
|
|
width: calc(100% - 18px);
|
|
}
|
|
|
|
.rolltemplates {
|
|
display: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg, .sheet-rolltemplate-atk, .sheet-rolltemplate-simple, .sheet-rolltemplate-atkdmg {
|
|
width: 14em;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-container, .sheet-rolltemplate-atk .sheet-container, .sheet-rolltemplate-atkdmg .sheet-container.sheet-atk {
|
|
background-color: var(--eg-bg);
|
|
border: 1px solid var(--eg-text);
|
|
color: var(--eg-text);
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-atk, .sheet-rolltemplate-dmg .sheet-container {
|
|
background-color: var(--eg-bg);
|
|
border: 1px solid var(--eg-text);
|
|
color: var(--eg-text);
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-container.sheet-damagetemplate {
|
|
background-color: var(--eg-bg);
|
|
border: 1px solid var(--eg-text);
|
|
color: var(--eg-text);
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-container {
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-container, .sheet-rolltemplate-atkdmg .sheet-container.sheet-atk {
|
|
border-top-left-radius: 0.8em;
|
|
border-top-right-radius: 0.8em;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-atk {
|
|
border-top-left-radius: 0.8em;
|
|
border-top-right-radius: 0.8em;
|
|
}
|
|
.sheet-rolltemplate-dmg .sheet-container {
|
|
border-bottom-left-radius: 0.8em;
|
|
border-bottom-right-radius: 0.8em;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-container.sheet-damagetemplate {
|
|
border-bottom-left-radius: 0.8em;
|
|
border-bottom-right-radius: 0.8em;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-damagetemplate .sheet-result {
|
|
min-height: 45px;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-damagetemplate .sheet-result {
|
|
min-height: 45px;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-adv, .sheet-rolltemplate-atk .sheet-adv, .sheet-rolltemplate-atkdmg .sheet-adv, .sheet-rolltemplate-dmg .sheet-adv {
|
|
display: inline-block;
|
|
margin-top: 1em;
|
|
text-align: center;
|
|
vertical-align: top;
|
|
width: 45%;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-adv:first-child, .sheet-rolltemplate-atk .sheet-adv:first-child, .sheet-rolltemplate-atkdmg .sheet-adv:first-child, .sheet-rolltemplate-dmg .sheet-adv:first-child {
|
|
margin-left: 0.2em;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-adv:nth-child(3), .sheet-rolltemplate-atk .sheet-adv:nth-child(3), .sheet-rolltemplate-atkdmg .sheet-adv:nth-child(3), .sheet-rolltemplate-dmg .sheet-adv:nth-child(3) {
|
|
margin-right: 8px;
|
|
margin-left: -3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-adv span, .sheet-rolltemplate-simple .sheet-solo span {
|
|
background-color: transparent;
|
|
border: 0px;
|
|
font-size: 1.2em;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-adv span, .sheet-rolltemplate-atk .sheet-solo span {
|
|
background-color: transparent;
|
|
border: 0px;
|
|
font-size: 1.2em;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-adv span, .sheet-rolltemplate-atkdmg .sheet-solo span {
|
|
background-color: transparent;
|
|
border: 0px;
|
|
font-size: 1.2em;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-adv span, .sheet-rolltemplate-dmg .sheet-solo span {
|
|
background-color: transparent;
|
|
border: 0px;
|
|
font-size: 1.2em;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-advspacer, .sheet-rolltemplate-atk .sheet-advspacer, .sheet-rolltemplate-atkdmg .sheet-advspacer, .sheet-rolltemplate-dmg .sheet-advspacer {
|
|
border: 1px solid var(--eg-text);
|
|
display: inline-block;
|
|
height: 35px;
|
|
width: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-solo, .sheet-rolltemplate-atk .sheet-solo, .sheet-rolltemplate-atkdmg .sheet-solo, .sheet-rolltemplate-dmg .sheet-solo {
|
|
height: auto;
|
|
padding-bottom: 0.5em;
|
|
padding-top: 1em;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple span, .sheet-rolltemplate-atk span, .sheet-rolltemplate-atkdmg span, .sheet-rolltemplate-dmg span, .sheet-rolltemplate-desc span {
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
line-height: 12px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-desc span.sheet-plus, .sheet-rolltemplate-atkdmg .sheet-desc span.sheet-plus {
|
|
display: inline;
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-grey {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-simple .sheet-grey .inlinerollresult.fullcrit, .sheet-rolltemplate-simple .sheet-grey .inlinerollresult.fullfail, .sheet-rolltemplate-simple .sheet-grey .inlinerollresult.importantroll {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-simple .sheet-label span span {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-label span span {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-atk .sheet-grey {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-atk .sheet-grey .inlinerollresult.fullcrit, .sheet-rolltemplate-atk .sheet-grey .inlinerollresult.fullfail, .sheet-rolltemplate-atk .sheet-grey .inlinerollresult.importantroll {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-label span span {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-atkdmg .sheet-grey {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-atkdmg .sheet-grey .inlinerollresult.fullcrit, .sheet-rolltemplate-atkdmg .sheet-grey .inlinerollresult.fullfail, .sheet-rolltemplate-atkdmg .sheet-grey .inlinerollresult.importantroll {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-label span span {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-dmg .sheet-grey {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-dmg .sheet-grey .inlinerollresult.fullcrit, .sheet-rolltemplate-dmg .sheet-grey .inlinerollresult.fullfail, .sheet-rolltemplate-dmg .sheet-grey .inlinerollresult.importantroll {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .sheet-grey {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-npc .sheet-grey .inlinerollresult.fullcrit, .sheet-rolltemplate-npc .sheet-grey .inlinerollresult.fullfail, .sheet-rolltemplate-npc .sheet-grey .inlinerollresult.importantroll {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.sheet-rolltemplate-npcaction .sheet-grey {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-npcaction .sheet-grey .inlinerollresult.fullcrit, .sheet-rolltemplate-npcaction .sheet-grey .inlinerollresult.fullfail, .sheet-rolltemplate-npcaction .sheet-grey .inlinerollresult.importantroll {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.sheet-rolltemplate-npcatk .sheet-grey {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
.sheet-rolltemplate-npcatk .sheet-grey .inlinerollresult.fullcrit, .sheet-rolltemplate-npcatk .sheet-grey .inlinerollresult.fullfail, .sheet-rolltemplate-npcatk .sheet-grey .inlinerollresult.importantroll {
|
|
color: var(--eg-text-faint);
|
|
border: 0px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-label, .sheet-rolltemplate-atk .sheet-label, .sheet-rolltemplate-atkdmg .sheet-label, .sheet-rolltemplate-dmg .sheet-label {
|
|
margin-top: -3px;
|
|
padding: 0.25em;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-label span span, .sheet-rolltemplate-atk .sheet-label span span, .sheet-rolltemplate-atkdmg .sheet-label span span, .sheet-rolltemplate-dmg .sheet-label span span {
|
|
padding: 0px;
|
|
border: 0px;
|
|
background-color: transparent;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .inlinerollresult.fullcrit, .sheet-rolltemplate-atk .inlinerollresult.fullcrit, .sheet-rolltemplate-atkdmg .inlinerollresult.fullcrit, .sheet-rolltemplate-dmg .inlinerollresult.fullcrit {
|
|
color: #3FB315;
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .inlinerollresult.fullfail, .sheet-rolltemplate-atk .inlinerollresult.fullfail, .sheet-rolltemplate-atkdmg .inlinerollresult.fullfail, .sheet-rolltemplate-dmg .inlinerollresult.fullfail {
|
|
color: #B31515;
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .inlinerollresult.importantroll, .sheet-rolltemplate-atk .inlinerollresult.importantroll, .sheet-rolltemplate-atkdmg .inlinerollresult.importantroll, .sheet-rolltemplate-dmg .inlinerollresult.importantroll {
|
|
color: #4A57ED;
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-damagetemplate .inlinerollresult.fullcrit, .sheet-rolltemplate-atkdmg .sheet-damagetemplate .inlinerollresult.fullfail, .sheet-rolltemplate-atkdmg .sheet-damagetemplate .inlinerollresult.importantroll {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-damagetemplate .inlinerollresult.fullcrit, .sheet-rolltemplate-dmg .sheet-damagetemplate .inlinerollresult.fullfail, .sheet-rolltemplate-dmg .sheet-damagetemplate .inlinerollresult.importantroll {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-npcaction .sheet-damagetemplate .inlinerollresult.fullcrit, .sheet-rolltemplate-npcaction .sheet-damagetemplate .inlinerollresult.fullfail, .sheet-rolltemplate-npcaction .sheet-damagetemplate .inlinerollresult.importantroll {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-npcdmg .sheet-damagetemplate .inlinerollresult.fullcrit, .sheet-rolltemplate-npcdmg .sheet-damagetemplate .inlinerollresult.fullfail, .sheet-rolltemplate-npcdmg .sheet-damagetemplate .inlinerollresult.importantroll {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-desc .inlinerollresult.fullcrit, .sheet-rolltemplate-atkdmg .sheet-desc .inlinerollresult.importantroll, .sheet-rolltemplate-atkdmg .sheet-desc .inlinerollresult.fullfail {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-desc .inlinerollresult.fullcrit, .sheet-rolltemplate-dmg .sheet-desc .inlinerollresult.importantroll, .sheet-rolltemplate-dmg .sheet-desc .inlinerollresult.fullfail .sheet-rolltemplate-atk .sheet-desc .inlinerollresult.fullcrit {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-desc .inlinerollresult.importantroll, .sheet-rolltemplate-atk .sheet-desc .inlinerollresult.fullfail {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerroll .inlinerollresult.fullcrit, .sheet-rolltemplate-mancerroll .inlinerollresult.importantroll, .sheet-rolltemplate-mancerroll .inlinerollresult.fullfail {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerhproll .inlinerollresult.fullcrit, .sheet-rolltemplate-mancerhproll .inlinerollresult.importantroll, .sheet-rolltemplate-mancerhproll .inlinerollresult.fullfail {
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-save .sheet-savedc, .sheet-rolltemplate-dmg .sheet-save .sheet-savedc, .sheet-rolltemplate-atkdmg .sheet-save .sheet-savedc {
|
|
padding-bottom: 5px;
|
|
padding-top: 15px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-save .sheet-savedc span, .sheet-rolltemplate-dmg .sheet-save .sheet-savedc span, .sheet-rolltemplate-atkdmg .sheet-save .sheet-savedc span {
|
|
font-size: 15px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-save .sheet-label span, .sheet-rolltemplate-dmg .sheet-save .sheet-label span, .sheet-rolltemplate-atkdmg .sheet-save .sheet-label span {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-desc .inlinerollresult, .sheet-rolltemplate-atkdmg .sheet-desc .inlinerollresult, .sheet-rolltemplate-atk .sheet-desc .inlinerollresult, .sheet-rolltemplate-mancerroll .inlinerollresult, .sheet-rolltemplate-mancerhproll .inlinerollresult, .sheet-rolltemplate-atk .sheet-save .inlinerollresult, .sheet-rolltemplate-dmg .sheet-save .inlinerollresult, .sheet-rolltemplate-atkdmg .sheet-save .inlinerollresult {
|
|
background-color: transparent;
|
|
border: 0px;
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-save .inlinerollresult, .sheet-rolltemplate-dmg .sheet-save .inlinerollresult, .sheet-rolltemplate-atkdmg .sheet-save .inlinerollresult {
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-desc .inlinerollresult, .sheet-rolltemplate-atkdmg .sheet-desc .inlinerollresult, .sheet-rolltemplate-atk .sheet-desc .inlinerollresult, .sheet-rolltemplate-mancerroll .inlinerollresult, .sheet-rolltemplate-mancerhproll .inlinerollresult {
|
|
font-size: 20px;
|
|
padding-bottom: 6px;
|
|
padding-top: 10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-desc .sheet-label span, .sheet-rolltemplate-atkdmg .sheet-desc .sheet-label span {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-save span, .sheet-rolltemplate-dmg .sheet-save span, .sheet-rolltemplate-atkdmg .sheet-save span {
|
|
font-weight: normal;
|
|
line-height: 12px;
|
|
display: block;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-save span.sheet-bold, .sheet-rolltemplate-dmg .sheet-save span.sheet-bold, .sheet-rolltemplate-atkdmg .sheet-save span.sheet-bold {
|
|
font-weight: bold;
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-sublabel, .sheet-rolltemplate-atkdmg .sheet-sublabel, .sheet-rolltemplate-dmg .sheet-sublabel {
|
|
text-align: center;
|
|
font-style: italic;
|
|
margin-top: -2px;
|
|
min-height: 17px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-desc, .sheet-rolltemplate-atkdmg .sheet-desc, .sheet-rolltemplate-dmg .sheet-desc, .sheet-rolltemplate-desc .sheet-desc {
|
|
background-color: var(--eg-bg);
|
|
border: 1px solid var(--eg-text);
|
|
color: var(--eg-text);
|
|
padding-bottom: 5px;
|
|
padding-top: 5px;
|
|
text-align: center;
|
|
width: 81%;
|
|
}
|
|
|
|
/* *Fix for Global Damage Modifier
|
|
* *By Miguel */
|
|
.sheet-rolltemplate-dmg .sheet-desc {
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-desc span, .sheet-rolltemplate-atkdmg .sheet-desc span, .sheet-rolltemplate-dmg .sheet-desc span, .sheet-rolltemplate-desc .sheet-desc span {
|
|
font-weight: normal;
|
|
line-height: 12px;
|
|
display: block;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-info span, .sheet-rolltemplate-atkdmg .sheet-info span, .sheet-rolltemplate-dmg .sheet-info span {
|
|
text-align: left;
|
|
padding: 0px 5px 0px 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-info .inlinerollresult, .sheet-rolltemplate-atkdmg .sheet-info .inlinerollresult, .sheet-rolltemplate-dmg .sheet-info .inlinerollresult {
|
|
font-size: inherit;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-damagetemplate .sheet-sublabel, .sheet-rolltemplate-dmg .sheet-damagetemplate .sheet-sublabel, .sheet-rolltemplate-atkdmg .sheet-desc .sheet-sublabel, .sheet-rolltemplate-dmg .sheet-desc .sheet-sublabel {
|
|
color: var(--eg-text-faint);
|
|
display: block;
|
|
font-size: 10px;
|
|
font-weight: normal;
|
|
margin-top: -5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-sublabel span, .sheet-rolltemplate-atkdmg .sheet-sublabel span, .sheet-rolltemplate-dmg .sheet-sublabel span {
|
|
font-weight: normal;
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.sheet-rolltemplate-atk .sheet-spacer, .sheet-rolltemplate-atkdmg .sheet-spacer, .sheet-rolltemplate-dmg .sheet-spacer {
|
|
height: 10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-atk a[href^="~"] {
|
|
background-color: transparent;
|
|
padding: 0px;
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
.sheet-rolltemplate-atk a:hover {
|
|
color: #4aa3ec;
|
|
}
|
|
.sheet-rolltemplate-atk a[href^="~"]:visited {
|
|
pointer-events: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-spell .sheet-container {
|
|
background: url("https://raw.githubusercontent.com/skydawn1/esper_genesis/master/EG-powerbg.jpg") center center;
|
|
background-repeat: repeat;
|
|
background-size: auto;
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 5px;
|
|
color: var(--eg-text);
|
|
font-family: "Source Sans Pro", "Varta", arial, sans-serif;
|
|
margin-left: -3em;
|
|
padding: 0.5em;
|
|
width: 19em;
|
|
}
|
|
|
|
.withoutavatars .sheet-rolltemplate-spell .sheet-container {
|
|
margin-left: -15px;
|
|
}
|
|
|
|
.sheet-rolltemplate-spell .sheet-row {
|
|
display: block;
|
|
}
|
|
.sheet-rolltemplate-spell .sheet-title {
|
|
color: #a88138;
|
|
font-weight: bold;
|
|
font-size: 1.2em;
|
|
}
|
|
.sheet-rolltemplate-spell .sheet-italics {
|
|
font-style: italic;
|
|
}
|
|
|
|
.npc .italics {
|
|
font-style: italic;
|
|
}
|
|
|
|
.sheet-rolltemplate-spell .sheet-bold, .actions .bold {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-spell .sheet-spacer {
|
|
height: 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerroll .sheet-container, .sheet-rolltemplate-mancerhproll .sheet-container {
|
|
width: 200px;
|
|
color: var(--eg-text);
|
|
background-color: var(--eg-bg);
|
|
border: 1px solid var(--eg-text);
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerroll .sheet-row, .sheet-rolltemplate-mancerhproll .sheet-row {
|
|
border-bottom: 1px dotted var(--eg-text);
|
|
padding: 4px;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerroll .sheet-row.sheet-header, .sheet-rolltemplate-mancerhproll .sheet-row.sheet-header {
|
|
border-bottom: 1px solid var(--eg-text);
|
|
font-size: 1.2em;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerroll .sheet-row.sheet-header span span, .sheet-rolltemplate-mancerhproll .sheet-row.sheet-header span span {
|
|
float: right;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerroll .sheet-row.sheet-header .inlinerollresult, .sheet-rolltemplate-mancerhproll .sheet-row.sheet-header .inlinerollresult {
|
|
padding: 0;
|
|
font-size: inherit;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerroll .sheet-desc {
|
|
font-size: 1.2em;
|
|
font-style: italic;
|
|
margin-left: 4px;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerhproll .sheet-desc {
|
|
font-size: 1.2em;
|
|
font-style: italic;
|
|
margin-left: 4px;
|
|
display: inline-block;
|
|
margin-left: 5%;
|
|
width: 50%;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerroll .sheet-result {
|
|
margin-left: 80px;
|
|
}
|
|
.sheet-rolltemplate-mancerroll .sheet-result .inlinerollresult {
|
|
width: 50px;
|
|
text-align: right;
|
|
}
|
|
|
|
.sheet-rolltemplate-mancerhproll .sheet-result .inlinerollresult {
|
|
width: 50px;
|
|
text-align: right;
|
|
}
|
|
|
|
.triangleold {
|
|
border-top: 3px solid transparent;
|
|
border-bottom: 3px solid transparent;
|
|
border-left: 360px solid var(--eg-blue);
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.triangle {
|
|
border: 1px solid var(--eg-blue);
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.red {
|
|
color: var(--eg-blue);
|
|
}
|
|
|
|
.npc :is(.sheet-display, .display) .red input, .npc :is(.sheet-display, .display) .red span {
|
|
color: var(--eg-blue);
|
|
}
|
|
.npc :is(.sheet-display, .display) .red input:first-child, .npc :is(.sheet-display, .display) .red span:first-child {
|
|
margin-right: 3px;
|
|
}
|
|
.npc .npc_options {
|
|
border-bottom: 2px dashed gold;
|
|
}
|
|
.npc .npc_options input {
|
|
border-bottom: 1px solid var(--eg-border);
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
width: 200px;
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
padding: 0px;
|
|
}
|
|
.npc .npc_options span {
|
|
display: inline-block;
|
|
font-size: 9px;
|
|
line-height: 12px;
|
|
text-align: left;
|
|
font-weight: bold;
|
|
margin-right: 6px;
|
|
}
|
|
.npc .npc_options .title span {
|
|
text-align: center;
|
|
font-size: 14px;
|
|
display: block;
|
|
margin-top: 5px;
|
|
}
|
|
.npc input[type=text].num {
|
|
width: 20px;
|
|
text-align: center;
|
|
}
|
|
.npc .col {
|
|
width: calc(33% - 5px);
|
|
}
|
|
.npc .spacer {
|
|
height: 5px;
|
|
}
|
|
.npc select {
|
|
border-bottom: 1px solid var(--eg-border);
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
line-height: inherit;
|
|
}
|
|
.npc :is(.sheet-display, .display) input, .npc .reaction input {
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
margin: 0px;
|
|
pointer-events: none;
|
|
padding: 0px;
|
|
height: 16px;
|
|
line-height: 16px;
|
|
margin-top: -2px;
|
|
}
|
|
.npc :is(.sheet-display, .display) .title span {
|
|
font-family: "Source Sans Pro", "Varta", arial, sans-serif;
|
|
font-size: 24px;
|
|
width: 100%;
|
|
text-transform: capitalize;
|
|
font-variant: small-caps;
|
|
font-weight: bold;
|
|
display: block;
|
|
text-align: left;
|
|
line-height: 27px;
|
|
}
|
|
.npc :is(.sheet-display, .display) .subtitle span {
|
|
font-size: 12px;
|
|
}
|
|
.npc :is(.sheet-display, .display) .num3 {
|
|
width: 27px;
|
|
text-align: center;
|
|
margin-right: 0px;
|
|
}
|
|
.npc :is(.sheet-display, .display) .actype + .parens {
|
|
display: none;
|
|
}
|
|
.npc :is(.sheet-display, .display) .actype:not([value=""]) + .parens {
|
|
display: inline;
|
|
}
|
|
.npc :is(.sheet-display, .display) .parens {
|
|
margin-left: 0px;
|
|
font-size: 13px;
|
|
font-weight: normal;
|
|
}
|
|
.npc :is(.sheet-display, .display) .parens:before {
|
|
content: " (";
|
|
}
|
|
.npc :is(.sheet-display, .display) .parens.xp:before {
|
|
content: " (";
|
|
}
|
|
.npc :is(.sheet-display, .display) .parens:after {
|
|
content: ")";
|
|
}
|
|
.npc :is(.sheet-display, .display) .parens.xp:after {
|
|
content: " XP)";
|
|
}
|
|
.npc :is(.sheet-display, .display) span.npc-init-die {
|
|
font-family: "dicefontd20";
|
|
font-size: 16px;
|
|
display: block;
|
|
}
|
|
.npc :is(.sheet-attr-container, .attr-container) {
|
|
width: 55px;
|
|
border: 0px;
|
|
border-radius: 0px;
|
|
position: relative;
|
|
padding: 5px 0px 5px 0px;
|
|
margin: 0px;
|
|
height: inherit;
|
|
display: inline-block;
|
|
text-align: center;
|
|
}
|
|
.npc :is(.sheet-attr-container, .attr-container) span {
|
|
font-size: 13px;
|
|
font-weight: normal;
|
|
display: inline;
|
|
margin-bottom: 2px;
|
|
}
|
|
.npc :is(.sheet-attr-container, .attr-container) span.bold {
|
|
display: block;
|
|
}
|
|
.npc span.bold, .npc .action button span.bold {
|
|
font-weight: bold;
|
|
}
|
|
.npc :is(.sheet-attr-container, .attr-container) input {
|
|
width: 20px;
|
|
text-align: center;
|
|
}
|
|
.npc :is(.sheet-attr-container, .attr-container) input:nth-child(3) {
|
|
width: 30px;
|
|
margin-left: -5px;
|
|
}
|
|
.npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="0"] + button, .npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="0"] + div {
|
|
display: none;
|
|
}
|
|
.npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value=""] + button, .npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value=""] + div {
|
|
display: none;
|
|
}
|
|
.npc :is(.sheet-display, .display) .status {
|
|
display: none;
|
|
}
|
|
.npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value]:not([value=""]) + div {
|
|
display: block;
|
|
}
|
|
.npc button[type=roll] {
|
|
width: auto;
|
|
white-space: nowrap;
|
|
}
|
|
.npc button[type=roll] input {
|
|
border: none;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
border-radius: 0px;
|
|
color: var(--eg-text);
|
|
margin: 0px;
|
|
pointer-events: none;
|
|
padding: 0px;
|
|
height: 16px;
|
|
line-height: 16px;
|
|
}
|
|
.npc .saving button[type=roll] span, .npc .skills button[type=roll] span {
|
|
font-size: 13px;
|
|
font-weight: normal;
|
|
width: auto;
|
|
display: inline-block;
|
|
line-height: 16px;
|
|
height: 16px;
|
|
vertical-align: bottom;
|
|
}
|
|
.npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="1"] + button .spacer, .npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="2"] + button .spacer {
|
|
display: none;
|
|
}
|
|
.npc :is(.sheet-display, .display) button input {
|
|
width: 14px;
|
|
text-align: center;
|
|
}
|
|
.npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="1"] + button .stat::before, .npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="2"] + button .stat::before {
|
|
content: "+";
|
|
}
|
|
|
|
.ships :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="1"] + button .stat::before, .ships :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="2"] + button .stat::before {
|
|
content: "+";
|
|
}
|
|
|
|
.npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="1"] + button .stat::after, .npc :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="3"] + button .stat::after {
|
|
content: ", ";
|
|
}
|
|
|
|
.ships :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="1"] + button .stat::after, .ships :is(.sheet-display, .display) :is(.sheet-flag, .flag)[value="3"] + button .stat::after {
|
|
content: ", ";
|
|
}
|
|
|
|
.negativeflag[value="1"] + .npcattr::before {
|
|
content: " (";
|
|
}
|
|
.negativeflag[value="0"] + .npcattr::before {
|
|
content: " (+";
|
|
}
|
|
|
|
.npcattr::after {
|
|
content: ")";
|
|
}
|
|
|
|
/* --- NPC / NPC Ship display header: name, HP formula, INIT/PILOT labels --- */
|
|
/* 1. The character name sits in a full-width roll button. Roll20's reserved
|
|
::before d20-icon space pushed the name to the right, out of alignment
|
|
with the Armor Class / Hull Points body rows below. Hide the ::before
|
|
space and zero padding so the name is flush-left. */
|
|
.npc :is(.sheet-display, .display) .row.title button[type=roll] {
|
|
padding: 0px !important;
|
|
text-align: left !important;
|
|
}
|
|
.npc :is(.sheet-display, .display) .row.title button[type=roll]::before {
|
|
display: none !important;
|
|
}
|
|
/* Optically align the 24px name's larger left side-bearing with the 13px body
|
|
labels below it (the name glyph overhangs ~5px further than the smaller text). */
|
|
.npc :is(.sheet-display, .display) .row.title button[type=roll] span {
|
|
text-indent: -4px;
|
|
}
|
|
/* 2. The Hit Point / Hull Point formula "(NdN + N)" sits in a roll button whose
|
|
9px text metrics raised its baseline above the 13px HP value. Match the
|
|
button font/line metrics so the parenthetical aligns with the value. */
|
|
.npc :is(.sheet-display, .display) .row button[name=roll_npc_hpformula] {
|
|
font-size: 13px;
|
|
line-height: 13px;
|
|
vertical-align: baseline;
|
|
height: auto;
|
|
}
|
|
/* Tighten the gap between the HP value and the formula, matching the OGL sheet:
|
|
drop the leading space in the formula's "(" (scoped to HP only - the AC type
|
|
parens keep it) and pull the formula left by 2px like OGL's .parens. */
|
|
.npc :is(.sheet-display, .display) button[name=roll_npc_hpformula] .parens:before {
|
|
content: "(";
|
|
}
|
|
.npc :is(.sheet-display, .display) button[name=roll_npc_hpformula] .parens {
|
|
margin-left: -2px;
|
|
}
|
|
/* Saving Throws / Skills values sit in roll buttons inside flex rows. Two things
|
|
threw them off: (a) Roll20's roll button reserves a ::before d20-icon box (its
|
|
glyph is blanked but the box width/height remain), which pushed the value right
|
|
and skewed the button's vertical metrics; (b) EG's shared rule forces 9px text +
|
|
line-height:12px, raising the button baseline above the 13px label. Fix both:
|
|
drop the ::before box and match the HP-formula button metrics. */
|
|
.npc :is(.sheet-display, .display) .saving,
|
|
.npc :is(.sheet-display, .display) .skills {
|
|
align-items: baseline;
|
|
}
|
|
.npc :is(.sheet-display, .display) .saving button[type=roll]::before,
|
|
.npc :is(.sheet-display, .display) .skills button[type=roll]::before {
|
|
display: none !important;
|
|
}
|
|
.npc :is(.sheet-display, .display) .saving button[type=roll],
|
|
.npc :is(.sheet-display, .display) .skills button[type=roll] {
|
|
font-size: 13px;
|
|
line-height: 13px;
|
|
vertical-align: baseline;
|
|
height: auto;
|
|
width: auto;
|
|
/* Roll20 forces a left padding on roll buttons (d20-icon space) that beats
|
|
EG's plain padding:0; without !important the value TEXT is shoved ~18px
|
|
right of its button, reading as a big label-to-value gap. */
|
|
padding: 0 !important;
|
|
}
|
|
.npc :is(.sheet-display, .display) .saving button[type=roll] span,
|
|
.npc :is(.sheet-display, .display) .skills button[type=roll] span {
|
|
display: inline;
|
|
vertical-align: baseline;
|
|
line-height: 13px;
|
|
height: auto;
|
|
}
|
|
/* NPC Ship: hide the redundant disabled Piloting Bonus input - it showed a stray
|
|
value and its default text-input width shoved the bonus far to the right. The
|
|
roll button's .stat already displays the bonus right after the label. */
|
|
.npc :is(.sheet-display, .display) .npc-piloting-val {
|
|
display: none;
|
|
}
|
|
/* 3. INIT / PILOT roll-button labels (the span right after the d20 die glyph):
|
|
shrink a little and center under the die. */
|
|
.npc :is(.sheet-display, .display) button[type=roll] .npc-init-die,
|
|
.npc :is(.sheet-display, .display) button[type=roll] .npc-init-die + span {
|
|
text-align: center;
|
|
}
|
|
.npc :is(.sheet-display, .display) button[type=roll] .npc-init-die + span {
|
|
font-size: 10px !important;
|
|
line-height: 11px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.traits {
|
|
min-height: 20px;
|
|
}
|
|
|
|
.npc :is(.sheet-display, .display) .traits .trait, .npc .reaction .trait {
|
|
position: relative;
|
|
}
|
|
.npc :is(.sheet-display, .display) .traits input, .npc .reaction input {
|
|
pointer-events: initial;
|
|
font-weight: bold;
|
|
width: 100%;
|
|
}
|
|
.npc :is(.sheet-display, .display) .traits textarea, .npc .reaction textarea {
|
|
resize: vertical;
|
|
height: 36px;
|
|
min-height: 36px;
|
|
border: none;
|
|
padding: 0px;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.attack textarea {
|
|
resize: vertical;
|
|
height: 36px;
|
|
min-height: 36px;
|
|
border: none;
|
|
padding: 0px;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.npc .actiontitle, .ships .actiontitle {
|
|
border-bottom: 1px solid var(--eg-blue);
|
|
width: 100%;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.npc .actions {
|
|
min-height: 40px;
|
|
}
|
|
.npc .actions .title {
|
|
font-size: 18px;
|
|
text-transform: capitalize;
|
|
font-variant: small-caps;
|
|
line-height: inherit;
|
|
height: inherit;
|
|
margin: 0px;
|
|
}
|
|
.npc .description_flag[value="0"] + textarea, .npc .description_flag[value=""] + textarea {
|
|
display: none;
|
|
height: 36px;
|
|
min-height: 36px;
|
|
}
|
|
.npc .attack_option {
|
|
display: none;
|
|
}
|
|
.npc .attack_options[value=on] ~ .attack_option, .npc .attack_options[value="{{attack=1}}"] ~ .attack_option {
|
|
display: block;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="3"] + textarea {
|
|
height: 54px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="4"] + textarea {
|
|
height: 72px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="5"] + textarea {
|
|
height: 90px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="6"] + textarea {
|
|
height: 108px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="7"] + textarea {
|
|
height: 126px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="8"] + textarea {
|
|
height: 144px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="9"] + textarea {
|
|
height: 162px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="10"] + textarea {
|
|
height: 180px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="11"] + textarea {
|
|
height: 196px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="12"] + textarea {
|
|
height: 216px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="13"] + textarea {
|
|
height: 234px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="14"] + textarea {
|
|
height: 252px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="15"] + textarea {
|
|
height: 270px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="16"] + textarea {
|
|
height: 288px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="17"] + textarea {
|
|
height: 306px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="18"] + textarea {
|
|
height: 324px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="19"] + textarea {
|
|
height: 342px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description_flag[value="20"] + textarea {
|
|
height: 360px;
|
|
}
|
|
.npc .actions select {
|
|
width: auto;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
height: 13px;
|
|
line-height: 13px;
|
|
font-size: 13px;
|
|
}
|
|
.npc .action button[type=roll] {
|
|
width: 100%;
|
|
text-align: left;
|
|
margin-bottom: 10px;
|
|
}
|
|
.npc .action button span {
|
|
font-size: 13px;
|
|
font-weight: normal;
|
|
}
|
|
.npc .actions .wide {
|
|
width: 100%;
|
|
text-align: left;
|
|
}
|
|
.npc .actions .wide span:after {
|
|
content: ".";
|
|
}
|
|
.npc .action :is(.sheet-display, .display) .description {
|
|
white-space: normal;
|
|
color: var(--eg-text-muted);
|
|
line-height: 18px;
|
|
}
|
|
.npc .action :is(.sheet-display, .display) textarea {
|
|
border: none;
|
|
margin-bottom: 0px;
|
|
padding: 0px;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
height: 36px;
|
|
min-height: 36px;
|
|
resize: none;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.legendaryactions {
|
|
border: none;
|
|
margin-bottom: 0px;
|
|
padding: 0px;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
height: 36px;
|
|
min-height: 36px;
|
|
resize: none;
|
|
overflow: hidden;
|
|
height: 90px;
|
|
pointer-events: none;
|
|
margin-bottom: 15px;
|
|
color: var(--eg-text-muted);
|
|
}
|
|
|
|
.npcspelloptions {
|
|
display: inline-block;
|
|
margin-left: 17px;
|
|
}
|
|
|
|
.container.npc .legendary, .container.npc .reaction {
|
|
display: none;
|
|
}
|
|
|
|
.npcspell_flag[value="0"] ~ .npcspell, .npcspellcastingflag:not(:checked) ~ .npcspelloptions {
|
|
display: none;
|
|
}
|
|
|
|
.legendary_flag:not([value="0"]) ~ .legendary, .reaction_flag[value="1"] ~ .reaction {
|
|
display: block;
|
|
}
|
|
|
|
.npc .action textarea, .pc .globalattack textarea {
|
|
resize: vertical;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc, .sheet-rolltemplate-npcaction .sheet-container, .sheet-rolltemplate-npcatk, .sheet-rolltemplate-npcdmg, .sheet-rolltemplate-traits {
|
|
width: 188px;
|
|
border: 1px solid;
|
|
background-color: var(--eg-bg);
|
|
padding: 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-npcaction .sheet-container.sheet-dmgcontainer {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-npcdmg {
|
|
margin-top: -8px;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .sheet-header, .sheet-rolltemplate-npcaction .sheet-header, .sheet-rolltemplate-npcatk .sheet-header, .sheet-rolltemplate-npcdmg .sheet-header {
|
|
color: var(--eg-blue);
|
|
font-size: 18px;
|
|
text-align: left;
|
|
font-family: "Source Sans Pro", "Varta", arial, sans-serif;
|
|
font-variant: small-caps;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-traits .sheet-header {
|
|
font-family: "Source Sans Pro", "Varta", arial, sans-serif;
|
|
font-size: 16px;
|
|
text-transform: capitalize;
|
|
font-variant: small-caps;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .sheet-italics, .sheet-rolltemplate-npcaction .sheet-italics, .sheet-rolltemplate-npcatk .sheet-italics, .sheet-rolltemplate-npcdmg .sheet-italics, .sheet-rolltemplate-traits .sheet-italics {
|
|
font-style: italic;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .sheet-subheader, .sheet-rolltemplate-npcaction .sheet-subheader, .sheet-rolltemplate-npcatk .sheet-subheader, .sheet-rolltemplate-npcdmg .sheet-subheader {
|
|
line-height: 13px;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-traits .sheet-subheader {
|
|
font-style: italic;
|
|
color: var(--eg-text-faint);
|
|
margin-top: -5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .sheet-subheader span, .sheet-rolltemplate-npcaction .sheet-subheader span, .sheet-rolltemplate-npcatk .sheet-subheader span, .sheet-rolltemplate-npcdmg .sheet-subheader span {
|
|
font-size: 11px;
|
|
line-height: 11px;
|
|
}
|
|
|
|
.sheet-rolltemplate-traits .sheet-subheader span {
|
|
font-weight: normal;
|
|
font-size: 10px;
|
|
text-align: left;
|
|
line-height: 16px;
|
|
}
|
|
.sheet-rolltemplate-traits .sheet-desc {
|
|
font-weight: normal;
|
|
font-size: 12px;
|
|
text-align: left;
|
|
line-height: 16px;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .sheet-arrow-rightold, .sheet-rolltemplate-npcaction .sheet-arrow-rightold, .sheet-rolltemplate-npcatk .sheet-arrow-rightold, .sheet-rolltemplate-npcdmg .sheet-arrow-rightold {
|
|
border-top: 3px solid transparent;
|
|
border-bottom: 3px solid transparent;
|
|
border-left: 195px solid var(--eg-blue);
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .sheet-arrow-right, .sheet-rolltemplate-npcaction .sheet-arrow-right, .sheet-rolltemplate-npcatk .sheet-arrow-right, .sheet-rolltemplate-npcdmg .sheet-arrow-right {
|
|
border: 1px solid var(--eg-blue);
|
|
margin-bottom: 2px;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .inlinerollresult, .sheet-rolltemplate-npcaction .inlinerollresult, .sheet-rolltemplate-npcatk .inlinerollresult, .sheet-rolltemplate-npcdmg .inlinerollresult, .sheet-rolltemplate-traits .inlinerollresult {
|
|
background-color: var(--eg-bg);
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .inlinerollresult.fullcrit, .sheet-rolltemplate-npcaction .inlinerollresult.fullcrit, .sheet-rolltemplate-npcatk .inlinerollresult.fullcrit, .sheet-rolltemplate-npcdmg .inlinerollresult.fullcrit {
|
|
color: #3FB315;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .inlinerollresult.fullfail, .sheet-rolltemplate-npcaction .inlinerollresult.fullfail, .sheet-rolltemplate-npcatk .inlinerollresult.fullfail, .sheet-rolltemplate-npcdmg .inlinerollresult.fullfail {
|
|
color: #B31515;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-npc .inlinerollresult.importantroll, .sheet-rolltemplate-npcaction .inlinerollresult.importantroll, .sheet-rolltemplate-npcatk .inlinerollresult.importantroll, .sheet-rolltemplate-npcdmg .inlinerollresult.importantroll {
|
|
color: #4A57ED;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-npcatk a[href^="~"] {
|
|
background-color: transparent;
|
|
padding: 0px;
|
|
color: var(--eg-text);
|
|
border: 0px;
|
|
}
|
|
.sheet-rolltemplate-npcatk .sheet-header a[href^="~"] {
|
|
color: var(--eg-blue);
|
|
}
|
|
.sheet-rolltemplate-npcatk a[href^="~"]:hover {
|
|
color: #4aa3ec;
|
|
}
|
|
|
|
.equipment .complex, .equipment :is(.sheet-simple, .simple) {
|
|
display: none;
|
|
}
|
|
|
|
.proficiencies .complex, .proficiencies :is(.sheet-simple, .simple) {
|
|
display: none;
|
|
}
|
|
|
|
.traits .complex, .traits :is(.sheet-simple, .simple) {
|
|
display: none;
|
|
}
|
|
|
|
.equipment .inventoryflag[value=complex] ~ .complex, .equipment .inventoryflag[value=simple] ~ :is(.sheet-simple, .simple) {
|
|
display: inline-block;
|
|
}
|
|
|
|
.proficiencies .inventoryflag[value=complex] ~ .complex, .proficiencies .inventoryflag[value=simple] ~ :is(.sheet-simple, .simple) {
|
|
display: inline-block;
|
|
}
|
|
|
|
.traits .inventoryflag[value=complex] ~ .complex, .traits .inventoryflag[value=simple] ~ :is(.sheet-simple, .simple) {
|
|
display: inline-block;
|
|
}
|
|
|
|
.equipment .inventorysubflag {
|
|
height: 10px;
|
|
width: 10px;
|
|
top: 10px;
|
|
right: 0px;
|
|
}
|
|
.equipment .inventorysubflag + span {
|
|
height: 10px;
|
|
width: 10px;
|
|
top: 10px;
|
|
right: 0px;
|
|
font-size: 10px;
|
|
padding: 0px;
|
|
}
|
|
.equipment .complex {
|
|
width: 160px;
|
|
vertical-align: top;
|
|
padding-top: 5px;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.proficiencies .complex, .traits .complex {
|
|
width: 240px;
|
|
vertical-align: top;
|
|
padding-top: 5px;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
/* ---- Other Proficiencies & Languages section redesign ---- */
|
|
.textbox-container.proficiencies {
|
|
padding-top: 28px;
|
|
padding-bottom: 10px;
|
|
position: relative;
|
|
}
|
|
.textbox-container.proficiencies > .label {
|
|
position: absolute !important;
|
|
top: 0 !important;
|
|
bottom: auto !important;
|
|
left: 0;
|
|
right: 0;
|
|
text-align: center;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
border-radius: 4px 4px 0 0;
|
|
padding: 5px 0;
|
|
box-sizing: border-box;
|
|
}
|
|
.textbox-container.proficiencies > .label span {
|
|
display: inline !important;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 10px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-blue) !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
width: auto !important;
|
|
margin-top: 0 !important;
|
|
}
|
|
.proficiencies .complex {
|
|
width: 100% !important;
|
|
padding-top: 0 !important;
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.proficiencies .complex :is(.sheet-top, .top) {
|
|
display: flex !important;
|
|
align-items: center;
|
|
background: transparent;
|
|
padding: 7px 6px 3px 6px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.2);
|
|
box-sizing: border-box;
|
|
}
|
|
.proficiencies .complex :is(.sheet-top, .top) span {
|
|
display: inline-block !important;
|
|
font-size: 9px !important;
|
|
color: var(--eg-text-muted) !important;
|
|
font-weight: normal !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
margin-top: 0 !important;
|
|
line-height: normal !important;
|
|
}
|
|
.proficiencies .complex :is(.sheet-top, .top) span[data-i18n="type-u"] {
|
|
width: 78px !important;
|
|
flex-shrink: 0;
|
|
text-align: left !important;
|
|
}
|
|
.proficiencies .complex :is(.sheet-top, .top) span[data-i18n="proficency-u"] {
|
|
flex: 1 !important;
|
|
width: auto !important;
|
|
text-align: left !important;
|
|
}
|
|
/* CSE: the proficiency gear is now wrapped in a <label> (a bare invisible checkbox
|
|
doesn't receive clicks in CSE - confirmed: toggling :checked via console worked,
|
|
but clicking the gear didn't). With the flag inside the label it's no longer a
|
|
sibling of .options/.display, so the old ':checked ~' rules don't match - drive
|
|
the panel with :is() on the row instead. */
|
|
.charsheet .proficiencies .proficiency > .options-flag:checked ~ :is(.sheet-options, .options) {
|
|
display: block;
|
|
}
|
|
.charsheet .proficiencies .proficiency > .options-flag:checked ~ :is(.sheet-display, .display) {
|
|
display: none;
|
|
}
|
|
/* Tool/proficiency gears unwrapped to the bare OGL checkbox; sibling combinator drives panel. */
|
|
.charsheet .tool_proficiencies .tool > .options-flag:checked ~ :is(.sheet-options, .options) {
|
|
display: block;
|
|
}
|
|
.charsheet .tool_proficiencies .tool > .options-flag:checked ~ :is(.sheet-display, .display) {
|
|
display: none !important;
|
|
}
|
|
/* Click target: force a real 18x18 box so the transparent checkbox covers the gear icon
|
|
and sits on top (it was computing to 18x0, so clicks fell through to the icon span). */
|
|
.charsheet .proficiencies .proficiency > .options-flag,
|
|
.charsheet .tool_proficiencies .tool > .options-flag {
|
|
width: 18px !important;
|
|
height: 18px !important;
|
|
z-index: 5;
|
|
}
|
|
.charsheet .proficiencies .proficiency :is(.sheet-display, .display) button[type=roll] {
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
background-color: transparent !important;
|
|
background-image: none !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
color: var(--eg-text) !important;
|
|
padding: 3px 6px !important;
|
|
width: 100% !important;
|
|
box-sizing: border-box !important;
|
|
}
|
|
.charsheet .proficiencies .proficiency :is(.sheet-display, .display) button[type=roll]:hover {
|
|
color: var(--eg-text) !important;
|
|
background: transparent !important;
|
|
background-color: transparent !important;
|
|
}
|
|
.charsheet .proficiencies .proficiency :is(.sheet-display, .display) button[type=roll]:hover * {
|
|
color: inherit !important;
|
|
background: transparent !important;
|
|
}
|
|
.proficiencies .proficiency :is(.sheet-display, .display) button span[name="attr_prof_type"] {
|
|
width: 78px !important;
|
|
flex-shrink: 0;
|
|
font-size: 11px !important;
|
|
font-weight: bold !important;
|
|
text-align: left !important;
|
|
background: transparent !important;
|
|
}
|
|
.proficiencies .proficiency :is(.sheet-display, .display) button span[name="attr_name"] {
|
|
flex: 1 !important;
|
|
width: auto !important;
|
|
font-size: 12px !important;
|
|
font-weight: bold !important;
|
|
text-align: left !important;
|
|
background: transparent !important;
|
|
}
|
|
.proficiencies .proficiency:hover :is(.sheet-display, .display) {
|
|
background: rgba(var(--eg-blue-rgb), 0.04) !important;
|
|
}
|
|
.proficiencies .proficiency .options-flag + span {
|
|
font-family: 'Material Symbols Outlined' !important;
|
|
font-size: 0 !important;
|
|
color: var(--eg-gold) !important;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24 !important;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
user-select: none;
|
|
opacity: 0.6;
|
|
}
|
|
.proficiencies .proficiency .options-flag + span::before {
|
|
content: 'settings';
|
|
font-size: 14px;
|
|
line-height: 18px;
|
|
}
|
|
.proficiencies .proficiency:hover .options-flag + span {
|
|
opacity: 1;
|
|
}
|
|
|
|
.pictos {
|
|
font-family: pictos;
|
|
}
|
|
|
|
.equipment .header span {
|
|
display: inline-block;
|
|
}
|
|
|
|
.item {
|
|
margin-bottom: 2px;
|
|
}
|
|
.item .name {
|
|
width: 100px;
|
|
}
|
|
.item input[type=text].weight {
|
|
width: 25px;
|
|
text-align: center;
|
|
}
|
|
.item .subitem .subfield {
|
|
font-weight: normal;
|
|
background-color: transparent;
|
|
padding: 0px;
|
|
flex: 1 1 100%;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
min-width: 0;
|
|
}
|
|
.item .subitem .subtextarea {
|
|
width: calc(100% - 20px);
|
|
font-size: 9px;
|
|
padding: 0px 5px 0px 15px;
|
|
min-height: 32px;
|
|
height: 32px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.equipment .weighttotal {
|
|
position: absolute;
|
|
margin-top: 70px;
|
|
left: 0px;
|
|
top: 160px;
|
|
width: 70px;
|
|
}
|
|
.equipment .weighttotal input {
|
|
pointer-events: none;
|
|
}
|
|
|
|
.item .subitem span {
|
|
width: 32px;
|
|
padding: 0px 0px 0px 10px;
|
|
display: inline-block;
|
|
color: var(--eg-text);
|
|
}
|
|
|
|
.equipment :is(.sheet-warning, .warning), .charactermancer_options :is(.sheet-warning, .warning) {
|
|
display: none;
|
|
padding: 6px;
|
|
border: 1px solid gray;
|
|
position: relative;
|
|
}
|
|
|
|
.equipment :is(.sheet-warning, .warning) label, .charactermancer_options :is(.sheet-warning, .warning) label {
|
|
font-family: pictos;
|
|
border: 1px solid gray;
|
|
font-size: 8px;
|
|
width: auto;
|
|
padding: 2px;
|
|
line-height: 1em;
|
|
cursor: pointer;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
}
|
|
|
|
.equipment :is(.sheet-warning, .warning) label input, .charactermancer_options :is(.sheet-warning, .warning) label input {
|
|
display: none;
|
|
}
|
|
|
|
.equipment .warningflag[value=show] + :is(.sheet-warning, .warning), .charactermancer_options .warningflag[value=show] + :is(.sheet-warning, .warning) {
|
|
display: block;
|
|
}
|
|
|
|
.equipment :is(.sheet-warning, .warning) span, .charactermancer_options :is(.sheet-warning, .warning) span {
|
|
color: red;
|
|
}
|
|
|
|
.equipment .encumb {
|
|
color: red;
|
|
display: none;
|
|
font-size: 9px;
|
|
}
|
|
|
|
.npc :is(.sheet-warning, .warning) {
|
|
color: red;
|
|
font-size: 9px;
|
|
}
|
|
|
|
.equipment .encumberance[value=IMMOBILE] ~ .immobile, .equipment .encumberance[value="HEAVILY ENCUMBERED"] ~ .heavily, .equipment .encumberance[value=ENCUMBERED] ~ .encumbered, .equipment .encumberance[value="OVER CARRYING CAPACITY"] ~ .over {
|
|
display: block;
|
|
}
|
|
.equipment :is(.sheet-warning, .warning) input[type=checkbox] {
|
|
-webkit-appearance: checkbox;
|
|
-moz-appearance: checkbox;
|
|
width: auto;
|
|
}
|
|
|
|
.charactermancer_options :is(.sheet-warning, .warning) input[type=checkbox] {
|
|
-webkit-appearance: checkbox;
|
|
-moz-appearance: checkbox;
|
|
width: auto;
|
|
}
|
|
|
|
.equipment .item .subitem .equipped {
|
|
-webkit-appearance: checkbox;
|
|
-moz-appearance: checkbox;
|
|
width: initial;
|
|
margin-left: 15px;
|
|
}
|
|
.equipment .item .subitem .equippedlabel {
|
|
width: calc(100% - 50px);
|
|
text-align: left;
|
|
padding-left: 5px;
|
|
}
|
|
.equipment .equippedflag[value="0"] ~ .item > .name {
|
|
color: var(--eg-text-muted);
|
|
}
|
|
|
|
.version {
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 5px;
|
|
pointer-events: none;
|
|
font-size: 0.25em;
|
|
}
|
|
|
|
.charsheet :is(.sheet-options, .options) .body .version input[type=text], .charsheet .settings-modal-body .version input[type=text] {
|
|
border-bottom: none;
|
|
width: 20px;
|
|
}
|
|
|
|
.spellattackinfo {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet .spells .spellattackinfoflag[value=ATTACK] ~ .spellattackinfo, .charsheet .npc .spellattackinfoflag[value=ATTACK] ~ .spellattackinfo {
|
|
display: block;
|
|
}
|
|
|
|
.attack input[type=text].flat {
|
|
display: none;
|
|
}
|
|
.attack .flatflag[value*=saveflat] ~ input[type=text].flat {
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-charname, .sheet-rolltemplate-atk .sheet-charname, .sheet-rolltemplate-dmg .sheet-charname, .sheet-rolltemplate-atkdmg .sheet-charname {
|
|
text-align: center;
|
|
margin-top: -10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple .sheet-charname span, .sheet-rolltemplate-atk .sheet-charname span, .sheet-rolltemplate-dmg .sheet-charname span, .sheet-rolltemplate-atkdmg .sheet-charname span {
|
|
font-size: 11px;
|
|
font-weight: normal;
|
|
color: var(--eg-text-faint);
|
|
}
|
|
|
|
.npc :is(.sheet-display, .display) .info {
|
|
font-weight: normal;
|
|
}
|
|
|
|
.attacks .ammo {
|
|
display: none;
|
|
}
|
|
|
|
.ammoflag[value=on] + .attacks .ammo {
|
|
display: block;
|
|
}
|
|
|
|
.hlabel-container [name=attr_race_display] {
|
|
width: 160px;
|
|
}
|
|
.hlabel-container [name=attr_alignment] {
|
|
width: 180px;
|
|
}
|
|
.hlabel-container [name=attr_experience] {
|
|
width: 100px;
|
|
}
|
|
|
|
.class {
|
|
width: 85px;
|
|
}
|
|
|
|
.charsheet .hlabel-container .multiclass-display {
|
|
width: 57px;
|
|
font-size: 13px;
|
|
border-bottom: 1px solid var(--eg-border);
|
|
line-height: 35px;
|
|
height: 27px;
|
|
margin-right: -4px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.charsheet .hlabel-container .multiclass-display-level {
|
|
width: 31px;
|
|
text-align: center;
|
|
font-size: 13px;
|
|
border-bottom: 1px solid var(--eg-border);
|
|
line-height: 35px;
|
|
height: 27px;
|
|
overflow: hidden;
|
|
}
|
|
.charsheet .hlabel-container input.class-level {
|
|
margin-left: -6px;
|
|
width: 34px;
|
|
}
|
|
|
|
.sheet-rolltemplate-dmg .sheet-label .rolltemplate-inline, .sheet-rolltemplate-dmg .sheet-savedc .rolltemplate-inline {
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-rolltemplate-atkdmg .sheet-savedc .rolltemplate-inline, .sheet-rolltemplate-atkdmg .sheet-label .rolltemplate-inline {
|
|
display: inline-block;
|
|
}
|
|
|
|
:is(.sheet-options, .options) .body input[type=text].pb_custom, .settings-modal-body input[type=text].pb_custom {
|
|
display: none;
|
|
}
|
|
:is(.sheet-options, .options) .body input[value=custom] + input[type=text].pb_custom, .settings-modal-body input[value=custom] + input[type=text].pb_custom {
|
|
display: inline-block;
|
|
}
|
|
|
|
.attr-mod .baseattr {
|
|
/*display: none; */
|
|
opacity: 0;
|
|
height: 0px;
|
|
width: 0px;
|
|
pointer-events: none;
|
|
display: inline;
|
|
position: absolute;
|
|
}
|
|
|
|
.finalattr {
|
|
font-size: 20px;
|
|
line-height: 20px;
|
|
}
|
|
|
|
.attr-mod:hover .baseattr, .attr-mod .baseattr:focus {
|
|
/*display: inline; */
|
|
opacity: 1;
|
|
height: 20px;
|
|
width: 40px;
|
|
pointer-events: auto;
|
|
position: static;
|
|
}
|
|
.attr-mod:hover .finalattr, .attr-mod .baseattr:focus ~ .finalattr {
|
|
display: none;
|
|
}
|
|
.attr-mod .attr-flag[value="1"] + .finalattr {
|
|
color: #3e99e8;
|
|
}
|
|
.attr-mod .attr-flag[value="1"] + .finalattr:after {
|
|
content: "*";
|
|
font-size: 15px;
|
|
position: absolute;
|
|
}
|
|
|
|
.spell_slot_mods .column {
|
|
width: 32%;
|
|
display: inline-block;
|
|
}
|
|
.spell_slot_mods .num_plus {
|
|
margin-left: 2px;
|
|
}
|
|
|
|
.esper-mastery .column {
|
|
width: 39px;
|
|
display: inline-block;
|
|
text-align: center;
|
|
margin-left: 5px;
|
|
}
|
|
.esper-mastery .mconf {
|
|
font-size: 10px;
|
|
width: 40px;
|
|
}
|
|
.esper-mastery .sub-button input[type=radio] {
|
|
position: relative;
|
|
background-color: var(--eg-bg-alt);
|
|
width: 18px;
|
|
height: 18px;
|
|
z-index: 2;
|
|
}
|
|
.esper-mastery .sub-button input[type=radio]:checked + span {
|
|
position: relative;
|
|
background-color: var(--eg-bg-alt);
|
|
color: green;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
}
|
|
/* "Gained?" checkboxes - circular blue pip with dotted border, filled when checked */
|
|
.esper-mastery .sub-button input[type=checkbox] {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
display: block !important;
|
|
width: 14px !important;
|
|
height: 14px !important;
|
|
border-radius: 50% !important;
|
|
border: 1.5px dashed var(--eg-blue-bright) !important;
|
|
background: transparent !important;
|
|
cursor: pointer !important;
|
|
margin: 2px auto !important;
|
|
padding: 0 !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.esper-mastery .sub-button input[type=checkbox]:checked {
|
|
background: var(--eg-blue-bright) !important;
|
|
border-color: var(--eg-blue-bright) !important;
|
|
border-style: solid !important;
|
|
}
|
|
|
|
.licensecontainer.active-drop-target.dropping, .monster_confirm_flag[value="1"] ~ .licensecontainer, .mancer_confirm_flag[value="1"] ~ .licensecontainer {
|
|
opacity: 0.5;
|
|
transition: opacity 0.15s ease-in-out;
|
|
-moz-transition: opacity 0.15s ease-in-out;
|
|
-webkit-transition: opacity 0.15s ease-in-out;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.compendium_warning, .monster_confirm, .mancer_confirm {
|
|
display: none;
|
|
}
|
|
|
|
.licensecontainer.active-drop-target.dropping ~ .compendium_warning, .monster_confirm_flag[value="1"] ~ .monster_confirm, .mancer_confirm_flag[value="1"] ~ .mancer_confirm {
|
|
display: block;
|
|
position: fixed;
|
|
top: 50%;
|
|
background: var(--eg-bg);
|
|
color: var(--eg-text);
|
|
left: 50%;
|
|
z-index: 100;
|
|
border: 2px solid var(--eg-text);
|
|
width: 300px;
|
|
height: 100px;
|
|
text-align: center;
|
|
margin: -70px 0 0 -170px;
|
|
}
|
|
|
|
.monster_confirm input[type=checkbox], .mancer_confirm input[type=checkbox] {
|
|
height: 34px;
|
|
border-radius: 50%;
|
|
opacity: 0;
|
|
z-index: 2;
|
|
position: relative;
|
|
}
|
|
|
|
.monster_confirm div div, .mancer_confirm div div {
|
|
margin: 0 2px;
|
|
}
|
|
|
|
.monster_confirm input[type=checkbox] + span, .mancer_confirm input[type=checkbox] + span {
|
|
font-size: 20px;
|
|
font-weight: normal;
|
|
line-height: 34px;
|
|
position: absolute;
|
|
left: 0px;
|
|
border-radius: 5px;
|
|
border: 1px solid var(--eg-text);
|
|
}
|
|
|
|
.mancer_confirm_flag[value="1"] ~ .mancer_confirm {
|
|
width: 350px;
|
|
margin: -70px 0 0 -195px;
|
|
}
|
|
|
|
.mancer_confirm input[type=checkbox] {
|
|
height: 40px;
|
|
}
|
|
.mancer_confirm input[type=checkbox] + span {
|
|
font-size: 15px;
|
|
line-height: 1.2em;
|
|
height: 40px;
|
|
padding-top: 3px;
|
|
}
|
|
|
|
.monster_confirm .yes, .mancer_confirm .yes {
|
|
width: 44px;
|
|
}
|
|
|
|
.monster_confirm .cancel, .mancer_confirm .cancel {
|
|
width: 75px;
|
|
}
|
|
|
|
.licensecontainer.active-drop-target.dropping ~ .compendium_warning span {
|
|
line-height: 100px;
|
|
}
|
|
|
|
.init {
|
|
text-align: center;
|
|
}
|
|
.init span {
|
|
font-size: 20px;
|
|
line-height: 31px;
|
|
}
|
|
|
|
.class_options :is(.sheet-subclass, .subclass) {
|
|
margin-left: 19px;
|
|
}
|
|
|
|
.header :is(.sheet-display, .display) .sheet-class-display {
|
|
width: 180px; /* overridden to 100% in new header-info:is(.sheet-display, .display) block */
|
|
text-transform: capitalize;
|
|
overflow: hidden;
|
|
word-wrap: break-word;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.sheet-no_events {
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* TRANSITION SCRIPT */
|
|
.class_options, .skill_options, .attribute_options, .save_options, .general_options {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
padding: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.transition_options {
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
padding: 5px;
|
|
margin-bottom: 5px;
|
|
display: none;
|
|
}
|
|
|
|
.already_transitioned[value="0"] ~ .transition_options {
|
|
display: block;
|
|
}
|
|
|
|
.sheet_select img {
|
|
padding: 5px;
|
|
border: 1px solid var(--eg-border);
|
|
border-radius: 5px;
|
|
}
|
|
.sheet_select img:hover {
|
|
background-color: #DDD;
|
|
cursor: pointer !important;
|
|
}
|
|
|
|
.charsheet :is(.sheet-options, .options) :is(.sheet-row, .row) span.transition_text {
|
|
color: var(--eg-text-faint);
|
|
}
|
|
.charsheet :is(.sheet-options, .options) :is(.sheet-row, .row) span.transition_text_highlight {
|
|
color: #F00;
|
|
}
|
|
|
|
.globalattack input[type=checkbox] {
|
|
display: inline;
|
|
height: 12px;
|
|
width: 12px;
|
|
-webkit-appearance: checkbox;
|
|
-moz-appearance: checkbox;
|
|
margin-left: 5px;
|
|
margin-top: 10px;
|
|
}
|
|
.globalattack textarea {
|
|
width: 95%;
|
|
display: inline;
|
|
height: 25px;
|
|
margin: 1px;
|
|
}
|
|
.globalattack .label {
|
|
margin-bottom: 5px;
|
|
padding-top: 5px;
|
|
color: var(--eg-text-faint);
|
|
border-top: 1px dotted #A0A0A0;
|
|
}
|
|
|
|
.missing-info {
|
|
margin-bottom: 100px;
|
|
display: none;
|
|
}
|
|
|
|
.missing-info-flag[value="1"] + .missing-info, .missing-info:hover .missing-info-desc, .missing-info-desc:hover {
|
|
display: block;
|
|
}
|
|
|
|
.actions.npcspell.spells, .missing-info-desc {
|
|
display: none;
|
|
}
|
|
|
|
.npcspell_flag[value="1"] + .actions.npcspell.spells {
|
|
display: block;
|
|
}
|
|
|
|
.spells .innate {
|
|
color: var(--eg-text-faint);
|
|
display: none;
|
|
font-size: 12px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.innate:before {
|
|
content: ", ";
|
|
}
|
|
|
|
.innate_flag:not([value=""]) + .innate {
|
|
display: inline;
|
|
}
|
|
|
|
.levelerbutton {
|
|
display: none;
|
|
}
|
|
|
|
.showleveler[value="1"] + .levelerbutton {
|
|
display: block;
|
|
}
|
|
|
|
/* Translation Overrides */
|
|
/* Spanish */
|
|
.lang-es .spell-container input[name=attr_spellcastingtime] {
|
|
width: 115px;
|
|
}
|
|
.lang-es .spell-container input[name=attr_spellrange] {
|
|
width: 200px;
|
|
}
|
|
.lang-es .spell-container input[name=attr_spelltarget] {
|
|
width: 188px;
|
|
}
|
|
.lang-es .spell-container input[name=attr_spellduration] {
|
|
width: 184px;
|
|
}
|
|
.lang-es .ac-init-speed-container div {
|
|
position: relative;
|
|
height: 56px;
|
|
}
|
|
.lang-es .ac-init-speed-container button, .lang-es .ac-init-speed-container .label {
|
|
position: absolute;
|
|
bottom: 0;
|
|
}
|
|
.lang-es .hdice-dsaves-container div.subcontainer {
|
|
position: relative;
|
|
height: 71px;
|
|
}
|
|
.lang-es .hdice-dsaves-container button {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
.lang-es .hp :is(.sheet-top, .top) input[name=attr_hp_max] {
|
|
width: 121px;
|
|
}
|
|
.lang-es .hlabel-container input[name=attr_race] {
|
|
width: 190px;
|
|
}
|
|
.lang-es .hlabel-container input[name=attr_alignment] {
|
|
width: 170px;
|
|
}
|
|
.lang-es .hlabel-container input[name=attr_experience] {
|
|
width: 120px;
|
|
}
|
|
.lang-es .npc .npc_options input[name=attr_npc_actype], .lang-es .npc .npc_options input[name=attr_npc_hpformula] {
|
|
width: 175px;
|
|
}
|
|
.lang-es .advantagetoggle input.toggle-left {
|
|
right: 214px;
|
|
width: 67px;
|
|
}
|
|
.lang-es .advantagetoggle input.toggle-left + span {
|
|
right: 214px;
|
|
width: 67px;
|
|
}
|
|
.lang-es .advantagetoggle input.toggle-center {
|
|
right: 145px;
|
|
width: 65px;
|
|
}
|
|
.lang-es .advantagetoggle input.toggle-center + span {
|
|
right: 145px;
|
|
width: 65px;
|
|
}
|
|
.lang-es .advantagetoggle input.toggle-right {
|
|
right: 50px;
|
|
width: 91px;
|
|
}
|
|
.lang-es .advantagetoggle input.toggle-right + span {
|
|
right: 50px;
|
|
width: 91px;
|
|
}
|
|
/* Czech */
|
|
.charsheet.lang-cs select[name=attr_cust_spellslots] {
|
|
font-size: 9px;
|
|
}
|
|
.charsheet.lang-cs .spell :is(.sheet-options, .options) span[data-i18n="at-higher-lvl-dmg:-u"], .charsheet.lang-cs .spell :is(.sheet-options, .options) span[data-i18n=add-ability-mod-u], .charsheet.lang-cs .spell :is(.sheet-options, .options) span[data-i18n="saving-throw:-u"], .charsheet.lang-cs .spell :is(.sheet-options, .options) span[data-i18n="effect:-u"] {
|
|
font-size: 8px;
|
|
}
|
|
.charsheet.lang-cs .ac-init-speed-container .ac > span {
|
|
font-size: 8px;
|
|
}
|
|
.charsheet.lang-cs .subcontainer :is(.sheet-top, .top) span[data-i18n=total] + input {
|
|
width: 75px;
|
|
}
|
|
.charsheet.lang-cs :is(.sheet-row, .row) span[data-i18n=senses-u] + input, .charsheet.lang-cs :is(.sheet-row, .row) span[data-i18n=npc-type-u] + input {
|
|
width: 220px;
|
|
}
|
|
.charsheet.lang-cs .class {
|
|
width: 79px;
|
|
}
|
|
.charsheet.lang-cs .hlabel-container .multiclass-display {
|
|
width: 62px;
|
|
}
|
|
.charsheet.lang-cs .hlabel-container .multiclass-display-level {
|
|
width: 23px;
|
|
}
|
|
.charsheet.lang-cs .hlabel-container input.class-level {
|
|
width: 28px;
|
|
}
|
|
.charsheet.lang-it div.licensecontainer .container.pc .spells .header .header-info .part {
|
|
width: 23%;
|
|
}
|
|
.charsheet.lang-it div.licensecontainer .container:not(.npc) div.page div.header div.name-container span {
|
|
margin-top: 19px;
|
|
margin-left: 30px;
|
|
}
|
|
.charsheet.lang-it .header .part input[type=text], .charsheet.lang-it .header .part select, .charsheet.lang-it .header .part span:is(.sheet-display, .display) {
|
|
height: 46px;
|
|
}
|
|
|
|
/* Italian */
|
|
/* ----------------- */
|
|
/* CHARACTERMANCER */
|
|
/* ----------------- */
|
|
.charmancer.container {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
flex-basis: 1 1 100%;
|
|
position: relative;
|
|
contain: paint;
|
|
}
|
|
.charmancer .choices {
|
|
flex: 40%;
|
|
max-width: 40%;
|
|
padding-right: 1em;
|
|
}
|
|
.charmancer .info {
|
|
flex: 60%;
|
|
position: relative;
|
|
max-width: calc(60% - 2em);
|
|
}
|
|
.charmancer .choices, .charmancer .info {
|
|
margin-bottom: 2em;
|
|
}
|
|
.charmancer .sheet-compendium-page {
|
|
height: 100%;
|
|
}
|
|
.charmancer iframe {
|
|
height: 100%;
|
|
min-height: 50vh;
|
|
contain: paint;
|
|
}
|
|
.charmancer select option:disabled {
|
|
background-color: var(--eg-bg-alt);
|
|
}
|
|
.charmancer select span.initials {
|
|
font-size: 6px;
|
|
}
|
|
.charmancer .topbar-holder {
|
|
width: 100%;
|
|
}
|
|
.charmancer .topbar, .charmancer .leveler-topbar {
|
|
flex: 100%;
|
|
margin-bottom: 15px;
|
|
}
|
|
.charmancer .topbar div div, .charmancer .leveler-topbar div div {
|
|
display: inline-block;
|
|
width: 16%;
|
|
border: 1px solid gray;
|
|
text-align: center;
|
|
}
|
|
.charmancer .topbar div span {
|
|
font-size: 3em;
|
|
line-height: 1em;
|
|
font-weight: bold;
|
|
}
|
|
.charmancer .leveler-topbar div span {
|
|
font-size: 3em;
|
|
line-height: 1em;
|
|
font-weight: bold;
|
|
font-size: 2.5em;
|
|
}
|
|
.charmancer .topbar div.meta-info-container, .charmancer .leveler-topbar div.meta-info-container {
|
|
display: flex;
|
|
width: 100%;
|
|
border: 0;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
.charmancer .topbar div.meta-info-container span, .charmancer .leveler-topbar div.meta-info-container span {
|
|
font-size: 1.2em;
|
|
}
|
|
.charmancer :is(.sheet-choice, .choice) {
|
|
display: none !important;
|
|
}
|
|
.charmancer .topbar div.meta-info-container span:is(.sheet-choice, .choice), .charmancer .leveler-topbar div.meta-info-container span:is(.sheet-choice, .choice) {
|
|
display: none;
|
|
}
|
|
.charmancer .steps {
|
|
position: sticky;
|
|
padding: 0.5em 0;
|
|
background: var(--eg-bg);
|
|
z-index: 1011;
|
|
top: 0;
|
|
border-bottom: 1px dashed var(--eg-border);
|
|
list-style: none;
|
|
list-style-position: inside;
|
|
flex: 100%;
|
|
margin: 0 0 1em;
|
|
display: flex;
|
|
flex-flow: row;
|
|
justify-content: space-between;
|
|
transform: translateZ(0);
|
|
}
|
|
.charmancer .lp-steps {
|
|
width: 100%;
|
|
display: block;
|
|
flex: none;
|
|
}
|
|
.charmancer .lp-steps li {
|
|
display: inline;
|
|
margin-right: 0.5em;
|
|
}
|
|
.charmancer .lp-steps li:last-of-type {
|
|
float: right;
|
|
}
|
|
.charmancer button {
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 5px;
|
|
background-color: var(--eg-bg-alt);
|
|
color: var(--eg-text);
|
|
text-align: center;
|
|
font-weight: bold;
|
|
}
|
|
.charmancer button[type=roll] {
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 5px;
|
|
background-color: var(--eg-bg-alt);
|
|
color: var(--eg-text);
|
|
text-align: center;
|
|
font-weight: bold;
|
|
padding: 1px 6px;
|
|
font-size: 13px;
|
|
margin: 0;
|
|
}
|
|
.charsheet .charmancer button[type=roll]::before {
|
|
content: "" !important;
|
|
}
|
|
.charmancer button.step {
|
|
border-color: var(--eg-text);
|
|
background-color: var(--eg-bg);
|
|
color: var(--eg-text);
|
|
}
|
|
.charmancer button.step.next, .charmancer button.step.prev, .charmancer button.step.done, .charmancer button.step:not(.here) {
|
|
border-color: var(--eg-text);
|
|
background-color: var(--eg-bg-alt);
|
|
color: var(--eg-text);
|
|
}
|
|
.charmancer button:hover {
|
|
color: #fff;
|
|
background-color: var(--eg-blue-bright);
|
|
}
|
|
.charmancer button:hover.step {
|
|
color: #fff;
|
|
background-color: var(--eg-blue-bright);
|
|
}
|
|
.charmancer button:hover.step.done {
|
|
color: #fff;
|
|
background-color: var(--eg-blue-bright);
|
|
}
|
|
.charmancer button.step.here {
|
|
color: #fff;
|
|
background-color: var(--eg-blue-bright);
|
|
}
|
|
.charmancer button[type=roll]:hover {
|
|
color: #fff;
|
|
background-color: var(--eg-blue-bright);
|
|
}
|
|
.charmancer button[type=roll]:hover * {
|
|
color: #fff;
|
|
background-color: var(--eg-blue-bright);
|
|
}
|
|
.charmancer button.exit {
|
|
text-transform: uppercase;
|
|
color: var(--eg-blue-bright);
|
|
background-color: var(--eg-bg);
|
|
border-color: var(--eg-blue-bright);
|
|
}
|
|
.charmancer button[type=back]:disabled:not(.here) {
|
|
color: #ddd;
|
|
background-color: var(--eg-bg);
|
|
border-color: var(--eg-border);
|
|
cursor: not-allowed;
|
|
}
|
|
.charmancer .bottombar, .charmancer .controls {
|
|
flex: 100%;
|
|
margin-bottom: 1em;
|
|
}
|
|
.charmancer .bottombar {
|
|
position: sticky;
|
|
bottom: -1px;
|
|
border-top: 1px dashed var(--eg-border);
|
|
padding: 0.5em 0;
|
|
background: var(--eg-bg);
|
|
box-sizing: border-box;
|
|
text-align: center;
|
|
transform: translateZ(0);
|
|
}
|
|
.charmancer .bottombar button {
|
|
text-transform: uppercase;
|
|
}
|
|
.charmancer .jump {
|
|
margin: 0 auto;
|
|
}
|
|
.charmancer .prev {
|
|
left: 0;
|
|
position: absolute;
|
|
}
|
|
.charmancer .next {
|
|
right: 0;
|
|
position: absolute;
|
|
}
|
|
.charmancer :is(.sheet-row, .row) {
|
|
border: 1px solid var(--eg-border);
|
|
border-radius: 0.5em 0 0 0;
|
|
border-width: 1px 4px 0 1px;
|
|
margin: 0 -1em 0 0;
|
|
padding: 0.5em;
|
|
}
|
|
.charmancer :is(.sheet-row, .row) :is(.sheet-row, .row) {
|
|
border-left-width: 0;
|
|
margin-left: -0.5em;
|
|
}
|
|
.charmancer :is(.sheet-row, .row) :is(.sheet-row, .row):first-of-type {
|
|
border-top-width: 0;
|
|
padding-top: 0;
|
|
}
|
|
.charmancer .race_traits b {
|
|
display: block;
|
|
}
|
|
.charmancer .race_traits b + b {
|
|
margin-top: 0.5em;
|
|
}
|
|
.charmancer label * {
|
|
display: block;
|
|
margin-top: 9px;
|
|
}
|
|
.charmancer label span:first-child {
|
|
margin-top: 0;
|
|
}
|
|
.charmancer select {
|
|
margin-bottom: 0;
|
|
width: calc(100% - 2.25em);
|
|
}
|
|
.charmancer select:not([required]) {
|
|
width: calc(100% - 3em);
|
|
}
|
|
.charmancer label {
|
|
font-size: 1.55rem;
|
|
}
|
|
.charmancer label p {
|
|
font-weight: normal;
|
|
}
|
|
.charmancer .label {
|
|
font-size: 1.55rem;
|
|
display: block;
|
|
font-weight: bold;
|
|
/* Roll20's leveler styles these intro headers (p.label) white and indents
|
|
them; white is invisible on EG's light-mode charmancer background. Theme the
|
|
color (dark in light mode, light in dark) and zero the platform indent. */
|
|
color: var(--eg-text);
|
|
margin-left: 0;
|
|
padding-left: 0;
|
|
text-indent: 0;
|
|
}
|
|
.charmancer select + select, .charmancer [class^=race_level0_choice] + [class^=race_level0_choice], .charmancer [class^=race_level1_choice] + [class^=race_level1_choice], .charmancer [class^=class_level0_choice] + [class^=class_level0_choice], .charmancer [class^=class_level1_choice] + [class^=class_level1_choice] {
|
|
margin-top: 0.5em;
|
|
}
|
|
.charmancer label.compendium-opt {
|
|
display: inline;
|
|
vertical-align: unset;
|
|
}
|
|
.charmancer label.compendium-opt > * {
|
|
display: inline;
|
|
vertical-align: unset;
|
|
}
|
|
.charmancer label.abilities_attribute {
|
|
display: inline;
|
|
vertical-align: unset;
|
|
}
|
|
.charmancer .cancel-prompt {
|
|
position: fixed;
|
|
background: var(--eg-bg);
|
|
border: 1px solid;
|
|
border-radius: 5px;
|
|
padding: 40px 20px 40px 20px;
|
|
top: 195px;
|
|
width: 650px;
|
|
text-align: center;
|
|
}
|
|
.charmancer.container .cancel-prompt {
|
|
top: 35px;
|
|
z-index: 1012;
|
|
}
|
|
.charmancer *[required]:not(:is(.sheet-choice, .choice)) {
|
|
display: inline-block;
|
|
}
|
|
.charmancer .hilite::after {
|
|
content: "* required";
|
|
font-style: italic;
|
|
font-weight: normal;
|
|
display: block;
|
|
font-size: 14px;
|
|
font-variant: small-caps;
|
|
}
|
|
.charmancer :is(.sheet-warning, .warning) {
|
|
color: var(--eg-blue);
|
|
}
|
|
.charmancer button:is(.sheet-warning, .warning) {
|
|
color: #fff;
|
|
background-color: var(--eg-blue-fill);
|
|
border-color: var(--eg-blue);
|
|
}
|
|
.charmancer button:hover:is(.sheet-warning, .warning) {
|
|
color: var(--eg-blue);
|
|
background-color: var(--eg-bg);
|
|
border-color: var(--eg-blue);
|
|
}
|
|
.charmancer .sheet-needed::before {
|
|
font-family: pictos;
|
|
content: "D";
|
|
}
|
|
.charmancer .hilite {
|
|
color: var(--eg-blue);
|
|
background: var(--eg-bg-alt);
|
|
border-radius: 0.5em;
|
|
box-sizing: border-box;
|
|
padding: 0.5em;
|
|
}
|
|
.charmancer .hilite div + div {
|
|
margin: 1em 0 0;
|
|
}
|
|
.charmancer .gold_option input[type=number] {
|
|
width: 4.5em;
|
|
}
|
|
.charmancer .customize-origin {
|
|
box-sizing: border-box;
|
|
padding-right: 40px;
|
|
position: relative;
|
|
width: 100%;
|
|
display: none;
|
|
}
|
|
.charmancer .customize-origin label span {
|
|
display: block;
|
|
}
|
|
.charmancer .customize-origin label span:last-child {
|
|
font-weight: normal;
|
|
width: calc(100% + 40px);
|
|
}
|
|
.charmancer .customize-origin .toggle {
|
|
box-sizing: border-box;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
width: 40px;
|
|
height: 20px;
|
|
overflow: hidden;
|
|
border-radius: 10px;
|
|
border: 1px solid var(--eg-border);
|
|
}
|
|
.charmancer .customize-origin .toggle input {
|
|
width: 100%;
|
|
height: 100%;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
border: 0;
|
|
padding: 0;
|
|
margin: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
outline: none;
|
|
}
|
|
.charmancer .customize-origin .toggle input:checked {
|
|
background: #c43c41;
|
|
}
|
|
.charmancer .customize-origin .toggle .knob {
|
|
width: 20px;
|
|
height: 20px;
|
|
background: #CCC;
|
|
position: absolute;
|
|
top: -1px;
|
|
left: -1px;
|
|
border-radius: 10px;
|
|
pointer-events: none;
|
|
}
|
|
.charmancer .customize-origin .toggle input:checked + .knob {
|
|
right: -1px;
|
|
left: auto;
|
|
}
|
|
.charmancer input[value="1"] + .customize-origin {
|
|
display: block;
|
|
}
|
|
.charmancer span.tasha + select {
|
|
margin-bottom: 10px;
|
|
}
|
|
.charmancer input[value="1"] + span.tasha:after {
|
|
content: " (+1):";
|
|
}
|
|
.charmancer input[value="2"] + span.tasha:after {
|
|
content: " (+2):";
|
|
}
|
|
.charmancer input[value="3"] + span.tasha:after {
|
|
content: " (+3):";
|
|
}
|
|
.charmancer input[value="4"] + span.tasha:after {
|
|
content: " (+4):";
|
|
}
|
|
.charmancer input[value="5"] + span.tasha:after {
|
|
content: " (+5):";
|
|
}
|
|
.charmancer input[value="6"] + span.tasha:after {
|
|
content: " (+6):";
|
|
}
|
|
.charmancer input[value="7"] + span.tasha:after {
|
|
content: " (+7):";
|
|
}
|
|
.charmancer input[value="8"] + span.tasha:after {
|
|
content: " (+8):";
|
|
}
|
|
.charmancer input[value="9"] + span.tasha:after {
|
|
content: " (+9):";
|
|
}
|
|
.charmancer input[value="10"] + span.tasha:after {
|
|
content: " (+10):";
|
|
}
|
|
.charmancer input[value="11"] + span.tasha:after {
|
|
content: " (+11):";
|
|
}
|
|
.charmancer input[value="12"] + span.tasha:after {
|
|
content: " (+12):";
|
|
}
|
|
.charmancer input[value="13"] + span.tasha:after {
|
|
content: " (+13):";
|
|
}
|
|
.charmancer input[value="14"] + span.tasha:after {
|
|
content: " (+14):";
|
|
}
|
|
.charmancer input[value="15"] + span.tasha:after {
|
|
content: " (+15):";
|
|
}
|
|
.charmancer input[value="16"] + span.tasha:after {
|
|
content: " (+16):";
|
|
}
|
|
.charmancer input[value="17"] + span.tasha:after {
|
|
content: " (+17):";
|
|
}
|
|
.charmancer input[value="18"] + span.tasha:after {
|
|
content: " (+18):";
|
|
}
|
|
.charmancer input[value="19"] + span.tasha:after {
|
|
content: " (+19):";
|
|
}
|
|
.charmancer input[value="20"] + span.tasha:after {
|
|
content: " (+20):";
|
|
}
|
|
.charmancer .asi-row .asi {
|
|
border-width: 1px !important;
|
|
}
|
|
.charmancer .asi-row .switch ~ .switch-container .feat-tab {
|
|
pointer-events: all;
|
|
}
|
|
.charmancer .asi-row .asi, .charmancer .asi-row .feat {
|
|
display: none;
|
|
}
|
|
.charmancer .asi-row .switchval[value=asi] ~ .asi, .charmancer .asi-row .switchval[value=feat] ~ .feat {
|
|
display: block;
|
|
border-color: var(--eg-border);
|
|
border-style: solid;
|
|
border-width: 0 1px 1px 1px;
|
|
border-radius: 0 0 4px 4px;
|
|
padding: 1em;
|
|
}
|
|
.charmancer .asi-row .switchval[value=asi] ~ .switch-container .asi-tab, .charmancer .asi-row .switchval[value=feat] ~ .switch-container .feat-tab {
|
|
border-bottom-width: 0;
|
|
background-color: var(--eg-bg);
|
|
}
|
|
.charmancer .spinnerloader {
|
|
width: 40%;
|
|
padding-right: 13px;
|
|
height: 100px;
|
|
background-image: url("https://app.roll20.net/images/load.gif");
|
|
background-repeat: no-repeat;
|
|
background-position: center center;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
}
|
|
.charmancer .spinner-toggle {
|
|
display: none;
|
|
}
|
|
.charmancer .spinner-toggle:empty + .spinnerloader {
|
|
display: none;
|
|
}
|
|
.charmancer .spinner-toggle:empty ~ .choices {
|
|
display: block;
|
|
}
|
|
.charmancer .spinner-toggle ~ .choices {
|
|
display: none;
|
|
}
|
|
|
|
.manver .yes_spells {
|
|
display: flex;
|
|
}
|
|
|
|
.charmancer button.mancer_info {
|
|
font-size: 1.25em;
|
|
width: 1.25em;
|
|
height: 1.25em;
|
|
padding: 0;
|
|
font-style: italic;
|
|
text-align: center;
|
|
color: white;
|
|
background: black;
|
|
font-weight: bold;
|
|
font-family: serif;
|
|
border-radius: 100%;
|
|
display: inline-block;
|
|
border: none;
|
|
}
|
|
.charmancer [data-repeating] button.action.choice-showing {
|
|
font-size: 1.25em;
|
|
width: 1.25em;
|
|
height: 1.25em;
|
|
padding: 0;
|
|
font-style: italic;
|
|
text-align: center;
|
|
color: white;
|
|
background: black;
|
|
font-weight: bold;
|
|
font-family: serif;
|
|
border-radius: 100%;
|
|
display: inline-block;
|
|
border: none;
|
|
}
|
|
.charmancer [data-repeating] p button.mancer_info {
|
|
font-size: 0.8em;
|
|
line-height: 1em;
|
|
vertical-align: super;
|
|
}
|
|
.charmancer button.mancer_info:hover, .charmancer [data-repeating] button.action:hover {
|
|
background: var(--eg-blue-bright);
|
|
}
|
|
.charmancer [class^=abilities_radio]:not(:is(.sheet-choice, .choice)) {
|
|
display: flex;
|
|
}
|
|
.charmancer span label.compendium-opt {
|
|
position: relative;
|
|
justify-content: space-between;
|
|
padding-right: 0;
|
|
}
|
|
.charmancer span label.compendium-opt > span {
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 5px;
|
|
display: inline-block;
|
|
min-width: 1.618em;
|
|
background-color: var(--eg-bg-alt);
|
|
color: var(--eg-text);
|
|
text-align: center;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
}
|
|
.charmancer span label.compendium-opt > input[type=radio]:disabled + span {
|
|
color: #ddd;
|
|
background-color: var(--eg-bg);
|
|
border-color: var(--eg-border);
|
|
cursor: not-allowed;
|
|
}
|
|
.charmancer span label.compendium-opt > input[type=radio]:checked + span {
|
|
color: white;
|
|
background-color: var(--eg-blue-bright);
|
|
}
|
|
.charmancer span .compendium-opt > input[type=radio] {
|
|
opacity: 0;
|
|
width: 0;
|
|
cursor: none;
|
|
}
|
|
.charmancer .summary .returnblock {
|
|
margin-bottom: 1em;
|
|
}
|
|
/* Review tab: the section headers (Features / Feats / Powers) are p.label elements
|
|
that Roll20's platform CSS center-aligns by default. EG never overrode this, so it
|
|
was invisible until dark mode gave the labels a readable color. Left-align them to
|
|
match the "Before/After Leveling" h2 headers and the body text. */
|
|
.charmancer .summary .label {
|
|
text-align: left;
|
|
}
|
|
|
|
.equipment_choice_title {
|
|
font-weight: bold;
|
|
margin-bottom: 0px;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.backgrounds_options label select, .backgrounds_options label span {
|
|
display: inline-block;
|
|
}
|
|
.backgrounds_options label button {
|
|
display: inline-block;
|
|
}
|
|
.backgrounds_options label button[type=roll] {
|
|
margin-top: 0.5em;
|
|
}
|
|
.backgrounds_options label br {
|
|
margin-top: 0.1em;
|
|
}
|
|
.backgrounds_options label select:not([required]) {
|
|
width: calc(100% - 4em);
|
|
}
|
|
|
|
.charmancer button.bg_info {
|
|
font-size: 1.25em;
|
|
width: 1.25em;
|
|
height: 1.25em;
|
|
padding: 0;
|
|
font-style: italic;
|
|
text-align: center;
|
|
color: white;
|
|
background: black;
|
|
font-weight: bold;
|
|
font-family: serif;
|
|
border-radius: 100%;
|
|
display: inline-block;
|
|
border: none;
|
|
}
|
|
.charmancer button.bg_info:hover {
|
|
background: var(--eg-blue-bright);
|
|
}
|
|
.charmancer .custom_class label input[type=checkbox] {
|
|
display: inline-block;
|
|
margin-top: inherit;
|
|
margin: 5px;
|
|
}
|
|
.charmancer .mancer_progress {
|
|
border: 2px solid var(--eg-text);
|
|
height: 10px;
|
|
margin-top: 1.5em;
|
|
width: 100%;
|
|
}
|
|
.charmancer .mancer_progress div {
|
|
background-color: red;
|
|
height: 100%;
|
|
}
|
|
.charmancer .bottombar button[type=finish]:is(.sheet-choice, .choice) {
|
|
display: inline-block;
|
|
opacity: 0.4;
|
|
pointer-events: none;
|
|
}
|
|
.charmancer .custom_type {
|
|
font-size: 0.9em;
|
|
}
|
|
.charmancer .custom_type select {
|
|
display: inline-block;
|
|
width: 65%;
|
|
}
|
|
.charmancer .custom_type + span:empty + select, .charmancer .custom_type + span:empty ~ button {
|
|
opacity: 0.5;
|
|
pointer-events: none;
|
|
}
|
|
.charmancer .custom_trait + span:empty ~ button {
|
|
opacity: 0.5;
|
|
pointer-events: none;
|
|
}
|
|
.charmancer .custom_add_action {
|
|
float: right;
|
|
margin-right: 4em;
|
|
}
|
|
.charmancer .custom_trait textarea {
|
|
width: calc(100% - 3em);
|
|
resize: vertical;
|
|
height: 7em;
|
|
}
|
|
|
|
.custom-proficiency button, .custom-trait button {
|
|
display: none;
|
|
}
|
|
|
|
.custom-proficiency:last-of-type button, .custom-trait:last-of-type button {
|
|
display: block;
|
|
}
|
|
|
|
.charmancer .choices.spellslide {
|
|
flex: 45%;
|
|
max-width: 45%;
|
|
box-sizing: border-box;
|
|
}
|
|
.charmancer .info.spellslide {
|
|
position: sticky;
|
|
flex: 55%;
|
|
top: 4em;
|
|
min-height: 50%;
|
|
height: 100%;
|
|
}
|
|
|
|
.spells-summary div div {
|
|
display: inline-block;
|
|
}
|
|
.spells-summary .title {
|
|
width: 15%;
|
|
text-align: right;
|
|
vertical-align: top;
|
|
}
|
|
.spells-summary .list {
|
|
width: 85%;
|
|
padding-left: 0.5em;
|
|
box-sizing: border-box;
|
|
}
|
|
.spells-summary .list span:not(:last-of-type)::after {
|
|
content: ",";
|
|
color: var(--eg-text);
|
|
text-decoration: none;
|
|
}
|
|
.spells-summary .list span::before {
|
|
content: " ";
|
|
}
|
|
.spells-summary .new {
|
|
/*color: #447877; */
|
|
color: green;
|
|
font-weight: bold;
|
|
}
|
|
.spells-summary .removed {
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
.spellslide .primeinfo {
|
|
margin-bottom: -1em;
|
|
}
|
|
.spellslide .primeinfo p {
|
|
margin: 0;
|
|
}
|
|
|
|
.charmancer .spellslide :is(.sheet-row, .row) {
|
|
padding-left: 0;
|
|
}
|
|
.charmancer .spellslide .instructions {
|
|
font-weight: bold;
|
|
}
|
|
.charmancer .spellslide .spell-summary {
|
|
margin: 0;
|
|
}
|
|
.charmancer label.nostyle * {
|
|
display: inline;
|
|
margin-top: 0;
|
|
}
|
|
.charmancer .spell-holder {
|
|
margin: 1em 0;
|
|
}
|
|
.charmancer .spell-holder label {
|
|
border: 1px solid var(--eg-text);
|
|
background-color: var(--eg-bg-alt);
|
|
margin: 0;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
.charmancer .spell-holder label .title {
|
|
display: inline;
|
|
padding: 1em;
|
|
line-height: 2em;
|
|
}
|
|
.charmancer .spell-holder label .title span.choice-showing {
|
|
font-family: pictos;
|
|
color: red;
|
|
display: inline;
|
|
font-size: 0.8em;
|
|
line-height: 0.1em;
|
|
padding-left: 0.5em;
|
|
position: relative;
|
|
bottom: 0.3em;
|
|
}
|
|
.charmancer .spell-holder label .number {
|
|
float: right;
|
|
font-weight: normal;
|
|
margin-right: 0.7em;
|
|
line-height: 0.8em;
|
|
}
|
|
.charmancer .spell-holder .spellheader input {
|
|
display: inline;
|
|
float: right;
|
|
opacity: 0;
|
|
}
|
|
.charmancer .spell-holder label .number::after {
|
|
content: "9";
|
|
font-family: pictos;
|
|
position: absolute;
|
|
margin-left: 0.3em;
|
|
font-size: 1.3em;
|
|
display: inline-block;
|
|
transform: rotate(-90deg);
|
|
}
|
|
.charmancer .spell-holder label input:checked ~ .number::after {
|
|
transform: rotate(90deg);
|
|
margin-left: 0.4em;
|
|
}
|
|
.charmancer .spell-holder .container {
|
|
width: 100%;
|
|
border: 1px solid var(--eg-text);
|
|
border-top: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
.charmancer .spell-item {
|
|
padding: 0 0.5em;
|
|
line-height: 1.5em;
|
|
}
|
|
.charmancer .spell-item label {
|
|
border: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
width: 100%;
|
|
background-color: unset;
|
|
font-size: 16px;
|
|
font-weight: normal;
|
|
display: inline;
|
|
line-height: 1.4em;
|
|
}
|
|
.charmancer .spell-item .mancer_info {
|
|
font-size: 1em;
|
|
margin-top: 0.25em;
|
|
background-color: #777;
|
|
line-height: 1em;
|
|
position: absolute;
|
|
left: 93%;
|
|
}
|
|
.charmancer .spell-item .classes {
|
|
font-size: 0.6em;
|
|
float: right;
|
|
margin-right: 7%;
|
|
}
|
|
.charmancer .spell-item .classes span:not(:last-child)::after {
|
|
content: ", ";
|
|
color: var(--eg-text);
|
|
}
|
|
.charmancer .spell-item .known {
|
|
color: var(--eg-text);
|
|
font-style: italic;
|
|
}
|
|
.charmancer .spell-item .class0 {
|
|
color: var(--eg-blue);
|
|
}
|
|
.charmancer .spell-item .class1 {
|
|
color: var(--eg-text);
|
|
}
|
|
.charmancer .spell-item .class2 {
|
|
color: #ec2127;
|
|
}
|
|
.charmancer .spell-item .class3 {
|
|
color: #447877;
|
|
}
|
|
.charmancer .container .spell-item .spellcheck {
|
|
margin-bottom: 0.3em;
|
|
margin-right: 0.3em;
|
|
}
|
|
.charmancer .spell-item .lock:not(:empty) ~ label, .charmancer .spell-item .hardlock:not(:empty) ~ label {
|
|
pointer-events: none;
|
|
}
|
|
.charmancer .spell-item .existing[value="1"] ~ label .name {
|
|
font-style: italic;
|
|
}
|
|
.charmancer .spell-item .existing[value="1"] ~ label input:not(:checked) ~ .name::before {
|
|
content: "r";
|
|
font-family: pictos;
|
|
color: red;
|
|
font-style: normal;
|
|
padding-right: 0.3em;
|
|
line-height: 1em;
|
|
}
|
|
.charmancer .spell-item .lock:not(:empty) ~ label *, .charmancer .spell-item .hardlock:not(:empty) ~ label * {
|
|
opacity: 0.6;
|
|
}
|
|
.charmancer .container .spell-item:nth-child(even) {
|
|
background-color: var(--eg-bg-alt);
|
|
}
|
|
.charmancer .spell-holder .controller:not(:empty) + .container {
|
|
height: 0;
|
|
display: none;
|
|
}
|
|
.charmancer .spell-holder .spellinfo:not(:empty) {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-top: 1em;
|
|
}
|
|
.charmancer .spell-holder .spellinfo div {
|
|
width: 49%;
|
|
}
|
|
.charmancer .spell-holder .spellinfo div div {
|
|
width: 100%;
|
|
padding-bottom: 0.3em;
|
|
}
|
|
.charmancer .spell-holder .spellinfo p {
|
|
margin: 0;
|
|
font-size: 1em;
|
|
}
|
|
.charmancer .pagelock:empty + .spellslide * {
|
|
pointer-events: none;
|
|
}
|
|
.charmancer .replace-info span {
|
|
font-family: pictos;
|
|
color: red;
|
|
}
|
|
.charmancer .asi-row .asi, .charmancer .asi-row .feat {
|
|
display: none;
|
|
}
|
|
.charmancer .asi-row .switch-container {
|
|
display: flex;
|
|
}
|
|
.charmancer .asi-row .switch-tab {
|
|
width: 50%;
|
|
border-color: var(--eg-border);
|
|
border-style: solid;
|
|
border-radius: 4px 4px 0 0;
|
|
border-width: 1px 1px 0 1px;
|
|
background-color: #aaa;
|
|
padding: 0.25em 0.5em;
|
|
margin: 0;
|
|
}
|
|
.charmancer .asi-row .switch-tab input {
|
|
display: none;
|
|
}
|
|
.charmancer .asi-row .switch:empty ~ .switch-container .asi-tab, .charmancer .asi-row .switch:not(:empty) ~ .switch-container .feat-tab {
|
|
border-bottom-width: 0;
|
|
background-color: var(--eg-bg);
|
|
}
|
|
.charmancer .asi-row .switch ~ .switch-container .feat-tab {
|
|
background-color: #bbb;
|
|
color: var(--eg-gold);
|
|
pointer-events: none;
|
|
}
|
|
.charmancer .asi-row .switch:empty ~ .asi, .charmancer .asi-row .switch:not(:empty) ~ .feat {
|
|
display: block;
|
|
border-color: var(--eg-border);
|
|
border-style: solid;
|
|
border-width: 0 1px 1px 1px;
|
|
border-radius: 0 0 4px 4px;
|
|
padding: 1em;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder {
|
|
display: flex;
|
|
width: 100%;
|
|
flex-wrap: wrap;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder div {
|
|
width: 33%;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder div:nth-child(1), .charmancer .asi-row .asi .abilities-holder div:nth-child(2), .charmancer .asi-row .asi .abilities-holder div:nth-child(3) {
|
|
margin-bottom: 1.5em;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder div div {
|
|
position: relative;
|
|
width: 1.2em;
|
|
display: inline-block;
|
|
top: -0.3em;
|
|
left: -0.5em;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder div h5 {
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder div input {
|
|
font-weight: bold;
|
|
border: none;
|
|
width: 30%;
|
|
font-size: 2em;
|
|
background-color: var(--eg-bg);
|
|
color: var(--eg-text);
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder div span {
|
|
font-size: 2em;
|
|
margin-left: 20%;
|
|
vertical-align: text-bottom;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder .spinner {
|
|
position: absolute;
|
|
left: 0;
|
|
height: 12px;
|
|
padding: 0;
|
|
font-size: 12px;
|
|
line-height: 0;
|
|
width: 100%;
|
|
border-radius: 0;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder .up-spinner {
|
|
bottom: 0;
|
|
border-bottom-width: 0;
|
|
border-radius: 2px 2px 0 0;
|
|
}
|
|
.charmancer .asi-row .asi .abilities-holder .down-spinner {
|
|
top: 0;
|
|
border-radius: 0 0 2px 2px;
|
|
}
|
|
|
|
.charsheet .charmancer .choices h2 span {
|
|
display: block;
|
|
font-size: 16px;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
color: var(--eg-text-muted);
|
|
margin: -8px 0 8px;
|
|
}
|
|
.charsheet .charmancer .choices :is(.sheet-row, .row) p {
|
|
white-space: pre-line;
|
|
}
|
|
|
|
.charmancer .asi-row .asi .abilities-holder .lock-down:not(:empty) ~ div .down-spinner, .charmancer .asi-row .asi .abilities-holder .lock-up:not(:empty) ~ div .up-spinner {
|
|
pointer-events: none;
|
|
color: rgba(0, 0, 0, 0.3);
|
|
background-color: rgba(232, 232, 232, 0.3);
|
|
}
|
|
.charmancer .lp-summary {
|
|
display: flex;
|
|
width: 100%;
|
|
min-height: 200px;
|
|
border: 1px solid var(--eg-text);
|
|
margin-bottom: 2em;
|
|
}
|
|
.charmancer .lp-summary div {
|
|
width: 50%;
|
|
}
|
|
.charmancer .lp-summary div div {
|
|
width: 100%;
|
|
padding-top: 0.5em;
|
|
}
|
|
.charmancer .lp-summary .before {
|
|
border-right: 1px solid var(--eg-text);
|
|
}
|
|
.charmancer .lp-summary div h2 {
|
|
width: 100%;
|
|
color: white;
|
|
border-bottom: 1px solid var(--eg-text);
|
|
box-sizing: border-box;
|
|
padding-left: 0.5em;
|
|
font-size: 1.5em;
|
|
}
|
|
.charmancer .lp-summary .before h2 {
|
|
background-color: black;
|
|
}
|
|
.charmancer .lp-summary .after h2 {
|
|
background-color: #999;
|
|
}
|
|
.charmancer .lp-summary :is(.sheet-row, .row) {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.charmancer .lp-summary :is(.sheet-row, .row)::before {
|
|
margin: 0.5em;
|
|
}
|
|
.charmancer .lp-summary .ability-row {
|
|
width: 100%;
|
|
display: flex;
|
|
padding: 0;
|
|
font-size: 1.2em;
|
|
}
|
|
.charmancer .lp-summary .ability-row div {
|
|
width: 16.6%;
|
|
text-align: center;
|
|
padding: 0;
|
|
}
|
|
.charmancer .lp-summary .ability-row h5 {
|
|
font-size: 1.1em;
|
|
line-height: 1.2em;
|
|
}
|
|
.charmancer .lp-summary p {
|
|
font-weight: bold;
|
|
margin: 0;
|
|
padding-left: 0.5em;
|
|
}
|
|
.charmancer .lp-summary p span {
|
|
font-weight: normal;
|
|
}
|
|
.charmancer .lp-summary .highlight {
|
|
background-color: #e6d6b8;
|
|
}
|
|
.charmancer .lp-summary span.highlight {
|
|
color: red;
|
|
}
|
|
.charmancer .lp-summary ~ div.summary {
|
|
width: 100%;
|
|
}
|
|
|
|
/* Firefox 3.5+ */
|
|
body:not(:-moz-handler-blocked) .charmancer .steps {
|
|
top: -0.8em;
|
|
}
|
|
body:not(:-moz-handler-blocked) .charmancer .bottombar {
|
|
bottom: -0.8em;
|
|
}
|
|
|
|
.pc .globalattack {
|
|
border: none;
|
|
}
|
|
.pc div.sheet.global-dmg div.global-mod div.rows {
|
|
margin-bottom: 5px;
|
|
}
|
|
.pc div.sheet.global-dmg div.global-mod div.rows span {
|
|
display: inline;
|
|
margin-left: 25px;
|
|
}
|
|
.pc div.global-dmg .global-mod {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.pc div.global-dmg div:is(.sheet-display, .display) {
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
.pc div.global-dmg div:is(.sheet-display, .display) span.title {
|
|
padding-right: 0px;
|
|
width: 40%;
|
|
}
|
|
.pc div.global-dmg div:is(.sheet-display, .display) span.subheader {
|
|
display: inline;
|
|
padding-right: 0px;
|
|
width: 50%;
|
|
}
|
|
.pc div.global-dmg div:is(.sheet-display, .display) span.subheader span {
|
|
display: inline;
|
|
padding: 4px 0px;
|
|
}
|
|
|
|
/* Customizations for the PC's global damage area */
|
|
div.globaldisplay {
|
|
width: 80%;
|
|
background-color: var(--eg-bg-alt);
|
|
border-bottom-right-radius: 5px;
|
|
border-top-left-radius: 5px;
|
|
display: inline-block;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
line-height: 16px;
|
|
padding-bottom: 3px;
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
padding-top: 3px;
|
|
text-align: left;
|
|
text-overflow: ellipsis;
|
|
}
|
|
div.globaldisplay span {
|
|
display: inline;
|
|
}
|
|
|
|
.pc .global-mod .options-flag:not(:checked) ~ :is(.sheet-display, .display) .title {
|
|
background-color: transparent;
|
|
flex: 1;
|
|
min-width: 0;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
color: var(--eg-text);
|
|
padding: 0;
|
|
text-align: left;
|
|
}
|
|
.pc .global-mod .options-flag:not(:checked) ~ :is(.sheet-display, .display) .subheader {
|
|
background-color: transparent !important;
|
|
display: flex !important;
|
|
flex-shrink: 0;
|
|
align-items: center;
|
|
padding: 0 !important;
|
|
height: auto !important;
|
|
width: auto !important;
|
|
}
|
|
.pc .global-mod .options-flag:not(:checked) ~ :is(.sheet-display, .display) .subheader span {
|
|
background: transparent !important;
|
|
width: 60px !important;
|
|
text-align: center !important;
|
|
display: block !important;
|
|
flex-shrink: 0;
|
|
font-size: 11px !important;
|
|
font-weight: normal !important;
|
|
color: var(--eg-text-muted) !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
}
|
|
.pc .global-mod .options-flag:not(:checked) ~ :is(.sheet-display, .display) .subheader span:last-child {
|
|
width: 96px !important;
|
|
}
|
|
.pc .global-mod .active-flag {
|
|
flex-shrink: 0;
|
|
align-self: center;
|
|
margin-right: 6px;
|
|
}
|
|
.pc .global-mod .options-flag:checked ~ .active-flag {
|
|
margin-bottom: 50px;
|
|
}
|
|
.pc .global-mod .options-flag:checked ~ :is(.sheet-display, .display) {
|
|
display: none;
|
|
}
|
|
/* Gear icon - global-mod rows */
|
|
.pc .global-mod .options-flag + span {
|
|
font-family: 'Material Symbols Outlined' !important;
|
|
font-size: 0 !important;
|
|
color: var(--eg-gold) !important;
|
|
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24 !important;
|
|
text-transform: none !important;
|
|
font-variant: normal !important;
|
|
opacity: 0.6;
|
|
}
|
|
.pc .global-mod .options-flag + span::before {
|
|
content: 'settings';
|
|
font-size: 14px;
|
|
line-height: 18px;
|
|
}
|
|
.pc .global-mod:hover .options-flag + span {
|
|
opacity: 1;
|
|
}
|
|
|
|
/* Level HP Bar */
|
|
.charmancer .levels-hp-row {
|
|
background: var(--eg-bg-alt);
|
|
border-radius: 0.25em;
|
|
border: 1px solid #aaa;
|
|
margin: 0.5em 0;
|
|
padding: 0.25em;
|
|
position: relative;
|
|
z-index: 0;
|
|
}
|
|
.charmancer .levels-hp-row h2 {
|
|
line-height: normal;
|
|
height: 1em;
|
|
vertical-align: middle;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle, .charmancer .levels-hp-row .class1_rollhp, .charmancer .levels-hp-row .class2_rollhp, .charmancer .levels-hp-row .class3_rollhp, .charmancer .levels-hp-row .class4_rollhp {
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
}
|
|
.charmancer .levels-hp-row input[name=comp_class1_addhp], .charmancer .levels-hp-row input[name=comp_class2_addhp], .charmancer .levels-hp-row input[name=comp_class3_addhp], .charmancer .levels-hp-row input[name=comp_class4_addhp] {
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
}
|
|
.charmancer .levels-hp-row button[name=act_class1_addhpAverage], .charmancer .levels-hp-row button[name=act_class2_addhpAverage], .charmancer .levels-hp-row button[name=act_class3_addhpAverage], .charmancer .levels-hp-row button[name=act_class4_addhpAverage] {
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ .class1_by-levels, .charmancer .levels-hp-row .hpbylevel-toggle:checked ~ .class2_by-levels, .charmancer .levels-hp-row .hpbylevel-toggle:checked ~ .class3_by-levels, .charmancer .levels-hp-row .hpbylevel-toggle:checked ~ .class4_by-levels {
|
|
border-top: 1px solid #aaa;
|
|
margin: -0.25em !important;
|
|
margin-top: 0.25em !important;
|
|
overflow: hidden;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse + div > div {
|
|
background: var(--eg-bg);
|
|
display: inline-block;
|
|
border-radius: 0 0 0.25em 0.25em;
|
|
padding: 0;
|
|
width: 100%;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse + div > label {
|
|
display: none;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse + div > div > label {
|
|
display: none;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse + div > div > div {
|
|
padding: 0.25em;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse + div > div > div:nth-child(odd) {
|
|
background: var(--eg-bg-alt);
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse + div > div > div label {
|
|
font-size: 24px;
|
|
vertical-align: middle;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse + div > div > div button {
|
|
vertical-align: middle;
|
|
}
|
|
.charmancer .levels-multiclass .hide-multiclass[value="0"] ~ :is(.sheet-row, .row):nth-of-type(1n+2), .charmancer .levels-multiclass .hide-multiclass[value="1"] ~ :is(.sheet-row, .row):nth-of-type(1n+3), .charmancer .levels-multiclass .hide-multiclass[value="2"] ~ :is(.sheet-row, .row):nth-of-type(1n+4), .charmancer .levels-multiclass .hide-multiclass[value="3"] ~ :is(.sheet-row, .row):nth-of-type(1n+5) {
|
|
display: none;
|
|
}
|
|
.charmancer .levels-multiclass .class1_selector, .charmancer .levels-multiclass .class2_selector, .charmancer .levels-multiclass .class3_selector, .charmancer .levels-multiclass .class4_selector {
|
|
display: inline-block;
|
|
width: 45%;
|
|
}
|
|
.charmancer .levels-multiclass button {
|
|
margin: 0% 1%;
|
|
font-weight: 500;
|
|
line-height: 18px;
|
|
height: 18px;
|
|
}
|
|
.charmancer .levels-multiclass h2 {
|
|
display: inline-block;
|
|
margin-right: 2%;
|
|
width: auto;
|
|
}
|
|
.charmancer .levels-multiclass :is(.sheet-row, .row) h2 + input {
|
|
margin-right: 2%;
|
|
}
|
|
.charmancer .levels-multiclass .multiclass_message {
|
|
display: inline-block;
|
|
width: auto;
|
|
margin-right: 25%;
|
|
}
|
|
.charmancer .levels-multiclass .levels-message {
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
}
|
|
.charmancer .levels-multiclass .levels-multiclass-buttons div {
|
|
display: inline-block;
|
|
margin-left: 5%;
|
|
width: auto;
|
|
}
|
|
.charmancer .levels-multiclass .add_multiclass {
|
|
margin-left: 25%;
|
|
}
|
|
.charmancer .levels-multiclass .add_multiclass button[type=action]:disabled {
|
|
cursor: not-allowed;
|
|
}
|
|
.charmancer .levels-multiclass .hp-flag[value=roll] ~ div > button[name*=rollhp], .charmancer .levels-multiclass .hp-flag[value=average] ~ div > button[name*=averagehp], .charmancer .levels-multiclass .hp-flag[value=roll] ~ button[name*=rollhp], .charmancer .levels-multiclass .hp-flag[value=average] ~ button[name*=averagehp] {
|
|
background-color: var(--eg-blue-bright);
|
|
color: #fff;
|
|
}
|
|
.charmancer .levels-hp-row :is(.sheet-row, .row) div > label {
|
|
display: inline;
|
|
}
|
|
.charmancer .sheet-compendium-class-name {
|
|
font-family: "Source Sans Pro", "Varta", arial, sans-serif;
|
|
font-size: 28px;
|
|
text-transform: capitalize;
|
|
font-variant: small-caps;
|
|
font-weight: bold;
|
|
}
|
|
.charmancer .lock-custom-class[value="1"] ~ .class1_container {
|
|
pointer-events: none;
|
|
background-color: var(--eg-bg-alt);
|
|
}
|
|
.charmancer .lock-custom-class[value="1"] ~ .class1_container input, .charmancer .lock-custom-class[value="1"] ~ .class1_container select, .charmancer .lock-custom-class[value="1"] ~ .class1_container button {
|
|
background-color: var(--eg-bg-alt) !important;
|
|
color: var(--eg-text-muted) !important;
|
|
cursor: not-allowed !important;
|
|
}
|
|
.charmancer .custom_warning {
|
|
display: none;
|
|
}
|
|
.charmancer .lock-custom-class[value="1"] ~ .class1_container .class_features_container, .charmancer .lock-custom-class[value="1"] ~ .class1_container .subclass_features_container {
|
|
display: none;
|
|
}
|
|
.charmancer .lock-custom-class[value="1"] ~ .class1_container .custom_warning {
|
|
display: block;
|
|
margin-bottom: 10px;
|
|
font-weight: bold;
|
|
}
|
|
.charmancer .levels-hp-row input.hpbylevel-toggle {
|
|
opacity: 0;
|
|
display: inline-block !important;
|
|
width: 1.5em;
|
|
height: 1.5em;
|
|
position: absolute;
|
|
right: 0.25em;
|
|
z-index: 1;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle ~ .collapse {
|
|
display: inline-block;
|
|
font-family: pictos;
|
|
font-size: 1.5em;
|
|
transform: rotate(90deg);
|
|
position: absolute;
|
|
right: 0.25em;
|
|
top: 9px;
|
|
z-index: 0;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse {
|
|
transform: rotate(-90deg);
|
|
margin-left: 0.4em;
|
|
}
|
|
.charmancer .levels-hp-row .class1_by-levels, .charmancer .levels-hp-row .class2_by-levels, .charmancer .levels-hp-row .class3_by-levels, .charmancer .levels-hp-row .class4_by-levels, .charmancer .levels-hp-row span.collapse + div {
|
|
display: none;
|
|
}
|
|
.charmancer .levels-hp-row .hpbylevel-toggle:checked ~ .class1_by-levels, .charmancer .levels-hp-row .hpbylevel-toggle:checked ~ .class2_by-levels, .charmancer .levels-hp-row .hpbylevel-toggle:checked ~ .class3_by-levels, .charmancer .levels-hp-row .hpbylevel-toggle:checked ~ .class4_by-levels, .charmancer .levels-hp-row .hpbylevel-toggle:checked ~ span.collapse + div {
|
|
display: block;
|
|
}
|
|
.charmancer button.step.disabled {
|
|
pointer-events: none;
|
|
opacity: 0.3;
|
|
}
|
|
|
|
/* Level HP expanded */
|
|
/* DEV 1378 */
|
|
/* levels-multiclass is the div encompassing the overall class section of the levels slide */
|
|
/* These are the two buttons to add or remove a multiclass */
|
|
/* The hidden checkbox to expanded or collapse the by level */
|
|
/* Icon for the collpase & expand toggle */
|
|
/* Toggles to expand & collapse the HP by levels */
|
|
.utilityrow label span span {
|
|
display: inline;
|
|
}
|
|
|
|
/* cleaning up level slide class feature display */
|
|
.charmancer .choices .class1_features, .charmancer .choices .class2_features, .charmancer .choices .class3_features, .charmancer .choices .class4_features, .charmancer .choices .subclass1_features, .charmancer .choices .subclass2_features, .charmancer .choices .subclass3_features, .charmancer .choices .subclass4_features {
|
|
font-size: 14px;
|
|
margin: 0.5em 0;
|
|
}
|
|
.charmancer .choices .subclass1_features_title, .charmancer .choices .subclass2_features_title, .charmancer .choices .subclass3_features_title, .charmancer .choices .subclass4_features_title {
|
|
margin-top: 0.5em;
|
|
display: inline-block !important;
|
|
}
|
|
.charmancer .choices .utilityrow {
|
|
margin-bottom: 1em;
|
|
}
|
|
.charmancer .choices .utilityrow .result {
|
|
font-weight: normal;
|
|
margin-bottom: -0.25em;
|
|
display: block;
|
|
font-size: 13px;
|
|
}
|
|
.charmancer p.prereq {
|
|
color: red;
|
|
margin-top: -0.5em;
|
|
}
|
|
.charmancer p.prereq span {
|
|
display: inline;
|
|
padding-right: 0.2em;
|
|
}
|
|
|
|
/* CHARACTERMANCER */
|
|
div.charmancer div.sheet-licensedsheet-flag {
|
|
display: none;
|
|
}
|
|
div.charmancer .logos, div.charmancer .logos {
|
|
display: flex;
|
|
width: 100%;
|
|
text-align: center;
|
|
flex-flow: column;
|
|
margin-bottom: 1em;
|
|
}
|
|
div.charmancer .charmancer-logo {
|
|
margin: 0 auto;
|
|
background: url("https://files.d20.io/images/175804954/NpVwmiRV0kYn9jOSipyXyA/med.png?1604618290");
|
|
background-position: center;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
display: flex;
|
|
width: 70%;
|
|
height: 5em;
|
|
}
|
|
div.charmancer .compendium-logo, div.charmancer .compendium-logo {
|
|
margin: 0 auto;
|
|
background: url("https://raw.githubusercontent.com/skydawn1/esper_genesis/master/EG_Logo.png");
|
|
background-position: center;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
display: flex;
|
|
width: 50%;
|
|
height: 3em;
|
|
}
|
|
|
|
/* ROLL TEMPLATE */
|
|
.sheet-rolltemplate-simple div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-atk div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-dmg div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-atkdmg div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-desc div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-spell div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-traits div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-npc div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-npcatk div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-npcdmg div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-npcaction div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-mancerroll div[class|=sheet-licensedsheet-flag], .sheet-rolltemplate-mancerhproll div[class|=sheet-licensedsheet-flag] {
|
|
display: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-simple, .sheet-rolltemplate-atk, .sheet-rolltemplate-atkdmg, .sheet-rolltemplate-dmg, .sheet-rolltemplate-desc {
|
|
image-rendering: -webkit-optimize-contrast;
|
|
}
|
|
|
|
/* Licensed Styling Start */
|
|
.charsheet .pc {
|
|
/* PC Ship */
|
|
}
|
|
.charsheet .pc label {
|
|
/* Reset only the platform/UA label margin (Bootstrap reboot adds margin-bottom).
|
|
Do NOT reset padding here: labels have no default padding, so 'padding:0' served
|
|
no purpose against the platform and only clobbered component <label> padding
|
|
(e.g. .tab-row .tab-label) - in Legacy those components had an auto-.charsheet
|
|
specificity boost that beat the reset; in CSE they don't. */
|
|
margin: 0;
|
|
}
|
|
.charsheet .pc textarea {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
}
|
|
.charsheet .pc .attributes-container {
|
|
margin-top: 0 !important;
|
|
}
|
|
.charsheet .pc .attributes-container :is(.sheet-attr-container, .attr-container) {
|
|
background: #010101;
|
|
border: 0;
|
|
border-radius: 5px 0 0 5px;
|
|
color: white;
|
|
position: relative;
|
|
}
|
|
.charsheet .pc .attributes-container :is(.sheet-attr-container, .attr-container) button[type=roll] {
|
|
color: white;
|
|
}
|
|
.charsheet .pc .attributes-container :is(.sheet-attr-container, .attr-container) input:not([value^="-"]):not([value="0"]) + .attr:before {
|
|
content: "+";
|
|
}
|
|
.charsheet .pc .attributes-container :is(.sheet-attr-container, .attr-container) .attr-mod {
|
|
background: #edcc8c;
|
|
border-color: #edcc8c;
|
|
border-radius: 5px;
|
|
color: var(--eg-text);
|
|
}
|
|
.charsheet .pc .attributes-container :is(.sheet-attr-container, .attr-container):after, .charsheet .pc .attributes-container :is(.sheet-attr-container, .attr-container):before {
|
|
background: var(--eg-bg);
|
|
border-radius: 5px;
|
|
content: "";
|
|
height: 10px;
|
|
position: absolute;
|
|
right: -5px;
|
|
width: 10px;
|
|
}
|
|
.charsheet .pc .attributes-container :is(.sheet-attr-container, .attr-container):after {
|
|
bottom: -5px;
|
|
}
|
|
.charsheet .pc .attributes-container :is(.sheet-attr-container, .attr-container):before {
|
|
top: -5px;
|
|
}
|
|
/* Abilities Bar - horizontal row above body (all three main tabs) */
|
|
.charsheet .sheet-pc-default .abilities-bar {
|
|
display: flex;
|
|
width: 860px;
|
|
border: 1.5px solid var(--eg-gold);
|
|
border-radius: 5px;
|
|
background: transparent;
|
|
margin-top: 6px;
|
|
margin-bottom: 0;
|
|
position: relative;
|
|
padding: 26px 0 4px;
|
|
}
|
|
/* Hide the duplicate final-score span next to the score input */
|
|
.charsheet .pc .abilities-bar .finalattr {
|
|
display: none;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-col {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
padding: 6px 4px 4px;
|
|
position: relative;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-col:not(:last-of-type)::after {
|
|
content: '';
|
|
position: absolute;
|
|
right: 0;
|
|
top: 6px;
|
|
bottom: 4px;
|
|
width: 1px;
|
|
background: #3a2e14;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-header button[type=roll] {
|
|
color: var(--eg-blue);
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
line-height: 1;
|
|
background: transparent;
|
|
border: none;
|
|
padding: 0;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
background-image: none;
|
|
min-width: 28px;
|
|
text-align: center;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-header button[type=roll]:before {
|
|
content: "" !important;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-header .baseattr {
|
|
width: 30px;
|
|
text-align: center;
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 3px;
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
color: var(--eg-text) !important;
|
|
background: var(--eg-bg-alt) !important;
|
|
box-shadow: none !important;
|
|
-webkit-appearance: none;
|
|
padding: 1px 2px;
|
|
margin-top: 0;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-modifiers {
|
|
display: flex;
|
|
gap: 3px;
|
|
width: 100%;
|
|
justify-content: center;
|
|
}
|
|
/* Mod/Save outer blocks - flex column containers only, no background */
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-mod-block,
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-save-block {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 4px;
|
|
min-width: 46px;
|
|
text-align: center;
|
|
}
|
|
/* Inner framed value box - light gray with gold border, centered content */
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-val-box {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: var(--eg-bg-alt);
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 4px;
|
|
padding: 4px 5px;
|
|
width: 46px;
|
|
min-height: 46px;
|
|
box-sizing: border-box;
|
|
}
|
|
/* Value spans inside val-box */
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-val-box .attr,
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-val-box .save-val {
|
|
font-size: 20px;
|
|
line-height: 24px;
|
|
color: var(--eg-text);
|
|
font-weight: bold;
|
|
display: block;
|
|
margin-top: 0 !important;
|
|
}
|
|
/* Roll buttons inside val-box - transparent, no chrome */
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-val-box button[type=roll] {
|
|
background: transparent;
|
|
border: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
background-image: none;
|
|
padding: 0;
|
|
display: block;
|
|
cursor: pointer;
|
|
color: var(--eg-text);
|
|
font-size: 20px;
|
|
line-height: 24px;
|
|
font-weight: bold;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-val-box button[type=roll]:before {
|
|
content: "" !important;
|
|
}
|
|
/* + prefix for positive modifiers */
|
|
.charsheet .pc .abilities-bar .ability-mod-block input[type=hidden]:not([value^="-"]):not([value="0"]) + button .attr:before {
|
|
content: "+";
|
|
}
|
|
/* + prefix for positive save values */
|
|
.charsheet .pc .abilities-bar .ability-save-block input[type=hidden]:not([value^="-"]):not([value="0"]) + button .save-val:before {
|
|
content: "+";
|
|
}
|
|
/* Proficiency checkbox - overlaps the bottom edge of the val-box */
|
|
/* Saving throw proficiency - styled as circular pip (blue when checked) */
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-save-block > input[type=checkbox] {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
display: block !important;
|
|
width: 12px !important;
|
|
height: 12px !important;
|
|
border-radius: 50% !important;
|
|
border: 1.5px dashed var(--eg-blue-bright) !important;
|
|
background: transparent !important;
|
|
cursor: pointer !important;
|
|
margin: -10px auto 0 !important;
|
|
padding: 0 !important;
|
|
box-shadow: none !important;
|
|
flex-shrink: 0;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-save-block > input[type=checkbox]:checked {
|
|
background: var(--eg-blue-bright) !important;
|
|
border-color: var(--eg-blue-bright) !important;
|
|
border-style: solid !important;
|
|
}
|
|
/* Label below the val-box */
|
|
.charsheet .sheet-pc-default .abilities-bar .ab-label {
|
|
font-size: 8px;
|
|
color: var(--eg-text-muted);
|
|
text-transform: uppercase;
|
|
font-weight: bold;
|
|
display: block;
|
|
text-align: center;
|
|
line-height: 1.2;
|
|
margin-top: 0 !important;
|
|
}
|
|
/* Push the Mod label down to align with Save label (which sits below the checkbox) */
|
|
.charsheet .sheet-pc-default .abilities-bar .ability-mod-block .ab-label {
|
|
margin-top: 6px !important;
|
|
}
|
|
/* Section label - Oxanium blue small-caps header at top-left of bar */
|
|
.charsheet .sheet-pc-default .abilities-bar .ab-section-label {
|
|
position: absolute;
|
|
top: 2px;
|
|
left: 8px;
|
|
background: transparent;
|
|
padding: 8px;
|
|
line-height: 1;
|
|
}
|
|
.charsheet .sheet-pc-default .abilities-bar .ab-section-label span {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
font-variant: small-caps;
|
|
text-transform: none;
|
|
letter-spacing: normal;
|
|
margin-top: 0 !important;
|
|
}
|
|
/* Reduce body top margin since abilities bar provides spacing above */
|
|
.charsheet .pc .page.bio .body,
|
|
.charsheet .pc .page.spells .body,
|
|
.charsheet .pc .page.core .body {
|
|
margin-top: 6px;
|
|
}
|
|
/* Hide abilities bar when Starship sheet type is active */
|
|
/* abilities-bar starship-hide removed: redundant - the tab system already hides the
|
|
whole PC view (incl. abilities bar) when the Starship tab is selected. */
|
|
.charsheet .pc .skills-list {
|
|
overflow: hidden;
|
|
padding-top: 0;
|
|
}
|
|
.charsheet .pc .skills-list .skill:nth-child(odd) {
|
|
background: var(--eg-bg-tint);
|
|
border-bottom: 1px solid #aadaf0;
|
|
border-top-color: 1px solid #aadaf0;
|
|
}
|
|
.charsheet .pc .skills-list .skill:nth-child(even) {
|
|
background: var(--eg-bg);
|
|
border-bottom: 1px solid var(--eg-bg);
|
|
border-top-color: 1px solid var(--eg-bg);
|
|
}
|
|
.charsheet .pc .spell-level {
|
|
background: var(--eg-gold-light);
|
|
border: 1px solid #68593d;
|
|
border-radius: 5px;
|
|
position: relative;
|
|
padding: 7px;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
.charsheet .pc .spell-level > *:not(.rank):not(.tp) {
|
|
display: none;
|
|
}
|
|
/* Orphaned OGL column-header row - replaced by inline per-bar labels */
|
|
.charsheet .pc .spell-labels {
|
|
display: none !important;
|
|
}
|
|
/* Hide slot counters for TP-only classes (Melder/Adept) and Talent Slot classes (Cybermancer) */
|
|
.charsheet .pc .page.spells .uses-power-slots-flag:not([value="1"]) ~ .body .spell-level .total,
|
|
.charsheet .pc .page.spells .uses-power-slots-flag:not([value="1"]) ~ .body .spell-level .expended {
|
|
display: none !important;
|
|
}
|
|
/* ---- Esper Powers: Slot Total / Remaining counters ---- */
|
|
.charsheet .pc .spell-level .total {
|
|
display: flex !important;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
order: 2;
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
height: auto;
|
|
border: none;
|
|
background: transparent;
|
|
margin-left: 0;
|
|
border-radius: 0;
|
|
}
|
|
.charsheet .pc .spell-level .total span {
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
position: static;
|
|
top: 0;
|
|
display: block;
|
|
text-align: center;
|
|
width: auto;
|
|
min-width: 16px;
|
|
line-height: 1;
|
|
margin-top: 0;
|
|
}
|
|
.charsheet .pc .spell-level .total::after {
|
|
content: "TOTAL";
|
|
font-family: Oxanium, sans-serif;
|
|
font-size: 8px;
|
|
font-weight: bold;
|
|
color: rgba(0,0,0,0.45);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.3px;
|
|
display: block;
|
|
text-align: center;
|
|
margin-top: 2px;
|
|
}
|
|
.charsheet .pc .spell-level .expended {
|
|
display: flex !important;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
order: 3;
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
height: auto;
|
|
border: none;
|
|
background: transparent;
|
|
margin-left: 0;
|
|
border-radius: 0;
|
|
}
|
|
.charsheet .pc .spell-level .expended input[type=number] {
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
width: 36px;
|
|
height: 22px;
|
|
text-align: center;
|
|
background: rgba(255,255,255,0.6);
|
|
border: 1px solid rgba(103,89,61,0.6) !important;
|
|
border-radius: 3px;
|
|
padding: 0;
|
|
margin: 0;
|
|
box-shadow: none !important;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: textfield;
|
|
}
|
|
.charsheet .pc .spell-level .expended::after {
|
|
content: "REMAINING";
|
|
font-family: Oxanium, sans-serif;
|
|
font-size: 8px;
|
|
font-weight: bold;
|
|
color: rgba(0,0,0,0.45);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.3px;
|
|
display: block;
|
|
text-align: center;
|
|
margin-top: 2px;
|
|
}
|
|
.charsheet .pc .spell-level .rank {
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
margin: 0;
|
|
flex: 1 1 auto;
|
|
width: auto;
|
|
order: 1;
|
|
}
|
|
.charsheet .pc .spell-level .rank span {
|
|
display: inline;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
margin: 0;
|
|
width: auto;
|
|
color: var(--eg-text);
|
|
}
|
|
.charsheet .pc .spell-level .rank span:last-child {
|
|
margin-left: 5px;
|
|
}
|
|
.charsheet .pc .spell-level .tp {
|
|
border: 0;
|
|
color: #394876;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
margin: 0;
|
|
flex: 0 0 auto;
|
|
text-transform: uppercase;
|
|
width: auto;
|
|
order: 4;
|
|
}
|
|
.charsheet .pc .spell-level .tp:before {
|
|
content: "tp:";
|
|
}
|
|
.charsheet .pc .equipment .weighttotal {
|
|
top: 70px;
|
|
}
|
|
|
|
.charsheet .pc .sheet-pc-ship input {
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-flex-container {
|
|
display: flex;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-grid-container {
|
|
display: grid;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship span {
|
|
display: inline-block;
|
|
font-size: 11px;
|
|
line-height: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship span[data-i18n*=-info] {
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship h3 span {
|
|
font-size: 16px;
|
|
line-height: normal;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship input[type=text],
|
|
.charsheet .pc .sheet-pc-ship input[type=number],
|
|
.charsheet .pc .sheet-pc-ship select,
|
|
.charsheet .pc .sheet-pc-ship textarea {
|
|
border: 1px solid var(--eg-text);
|
|
border-radius: 0;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) {
|
|
margin-bottom: 20px;
|
|
padding-top: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-ship-logo-footer {
|
|
text-align: right;
|
|
padding: 12px 10px 8px 0;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-ship-logo-footer .sheet-ship-logo-img {
|
|
width: 266px;
|
|
opacity: 0.85;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-ship-top-layout {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: stretch;
|
|
gap: 12px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-token-frame, .token-frame) {
|
|
width: 90px;
|
|
flex-shrink: 0;
|
|
border: 3px solid var(--eg-gold);
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
background: var(--eg-bg);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-char-avatar, .char-avatar) {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
display: block;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-ship-info {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
gap: 4px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) .sheet-flex-container {
|
|
align-items: flex-end;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) label {
|
|
margin-right: 5px;
|
|
width: auto;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) label span {
|
|
font-size: 13px;
|
|
line-height: normal;
|
|
white-space: nowrap;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) input[type=text] {
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
background: transparent;
|
|
border: none;
|
|
border-bottom: 1px solid var(--eg-border);
|
|
border-radius: 0;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) input[type=text]:not(:last-child) {
|
|
margin-right: 5px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) input.sheet-ship-compact {
|
|
max-width: 90px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-crew-roles {
|
|
border: 1px solid var(--eg-gold-light);
|
|
border-radius: 6px;
|
|
margin-bottom: 20px;
|
|
padding: 12px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-crew-roles .sheet-flex-container {
|
|
gap: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-crew-roles .sheet-crew-field {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex: 1;
|
|
min-width: 0;
|
|
width: auto;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-crew-roles .sheet-crew-field input[type=text] {
|
|
background: transparent;
|
|
border: none;
|
|
border-bottom: 1px solid var(--eg-border);
|
|
border-radius: 0;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-crew-roles .sheet-crew-field span {
|
|
color: var(--eg-text);
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
letter-spacing: 1px;
|
|
margin-top: 4px;
|
|
text-transform: uppercase;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-piloting-maneuver-check h3 button {
|
|
background: none;
|
|
border: none;
|
|
box-shadow: none;
|
|
text-shadow: none;
|
|
color: inherit;
|
|
cursor: pointer;
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
font-weight: inherit;
|
|
padding: 0;
|
|
text-decoration: underline;
|
|
text-decoration-style: dotted;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) {
|
|
grid-column-gap: 40px;
|
|
/* Explicit, content-independent column tracks. Previously only grid-template-areas
|
|
was set (no grid-template-columns), so the three columns were auto-sized to their
|
|
content. Opening a weapon's options submenu changed the right column's content
|
|
width, which reflowed the whole row (other columns shrank/grew). minmax(0, Nfr)
|
|
pins the proportions (measured from the stable closed layout: left 277 / center 180
|
|
/ right 323) so content can no longer drive the track sizes, while fr keeps the
|
|
columns fluid as the sheet is resized. */
|
|
grid-template-columns: minmax(0, 277fr) minmax(0, 180fr) minmax(0, 323fr);
|
|
grid-template-areas: "left center right";
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left {
|
|
-ms-grid-row: 1;
|
|
-ms-grid-column: 1;
|
|
-ms-grid-column-span: 11;
|
|
grid-area: left;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities {
|
|
color: white;
|
|
grid-gap: 10px;
|
|
grid-template-areas: "pilot captain" "technician1 technician2" "commander commander";
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities h3 {
|
|
border-bottom: 2px solid var(--eg-gold-light);
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities h3 span {
|
|
color: white;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities > div {
|
|
border: 2px solid var(--eg-gold-light);
|
|
background: black;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities > div .sheet-flex-container {
|
|
margin: 0 auto;
|
|
max-width: 150px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities > div > span:last-child {
|
|
text-align: center;
|
|
text-transform: uppercase;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-pilot {
|
|
-ms-grid-row: 1;
|
|
-ms-grid-column: 1;
|
|
grid-area: pilot;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-captain {
|
|
-ms-grid-row: 1;
|
|
-ms-grid-column: 3;
|
|
grid-area: captain;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-technician1 {
|
|
-ms-grid-row: 3;
|
|
-ms-grid-column: 1;
|
|
grid-area: technician1;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-technician2 {
|
|
-ms-grid-row: 3;
|
|
-ms-grid-column: 3;
|
|
grid-area: technician2;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-commander {
|
|
-ms-grid-row: 5;
|
|
-ms-grid-column: 1;
|
|
-ms-grid-column-span: 3;
|
|
grid-area: commander;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-commander .sheet-ability {
|
|
min-width: 25%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-commander .sheet-flex-container {
|
|
max-width: 300px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-ability {
|
|
min-width: 50%;
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-ability label {
|
|
display: block;
|
|
margin: 0;
|
|
padding: 0;
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-ability label span {
|
|
color: white;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-abilities .sheet-ability input {
|
|
border-radius: 24px;
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
height: 48px;
|
|
outline: none;
|
|
text-align: center;
|
|
width: 48px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-sensors-and-initiative {
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-gap: 20px;
|
|
margin-top: 20px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-sensors-and-initiative .sheet-sensors label span {
|
|
font-size: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-sensors-and-initiative .sheet-initiative label {
|
|
grid-template-columns: 48px 1fr;
|
|
grid-gap: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-sensors-and-initiative .sheet-initiative label input {
|
|
background: var(--eg-bg);
|
|
border: 2px solid var(--eg-text);
|
|
border-radius: 24px;
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
height: 48px;
|
|
outline: none;
|
|
text-align: center;
|
|
width: 48px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-left .sheet-sensors-and-initiative .sheet-initiative label span {
|
|
align-items: center;
|
|
display: flex;
|
|
font-size: 11px;
|
|
font-weight: normal;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center {
|
|
-ms-grid-row: 1;
|
|
-ms-grid-column: 13;
|
|
-ms-grid-column-span: 9;
|
|
grid-area: center;
|
|
max-width: 180px;
|
|
min-width: 180px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-piloting-maneuver-check h3 {
|
|
margin-bottom: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-piloting-maneuver-check h3 span {
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-piloting-maneuver-check h3 button span {
|
|
margin-left: 4px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-piloting-maneuver-check img {
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-piloting-maneuver-check p {
|
|
border-color: #394872;
|
|
border-style: solid;
|
|
border-width: 3px 0;
|
|
font-size: 11px;
|
|
line-height: 1em;
|
|
margin-top: 10px;
|
|
padding: 5px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice {
|
|
border: 1px solid var(--eg-text);
|
|
background: var(--eg-bg-tint);
|
|
margin-top: 20px;
|
|
padding: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice h3 {
|
|
margin-bottom: 8px;
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice > label {
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice label {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice select {
|
|
width: auto;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice > label span {
|
|
text-transform: lowercase;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice > label span:first-letter {
|
|
text-transform: uppercase;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice > label span:after {
|
|
content: ":";
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice .sheet-grid-container {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-gap: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-command-dice .sheet-grid-container span {
|
|
font-size: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-intercept-speed {
|
|
grid-template-columns: 68px 1fr;
|
|
grid-gap: 5px;
|
|
margin-top: 20px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-intercept-speed > div:last-child label {
|
|
border-color: #394872;
|
|
border-style: solid;
|
|
border-width: 3px 0;
|
|
box-sizing: border-box;
|
|
font-size: 11px;
|
|
margin: 0;
|
|
padding: 2px 5px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-center .sheet-intercept-speed > div:last-child label input {
|
|
width: auto;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right {
|
|
-ms-grid-row: 1;
|
|
-ms-grid-column: 23;
|
|
-ms-grid-column-span: 11;
|
|
grid-area: right;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right .sheet-maneuver-save h3 {
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right .sheet-maneuver-save .sheet-grid-container {
|
|
grid-template-columns: 106px 1fr;
|
|
grid-gap: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right .sheet-maneuver-save .sheet-grid-container > div:first-child img {
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right .sheet-maneuver-save .sheet-grid-container > div:last-child {
|
|
align-items: center;
|
|
display: flex;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right .sheet-maneuver-save .sheet-grid-container > div:last-child label {
|
|
border: 1px solid var(--eg-text);
|
|
background: var(--eg-bg-tint);
|
|
padding: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right .sheet-maneuver-save .sheet-grid-container > div:last-child label span {
|
|
font-size: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row {
|
|
grid-template-columns: 1fr 1fr;
|
|
margin-top: 20px;
|
|
padding-bottom: 20px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-special-features h3 {
|
|
border-bottom: 1px solid var(--eg-text);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-special-features .repcontainer .repitem {
|
|
position: relative;
|
|
border-bottom: 1px solid var(--eg-text);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-special-features .repcontainer .repitem textarea {
|
|
left: 0;
|
|
height: 100%;
|
|
min-height: 30px;
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-special-features .repcontainer .repitem span {
|
|
display: inline-block;
|
|
line-height: 30px;
|
|
min-height: 25px;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-special-features .repcontainer .repitem textarea:focus {
|
|
opacity: 1;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-special-features .repcontainer .repitem textarea:focus + span {
|
|
opacity: 0;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-ship-cargo .repcontainer {
|
|
border: 1px solid var(--eg-text);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-ship-cargo .repcontainer .repitem:not(:first-child) {
|
|
border-top: 1px solid var(--eg-text);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-ship-cargo .repcontainer .repitem .sheet-grid-container {
|
|
grid-template-columns: 1fr 85px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-features-cargo-row .sheet-ship-cargo .repcontainer .repitem .sheet-grid-container input {
|
|
border: none;
|
|
border-radius: 0;
|
|
line-height: 22px;
|
|
outline: none;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right .sheet-ship-cargo .repcontainer .repitem .sheet-grid-container div:first-child input {
|
|
border-right: 1px solid var(--eg-text);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-middle, .middle) .sheet-col-right .sheet-ship-cargo .repcontainer .repitem .sheet-grid-container div:last-child input {
|
|
text-align: right;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) {
|
|
margin-top: 40px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container {
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-gap: 17px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-armor-class, .charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense {
|
|
border: 1px solid var(--eg-text);
|
|
background: var(--eg-bg-tint);
|
|
padding: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-armor-class h3, .charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense h3 {
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-armor-class > .sheet-grid-container, .charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense > .sheet-grid-container {
|
|
grid-template-columns: 98px 1fr;
|
|
grid-gap: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-armor-class > .sheet-grid-container > div:first-child, .charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense > .sheet-grid-container > div:first-child {
|
|
align-items: center;
|
|
display: flex;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-armor-class > .sheet-grid-container .sheet-grid-container, .charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense > .sheet-grid-container .sheet-grid-container {
|
|
grid-template-rows: repeat(4, 1fr);
|
|
grid-template-columns: 30px 1fr;
|
|
grid-gap: 5px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-armor-class > .sheet-grid-container .sheet-grid-container input, .charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense > .sheet-grid-container .sheet-grid-container input {
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense .sheet-static-num {
|
|
display: block;
|
|
width: 100%;
|
|
text-align: center;
|
|
border: 1px solid var(--eg-border);
|
|
background: var(--eg-bg);
|
|
font-size: 14px;
|
|
line-height: 22px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-armor-class > .sheet-grid-container .sheet-grid-container label, .charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense > .sheet-grid-container .sheet-grid-container label {
|
|
align-items: center;
|
|
display: flex;
|
|
line-height: 11px;
|
|
position: relative;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-armor-class > .sheet-grid-container .sheet-grid-container label span, .charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:first-child .sheet-grid-container .sheet-maneuver-defense > .sheet-grid-container .sheet-grid-container label span {
|
|
font-size: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-grid-container > div:last-child > .sheet-grid-container {
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-gap: 17px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-defense-systems {
|
|
margin-top: 20px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-defense-systems .repcontainer .repitem {
|
|
position: relative;
|
|
border-bottom: 1px solid var(--eg-text);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-defense-systems .repcontainer .repitem textarea {
|
|
left: 0;
|
|
height: 100%;
|
|
min-height: 30px;
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-defense-systems .repcontainer .repitem span {
|
|
display: inline-block;
|
|
line-height: 30px;
|
|
min-height: 25px;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-defense-systems .repcontainer .repitem textarea:focus {
|
|
opacity: 1;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-bottom, .bottom) .sheet-defense-systems .repcontainer .repitem textarea:focus + span {
|
|
opacity: 0;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-fancy-input {
|
|
position: relative;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-fancy-input img {
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-fancy-input input {
|
|
background: none;
|
|
border: none;
|
|
font-size: 36px;
|
|
left: 50%;
|
|
margin: 0;
|
|
outline: none;
|
|
padding: 0;
|
|
position: absolute;
|
|
text-align: center;
|
|
top: 50%;
|
|
transform: translate(-50%, -50%);
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .repcontainer {
|
|
column-gap: 20px;
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .repcontainer .repitem {
|
|
border-top: 2px solid var(--eg-gold-light);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-action {
|
|
position: relative;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-flag {
|
|
cursor: pointer;
|
|
height: 18px;
|
|
margin: 0;
|
|
opacity: 0;
|
|
position: absolute;
|
|
right: 2px;
|
|
top: 4px;
|
|
width: 18px;
|
|
z-index: 2;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-flag + span {
|
|
align-items: center;
|
|
color: var(--eg-text-faint);
|
|
cursor: pointer;
|
|
display: none;
|
|
font-family: pictos;
|
|
font-size: 18px;
|
|
height: 18px;
|
|
justify-content: center;
|
|
position: absolute;
|
|
right: 2px;
|
|
top: 4px;
|
|
width: 18px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-flag:checked + span {
|
|
color: var(--eg-text);
|
|
display: flex;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-action:hover .sheet-weapon-flag + span {
|
|
display: flex;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-flag:checked ~ .sheet-weapon-options {
|
|
display: block;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-flag:not(:checked) ~ .sheet-weapon-options {
|
|
display: none;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-flag:checked ~ .sheet-weapon-display {
|
|
display: none;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-flag:not(:checked) ~ .sheet-weapon-display {
|
|
display: block;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options {
|
|
padding: 4px 0;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options .sheet-weapon-row {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: 6px;
|
|
margin-bottom: 4px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options .sheet-weapon-row > span {
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
white-space: nowrap;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options .sheet-weapon-row > span:first-child {
|
|
min-width: 60px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options .sheet-weapon-row input[type=text] {
|
|
border: none;
|
|
border-bottom: 1px solid var(--eg-text);
|
|
flex: 1;
|
|
font-size: 12px;
|
|
min-width: 0;
|
|
padding: 1px 2px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options .sheet-weapon-row input[type=checkbox] {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
border: 1px solid var(--eg-text);
|
|
flex: none;
|
|
height: 14px;
|
|
outline: none;
|
|
width: 14px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options .sheet-weapon-row input[type=checkbox]:checked {
|
|
background: black;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-display button[type=roll] {
|
|
align-items: center;
|
|
background: none;
|
|
border: none;
|
|
box-shadow: none;
|
|
text-shadow: none;
|
|
color: inherit;
|
|
cursor: pointer;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
column-gap: 6px;
|
|
row-gap: 0;
|
|
padding: 4px 0;
|
|
text-align: left;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-display button[type=roll] img {
|
|
height: 16px;
|
|
width: 16px;
|
|
flex: 0 0 auto;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-display button[type=roll]:hover {
|
|
color: var(--eg-blue-bright);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-display button[type=roll] .sheet-weapon-name {
|
|
flex: 0 0 auto;
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-display button[type=roll] .sheet-weapon-meta {
|
|
color: var(--eg-text-muted);
|
|
flex: 0 0 100%;
|
|
font-size: 11px;
|
|
font-style: italic;
|
|
}
|
|
/* Weapon roll button: hide Roll20's default d20 die glyph (the ::before pictos "t")
|
|
that renders before the weapon name in the collapsed display. Use display:none (not
|
|
content:"") so the pseudo-element is removed from the button's flex flow entirely -
|
|
an empty ::before would still occupy a flex slot plus the 6px column-gap, nudging
|
|
the weapon name to the right. */
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-display button[type=roll]::before {
|
|
display: none !important;
|
|
}
|
|
/* The gear/lock toggle is absolutely positioned at the top-right of the weapon row.
|
|
Previously a 22px right gutter on the whole .sheet-weapon-action shrank the entire
|
|
submenu (every input row) to clear it, so the options box looked narrower than the
|
|
section header/divider. All option rows now span the full section width; the only
|
|
element the toggle overlaps is the gunner-name input (last field on the first row),
|
|
so just that input gets a right inset to keep its text clear of the gear. */
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-display {
|
|
padding-right: 22px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options .sheet-weapon-row:first-child input[name="attr_gunner"] {
|
|
padding-right: 22px;
|
|
}
|
|
/* Give the weapon-name field more room than the gunner-name field on the shared
|
|
first row so longer names (e.g. "Autocannon") are not truncated. */
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-options .sheet-weapon-row input[name="attr_weapon"] {
|
|
flex: 1.6;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-systems-info {
|
|
margin-top: 2px;
|
|
pointer-events: none;
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-weapon-systems .sheet-weapon-systems-info span {
|
|
background: var(--eg-bg-tint);
|
|
border: 1px solid var(--eg-text);
|
|
display: inline-block;
|
|
font-size: 11px;
|
|
line-height: normal;
|
|
margin: 0 auto;
|
|
padding: 2px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-hull-points h3 {
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-hull-points .sheet-fancy-input {
|
|
margin-bottom: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-hull-points .sheet-fancy-input h3 {
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-hull-points .sheet-fancy-input img {
|
|
min-width: 153px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-resistances, .resistances) {
|
|
margin-top: 20px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-resistances, .resistances) h3 {
|
|
border-bottom: 1px solid var(--eg-text);
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-resistances, .resistances) h3 span {
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-resistances, .resistances) .repcontainer .repitem {
|
|
position: relative;
|
|
border-bottom: 1px solid var(--eg-text);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-resistances, .resistances) .repcontainer .repitem textarea {
|
|
left: 0;
|
|
height: 100%;
|
|
min-height: 30px;
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-resistances, .resistances) .repcontainer .repitem span {
|
|
display: inline-block;
|
|
line-height: 30px;
|
|
min-height: 25px;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-resistances, .resistances) .repcontainer .repitem textarea:focus {
|
|
opacity: 1;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship :is(.sheet-resistances, .resistances) .repcontainer .repitem textarea:focus + span {
|
|
opacity: 0;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-patch-repair {
|
|
border: 1px solid var(--eg-text);
|
|
background: var(--eg-bg-tint);
|
|
padding: 0 20px 10px 20px;
|
|
margin-top: 20px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-patch-repair h3 {
|
|
border-bottom: 1px solid var(--eg-text);
|
|
line-height: normal;
|
|
margin-bottom: 5px;
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-patch-repair h3 span {
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-patch-repair label {
|
|
line-height: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-patch-repair label span {
|
|
font-size: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-patch-repair label input {
|
|
text-align: center;
|
|
width: 34px;
|
|
height: 34px;
|
|
min-width: 0;
|
|
padding: 0;
|
|
margin: 0 auto;
|
|
display: block;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-patch-repair .sheet-grid-container {
|
|
align-items: end;
|
|
justify-content: center;
|
|
grid-template-columns: repeat(3, 34px);
|
|
grid-gap: 8px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-patch-repair span[data-i18n=patch-repair-info] {
|
|
display: block;
|
|
font-size: 9px;
|
|
margin-top: 5px;
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-damage-taken h3 {
|
|
text-align: right;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-damage-taken h3 span {
|
|
font-size: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-damage-taken .sheet-grid-container {
|
|
border: 1px solid var(--eg-text);
|
|
grid-template-columns: 50px 1fr;
|
|
grid-gap: 10px;
|
|
padding: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-damage-taken .sheet-grid-container label {
|
|
line-height: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-damage-taken .sheet-grid-container label span {
|
|
font-size: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-damage-taken .sheet-grid-container > div label:last-child {
|
|
margin-top: 20px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-damage-taken .sheet-grid-container > label span {
|
|
text-align: right;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity {
|
|
border: 1px solid var(--eg-text);
|
|
background: var(--eg-bg-tint);
|
|
margin-top: 20px;
|
|
padding: 0 10px 10px 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity h3 {
|
|
line-height: normal;
|
|
margin-bottom: 5px;
|
|
text-align: center;
|
|
border-bottom: 1px solid var(--eg-text);
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity span {
|
|
font-size: 11px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity .sheet-grid-container {
|
|
align-items: stretch;
|
|
grid-template-columns: 94px 1fr;
|
|
grid-gap: 10px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity .sheet-grid-container > label {
|
|
background: var(--eg-bg);
|
|
border: 1px solid var(--eg-text);
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity .sheet-fancy-input input {
|
|
font-size: 26px;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity .sheet-grid-container > label input {
|
|
border: 0;
|
|
flex: 1;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity .sheet-grid-container > label span {
|
|
display: inline-block;
|
|
font-size: 11px;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-structural-integrity > span {
|
|
display: block;
|
|
font-size: 11px;
|
|
margin-top: 6px;
|
|
text-align: center;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-max-weapon-payload {
|
|
align-items: center;
|
|
grid-template-columns: 1fr 34px !important;
|
|
grid-gap: 10px !important;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-max-weapon-payload label {
|
|
text-align: right;
|
|
}
|
|
.charsheet .pc .sheet-pc-ship .sheet-max-weapon-payload div input {
|
|
border-radius: 24px;
|
|
height: 34px;
|
|
line-height: 34px;
|
|
outline: none;
|
|
text-align: center;
|
|
width: 34px;
|
|
}
|
|
|
|
.pc .sheet-pc-ship {
|
|
display: none;
|
|
}
|
|
.pc .sheet-pc-default .tab-button.type-pc + span {
|
|
color: #FFFFFF;
|
|
background-color: var(--eg-hp-green);
|
|
}
|
|
|
|
.sheet-pc-type[value=starship] ~ .pc {
|
|
width: 100%;
|
|
}
|
|
.sheet-pc-type[value=starship] ~ .pc .sheet-pc-default {
|
|
display: none;
|
|
}
|
|
.sheet-pc-type[value=starship] ~ .pc .sheet-pc-ship {
|
|
display: block;
|
|
}
|
|
|
|
|
|
/* ---- Feature: Short/Long Rest Buttons ---- */
|
|
.resources .rest {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 10px;
|
|
margin: 10px 0 -5px 0;
|
|
}
|
|
.resources .rest button {
|
|
width: 100%;
|
|
margin: 0;
|
|
box-sizing: border-box;
|
|
background: var(--eg-bg-alt);
|
|
border: 1px solid var(--eg-gold);
|
|
border-radius: 6px;
|
|
padding: 8px 12px;
|
|
min-height: 34px;
|
|
cursor: pointer;
|
|
transition: background 0.2s, color 0.2s, border-color 0.2s;
|
|
}
|
|
.resources .rest button:hover {
|
|
background: var(--eg-gold) !important;
|
|
border-color: var(--eg-gold) !important;
|
|
}
|
|
.resources .rest button:hover span {
|
|
color: #fff !important;
|
|
}
|
|
.resources .rest button span {
|
|
font-family: 'Oxanium', sans-serif !important;
|
|
font-size: 12px !important;
|
|
font-weight: bold !important;
|
|
color: var(--eg-gold) !important;
|
|
font-variant: small-caps !important;
|
|
letter-spacing: 1px !important;
|
|
}
|
|
input[name="attr_use_rest_buttons"]:not([value="1"]) + .resources .rest {
|
|
display: none !important;
|
|
}
|
|
input[name="attr_show_tp_resource"]:not([value="1"]) + .hdice-dsaves-container .tp-resource-slot {
|
|
display: none !important;
|
|
}
|
|
/* Make the TP + Other Resource container a flex row so:
|
|
- both visible: TP on left, Other Resource on right (space-between)
|
|
- TP hidden: Other Resource sits on the left with no gap
|
|
Flex also ignores the float:right inline style on Other Resource and prevents height collapse. */
|
|
input[name="attr_show_tp_resource"] + .hdice-dsaves-container {
|
|
display: flex !important;
|
|
justify-content: space-between;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
/* ---- Feature: Hero Points ---- */
|
|
.hero-points {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: stretch;
|
|
width: 100%;
|
|
margin-top: 8px;
|
|
border: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
border-radius: 6px;
|
|
overflow: hidden;
|
|
}
|
|
/* Header bar via pseudo-element - spans full flex row width */
|
|
.hero-points::before {
|
|
content: 'HERO POINTS';
|
|
flex: 0 0 100%;
|
|
display: block;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
text-align: center;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb),0.5);
|
|
padding: 3px 0;
|
|
}
|
|
/* Value column - the editable count */
|
|
.hero-points .value {
|
|
flex: 0 0 48px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 4px;
|
|
border-right: 1px solid rgba(var(--eg-gold-rgb),0.4);
|
|
}
|
|
.hero-points .value input {
|
|
font-size: 22px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
border: none;
|
|
background: transparent;
|
|
width: 40px;
|
|
height: auto;
|
|
text-align: center;
|
|
padding: 0;
|
|
box-shadow: none;
|
|
}
|
|
/* Label column - the roll button */
|
|
.hero-points .label {
|
|
flex: 1;
|
|
position: relative;
|
|
display: flex;
|
|
}
|
|
.hero-points .label button {
|
|
flex: 1;
|
|
background: transparent;
|
|
background-image: none;
|
|
border: none;
|
|
box-shadow: none;
|
|
text-shadow: none;
|
|
padding: 4px 6px;
|
|
min-height: 38px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
cursor: pointer;
|
|
border-radius: 0;
|
|
margin: 0 !important;
|
|
transition: background 0.2s;
|
|
}
|
|
.hero-points .label button::before {
|
|
content: none;
|
|
}
|
|
/* The header already says HERO POINTS - hide the redundant inner span */
|
|
.hero-points .label button > span:first-child > span[data-i18n] {
|
|
display: none;
|
|
}
|
|
/* Style the outer span; the "(1D6)" text node inherits from it */
|
|
.hero-points .label button > span:first-child {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
line-height: 1;
|
|
}
|
|
/* "NONE LEFT" - hidden by default, shown in red when count reaches 0 */
|
|
.hero-points .label button > span:last-of-type {
|
|
display: none;
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 8px;
|
|
font-weight: bold;
|
|
color: var(--eg-danger);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
margin-top: 3px;
|
|
}
|
|
/* Hidden checkbox - triggers consumed_hero_points sheetworker on click */
|
|
.hero-points .label button input {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
opacity: 0;
|
|
pointer-events: all;
|
|
width: 100% !important;
|
|
height: 100% !important;
|
|
}
|
|
/* Hover: gold tint with blue text */
|
|
.charsheet .hero-points .label button:hover {
|
|
background: rgba(var(--eg-gold-rgb),0.12) !important;
|
|
}
|
|
.charsheet .hero-points .label button:hover > span:first-child {
|
|
color: var(--eg-blue-bright) !important;
|
|
}
|
|
/* When hero_points = 0: disable button and reveal NONE LEFT */
|
|
.hero-points input[name="attr_hero_points"][value="0"] ~ .label button {
|
|
pointer-events: none !important;
|
|
}
|
|
.hero-points input[name="attr_hero_points"][value="0"] ~ .label button > span:first-child {
|
|
opacity: 0.35;
|
|
}
|
|
.hero-points input[name="attr_hero_points"][value="0"] ~ .label button > span:last-of-type {
|
|
display: block;
|
|
}
|
|
/* Hide entire section when the setting is off */
|
|
input[name="attr_use_hero_points"]:not([value="1"]) + .hero-points {
|
|
display: none;
|
|
}
|
|
|
|
/* ---- Feature 9: Skill Toggle (Show 5E Skills?) ---- */
|
|
/* Hide the controlling checkbox inputs in the sheet flow */
|
|
.show-5e-toggle,
|
|
.show-5e-settings-toggle {
|
|
display: none;
|
|
}
|
|
/* Default: hide 5E separator (separator has no conflict with redesign) */
|
|
.skills-container .fivee-separator {
|
|
display: none;
|
|
border-top: 1px solid var(--eg-border);
|
|
margin: 2px 0;
|
|
}
|
|
/* When checked: reveal separator */
|
|
input[name="attr_show_5e_skills"]:checked ~ .skills-container .fivee-separator {
|
|
display: block;
|
|
}
|
|
/* NOTE: fivee-skill hide/show rules are at the END of the file - they must
|
|
appear after the skill redesign block to win the cascade. */
|
|
|
|
/* ---- Typography: Oxanium headers ---- */
|
|
.charsheet h3,
|
|
.charsheet h3 span,
|
|
.charsheet .traits :is(.sheet-display, .display) .title,
|
|
.charsheet .spell .details span[name=attr_spellname],
|
|
.charsheet .col-full .spell-header > span,
|
|
.charsheet .npc :is(.sheet-display, .display) .title span,
|
|
.sheet-rolltemplate-npc .sheet-header,
|
|
.sheet-rolltemplate-npcaction .sheet-header,
|
|
.sheet-rolltemplate-npcatk .sheet-header,
|
|
.sheet-rolltemplate-npcdmg .sheet-header,
|
|
.sheet-rolltemplate-traits .sheet-header,
|
|
.sheet-rolltemplate-spell .sheet-title,
|
|
.charsheet .charmancer .sheet-compendium-class-name {
|
|
font-family: 'Oxanium', sans-serif;
|
|
}
|
|
|
|
/* ---- Feature 10: Currency Toggle (EG <-> 5e) ---- */
|
|
.equipment .fivee-currency {
|
|
display: none;
|
|
}
|
|
input[name="attr_currency_mode"][value="5e"] ~ .fivee-currency {
|
|
display: inline-block;
|
|
}
|
|
input[name="attr_currency_mode"][value="5e"] ~ .eg-currency {
|
|
display: none;
|
|
}
|
|
|
|
/* ---- Skills Section Redesign ---- */
|
|
|
|
/* Container: flex column so label reorders to top */
|
|
.charsheet .pc .page.core .skills-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-top: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* "SKILLS" label - moved to top, blue Oxanium header */
|
|
.charsheet .pc .page.core .skills-container > .label {
|
|
order: -1;
|
|
padding: 6px 8px 4px;
|
|
border-bottom: 1px solid var(--eg-gold);
|
|
}
|
|
.charsheet .pc .page.core .skills-container > .label span {
|
|
font-family: 'Oxanium', sans-serif;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
color: var(--eg-blue);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.05em;
|
|
text-align: left;
|
|
display: inline-block;
|
|
width: auto;
|
|
margin: 0;
|
|
}
|
|
|
|
/* Each skill row: flex, vertically centered */
|
|
.charsheet .pc .page.core .skills-list .skill {
|
|
display: flex;
|
|
align-items: center;
|
|
height: auto !important;
|
|
min-height: 26px;
|
|
padding: 2px 6px;
|
|
gap: 5px;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
}
|
|
|
|
/* Alternating rows */
|
|
.charsheet .pc .page.core .skills-list .skill:nth-child(odd) {
|
|
background: transparent;
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb), 0.2);
|
|
border-top: none;
|
|
}
|
|
.charsheet .pc .page.core .skills-list .skill:nth-child(even) {
|
|
background: rgba(0, 0, 0, 0.03);
|
|
border-bottom: 1px solid rgba(var(--eg-gold-rgb), 0.2);
|
|
border-top: none;
|
|
}
|
|
|
|
/* Roll button - skill name, left, flex-grow */
|
|
.charsheet .pc .page.core .skills-list .skill button[type=roll] {
|
|
order: 1;
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 5px;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
text-align: left;
|
|
background: transparent !important;
|
|
background-image: none !important;
|
|
border: none;
|
|
box-shadow: none;
|
|
text-shadow: none;
|
|
padding: 0;
|
|
width: auto;
|
|
overflow: visible;
|
|
white-space: nowrap;
|
|
color: inherit;
|
|
}
|
|
.charsheet .pc .page.core .skills-list .skill button[type=roll]::before {
|
|
content: "" !important;
|
|
}
|
|
|
|
/* Stat abbreviation inside the roll button - muted, small-caps */
|
|
.charsheet .pc .page.core .skills-list .skill button[type=roll] span {
|
|
color: var(--eg-text-muted);
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
font-variant: small-caps;
|
|
text-transform: uppercase;
|
|
display: inline;
|
|
margin: 0;
|
|
}
|
|
|
|
/* Bonus badge - dark background, white text */
|
|
.charsheet .pc .page.core .skills-list .skill > span {
|
|
order: 2;
|
|
background: #2c2c2c;
|
|
color: #fff;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
min-width: 32px;
|
|
padding: 2px 5px;
|
|
border-radius: 3px;
|
|
text-align: center;
|
|
display: inline-block;
|
|
flex-shrink: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* "+" prefix for non-negative, non-zero bonuses */
|
|
.charsheet .pc .page.core .skills-list .skill input[type=hidden] + span::before {
|
|
content: "+";
|
|
}
|
|
.charsheet .pc .page.core .skills-list .skill input[type=hidden][value^="-"] + span::before,
|
|
.charsheet .pc .page.core .skills-list .skill input[type=hidden][value="0"] + span::before {
|
|
content: "";
|
|
}
|
|
|
|
/* Proficiency pip - circular, gold border -> blue fill when checked */
|
|
.charsheet .pc .page.core .skills-list .skill input[type=checkbox] {
|
|
order: 3;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
width: 14px;
|
|
height: 14px;
|
|
border: 2px solid var(--eg-gold);
|
|
border-radius: 50%;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
flex-shrink: 0;
|
|
margin: 0;
|
|
}
|
|
.charsheet .pc .page.core .skills-list .skill input[type=checkbox]:checked {
|
|
background: var(--eg-blue-bright);
|
|
border-color: var(--eg-blue-bright);
|
|
}
|
|
|
|
/* Proficient: bonus badge gets deeper blue */
|
|
.charsheet .pc .page.core .skills-list .skill input[type=checkbox]:checked ~ span {
|
|
background: var(--eg-blue-bright);
|
|
}
|
|
|
|
/* 5E skill row toggle - MUST be last: overrides redesign's display:flex (specificity 0,5,0) via
|
|
equal specificity + later cascade position (hide), and !important (show). */
|
|
.charsheet .pc .page.core .skills-list .fivee-skill {
|
|
display: none;
|
|
}
|
|
input[name="attr_show_5e_skills"]:checked ~ .skills-container .fivee-skill {
|
|
display: flex !important;
|
|
}
|
|
|
|
/* ---- EG Logo footer - bottom-right of PC sheet, visible on all tabs ---- */
|
|
.pc-logo-footer {
|
|
text-align: right;
|
|
padding: 12px 10px 8px 0;
|
|
}
|
|
.pc-logo-footer .pc-logo-img {
|
|
width: 266px;
|
|
opacity: 0.85;
|
|
}
|
|
|
|
|
|
/* ============================================================
|
|
DARK MODE - activated by Roll20's global Accessibility toggle,
|
|
which adds `.sheet-darkmode` to <body>. Keeps the EG gold/blue
|
|
identity on a charcoal background. Tune values here only.
|
|
============================================================ */
|
|
body.sheet-darkmode {
|
|
--eg-gold: #c2a05f;
|
|
--eg-gold-rgb: 194, 160, 95;
|
|
--eg-gold-light: #e6cd96;
|
|
--eg-blue: #7eb6e8;
|
|
--eg-blue-rgb: 126, 182, 232;
|
|
--eg-blue-fill: #3a6ea5;
|
|
--eg-blue-bright: #4aa3ec;
|
|
--eg-blue-bright-rgb: 74, 163, 236;
|
|
--eg-hp-green: #1fd98c;
|
|
--eg-success: #2ecc71;
|
|
--eg-danger: #e74c3c;
|
|
--eg-text: #e6e6e6;
|
|
--eg-text-muted: #b0b0b0;
|
|
--eg-text-faint: #8a8a8a;
|
|
--eg-bg: #262629;
|
|
--eg-bg-alt: #303034;
|
|
--eg-bg-tint: #2d3640;
|
|
--eg-bg-input: #1e1e21;
|
|
--eg-border: #45454b;
|
|
--eg-border-faint: #3a3a3f;
|
|
}
|
|
|
|
/* DARK MODE - roll template tokens. Light tokens sit on the template roots
|
|
themselves (because :root does not reach chat); an element's own custom-prop
|
|
declaration beats an ancestor, so body.sheet-darkmode alone could not re-theme
|
|
the templates. Re-declare dark tokens at the template-root level (higher
|
|
specificity) so chat templates follow dark mode as well. */
|
|
body.sheet-darkmode .sheet-rolltemplate-simple,
|
|
body.sheet-darkmode .sheet-rolltemplate-atk,
|
|
body.sheet-darkmode .sheet-rolltemplate-dmg,
|
|
body.sheet-darkmode .sheet-rolltemplate-atkdmg,
|
|
body.sheet-darkmode .sheet-rolltemplate-desc,
|
|
body.sheet-darkmode .sheet-rolltemplate-spell,
|
|
body.sheet-darkmode .sheet-rolltemplate-traits,
|
|
body.sheet-darkmode .sheet-rolltemplate-npc,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcatk,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcdmg,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcaction,
|
|
body.sheet-darkmode .sheet-rolltemplate-mancerroll,
|
|
body.sheet-darkmode .sheet-rolltemplate-mancerhproll {
|
|
--eg-gold: #c2a05f;
|
|
--eg-gold-rgb: 194, 160, 95;
|
|
--eg-gold-light: #e6cd96;
|
|
--eg-blue: #7eb6e8;
|
|
--eg-blue-rgb: 126, 182, 232;
|
|
--eg-blue-fill: #3a6ea5;
|
|
--eg-blue-bright: #4aa3ec;
|
|
--eg-blue-bright-rgb: 74, 163, 236;
|
|
--eg-hp-green: #1fd98c;
|
|
--eg-success: #2ecc71;
|
|
--eg-danger: #e74c3c;
|
|
--eg-text: #e6e6e6;
|
|
--eg-text-muted: #b0b0b0;
|
|
--eg-text-faint: #8a8a8a;
|
|
--eg-bg: #262629;
|
|
--eg-bg-alt: #303034;
|
|
--eg-bg-tint: #2d3640;
|
|
--eg-bg-input: #1e1e21;
|
|
--eg-border: #45454b;
|
|
--eg-border-faint: #3a3a3f;
|
|
}
|
|
|
|
/* DARK MODE - Inventory item submenu panel. The base .subitem background is a
|
|
fixed light rgba(255,255,255,0.6), which renders as a light-gray panel even in
|
|
dark mode - so the themed (light) body text in the PROP/MODS .subfield values
|
|
becomes unreadable. Darken the panel so the light text has contrast. */
|
|
body.sheet-darkmode .page.bio .equipment .item .subitem {
|
|
background: var(--eg-bg-alt);
|
|
}
|
|
|
|
/* DARK MODE - Esper Powers rank headers. Their gold background (--eg-gold-light)
|
|
stays light in dark mode, washing out the light text. Switch it to the darker
|
|
--eg-gold used by the active sheet tabs so the light text stays legible. */
|
|
body.sheet-darkmode .charsheet .pc .spell-level {
|
|
background: var(--eg-gold);
|
|
}
|
|
/* TOTAL/REMAINING slot numbers: the dark-mode light blue is too pale on gold -
|
|
use the light-mode --eg-blue (#245485) for contrast. */
|
|
body.sheet-darkmode .charsheet .pc .spell-level .total span,
|
|
body.sheet-darkmode .charsheet .pc .spell-level .expended input[type=number] {
|
|
color: #245485;
|
|
}
|
|
|
|
/* DARK MODE - Starship sheet text. The platform sets a dark color directly on
|
|
h3 headings, labels and inputs, which blocks the .pc light-text inheritance,
|
|
so the ship section headers and top-bar fields render near-black on the dark
|
|
sheet. Re-assert the theme text color (light in dark mode). The ability
|
|
circles keep their own white/dark colors via more specific rules, so they
|
|
are untouched here. */
|
|
|
|
/* Resource number inputs - native spin buttons appear as light gray boxes in
|
|
dark mode. color-scheme: dark tells the browser to render native controls
|
|
(including spin buttons) using dark UI styling. */
|
|
body.sheet-darkmode .charsheet .resources input[type=number] {
|
|
color-scheme: dark;
|
|
}
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship h3,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship h3 span,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) label span,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship :is(.sheet-top, .top) input[type=text] {
|
|
color: var(--eg-text);
|
|
}
|
|
/* Center numbers that sit on dark circle graphics - make them white for contrast
|
|
in dark mode: Piloting Maneuver Check, Maneuver Save DC, Initiative, Armor
|
|
Class, Maneuver Defense, Hull Points, Structural Integrity, Intercept Speed. */
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship .sheet-piloting-maneuver-check .sheet-fancy-input input,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship .sheet-maneuver-save .sheet-fancy-input input,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship .sheet-initiative input,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship .sheet-armor-class .sheet-fancy-input input,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship .sheet-maneuver-defense .sheet-fancy-input input,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship .sheet-hull-points .sheet-fancy-input input,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship .sheet-structural-integrity .sheet-fancy-input input,
|
|
body.sheet-darkmode .charsheet .pc .sheet-pc-ship .sheet-intercept-speed .sheet-fancy-input input {
|
|
color: #ffffff;
|
|
}
|
|
|
|
/* DARK MODE - Charactermancer. Roll20's leveler renders its intro text, class
|
|
names, ability labels, and choice labels in a dark gray (inherited from the
|
|
platform default) that EG never overrode, so it is nearly unreadable on the
|
|
dark charmancer background. Force the charmancer text to the light theme color
|
|
(mirrors the OGL sheet, which relies on a light inherited body color), and
|
|
invert the black CHARACTERMANCER wordmark so it shows on dark. The colorful
|
|
Esper Genesis .compendium-logo is left untouched. */
|
|
body.sheet-darkmode .charmancer,
|
|
body.sheet-darkmode .charmancer p,
|
|
body.sheet-darkmode .charmancer b,
|
|
body.sheet-darkmode .charmancer i,
|
|
body.sheet-darkmode .charmancer li,
|
|
body.sheet-darkmode .charmancer span,
|
|
body.sheet-darkmode .charmancer label,
|
|
body.sheet-darkmode .charmancer .label,
|
|
body.sheet-darkmode .charmancer h1,
|
|
body.sheet-darkmode .charmancer h2,
|
|
body.sheet-darkmode .charmancer h3,
|
|
body.sheet-darkmode .charmancer h4,
|
|
body.sheet-darkmode .charmancer h5,
|
|
body.sheet-darkmode .charmancer h6,
|
|
body.sheet-darkmode .charmancer div {
|
|
color: var(--eg-text);
|
|
}
|
|
/* Keep the warning / required emphasis legible (blue) rather than washed light. */
|
|
body.sheet-darkmode .charmancer :is(.sheet-warning, .warning),
|
|
body.sheet-darkmode .charmancer button:is(.sheet-warning, .warning) {
|
|
color: var(--eg-blue);
|
|
}
|
|
/* Invert the black CHARACTERMANCER wordmark image for the dark background. */
|
|
body.sheet-darkmode .charmancer .charmancer-logo {
|
|
filter: invert(0.85);
|
|
}
|
|
/* Review (Before/After Leveling): the changed-row highlight is a hardcoded beige
|
|
(#e6d6b8) that stays light in dark mode, making the light text on it unreadable.
|
|
Swap it for a dark blue-gray tint that still reads as a highlighted row, and
|
|
brighten the red "changed value" text for the dark background. */
|
|
body.sheet-darkmode .charmancer .lp-summary .highlight {
|
|
background-color: var(--eg-bg-tint);
|
|
}
|
|
body.sheet-darkmode .charmancer .lp-summary span.highlight {
|
|
color: var(--eg-danger);
|
|
}
|
|
|
|
/* Roll templates render in chat outside .charsheet; Roll20 adds
|
|
.sheet-rolltemplate-darkmode at the SAME level as the template class. */
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atk,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atkdmg,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-desc,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-dmg,
|
|
.sheet-rolltemplate-darkmode.rolltemplate-inline,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-mancerhproll,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-mancerroll,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npc,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcaction,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcatk,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcdmg,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-simple,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-spell,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-traits {
|
|
--eg-gold: #c2a05f;
|
|
--eg-gold-rgb: 194, 160, 95;
|
|
--eg-gold-light: #e6cd96;
|
|
--eg-blue: #7eb6e8;
|
|
--eg-blue-rgb: 126, 182, 232;
|
|
--eg-blue-fill: #3a6ea5;
|
|
--eg-blue-bright: #4aa3ec;
|
|
--eg-blue-bright-rgb: 74, 163, 236;
|
|
--eg-hp-green: #1fd98c;
|
|
--eg-success: #2ecc71;
|
|
--eg-danger: #e74c3c;
|
|
--eg-text: #e6e6e6;
|
|
--eg-text-muted: #b0b0b0;
|
|
--eg-text-faint: #8a8a8a;
|
|
--eg-bg: #262629;
|
|
--eg-bg-alt: #303034;
|
|
--eg-bg-tint: #2d3640;
|
|
--eg-bg-input: #1e1e21;
|
|
--eg-border: #45454b;
|
|
--eg-border-faint: #3a3a3f;
|
|
}
|
|
|
|
/* DARK MODE - features and proficiencies (traits template): blue-gray panel,
|
|
bright-blue header, white body text, dark gold border. Scoped to the traits
|
|
template only; attack/damage templates keep their charcoal look. Both selector
|
|
forms cover Roll20's two dark signals (compound class + body ancestor). */
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-traits,
|
|
body.sheet-darkmode .sheet-rolltemplate-traits {
|
|
background-color: #2c353f;
|
|
border: 1.5px solid #c2a05f;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-traits .sheet-header,
|
|
body.sheet-darkmode .sheet-rolltemplate-traits .sheet-header {
|
|
color: #4aa3ec;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-traits .sheet-desc,
|
|
body.sheet-darkmode .sheet-rolltemplate-traits .sheet-desc {
|
|
color: #ffffff;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-traits .sheet-subheader,
|
|
body.sheet-darkmode .sheet-rolltemplate-traits .sheet-subheader {
|
|
color: #cfcfcf;
|
|
}
|
|
|
|
/* DARK MODE - spell/power template: the parchment EG-powerbg.jpg background image
|
|
stays light in dark mode (the white card). Swap to the themed dark bg so it matches
|
|
the atk/dmg templates. Cover both Roll20 dark signals (compound class + body ancestor). */
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-spell .sheet-container,
|
|
body.sheet-darkmode .sheet-rolltemplate-spell .sheet-container {
|
|
background: var(--eg-bg);
|
|
}
|
|
|
|
/* DARK MODE - PC/NPC attack+damage templates: every element that uses
|
|
var(--eg-text-faint) = #8a8a8a in dark mode is raised to #b3b3b3 for
|
|
legibility on the charcoal background. Covers:
|
|
- .sheet-grey (dimmed roll when not chosen in adv/disadv)
|
|
- .sheet-label span span (attack-bonus "(+9)" inside the weapon name)
|
|
- .sheet-charname span (character name below the weapon label)
|
|
- .sheet-damagetemplate .sheet-sublabel (damage type "bludgeoning") */
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-simple .sheet-grey,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atk .sheet-grey,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atkdmg .sheet-grey,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-dmg .sheet-grey,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcatk .sheet-grey,
|
|
body.sheet-darkmode .sheet-rolltemplate-simple .sheet-grey,
|
|
body.sheet-darkmode .sheet-rolltemplate-atk .sheet-grey,
|
|
body.sheet-darkmode .sheet-rolltemplate-atkdmg .sheet-grey,
|
|
body.sheet-darkmode .sheet-rolltemplate-dmg .sheet-grey,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcatk .sheet-grey,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-simple .sheet-label span span,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atk .sheet-label span span,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atkdmg .sheet-label span span,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-dmg .sheet-label span span,
|
|
body.sheet-darkmode .sheet-rolltemplate-simple .sheet-label span span,
|
|
body.sheet-darkmode .sheet-rolltemplate-atk .sheet-label span span,
|
|
body.sheet-darkmode .sheet-rolltemplate-atkdmg .sheet-label span span,
|
|
body.sheet-darkmode .sheet-rolltemplate-dmg .sheet-label span span,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-simple .sheet-charname span,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atk .sheet-charname span,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atkdmg .sheet-charname span,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-dmg .sheet-charname span,
|
|
body.sheet-darkmode .sheet-rolltemplate-simple .sheet-charname span,
|
|
body.sheet-darkmode .sheet-rolltemplate-atk .sheet-charname span,
|
|
body.sheet-darkmode .sheet-rolltemplate-atkdmg .sheet-charname span,
|
|
body.sheet-darkmode .sheet-rolltemplate-dmg .sheet-charname span,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-atkdmg .sheet-damagetemplate .sheet-sublabel,
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-dmg .sheet-damagetemplate .sheet-sublabel,
|
|
body.sheet-darkmode .sheet-rolltemplate-atkdmg .sheet-damagetemplate .sheet-sublabel,
|
|
body.sheet-darkmode .sheet-rolltemplate-dmg .sheet-damagetemplate .sheet-sublabel {
|
|
color: #b3b3b3;
|
|
}
|
|
|
|
/* DARK MODE - NPC attack template (npcatk): bright-blue header, muted-gray
|
|
actor line, white body text, no Roll20 purple roll-result backgrounds.
|
|
Both selector forms cover Roll20's two dark signals. */
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcatk,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcatk {
|
|
color: #ffffff;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcatk .sheet-header,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcatk .sheet-header {
|
|
color: #4aa3ec;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcatk .sheet-subheader,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcatk .sheet-subheader {
|
|
color: #b3b3b3;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcatk .inlinerollresult,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcatk .inlinerollresult {
|
|
background-color: transparent !important;
|
|
border: none !important;
|
|
color: #ffffff;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcatk .inlinerollresult.fullcrit,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcatk .inlinerollresult.fullcrit {
|
|
color: #3fb315 !important;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npcatk .inlinerollresult.fullfail,
|
|
body.sheet-darkmode .sheet-rolltemplate-npcatk .inlinerollresult.fullfail {
|
|
color: #e74c3c !important;
|
|
}
|
|
|
|
/* DARK MODE - NPC info template (npc): used by Initiative, Piloting Bonus, and the
|
|
ability/save checks on the NPC + NPC Ship sheets. Mirror the npcatk (attack)
|
|
treatment so these rolls match the Autocannon look - white body text (which also
|
|
drives the template's 1px-solid currentColor border to white), bright-blue header,
|
|
muted-gray actor line, and no Roll20 purple roll-result backgrounds (the light-mode
|
|
rule themes them but lacks !important, so the platform dark default wins). Both
|
|
selector forms cover Roll20's two dark signals (compound class + body ancestor). */
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npc,
|
|
body.sheet-darkmode .sheet-rolltemplate-npc {
|
|
color: #ffffff;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npc .sheet-header,
|
|
body.sheet-darkmode .sheet-rolltemplate-npc .sheet-header {
|
|
color: #4aa3ec;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npc .sheet-subheader,
|
|
body.sheet-darkmode .sheet-rolltemplate-npc .sheet-subheader {
|
|
color: #b3b3b3;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npc .sheet-grey,
|
|
body.sheet-darkmode .sheet-rolltemplate-npc .sheet-grey {
|
|
color: #b3b3b3;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npc .inlinerollresult,
|
|
body.sheet-darkmode .sheet-rolltemplate-npc .inlinerollresult {
|
|
background-color: transparent !important;
|
|
border: none !important;
|
|
color: #ffffff;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npc .inlinerollresult.fullcrit,
|
|
body.sheet-darkmode .sheet-rolltemplate-npc .inlinerollresult.fullcrit {
|
|
color: #3fb315 !important;
|
|
}
|
|
.sheet-rolltemplate-darkmode.sheet-rolltemplate-npc .inlinerollresult.fullfail,
|
|
body.sheet-darkmode .sheet-rolltemplate-npc .inlinerollresult.fullfail {
|
|
color: #e74c3c !important;
|
|
}
|