mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
2225 lines
68 KiB
CSS
2225 lines
68 KiB
CSS
@import url("https://fonts.googleapis.com/css?family=Baumans|Roboto+Mono&display=swap");
|
|
html {
|
|
font-size: 13px;
|
|
}
|
|
|
|
#attributes:not(.active-section) > .available-dice, .sticky-sub {
|
|
top: 70.5px;
|
|
position: sticky;
|
|
z-index: 100;
|
|
}
|
|
|
|
#main h6, #main .h6, #main button[type=roll].h6, #main button[type=action].h6,
|
|
.sheet-rolltemplate-scp h6,
|
|
.sheet-rolltemplate-scp .h6,
|
|
.sheet-rolltemplate-scp button[type=roll].h6,
|
|
.sheet-rolltemplate-scp button[type=action].h6, #main h5, #main .h5, #main button[type=roll].h5, #main button[type=action].h5,
|
|
.sheet-rolltemplate-scp h5,
|
|
.sheet-rolltemplate-scp .h5,
|
|
.sheet-rolltemplate-scp button[type=roll].h5,
|
|
.sheet-rolltemplate-scp button[type=action].h5, #main h4, #main .h4, #main button[type=roll].h4, #main button[type=action].h4,
|
|
.sheet-rolltemplate-scp h4,
|
|
.sheet-rolltemplate-scp .h4,
|
|
.sheet-rolltemplate-scp button[type=roll].h4,
|
|
.sheet-rolltemplate-scp button[type=action].h4, #main h3, #main .h3, #main button[type=roll].h3, #main button[type=action].h3,
|
|
.sheet-rolltemplate-scp h3,
|
|
.sheet-rolltemplate-scp .h3,
|
|
.sheet-rolltemplate-scp button[type=roll].h3,
|
|
.sheet-rolltemplate-scp button[type=action].h3, #main .input-label.large > input,
|
|
.sheet-rolltemplate-scp .input-label.large > input, #main h2, #main .h2, #main button[type=roll].h2, #main button[type=action].h2,
|
|
.sheet-rolltemplate-scp h2,
|
|
.sheet-rolltemplate-scp .h2,
|
|
.sheet-rolltemplate-scp button[type=roll].h2,
|
|
.sheet-rolltemplate-scp button[type=action].h2 {
|
|
font-family: Roboto Mono;
|
|
}
|
|
|
|
#main *,
|
|
.sheet-rolltemplate-scp * {
|
|
font-family: Tahoma;
|
|
}
|
|
|
|
#equipment.repeating-equipment h4, #attacks > h4:not(input), :is(#knowledges, #skills, #abilities) > .header {
|
|
border: solid black;
|
|
border-width: 2px 1px;
|
|
}
|
|
|
|
#main h5, #main .h5, #main button[type=roll].h5, #main button[type=action].h5,
|
|
.sheet-rolltemplate-scp h5,
|
|
.sheet-rolltemplate-scp .h5,
|
|
.sheet-rolltemplate-scp button[type=roll].h5,
|
|
.sheet-rolltemplate-scp button[type=action].h5, #main h4, #main .h4, #main button[type=roll].h4, #main button[type=action].h4,
|
|
.sheet-rolltemplate-scp h4,
|
|
.sheet-rolltemplate-scp .h4,
|
|
.sheet-rolltemplate-scp button[type=roll].h4,
|
|
.sheet-rolltemplate-scp button[type=action].h4, #main h3, #main .h3, #main button[type=roll].h3, #main button[type=action].h3,
|
|
.sheet-rolltemplate-scp h3,
|
|
.sheet-rolltemplate-scp .h3,
|
|
.sheet-rolltemplate-scp button[type=roll].h3,
|
|
.sheet-rolltemplate-scp button[type=action].h3, #main .input-label.large > input,
|
|
.sheet-rolltemplate-scp .input-label.large > input, #main h2, #main .h2, #main button[type=roll].h2, #main button[type=action].h2,
|
|
.sheet-rolltemplate-scp h2,
|
|
.sheet-rolltemplate-scp .h2,
|
|
.sheet-rolltemplate-scp button[type=roll].h2,
|
|
.sheet-rolltemplate-scp button[type=action].h2, #security_level > .head .security_level > input, #main h1, #main .h1, #main button[type=roll].h1, #main button[type=action].h1,
|
|
.sheet-rolltemplate-scp h1,
|
|
.sheet-rolltemplate-scp .h1,
|
|
.sheet-rolltemplate-scp button[type=roll].h1,
|
|
.sheet-rolltemplate-scp button[type=action].h1 {
|
|
text-transform: capitalize;
|
|
font-weight: bold;
|
|
line-height: normal;
|
|
display: block;
|
|
white-space: nowrap;
|
|
}
|
|
#main h5 margin, #main .h5 margin, #main button[type=roll].h5 margin, #main button[type=action].h5 margin,
|
|
.sheet-rolltemplate-scp h5 margin,
|
|
.sheet-rolltemplate-scp .h5 margin,
|
|
.sheet-rolltemplate-scp button[type=roll].h5 margin,
|
|
.sheet-rolltemplate-scp button[type=action].h5 margin, #main h4 margin, #main .h4 margin, #main button[type=roll].h4 margin, #main button[type=action].h4 margin,
|
|
.sheet-rolltemplate-scp h4 margin,
|
|
.sheet-rolltemplate-scp .h4 margin,
|
|
.sheet-rolltemplate-scp button[type=roll].h4 margin,
|
|
.sheet-rolltemplate-scp button[type=action].h4 margin, #main h3 margin, #main .h3 margin, #main button[type=roll].h3 margin, #main button[type=action].h3 margin,
|
|
.sheet-rolltemplate-scp h3 margin,
|
|
.sheet-rolltemplate-scp .h3 margin,
|
|
.sheet-rolltemplate-scp button[type=roll].h3 margin,
|
|
.sheet-rolltemplate-scp button[type=action].h3 margin, #main .input-label.large > input margin,
|
|
.sheet-rolltemplate-scp .input-label.large > input margin, #main h2 margin, #main .h2 margin, #main button[type=roll].h2 margin, #main button[type=action].h2 margin,
|
|
.sheet-rolltemplate-scp h2 margin,
|
|
.sheet-rolltemplate-scp .h2 margin,
|
|
.sheet-rolltemplate-scp button[type=roll].h2 margin,
|
|
.sheet-rolltemplate-scp button[type=action].h2 margin, #security_level > .head .security_level > input margin, #main h1 margin, #main .h1 margin, #main button[type=roll].h1 margin, #main button[type=action].h1 margin,
|
|
.sheet-rolltemplate-scp h1 margin,
|
|
.sheet-rolltemplate-scp .h1 margin,
|
|
.sheet-rolltemplate-scp button[type=roll].h1 margin,
|
|
.sheet-rolltemplate-scp button[type=action].h1 margin {
|
|
top: 0px;
|
|
bottom: 0px;
|
|
}
|
|
|
|
#security_level > .head .security_level > input, #main h1, #main .h1, #main button[type=roll].h1, #main button[type=action].h1,
|
|
.sheet-rolltemplate-scp h1,
|
|
.sheet-rolltemplate-scp .h1,
|
|
.sheet-rolltemplate-scp button[type=roll].h1,
|
|
.sheet-rolltemplate-scp button[type=action].h1 {
|
|
font-size: 3rem;
|
|
display: block;
|
|
font-family: Baumans;
|
|
}
|
|
#security_level > .head .security_level > input:not(input), #main h1:not(input), #main .h1:not(input), #main button[type=roll].h1:not(input), #main button[type=action].h1:not(input),
|
|
.sheet-rolltemplate-scp h1:not(input),
|
|
.sheet-rolltemplate-scp .h1:not(input),
|
|
.sheet-rolltemplate-scp button[type=roll].h1:not(input),
|
|
.sheet-rolltemplate-scp button[type=action].h1:not(input) {
|
|
text-align: center;
|
|
}
|
|
|
|
#main .input-label.large > input,
|
|
.sheet-rolltemplate-scp .input-label.large > input, #main h2, #main .h2, #main button[type=roll].h2, #main button[type=action].h2,
|
|
.sheet-rolltemplate-scp h2,
|
|
.sheet-rolltemplate-scp .h2,
|
|
.sheet-rolltemplate-scp button[type=roll].h2,
|
|
.sheet-rolltemplate-scp button[type=action].h2 {
|
|
font-size: 2.5rem;
|
|
display: block;
|
|
}
|
|
#main .input-label.large > input:not(input),
|
|
.sheet-rolltemplate-scp .input-label.large > input:not(input), #main h2:not(input), #main .h2:not(input), #main button[type=roll].h2:not(input), #main button[type=action].h2:not(input),
|
|
.sheet-rolltemplate-scp h2:not(input),
|
|
.sheet-rolltemplate-scp .h2:not(input),
|
|
.sheet-rolltemplate-scp button[type=roll].h2:not(input),
|
|
.sheet-rolltemplate-scp button[type=action].h2:not(input) {
|
|
text-align: center;
|
|
}
|
|
|
|
#main h3, #main .h3, #main button[type=roll].h3, #main button[type=action].h3,
|
|
.sheet-rolltemplate-scp h3,
|
|
.sheet-rolltemplate-scp .h3,
|
|
.sheet-rolltemplate-scp button[type=roll].h3,
|
|
.sheet-rolltemplate-scp button[type=action].h3 {
|
|
font-size: 2rem;
|
|
display: block;
|
|
}
|
|
#main h3:not(input), #main .h3:not(input), #main button[type=roll].h3:not(input), #main button[type=action].h3:not(input),
|
|
.sheet-rolltemplate-scp h3:not(input),
|
|
.sheet-rolltemplate-scp .h3:not(input),
|
|
.sheet-rolltemplate-scp button[type=roll].h3:not(input),
|
|
.sheet-rolltemplate-scp button[type=action].h3:not(input) {
|
|
text-align: center;
|
|
}
|
|
|
|
#main h4, #main .h4, #main button[type=roll].h4, #main button[type=action].h4,
|
|
.sheet-rolltemplate-scp h4,
|
|
.sheet-rolltemplate-scp .h4,
|
|
.sheet-rolltemplate-scp button[type=roll].h4,
|
|
.sheet-rolltemplate-scp button[type=action].h4 {
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
display: block;
|
|
}
|
|
#main h4:not(input), #main .h4:not(input), #main button[type=roll].h4:not(input), #main button[type=action].h4:not(input),
|
|
.sheet-rolltemplate-scp h4:not(input),
|
|
.sheet-rolltemplate-scp .h4:not(input),
|
|
.sheet-rolltemplate-scp button[type=roll].h4:not(input),
|
|
.sheet-rolltemplate-scp button[type=action].h4:not(input) {
|
|
text-align: center;
|
|
}
|
|
|
|
#main h5, #main .h5, #main button[type=roll].h5, #main button[type=action].h5,
|
|
.sheet-rolltemplate-scp h5,
|
|
.sheet-rolltemplate-scp .h5,
|
|
.sheet-rolltemplate-scp button[type=roll].h5,
|
|
.sheet-rolltemplate-scp button[type=action].h5 {
|
|
font-size: 1rem;
|
|
display: block;
|
|
}
|
|
#main h5:not(input), #main .h5:not(input), #main button[type=roll].h5:not(input), #main button[type=action].h5:not(input),
|
|
.sheet-rolltemplate-scp h5:not(input),
|
|
.sheet-rolltemplate-scp .h5:not(input),
|
|
.sheet-rolltemplate-scp button[type=roll].h5:not(input),
|
|
.sheet-rolltemplate-scp button[type=action].h5:not(input) {
|
|
text-align: center;
|
|
}
|
|
|
|
#main h6, #main .h6, #main button[type=roll].h6, #main button[type=action].h6,
|
|
.sheet-rolltemplate-scp h6,
|
|
.sheet-rolltemplate-scp .h6,
|
|
.sheet-rolltemplate-scp button[type=roll].h6,
|
|
.sheet-rolltemplate-scp button[type=action].h6 {
|
|
font-size: 1rem;
|
|
display: block;
|
|
font-style: italic;
|
|
}
|
|
#main h6:not(input), #main .h6:not(input), #main button[type=roll].h6:not(input), #main button[type=action].h6:not(input),
|
|
.sheet-rolltemplate-scp h6:not(input),
|
|
.sheet-rolltemplate-scp .h6:not(input),
|
|
.sheet-rolltemplate-scp button[type=roll].h6:not(input),
|
|
.sheet-rolltemplate-scp button[type=action].h6:not(input) {
|
|
text-align: center;
|
|
}
|
|
|
|
.characterviewer > ul.nav-tabs > li.active {
|
|
z-index: 100;
|
|
}
|
|
.characterviewer > ul.nav-tabs a[data-tab=charsheet] {
|
|
display: flex;
|
|
align-items: center;
|
|
line-height: 1rem;
|
|
padding-top: 0;
|
|
padding-bottom: 1px;
|
|
padding-left: 6px;
|
|
}
|
|
.characterviewer > ul.nav-tabs a[data-tab=charsheet]:before {
|
|
content: "X";
|
|
background-image: url(https://s3.amazonaws.com/files.d20.io/images/237119632/ALMH-rWYBVVqwtIQI970xw/original.png);
|
|
width: 3rem;
|
|
color: transparent;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
font-size: 2rem;
|
|
line-height: normal;
|
|
}
|
|
|
|
#main,
|
|
.sheet-rolltemplate-scp {
|
|
--grid-gap:1rem;
|
|
--half-gap:calc(var(--grid-gap) / 2);
|
|
--tiny-gap:calc(var(--half-gap) / 2);
|
|
position: relative;
|
|
gap: var(--grid-gap);
|
|
--revealTime:500ms;
|
|
--delayTime:200ms;
|
|
--inputSwap:opacity var(--revealTime) ease var(--delayTime);
|
|
--focusTrans:all 500ms ease var(--delayTime);
|
|
--borderColor:black;
|
|
--fontColor:black;
|
|
--backColor:#636363;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
#main .transparent-logo,
|
|
.sheet-rolltemplate-scp .transparent-logo {
|
|
aspect-ratio: 1/1;
|
|
background-image: url("https://s3.amazonaws.com/files.d20.io/images/237119631/qha_0dNwFDUbYjLIGp2SCg/original.png");
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
}
|
|
#main .black-logo,
|
|
#main .sheet-black-logo,
|
|
.sheet-rolltemplate-scp .black-logo,
|
|
.sheet-rolltemplate-scp .sheet-black-logo {
|
|
aspect-ratio: 1/1;
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: 1fr;
|
|
grid-template-areas: "content";
|
|
}
|
|
#main .black-logo > .logo,
|
|
#main .black-logo .sheet-logo,
|
|
#main .sheet-black-logo > .logo,
|
|
#main .sheet-black-logo .sheet-logo,
|
|
.sheet-rolltemplate-scp .black-logo > .logo,
|
|
.sheet-rolltemplate-scp .black-logo .sheet-logo,
|
|
.sheet-rolltemplate-scp .sheet-black-logo > .logo,
|
|
.sheet-rolltemplate-scp .sheet-black-logo .sheet-logo {
|
|
grid-area: content;
|
|
background-image: url("https://s3.amazonaws.com/files.d20.io/images/237119632/ALMH-rWYBVVqwtIQI970xw/original.png");
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
z-index: 10;
|
|
}
|
|
#main .black-logo > .black-diamond,
|
|
#main .black-logo .sheet-black-diamond,
|
|
#main .sheet-black-logo > .black-diamond,
|
|
#main .sheet-black-logo .sheet-black-diamond,
|
|
.sheet-rolltemplate-scp .black-logo > .black-diamond,
|
|
.sheet-rolltemplate-scp .black-logo .sheet-black-diamond,
|
|
.sheet-rolltemplate-scp .sheet-black-logo > .black-diamond,
|
|
.sheet-rolltemplate-scp .sheet-black-logo .sheet-black-diamond {
|
|
grid-area: content;
|
|
background-color: var(--fontColor);
|
|
width: 100%;
|
|
height: 100%;
|
|
transform: scale(0.75) rotate(45deg);
|
|
}
|
|
#main *,
|
|
.sheet-rolltemplate-scp * {
|
|
color: black;
|
|
transition: var(--focusTrans);
|
|
}
|
|
#main select, #main textarea, #main input, #main .uneditable-input, #main label, #main button,
|
|
.sheet-rolltemplate-scp select,
|
|
.sheet-rolltemplate-scp textarea,
|
|
.sheet-rolltemplate-scp input,
|
|
.sheet-rolltemplate-scp .uneditable-input,
|
|
.sheet-rolltemplate-scp label,
|
|
.sheet-rolltemplate-scp button {
|
|
all: unset;
|
|
}
|
|
#main [hidden],
|
|
.sheet-rolltemplate-scp [hidden] {
|
|
display: none;
|
|
}
|
|
#main button,
|
|
.sheet-rolltemplate-scp button {
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
}
|
|
#main textarea,
|
|
.sheet-rolltemplate-scp textarea {
|
|
resize: vertical;
|
|
min-height: 3.5rem;
|
|
white-space: pre-wrap;
|
|
}
|
|
#main select, #main input, #main .uneditable-input,
|
|
.sheet-rolltemplate-scp select,
|
|
.sheet-rolltemplate-scp input,
|
|
.sheet-rolltemplate-scp .uneditable-input {
|
|
padding: initial;
|
|
}
|
|
#main select, #main input, #main .uneditable-input, #main textarea,
|
|
.sheet-rolltemplate-scp select,
|
|
.sheet-rolltemplate-scp input,
|
|
.sheet-rolltemplate-scp .uneditable-input,
|
|
.sheet-rolltemplate-scp textarea {
|
|
border-width: 1px 3px;
|
|
border-style: solid;
|
|
border-radius: 5px;
|
|
border-color: transparent;
|
|
box-sizing: border-box;
|
|
}
|
|
#main select:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus), #main input:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus), #main .uneditable-input:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus), #main textarea:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus),
|
|
.sheet-rolltemplate-scp select:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus),
|
|
.sheet-rolltemplate-scp input:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus),
|
|
.sheet-rolltemplate-scp .uneditable-input:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus),
|
|
.sheet-rolltemplate-scp textarea:not(:is([readonly], .boxed, .separated-span, .separated-label)):is(:hover, :focus) {
|
|
border-width: 1px 3px;
|
|
border-style: solid;
|
|
border-color: black;
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
transition: var(--focusTrans);
|
|
}
|
|
#main select:not(:is([readonly])):focus, #main input:not(:is([readonly])):focus, #main .uneditable-input:not(:is([readonly])):focus, #main textarea:not(:is([readonly])):focus,
|
|
.sheet-rolltemplate-scp select:not(:is([readonly])):focus,
|
|
.sheet-rolltemplate-scp input:not(:is([readonly])):focus,
|
|
.sheet-rolltemplate-scp .uneditable-input:not(:is([readonly])):focus,
|
|
.sheet-rolltemplate-scp textarea:not(:is([readonly])):focus {
|
|
background-color: #DCDCDC;
|
|
transition: var(--focusTrans);
|
|
}
|
|
#main select,
|
|
.sheet-rolltemplate-scp select {
|
|
appearance: none;
|
|
text-transform: capitalize;
|
|
overflow: hidden !important;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
#main .circle,
|
|
.sheet-rolltemplate-scp .circle {
|
|
border-radius: 50%;
|
|
}
|
|
#main label,
|
|
.sheet-rolltemplate-scp label {
|
|
width: unset;
|
|
margin: unset;
|
|
}
|
|
#main label[for],
|
|
.sheet-rolltemplate-scp label[for] {
|
|
cursor: pointer;
|
|
}
|
|
#main input,
|
|
.sheet-rolltemplate-scp input {
|
|
width: 100%;
|
|
}
|
|
#main input:placeholder,
|
|
.sheet-rolltemplate-scp input:placeholder {
|
|
color: #ededed80;
|
|
}
|
|
#main input.plus-control:not([value*="-"]) + span:before,
|
|
.sheet-rolltemplate-scp input.plus-control:not([value*="-"]) + span:before {
|
|
content: "+";
|
|
}
|
|
#main .right,
|
|
.sheet-rolltemplate-scp .right {
|
|
align-text: right;
|
|
}
|
|
#main span, #main input, #main textarea,
|
|
.sheet-rolltemplate-scp span,
|
|
.sheet-rolltemplate-scp input,
|
|
.sheet-rolltemplate-scp textarea {
|
|
font-size: 1rem;
|
|
}
|
|
#main label[for*="-0"],
|
|
.sheet-rolltemplate-scp label[for*="-0"] {
|
|
display: none;
|
|
}
|
|
#main .hidden,
|
|
.sheet-rolltemplate-scp .hidden {
|
|
display: none !important;
|
|
}
|
|
#main .italics,
|
|
.sheet-rolltemplate-scp .italics {
|
|
font-style: italic;
|
|
}
|
|
#main :is(span, label),
|
|
.sheet-rolltemplate-scp :is(span, label) {
|
|
line-height: normal;
|
|
text-transform: capitalize;
|
|
}
|
|
#main .roller,
|
|
.sheet-rolltemplate-scp .roller {
|
|
cursor: pointer;
|
|
display: inline-grid;
|
|
}
|
|
#main .roll-label,
|
|
.sheet-rolltemplate-scp .roll-label {
|
|
cursor: pointer;
|
|
--beforeColor:grey;
|
|
display: grid;
|
|
grid-template-columns: auto auto;
|
|
grid-template-rows: auto;
|
|
place-items: center start;
|
|
place-content: center;
|
|
}
|
|
#main .roll-label .dice-icon,
|
|
.sheet-rolltemplate-scp .roll-label .dice-icon {
|
|
justify-self: center;
|
|
display: inline-grid;
|
|
grid-template-columns: [d8-start] 0.5rem [d10-start] 0.5rem [d8-end d12-start] 0.5rem [d10-end] 0.5rem [d12-end];
|
|
grid-template-rows: [d10-start content-start] 0.5rem [d8-start d12-start] 0.5rem [d10-start] 0.5rem [d8-end d12-end content-end];
|
|
}
|
|
#main .roll-label .dice-icon > .d8-font,
|
|
.sheet-rolltemplate-scp .roll-label .dice-icon > .d8-font {
|
|
display: contents;
|
|
}
|
|
#main .roll-label .dice-icon > .d8-font:before,
|
|
.sheet-rolltemplate-scp .roll-label .dice-icon > .d8-font:before {
|
|
content: "H";
|
|
font-family: dicefontd8;
|
|
grid-area: d8;
|
|
place-self: center;
|
|
color: var(--beforeColor);
|
|
text-shadow: var(--selectShadow);
|
|
transition: var(--focusTrans);
|
|
}
|
|
#main .roll-label .dice-icon > .d10-font,
|
|
.sheet-rolltemplate-scp .roll-label .dice-icon > .d10-font {
|
|
display: contents;
|
|
}
|
|
#main .roll-label .dice-icon > .d10-font:before,
|
|
.sheet-rolltemplate-scp .roll-label .dice-icon > .d10-font:before {
|
|
content: "K";
|
|
font-family: dicefontd10;
|
|
grid-area: d10;
|
|
place-self: start center;
|
|
color: var(--beforeColor);
|
|
text-shadow: var(--selectShadow);
|
|
transition: var(--focusTrans);
|
|
}
|
|
#main .roll-label .dice-icon > .d12-font,
|
|
.sheet-rolltemplate-scp .roll-label .dice-icon > .d12-font {
|
|
display: contents;
|
|
}
|
|
#main .roll-label .dice-icon > .d12-font:before,
|
|
.sheet-rolltemplate-scp .roll-label .dice-icon > .d12-font:before {
|
|
content: "L";
|
|
font-family: dicefontd12;
|
|
grid-area: d12;
|
|
place-self: center;
|
|
color: var(--beforeColor);
|
|
text-shadow: var(--selectShadow);
|
|
transition: var(--focusTrans);
|
|
}
|
|
#main .roll-label .dice-icon button,
|
|
.sheet-rolltemplate-scp .roll-label .dice-icon button {
|
|
grid-area: content;
|
|
}
|
|
#main .roll-label:is(:hover, :focus, :focus-within),
|
|
.sheet-rolltemplate-scp .roll-label:is(:hover, :focus, :focus-within) {
|
|
--beforeColor:var(--selectColor);
|
|
}
|
|
#main .roll-label:is(:hover, :focus, :focus-within) > button,
|
|
.sheet-rolltemplate-scp .roll-label:is(:hover, :focus, :focus-within) > button {
|
|
color: var(--beforeColor);
|
|
text-shadow: var(--selectShadow);
|
|
}
|
|
#main .pictos,
|
|
.sheet-rolltemplate-scp .pictos {
|
|
font-family: pictos;
|
|
text-transform: initial;
|
|
}
|
|
#main .pictos3,
|
|
.sheet-rolltemplate-scp .pictos3 {
|
|
font-family: pictos three;
|
|
text-transform: initial;
|
|
}
|
|
#main .pictoscustom,
|
|
.sheet-rolltemplate-scp .pictoscustom {
|
|
font-family: pictos custom;
|
|
text-transform: initial;
|
|
}
|
|
#main input[type=checkbox],
|
|
.sheet-rolltemplate-scp input[type=checkbox] {
|
|
-webkit-appearance: checkbox;
|
|
-moz-appearance: checkbox;
|
|
appearance: checkbox;
|
|
width: auto;
|
|
}
|
|
#main input.number,
|
|
.sheet-rolltemplate-scp input.number {
|
|
-moz-appearance: textfield !important;
|
|
text-align: center;
|
|
}
|
|
#main textarea.fixed,
|
|
.sheet-rolltemplate-scp textarea.fixed {
|
|
resize: none;
|
|
overflow: auto;
|
|
}
|
|
#main section.page,
|
|
.sheet-rolltemplate-scp section.page {
|
|
display: none;
|
|
}
|
|
#main .pseudo-button,
|
|
.sheet-rolltemplate-scp .pseudo-button {
|
|
display: inline;
|
|
cursor: pointer;
|
|
border-radius: 5px;
|
|
text-transform: uppercase;
|
|
border: 1px solid black;
|
|
text-align: center;
|
|
padding: 0 5px;
|
|
}
|
|
#main .input-label,
|
|
.sheet-rolltemplate-scp .input-label {
|
|
display: inline-grid;
|
|
grid-gap: var(--half-gap);
|
|
place-items: center stretch;
|
|
}
|
|
#main .input-label.stacked,
|
|
.sheet-rolltemplate-scp .input-label.stacked {
|
|
grid-template-columns: auto;
|
|
grid-template-areas: "over" "under";
|
|
}
|
|
#main .input-label.stacked.under,
|
|
.sheet-rolltemplate-scp .input-label.stacked.under {
|
|
grid-template-rows: 1fr auto;
|
|
}
|
|
#main .input-label.stacked.under > span:last-of-type,
|
|
.sheet-rolltemplate-scp .input-label.stacked.under > span:last-of-type {
|
|
grid-area: under;
|
|
}
|
|
#main .input-label.stacked.over,
|
|
.sheet-rolltemplate-scp .input-label.stacked.over {
|
|
grid-template-rows: auto 1fr;
|
|
}
|
|
#main .input-label.stacked.over > span:last-of-type,
|
|
.sheet-rolltemplate-scp .input-label.stacked.over > span:last-of-type {
|
|
grid-area: over;
|
|
}
|
|
#main .input-label.stacked.center > *,
|
|
.sheet-rolltemplate-scp .input-label.stacked.center > * {
|
|
text-align: center;
|
|
}
|
|
#main .input-label.stacked:not(.center) > :not(input),
|
|
.sheet-rolltemplate-scp .input-label.stacked:not(.center) > :not(input) {
|
|
text-align: left;
|
|
}
|
|
#main .input-label:not(:is(.stacked, .right)),
|
|
.sheet-rolltemplate-scp .input-label:not(:is(.stacked, .right)) {
|
|
grid-template-columns: auto 1fr;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "left right";
|
|
}
|
|
#main .input-label:not(:is(.stacked, .right)) > span,
|
|
.sheet-rolltemplate-scp .input-label:not(:is(.stacked, .right)) > span {
|
|
grid-area: left;
|
|
}
|
|
#main .input-label.right,
|
|
.sheet-rolltemplate-scp .input-label.right {
|
|
grid-template-columns: 1fr auto;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "left right";
|
|
}
|
|
#main .input-label.right > span,
|
|
.sheet-rolltemplate-scp .input-label.right > span {
|
|
grid-area: right;
|
|
}
|
|
#main .input-label > *,
|
|
.sheet-rolltemplate-scp .input-label > * {
|
|
margin: 0;
|
|
}
|
|
#main .input-label > input:is([type=text], [type=number]),
|
|
.sheet-rolltemplate-scp .input-label > input:is([type=text], [type=number]) {
|
|
width: 100%;
|
|
}
|
|
#main .dual.input-label,
|
|
.sheet-rolltemplate-scp .dual.input-label {
|
|
grid-template-columns: 1fr auto 1fr;
|
|
grid-template-areas: "over over over" "under under under";
|
|
}
|
|
#main .dual.input-label > span:last-of-type,
|
|
.sheet-rolltemplate-scp .dual.input-label > span:last-of-type {
|
|
grid-column: 1/-1;
|
|
}
|
|
#main .dual.input-label > input,
|
|
.sheet-rolltemplate-scp .dual.input-label > input {
|
|
width: 100%;
|
|
}
|
|
#main .dual.input-label > .slash,
|
|
.sheet-rolltemplate-scp .dual.input-label > .slash {
|
|
line-height: 0rem;
|
|
font-weight: normal;
|
|
}
|
|
#main .headed-textarea,
|
|
.sheet-rolltemplate-scp .headed-textarea {
|
|
display: grid;
|
|
grid-template-rows: auto 1fr;
|
|
grid-template-columns: auto;
|
|
}
|
|
#main .boxed,
|
|
.sheet-rolltemplate-scp .boxed {
|
|
border: 1px solid black;
|
|
}
|
|
#main .boxed.thick-left,
|
|
.sheet-rolltemplate-scp .boxed.thick-left {
|
|
border-left-width: 5px;
|
|
}
|
|
#main .boxed.thick-bottom,
|
|
.sheet-rolltemplate-scp .boxed.thick-bottom {
|
|
border-bottom-width: 5px;
|
|
}
|
|
#main .boxed.thick-right,
|
|
.sheet-rolltemplate-scp .boxed.thick-right {
|
|
border-right-width: 5px;
|
|
}
|
|
#main .boxed.thick-top,
|
|
.sheet-rolltemplate-scp .boxed.thick-top {
|
|
border-top-width: 5px;
|
|
}
|
|
#main .underlined,
|
|
.sheet-rolltemplate-scp .underlined {
|
|
border-radius: 5px 5px 0 0;
|
|
border-bottom: 1px solid black;
|
|
transition: var(--focusTrans);
|
|
}
|
|
#main .underlined.thick,
|
|
.sheet-rolltemplate-scp .underlined.thick {
|
|
border-bottom-width: 5px;
|
|
}
|
|
#main .ratio1-1,
|
|
.sheet-rolltemplate-scp .ratio1-1 {
|
|
aspect-ratio: 1/1;
|
|
}
|
|
#main .repeat-columns,
|
|
.sheet-rolltemplate-scp .repeat-columns {
|
|
display: grid;
|
|
grid-gap: var(--half-gap);
|
|
place-items: center;
|
|
}
|
|
#main .repcontainer,
|
|
.sheet-rolltemplate-scp .repcontainer {
|
|
display: grid;
|
|
grid-gap: var(--half-gap);
|
|
}
|
|
#main .repcontainer > .repitem,
|
|
.sheet-rolltemplate-scp .repcontainer > .repitem {
|
|
display: grid;
|
|
grid-gap: var(--half-gap);
|
|
}
|
|
#main .repcontainer > .repitem .itemcontrol,
|
|
.sheet-rolltemplate-scp .repcontainer > .repitem .itemcontrol {
|
|
grid-column: 1/-1;
|
|
place-self: start stretch;
|
|
}
|
|
|
|
#main {
|
|
--selectedRadio:grey;
|
|
--fillTrackRadioHeight:2rem;
|
|
--fillTrackRadioWidth:1rem;
|
|
--fillTrackSpanWidth:1rem;
|
|
--fillTrackSpanHeight:0.5rem;
|
|
--fillItemFlex:0 0 auto;
|
|
--track-gap:var(--tiny-gap);
|
|
display: grid;
|
|
}
|
|
#main.level-1, #main.sheet-level-1 {
|
|
--backColor:#6abd47;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
#main.level-2, #main.sheet-level-2 {
|
|
--backColor:#4f72b7;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
#main.level-3, #main.sheet-level-3 {
|
|
--backColor:#ef6024;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
#main.level-4, #main.sheet-level-4 {
|
|
--backColor:#ed2025;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
#main.level-5, #main.sheet-level-5 {
|
|
--backColor:#7d52a1;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
#main.level-6, #main.sheet-level-6 {
|
|
--backColor:#000000;
|
|
--borderColor:white;
|
|
--fontColor:#ededed;
|
|
}
|
|
#main.all {
|
|
grid-template-columns: 2rem auto [sticky-background-start] 10rem auto auto auto auto auto auto 10rem [sticky-background-end];
|
|
grid-template-rows: auto auto [sticky-background-start] auto [sticky-background-end] auto auto auto 1fr;
|
|
grid-template-areas: "section-tabs summary summary summary summary summary summary summary summary summary" "section-tabs attributes experience experience purchase_guide purchase_guide purchase_guide purchase_guide player_name player_name" "section-tabs attributes reverence defenses defenses defenses defenses defenses defenses exertion " "section-tabs attributes character_details character_details character_details character_details character_details character_details character_details character_details" "section-tabs attributes actions actions actions actions actions actions actions actions" "section-tabs attacks attacks attacks attacks attacks attacks attacks attacks attacks" "section-tabs equipment equipment equipment equipment equipment equipment equipment equipment equipment";
|
|
}
|
|
#main:not(.all) {
|
|
grid-template-columns: 2rem [sticky-background-start character_details-start attributes-start attacks-start actions-start equipment-start] 10rem auto auto auto 10rem [sticky-background-end character_details-end attributes-end attacks-end actions-end equipment-end];
|
|
grid-template-rows: auto auto [sticky-background-start] auto [sticky-background-end character_details-start attributes-start attacks-start actions-start equipment-start] 1fr [character_details-end attributes-end attacks-end actions-end equipment-end];
|
|
grid-template-areas: "section-tabs summary summary summary summary summary" "section-tabs experience experience purchase_guide player_name player_name" "section-tabs reverence defenses defenses defenses exertion" "section-tabs content content content content content";
|
|
}
|
|
#main #attributes {
|
|
grid-area: attributes;
|
|
}
|
|
#main #character_details {
|
|
grid-area: character_details;
|
|
}
|
|
#main #experience {
|
|
grid-area: experience;
|
|
}
|
|
#main #player_name {
|
|
grid-area: player_name;
|
|
}
|
|
#main #purchase_guide {
|
|
grid-area: purchase_guide;
|
|
}
|
|
#main #credits {
|
|
grid-area: credits;
|
|
}
|
|
#main #knowledges {
|
|
grid-area: knowledges;
|
|
}
|
|
#main #skills {
|
|
grid-area: skills;
|
|
}
|
|
#main #abilities {
|
|
grid-area: abilities;
|
|
}
|
|
#main #exertion {
|
|
grid-area: exertion;
|
|
}
|
|
#main #security_level {
|
|
grid-area: security_level;
|
|
}
|
|
#main #defenses {
|
|
grid-area: defenses;
|
|
}
|
|
#main #attacks {
|
|
grid-area: attacks;
|
|
}
|
|
#main #actions {
|
|
grid-area: actions;
|
|
}
|
|
#main #section-tabs {
|
|
grid-area: section-tabs;
|
|
}
|
|
#main #reverence {
|
|
grid-area: reverence;
|
|
}
|
|
#main #equipment {
|
|
grid-area: equipment;
|
|
}
|
|
#main .help {
|
|
grid-area: help;
|
|
white-space: pre-wrap;
|
|
text-transform: normal;
|
|
font-size: 0.5rem;
|
|
}
|
|
#main .accented {
|
|
accent-color: var(--backColor);
|
|
}
|
|
#main .fillTrack {
|
|
position: relative;
|
|
display: inline-flex;
|
|
gap: var(--track-gap);
|
|
align-items: center;
|
|
}
|
|
#main .fillTrack .separated-label {
|
|
width: var(--fillTrackRadioWidth);
|
|
height: var(--fillTrackRadioHeight);
|
|
}
|
|
#main .fillTrack .separated-span {
|
|
width: var(--fillTrackSpanWidth);
|
|
height: var(--fillTrackSpanHeight);
|
|
box-sizing: border-box;
|
|
}
|
|
#main .fillTrack .separated-label,
|
|
#main .fillTrack .separated-span {
|
|
-webkit-apperance: none;
|
|
appearance: none;
|
|
border: 1px solid black;
|
|
background-color: var(--selectedRadio);
|
|
order: 1;
|
|
border-radius: 0;
|
|
flex: var(--fillItemFlex);
|
|
box-sizing: content-box;
|
|
}
|
|
#main .fillTrack .separated-label:before,
|
|
#main .fillTrack .separated-span:before {
|
|
background-color: var(--selectedRadio);
|
|
}
|
|
#main .fillTrack .separated-label:checked,
|
|
#main .fillTrack .separated-span:checked {
|
|
display: none;
|
|
}
|
|
#main .fillTrack .separated-label.clearer,
|
|
#main .fillTrack .separated-span.clearer {
|
|
order: 2;
|
|
}
|
|
#main .fillTrack .separated-label.clearer:checked,
|
|
#main .fillTrack .separated-span.clearer:checked {
|
|
display: none;
|
|
}
|
|
#main .fillTrack .separated-label:checked ~ .separated-label,
|
|
#main .fillTrack .separated-span:checked ~ .separated-label {
|
|
order: 3;
|
|
background-color: white;
|
|
}
|
|
#main .fillTrack .separated-label:checked ~ .separated-label:before,
|
|
#main .fillTrack .separated-span:checked ~ .separated-label:before {
|
|
background-color: white;
|
|
}
|
|
#main .fillTrack .hidden + .separated-span ~ .separated-span {
|
|
background-color: white;
|
|
}
|
|
#main .fillTrack .separated-label {
|
|
cursor: pointer;
|
|
}
|
|
#main .fillTrack .separated-label[value="0"] + .readonly-dot {
|
|
display: none;
|
|
}
|
|
#main .fillTrack:is(:hover, :focus-within, :focus) .clearer,
|
|
#main .fillTrack:is(:hover, :focus-within, :focus) .clearer:before {
|
|
background-color: var(--selectedRadio);
|
|
background-image: linear-gradient(45deg, transparent 0% 48%, white 48% calc(48% + 2px), transparent calc(48% + 2px)), linear-gradient(-45deg, transparent 0% 48%, white 48% calc(48% + 2px), transparent calc(48% + 2px));
|
|
}
|
|
|
|
main#main:not(.all) > section:not(.active-section) {
|
|
display: none;
|
|
}
|
|
|
|
#summary {
|
|
position: sticky;
|
|
top: 0px;
|
|
z-index: 110;
|
|
grid-area: summary;
|
|
background-color: var(--backColor);
|
|
border-radius: 10px 10px 0 0;
|
|
border-width: 2px 5px;
|
|
border-style: solid;
|
|
border-color: var(--borderColor);
|
|
filter: drop-shadow(0px -10px white);
|
|
padding: 5px;
|
|
display: grid;
|
|
grid-template-columns: 1fr [strength-start fate-start] auto [strength-end fate-end health-start charisma-start] auto [health-end charisma-end perception-start intelligence-start] auto [perception-end intelligence-end dexterity-start willpower-start] auto [dexterity-end willpower-end];
|
|
grid-template-rows: [strength-start health-start perception-start dexterity-start] 1rem [fate-start charisma-start intelligence-start willpower-start] 1rem [strength-end health-end perception-end dexterity-end] 1rem [fate-end charisma-end intelligence-end willpower-end];
|
|
grid-gap: var(--half-gap);
|
|
grid-template-areas: "character_name . . . ." "character_name . . . ." "alias . . . .";
|
|
}
|
|
#summary > .character_name {
|
|
grid-area: character_name;
|
|
}
|
|
#summary > .alias {
|
|
grid-area: alias;
|
|
}
|
|
#summary > .strength {
|
|
grid-area: strength;
|
|
}
|
|
#summary > .health {
|
|
grid-area: health;
|
|
}
|
|
#summary > .perception {
|
|
grid-area: perception;
|
|
}
|
|
#summary > .dexterity {
|
|
grid-area: dexterity;
|
|
}
|
|
#summary > .fate {
|
|
grid-area: fate;
|
|
}
|
|
#summary > .charisma {
|
|
grid-area: charisma;
|
|
}
|
|
#summary > .intelligence {
|
|
grid-area: intelligence;
|
|
}
|
|
#summary > .willpower {
|
|
grid-area: willpower;
|
|
}
|
|
#summary .h4, #summary .h5 {
|
|
line-height: 0;
|
|
place-self: center;
|
|
}
|
|
#summary h6 {
|
|
text-transform: uppercase;
|
|
}
|
|
#summary * {
|
|
color: var(--fontColor);
|
|
}
|
|
#summary > .ability-summary {
|
|
align-self: center;
|
|
display: grid;
|
|
grid-template-columns: 2.5rem repeat(3, 1rem auto);
|
|
}
|
|
#summary > .ability-summary > .die-num {
|
|
justify-self: end;
|
|
}
|
|
#summary > .ability-summary > .die-size {
|
|
justify-self: start;
|
|
text-transform: initial;
|
|
}
|
|
|
|
.sticky-sub.background {
|
|
background-color: white;
|
|
grid-area: sticky-background;
|
|
box-shadow: 0 0 0 10px white;
|
|
}
|
|
|
|
#reverence {
|
|
display: grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: 2rem 2rem 1fr;
|
|
grid-row-gap: var(--half-gap);
|
|
grid-template-areas: "header" "." "help";
|
|
background-color: teal;
|
|
background: radial-gradient(transparent, 80%, grey), linear-gradient(90deg, teal, white, teal);
|
|
border: 2px solid black;
|
|
}
|
|
#reverence > h3 {
|
|
grid-area: header;
|
|
line-height: normal;
|
|
place-self: center;
|
|
}
|
|
#reverence > .fillTrack {
|
|
place-self: center;
|
|
}
|
|
#reverence .help {
|
|
background-color: grey;
|
|
}
|
|
|
|
#defenses {
|
|
display: grid;
|
|
grid: repeat(2, auto)/repeat(3, 1fr);
|
|
grid-template-areas: "hp hp_max damage_reduction damage_reduction" "reaction_defense move_speed melee_multiplier ranged_multiplier";
|
|
align-items: start;
|
|
}
|
|
#defenses .hp {
|
|
grid-area: hp;
|
|
}
|
|
#defenses .hp_max {
|
|
grid-area: hp_max;
|
|
}
|
|
#defenses .damage_reduction {
|
|
grid-area: damage_reduction;
|
|
}
|
|
#defenses .reaction_defense {
|
|
grid-area: reaction_defense;
|
|
}
|
|
#defenses .move_speed {
|
|
grid-area: move_speed;
|
|
}
|
|
#defenses .melee_multiplier {
|
|
grid-area: melee_multiplier;
|
|
}
|
|
#defenses .ranged_multiplier {
|
|
grid-area: ranged_multiplier;
|
|
}
|
|
|
|
#exertion {
|
|
display: grid;
|
|
grid-template-rows: 2rem 1rem 0.25rem 1fr;
|
|
grid-row-gap: 5px;
|
|
grid-template-areas: "header" "." "." "help";
|
|
border: 2px solid black;
|
|
background-color: teal;
|
|
background: radial-gradient(transparent, 80%, grey), linear-gradient(90deg, #ca6866, white, #ca6866);
|
|
--fillTrackRadioHeight:1rem;
|
|
}
|
|
#exertion > .fillTrack {
|
|
place-self: center;
|
|
}
|
|
#exertion .help {
|
|
background-color: grey;
|
|
}
|
|
|
|
#section-tabs {
|
|
position: sticky;
|
|
top: -1px;
|
|
border-radius: 5px;
|
|
background-color: #adadad;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-self: start;
|
|
}
|
|
#section-tabs input:checked + label,
|
|
#section-tabs label:hover {
|
|
background-color: var(--backColor);
|
|
color: var(--fontColor);
|
|
}
|
|
#section-tabs > .section-control {
|
|
color: black;
|
|
padding: 5px;
|
|
border-radius: 5px;
|
|
border: 1px solid transparent;
|
|
transform: rotate(-180deg);
|
|
writing-mode: vertical-rl;
|
|
}
|
|
#section-tabs input:checked + label, #section-tabs label:hover {
|
|
box-shadow: inset 0 0 5px var(--fontColor);
|
|
}
|
|
|
|
#character_details {
|
|
display: grid;
|
|
grid-template-columns: 2fr repeat(2, 1fr) 2fr;
|
|
grid-template-rows: auto auto auto auto auto auto auto;
|
|
grid-gap: var(--half-gap);
|
|
grid-template-areas: "character_name character_name alias alias" "character_name character_name alias alias" "gender weight weight height" "age hair hair eyes" "appearance body_type body_type reasoning" "personnel_class personnel_class . credits" "security_level security_level character_description character_description";
|
|
}
|
|
#character_details > .character_name {
|
|
grid-area: character_name;
|
|
}
|
|
#character_details > .gender {
|
|
grid-area: gender;
|
|
}
|
|
#character_details > .appearance {
|
|
grid-area: appearance;
|
|
}
|
|
#character_details > .body_type {
|
|
grid-area: body_type;
|
|
}
|
|
#character_details > .reasoning {
|
|
grid-area: reasoning;
|
|
}
|
|
#character_details > .alias {
|
|
grid-area: alias;
|
|
}
|
|
#character_details > .weight {
|
|
grid-area: weight;
|
|
}
|
|
#character_details > .height {
|
|
grid-area: height;
|
|
}
|
|
#character_details > .age {
|
|
grid-area: age;
|
|
}
|
|
#character_details > .character_description {
|
|
grid-area: character_description;
|
|
}
|
|
#character_details > .hair {
|
|
grid-area: hair;
|
|
}
|
|
#character_details > .eyes {
|
|
grid-area: eyes;
|
|
}
|
|
#character_details > .personnel_class {
|
|
grid-area: personnel_class;
|
|
}
|
|
#character_details .body_type {
|
|
place-self: center;
|
|
}
|
|
#character_details .personnel_class {
|
|
place-self: start center;
|
|
display: grid;
|
|
grid-template-columns: repeat(5, auto);
|
|
grid-template-rows: repeat(2, auto);
|
|
grid-column-gap: var(--half-gap);
|
|
}
|
|
#character_details .personnel_class h5 {
|
|
grid-column: span 5;
|
|
}
|
|
#character_details .personnel_class input:checked + label,
|
|
#character_details .personnel_class label:hover {
|
|
background-color: black;
|
|
color: white;
|
|
}
|
|
#character_details .personnel_class > label {
|
|
font-family: Baumans;
|
|
display: grid;
|
|
place-items: center;
|
|
place-self: center;
|
|
height: 1rem;
|
|
display: inline-block;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
}
|
|
|
|
#security_level {
|
|
place-self: start center;
|
|
display: grid;
|
|
grid-template-columns: 8rem auto;
|
|
grid-template-rows: auto auto auto;
|
|
grid-template-areas: "head head" "qr-code merit" "qr-code id";
|
|
border-radius: 10px;
|
|
border-width: 2px 3px 3px 2px;
|
|
border: solid black;
|
|
overflow: hidden;
|
|
}
|
|
#security_level > .head {
|
|
--scpSize:6rem;
|
|
background-color: var(--backColor);
|
|
transition: var(--focusTrans);
|
|
grid-area: head;
|
|
display: grid;
|
|
grid-template-columns: 10rem 5rem 1fr;
|
|
grid-template-rows: calc(var(--scpSize) - 1rem) 2rem;
|
|
grid-template-areas: "header logo level" "sub . level";
|
|
border-bottom: 2px solid var(--borderColor);
|
|
}
|
|
#security_level > .head *:not(input) {
|
|
color: var(--fontColor);
|
|
}
|
|
#security_level > .head > .header {
|
|
grid-area: header;
|
|
font-size: var(--scpSize);
|
|
text-transform: uppercase;
|
|
place-self: start center;
|
|
line-height: calc(var(--scpSize) - 1rem);
|
|
}
|
|
#security_level > .head .sub-header {
|
|
font-family: Baumans;
|
|
grid-area: sub;
|
|
font-size: calc(var(--scpSize) * 0.16);
|
|
}
|
|
#security_level > .head .transparent-logo {
|
|
grid-area: logo;
|
|
width: 100%;
|
|
place-self: center;
|
|
}
|
|
#security_level > .head .security_level {
|
|
grid-area: level;
|
|
place-items: center;
|
|
gap: 0px;
|
|
place-self: center;
|
|
}
|
|
#security_level > .head .security_level > input {
|
|
width: 5rem;
|
|
place-self: start center;
|
|
background-color: white;
|
|
height: unset;
|
|
color: black;
|
|
}
|
|
#security_level > .head .security_level > span {
|
|
font-size: 0.75rem;
|
|
font-family: baumans;
|
|
margin: 0;
|
|
}
|
|
#security_level > .qr-code {
|
|
grid-area: qr-code;
|
|
background-image: url("https://s3.amazonaws.com/files.d20.io/images/237721889/dzJg1nel3HT7J2OhxtWBJg/thumb.png");
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
place-self: center;
|
|
width: 100%;
|
|
aspect-ratio: 1/1;
|
|
}
|
|
#security_level > .merit {
|
|
--selectedRadio:var(--backColor);
|
|
--track-gap:calc(var(--tiny-gap) / 2);
|
|
grid-area: merit;
|
|
display: grid;
|
|
grid-template-columns: 3rem 1fr;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "header tracker";
|
|
grid-gap: var(--half-gap);
|
|
padding-right: var(--half-gap);
|
|
}
|
|
#security_level > .merit > h5 {
|
|
place-self: center;
|
|
white-space: pre-wrap;
|
|
place-self: center;
|
|
}
|
|
#security_level > .merit > .fillTrack {
|
|
place-self: center;
|
|
grid-auto-columns: 0.9rem;
|
|
}
|
|
#security_level > .merit > .fillTrack > .separated-label {
|
|
filter: drop-shadow(-1px 0px 0 black) drop-shadow(1px 0px 0 black) drop-shadow(0px -1px 0 black) drop-shadow(0px 1px 0 black);
|
|
background-color: transparent !important;
|
|
border: 0px solid transparent;
|
|
}
|
|
#security_level > .merit > .fillTrack > .separated-label:before {
|
|
clip-path: polygon(45% 0, 100% 50%, 45% 100%, 0% 100%, 55% 50%, 0% 0%);
|
|
grid-area: b;
|
|
position: absolute;
|
|
content: "";
|
|
place-self: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
#security_level > .id {
|
|
padding: 5px 0 0 5px;
|
|
display: grid;
|
|
--arrowsize:1.5rem;
|
|
grid-template-columns: 3rem 1fr;
|
|
grid-template-rows: 3.5rem;
|
|
grid-column-gap: var(--half-gap);
|
|
grid-template-areas: "logo id";
|
|
background-color: var(--backColor);
|
|
transition: var(--focusTrans);
|
|
grid-area: id;
|
|
border: solid var(--borderColor);
|
|
border-width: 2px 0 0 2px;
|
|
}
|
|
#security_level > .id > .black-logo {
|
|
grid-area: logo;
|
|
}
|
|
#security_level > .id > * {
|
|
color: var(--fontColor);
|
|
}
|
|
#security_level > .id > span[name*=attr] {
|
|
place-self: start center;
|
|
font-size: 0.65rem;
|
|
place-self: center;
|
|
}
|
|
#security_level > .id > :not([name*=attr]) {
|
|
font-size: 0.5rem;
|
|
}
|
|
|
|
#credits.input-label {
|
|
align-self: start;
|
|
height: 2rem;
|
|
}
|
|
|
|
#attributes {
|
|
--fillTrackRadioHeight:2.5rem;
|
|
--track-gap:0;
|
|
--fillItemFlex:1 1 0;
|
|
}
|
|
#attributes.active-section {
|
|
display: grid;
|
|
grid-template-columns: repeat(6, auto);
|
|
grid-gap: var(--grid-gap);
|
|
place-content: center;
|
|
}
|
|
#attributes.active-section > .ability_score {
|
|
grid-column: span 2;
|
|
}
|
|
#attributes.active-section > .ability_score:nth-last-child(2) {
|
|
grid-column: 2/span 2;
|
|
}
|
|
#attributes.active-section .available-dice {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
#attributes:not(.active-section) > .available-dice {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
gap: var(--half-gap);
|
|
margin-bottom: var(--grid-gap);
|
|
box-shadow: 0 0 0 10px white;
|
|
z-index: 100;
|
|
}
|
|
#attributes:not(.active-section) > .available-dice h4 {
|
|
grid-column: 1/-1;
|
|
}
|
|
#attributes > .available-dice {
|
|
grid-column: 1/-1;
|
|
background-color: white;
|
|
}
|
|
#attributes > .available-dice > button[type=action] {
|
|
background-color: #ededed;
|
|
box-shadow: inset 0 0 5px black;
|
|
color: black;
|
|
border-radius: 5px;
|
|
padding: 3px 5px;
|
|
display: flex;
|
|
justify-content: center;
|
|
transition: var(--focusTrans);
|
|
}
|
|
#attributes > .available-dice > button[type=action] > span {
|
|
text-transform: initial;
|
|
}
|
|
#attributes > .available-dice > button[type=action]:hover {
|
|
background-color: var(--backColor);
|
|
transition: var(--focusTrans);
|
|
box-shadow: inset 0 0 5px var(--fontColor);
|
|
}
|
|
#attributes > .available-dice > button[type=action]:hover * {
|
|
color: var(--fontColor);
|
|
}
|
|
#attributes:hover > .ability_score :is(label, span):not(.roll-label), #attributes:focus-within > .ability_score :is(label, span):not(.roll-label) {
|
|
color: red;
|
|
transition: var(--focusTrans);
|
|
}
|
|
#attributes > .ability_score {
|
|
position: relative;
|
|
display: grid;
|
|
grid-template-columns: 4rem 13rem;
|
|
grid-template-rows: repeat(4, auto);
|
|
grid-template-areas: "header header " "d8 ." "d10 ." "d12 .";
|
|
place-self: center;
|
|
margin-bottom: var(--grid-gap);
|
|
background-color: black;
|
|
border: 1px solid black;
|
|
}
|
|
#attributes > .ability_score .attribute,
|
|
#attributes > .ability_score h5 {
|
|
border: 1px solid black;
|
|
line-height: var(--fillTrackRadioHeight);
|
|
text-align: center;
|
|
background-color: white;
|
|
}
|
|
#attributes > .ability_score .attribute[data-i18n*=d8],
|
|
#attributes > .ability_score h5[data-i18n*=d8] {
|
|
grid-area: d8;
|
|
}
|
|
#attributes > .ability_score .attribute[data-i18n*=d10],
|
|
#attributes > .ability_score h5[data-i18n*=d10] {
|
|
grid-area: d10;
|
|
}
|
|
#attributes > .ability_score .attribute[data-i18n*=d12],
|
|
#attributes > .ability_score h5[data-i18n*=d12] {
|
|
grid-area: d12;
|
|
}
|
|
#attributes > .ability_score .attribute {
|
|
grid-area: header;
|
|
text-align: center;
|
|
}
|
|
#attributes .fill-label {
|
|
color: transparent;
|
|
font-size: 0.75rem;
|
|
overflow: hidden;
|
|
transition: var(--focusTrans);
|
|
}
|
|
|
|
#actions {
|
|
column-width: 255px;
|
|
column-gap: var(--grid-gap);
|
|
column-rule: 1px solid black;
|
|
}
|
|
#actions .thick {
|
|
padding-bottom: var(--half-gap);
|
|
}
|
|
|
|
:is(#knowledges, #skills, #abilities) {
|
|
display: contents;
|
|
}
|
|
:is(#knowledges, #skills, #abilities):not(:first-child) > .header {
|
|
margin-top: var(--half-gap);
|
|
}
|
|
:is(#knowledges, #skills, #abilities) > div {
|
|
position: relative;
|
|
display: inline-grid;
|
|
width: 100%;
|
|
grid-template-columns: 1fr 2rem 2rem;
|
|
grid-gap: var(--half-gap);
|
|
margin-bottom: var(--half-gap);
|
|
}
|
|
:is(#knowledges, #skills, #abilities) > div > label {
|
|
place-self: center start;
|
|
white-space: pre-wrap;
|
|
text-transform: capitalize;
|
|
}
|
|
:is(#knowledges, #skills, #abilities) > div > input[name*=base_mod] {
|
|
opacity: 0;
|
|
z-index: 10;
|
|
transition: var(--inputSwap);
|
|
position: absolute;
|
|
grid-column: 3/4;
|
|
}
|
|
:is(#knowledges, #skills, #abilities) > div > input[name*=base_mod] + input {
|
|
opacity: 1;
|
|
transition: var(--inputSwap);
|
|
}
|
|
:is(#knowledges, #skills, #abilities) > div > input[name*=base_mod]:is(:hover, :focus) {
|
|
opacity: 1;
|
|
transition: var(--inputSwap);
|
|
}
|
|
:is(#knowledges, #skills, #abilities) > div > input[name*=base_mod]:is(:hover, :focus) + input {
|
|
opacity: 0;
|
|
transition: var(--inputSwap);
|
|
}
|
|
:is(#knowledges, #skills, #abilities) > div > .underlined {
|
|
align-self: center;
|
|
width: 100%;
|
|
}
|
|
|
|
#attacks {
|
|
--gridColumns:
|
|
[header-start] 2rem 1fr [weapon] 9rem [skill] 4rem [recoil] repeat(4, 3rem) [to-hits] repeat(2,2.5rem) [clip] repeat(2, 4rem) [damages] 4rem [element] 3rem [range] 1fr [special header-end] ;
|
|
--attackColumns:". weapon skill recoil melee hip ready aim clip clip_max base x element range special";
|
|
display: grid;
|
|
grid: [header-start] auto [header-end] 2rem 2rem auto 1rem/var(--gridColumns);
|
|
grid-auto-flow: row dense;
|
|
grid-gap: var(--half-gap);
|
|
grid-template-areas: ". . . . melee-mult melee-mult melee-mult melee-mult melee-mult . ranged-mult ranged-mult ranged-mult ranged-mult . " ". . . . to-hit to-hit to-hit to-hit . . damage damage . . . " var(--attackColumns) "content content content content content content content content content content content content content content content" "control control control control control control control control control control control control control control control";
|
|
place-content: start stretch;
|
|
}
|
|
#attacks > h4:not(input) {
|
|
grid-area: header;
|
|
text-align: left;
|
|
padding-left: 1rem;
|
|
}
|
|
#attacks .weapon {
|
|
grid-area: weapon;
|
|
}
|
|
#attacks .skill {
|
|
grid-area: skill;
|
|
}
|
|
#attacks .recoil {
|
|
grid-area: recoil;
|
|
}
|
|
#attacks .melee {
|
|
grid-area: melee;
|
|
}
|
|
#attacks .hip {
|
|
grid-area: hip;
|
|
}
|
|
#attacks .ready {
|
|
grid-area: ready;
|
|
}
|
|
#attacks .aim {
|
|
grid-area: aim;
|
|
}
|
|
#attacks .clip {
|
|
grid-area: clip;
|
|
}
|
|
#attacks .clip_max {
|
|
grid-area: clip_max;
|
|
}
|
|
#attacks .base {
|
|
grid-area: base;
|
|
}
|
|
#attacks .x {
|
|
grid-area: x;
|
|
}
|
|
#attacks .element {
|
|
grid-area: element;
|
|
}
|
|
#attacks .range {
|
|
grid-area: range;
|
|
}
|
|
#attacks .special {
|
|
grid-area: special;
|
|
}
|
|
#attacks .to-hit {
|
|
grid-area: to-hit;
|
|
}
|
|
#attacks .damage {
|
|
grid-area: damage;
|
|
}
|
|
#attacks .melee-mult {
|
|
grid-area: melee-mult;
|
|
}
|
|
#attacks .ranged-mult {
|
|
grid-area: ranged-mult;
|
|
}
|
|
#attacks > .input-label:is(.melee-mult, .ranged-mult) {
|
|
grid-template-columns: auto 3rem;
|
|
justify-content: center;
|
|
}
|
|
#attacks > .repeat-columns {
|
|
display: contents;
|
|
}
|
|
#attacks > .repeat-columns > h5, #attacks > .repeat-columns h6 {
|
|
border-bottom: 1px solid black;
|
|
}
|
|
#attacks > .repeat-columns h6 {
|
|
text-transform: capitalize;
|
|
}
|
|
#attacks > .repeat-columns .clip {
|
|
grid-column: clip-start/clip_max-end;
|
|
grid-row: clip-start/clip-end;
|
|
}
|
|
#attacks > .repcontainer {
|
|
grid-area: content;
|
|
}
|
|
#attacks > .repcontainer > .repitem {
|
|
position: relative;
|
|
grid: auto/var(--gridColumns);
|
|
grid-template-areas: var(--attackColumns);
|
|
}
|
|
#attacks > .repcontainer > .repitem > :is(.base, .x) {
|
|
text-align: center;
|
|
}
|
|
#attacks > .repcontainer > .repitem > .roll-label {
|
|
opacity: 0;
|
|
transition: var(--focusTrans);
|
|
}
|
|
#attacks > .repcontainer > .repitem:is(:hover, :focus-within) > .roll-label {
|
|
opacity: 100;
|
|
transition: var(--focusTrans);
|
|
}
|
|
#attacks > .repcontainer > .repitem > input[name=attr_recoil] {
|
|
opacity: 1;
|
|
transition: var(--inputSwap);
|
|
}
|
|
#attacks > .repcontainer > .repitem > input[name=attr_recoil_base] {
|
|
opacity: 0;
|
|
z-index: 10;
|
|
transition: var(--inputSwap);
|
|
}
|
|
#attacks > .repcontainer > .repitem > input[name=attr_recoil_base]:is(:hover, :focus) {
|
|
opacity: 1;
|
|
transition: var(--inputSwap);
|
|
}
|
|
#attacks > .repcontainer > .repitem > input[name=attr_recoil_base]:is(:hover, :focus) + input {
|
|
opacity: 0;
|
|
transition: var(--inputSwap);
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container {
|
|
position: relative;
|
|
display: grid;
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container > * {
|
|
grid-column: 1/2;
|
|
grid-row: 1/2;
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container label {
|
|
position: relative;
|
|
opacity: 0;
|
|
top: 0;
|
|
background-color: transparent;
|
|
transition: var(--focusTrans);
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
place-content: center;
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container input[type=radio] {
|
|
appearance: checkbox;
|
|
accent-color: var(--backColor);
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container:is(:hover) label {
|
|
z-index: 10;
|
|
opacity: 1;
|
|
top: 100%;
|
|
background-color: white;
|
|
transition: var(--focusTrans);
|
|
height: 150%;
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container input[type=hidden] + input {
|
|
transition: var(--focusTrans);
|
|
place-self: center;
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container.hip input[type=hidden][value="1"] + input {
|
|
border-width: 1px 3px;
|
|
border-style: solid;
|
|
border-color: black;
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
transition: var(--focusTrans);
|
|
background-color: var(--backColor);
|
|
color: var(--fontColor);
|
|
font-weight: bold;
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container.ready input[type=hidden][value="2"] + input {
|
|
border-width: 1px 3px;
|
|
border-style: solid;
|
|
border-color: black;
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
transition: var(--focusTrans);
|
|
background-color: var(--backColor);
|
|
color: var(--fontColor);
|
|
font-weight: bold;
|
|
}
|
|
#attacks > .repcontainer > .repitem > .hover-button-container.aim input[type=hidden][value="3"] + input {
|
|
border-width: 1px 3px;
|
|
border-style: solid;
|
|
border-color: black;
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
transition: var(--focusTrans);
|
|
background-color: var(--backColor);
|
|
color: var(--fontColor);
|
|
font-weight: bold;
|
|
}
|
|
#attacks > .repcontainer.editmode > .repitem > .itemcontrol {
|
|
grid-column: 1/-1;
|
|
position: absolute;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
#attacks > .repcontrol {
|
|
grid-area: control;
|
|
order: 10;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
#equipment.repeating-equipment h4 {
|
|
text-align: left;
|
|
}
|
|
#equipment .repcontainer {
|
|
display: block;
|
|
column-width: 200px;
|
|
}
|
|
#equipment .repcontainer > .repitem {
|
|
display: inline-grid;
|
|
}
|
|
#equipment .repcontainer .item-container {
|
|
display: flex;
|
|
gap: var(--half-gap);
|
|
}
|
|
#equipment > .repcontrol {
|
|
grid-area: control;
|
|
order: 10;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
#equipment .carry-check:not(:checked) + .item-container * {
|
|
color: #00000080;
|
|
border-bottom-color: currentColor;
|
|
}
|
|
|
|
/*
|
|
|
|
Roll Template
|
|
|
|
*/
|
|
.sheet-rolltemplate-scp {
|
|
--templateRadius:1rem;
|
|
--dieSize:50px;
|
|
--templateBorderW:2px 5px 2px 5px;
|
|
--fumbleColor:red;
|
|
--critColor:green;
|
|
--innerBorderRadius:5px;
|
|
position: relative;
|
|
margin-left: -40px;
|
|
}
|
|
.sheet-rolltemplate-scp h3 {
|
|
line-height: 20px;
|
|
text-transform: capitalize;
|
|
}
|
|
.sheet-rolltemplate-scp:first-child > .sheet-scp.sheet-continuation {
|
|
margin-top: -9px;
|
|
border-top-width: 0;
|
|
}
|
|
.sheet-rolltemplate-scp:not(:first-child) {
|
|
margin-top: 10px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp {
|
|
border: solid black;
|
|
overflow: hidden;
|
|
border-width: var(--templateBorderW);
|
|
border-color: var(--borderColor);
|
|
background-color: var(--backColor);
|
|
color: var(--fontColor);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.level-1, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-1 {
|
|
--backColor:#6abd47;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.level-2, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-2 {
|
|
--backColor:#4f72b7;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.level-3, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-3 {
|
|
--backColor:#ef6024;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.level-4, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-4 {
|
|
--backColor:#ed2025;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.level-5, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-5 {
|
|
--backColor:#7d52a1;
|
|
--selectColor:var(--backColor);
|
|
--selectShadow:none;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.level-6, .sheet-rolltemplate-scp > .sheet-scp.sheet-level-6 {
|
|
--backColor:#000000;
|
|
--borderColor:white;
|
|
--fontColor:#ededed;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp h4 {
|
|
text-transform: capitalize;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-color-cond,
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-color-cond * {
|
|
color: var(--fontColor);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp:not(.sheet-continuation) {
|
|
border-radius: var(--templateRadius) var(--templateRadius) 0 0;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp:not(.sheet-continuation) .sheet-roll-content {
|
|
border-top-left-radius: var(--innerBorderRadius);
|
|
border-top-right-radius: var(--innerBorderRadius);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.sheet-continuation .sheet-roll-content {
|
|
padding: 0;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.sheet-continuation.sheet-first .sheet-results {
|
|
background-color: var(--backColor);
|
|
border-radius: var(--innerBorderRadius);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.sheet-continuation.sheet-first .sheet-result-values {
|
|
background-color: white;
|
|
border-radius: var(--innerBorderRadius);
|
|
width: calc(100% + 5px);
|
|
margin-left: -5px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.sheet-continuation .sheet-result-values {
|
|
width: 100%;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head {
|
|
color: var(--fontColor);
|
|
display: grid;
|
|
grid-template-rows: auto auto;
|
|
grid-gap: 5px;
|
|
padding: 5px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head:not(.sheet-element) {
|
|
grid-template-columns: 39px 1fr;
|
|
grid-template-areas: "black-logo roll_name" "black-logo character_name";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head.sheet-element {
|
|
grid-template-columns: 39px 1fr 2fr;
|
|
grid-template-areas: "black-logo roll_name roll_name" "black-logo element character_name";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head > * {
|
|
white-space: pre-wrap;
|
|
text-align: left;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head .sheet-black-logo {
|
|
grid-area: black-logo;
|
|
place-self: start stretch;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head .sheet-roll_name {
|
|
grid-area: roll_name;
|
|
place-self: center end;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head .sheet-character_name {
|
|
grid-area: character_name;
|
|
place-self: start end;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-template-head .sheet-element {
|
|
grid-area: element;
|
|
border-width: 2px 5px;
|
|
border-style: solid;
|
|
border-color: var(--fontColor);
|
|
border-radius: var(--templateRadius);
|
|
background-color: white;
|
|
padding: 0.5rem;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-modifier {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-modifier > :not(span) {
|
|
text-transform: capitalize;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-content {
|
|
background-color: white;
|
|
padding: 2px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-results {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding-left: 5px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-result-values {
|
|
display: inline-flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-evenly;
|
|
align-items: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total {
|
|
position: relative;
|
|
display: grid;
|
|
place-items: center;
|
|
color: var(--fontColor);
|
|
grid-template-columns: 106px 50px 10px 70px;
|
|
grid-template-rows: auto 1fr 1fr;
|
|
grid-template-areas: "high-label . . total-label" "high modifier . total " "high ones . total ";
|
|
place-content: stretch center;
|
|
padding: 5px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-label {
|
|
grid-area: high-label;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-label {
|
|
grid-area: total-label;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total .sheet-modifier {
|
|
grid-area: modifier;
|
|
border-radius: 0 var(--templateRadius) 0 0;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total .sheet-ones {
|
|
grid-area: ones;
|
|
border-radius: 0 0 var(--templateRadius);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total .sheet-ones > span {
|
|
color: var(--fumbleColor);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-modifier,
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-ones {
|
|
background-color: white;
|
|
border-width: var(--templateBorderW);
|
|
border-color: var(--borderColor);
|
|
border-style: solid;
|
|
display: grid;
|
|
place-self: stretch;
|
|
place-content: center;
|
|
position: relative;
|
|
left: -5px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice {
|
|
border-radius: var(--templateRadius) 0 0 var(--templateRadius);
|
|
grid-area: high;
|
|
justify-self: end;
|
|
place-self: stretch;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-val-1 {
|
|
color: var(--fumbleColor);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-d8.sheet-val-8 > .sheet-die-icon,
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-d10.sheet-val-10 > .sheet-die-icon,
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-d12.sheet-val-12 > .sheet-die-icon,
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice .sheet-d20.sheet-val-20 > .sheet-die-icon {
|
|
color: var(--critColor);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-value {
|
|
border-radius: var(--templateRadius);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-high-dice,
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-value {
|
|
background-color: white;
|
|
border-width: var(--templateBorderW);
|
|
border-color: var(--borderColor);
|
|
border-style: solid;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-value {
|
|
grid-area: total;
|
|
--totalSize:calc(var(--dieSize)/2);
|
|
font-size: var(--totalSize);
|
|
line-height: var(--totalSize);
|
|
padding: 5px;
|
|
display: grid;
|
|
place-content: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp > .sheet-total > .sheet-total-value > span {
|
|
font-size: var(--totalSize);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult {
|
|
position: relative;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult[title*="0[computed value]"], .sheet-rolltemplate-scp > .sheet-scp .inlinerollresult[original-title*="[computed value]"] {
|
|
pointer-events: none;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult, .sheet-rolltemplate-scp > .sheet-scp .inlinerollresult:is(.fullcrit, .fullfail, .importantroll) {
|
|
border: none;
|
|
background-color: transparent;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult.fullcrit + .sheet-die-icon {
|
|
color: green;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult.fullfail + .sheet-die-icon {
|
|
color: red;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .inlinerollresult.importantroll + .sheet-die-icon {
|
|
color: blue;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-die-icon {
|
|
font-size: var(--dieSize);
|
|
place-self: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-die-icon:before {
|
|
line-height: var(--dieSize);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8 {
|
|
display: inline-grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "content";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8 > * {
|
|
grid-area: content;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8 > .inlinerollresult {
|
|
opacity: 0;
|
|
text-align: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8 > .sheet-die-icon:before {
|
|
font-family: dicefontd8;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-1 > .sheet-die-icon:before {
|
|
content: "A";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-2 > .sheet-die-icon:before {
|
|
content: "B";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-3 > .sheet-die-icon:before {
|
|
content: "C";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-4 > .sheet-die-icon:before {
|
|
content: "D";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-5 > .sheet-die-icon:before {
|
|
content: "E";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-6 > .sheet-die-icon:before {
|
|
content: "F";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-7 > .sheet-die-icon:before {
|
|
content: "G";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d8.sheet-val-8 > .sheet-die-icon:before {
|
|
content: "H";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10 {
|
|
display: inline-grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "content";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10 > * {
|
|
grid-area: content;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10 > .inlinerollresult {
|
|
opacity: 0;
|
|
text-align: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10 > .sheet-die-icon:before {
|
|
font-family: dicefontd10;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-1 > .sheet-die-icon:before {
|
|
content: "A";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-2 > .sheet-die-icon:before {
|
|
content: "B";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-3 > .sheet-die-icon:before {
|
|
content: "C";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-4 > .sheet-die-icon:before {
|
|
content: "D";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-5 > .sheet-die-icon:before {
|
|
content: "E";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-6 > .sheet-die-icon:before {
|
|
content: "F";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-7 > .sheet-die-icon:before {
|
|
content: "G";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-8 > .sheet-die-icon:before {
|
|
content: "H";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-9 > .sheet-die-icon:before {
|
|
content: "I";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d10.sheet-val-10 > .sheet-die-icon:before {
|
|
content: "K";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12 {
|
|
display: inline-grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "content";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12 > * {
|
|
grid-area: content;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12 > .inlinerollresult {
|
|
opacity: 0;
|
|
text-align: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12 > .sheet-die-icon:before {
|
|
font-family: dicefontd12;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-1 > .sheet-die-icon:before {
|
|
content: "A";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-2 > .sheet-die-icon:before {
|
|
content: "B";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-3 > .sheet-die-icon:before {
|
|
content: "C";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-4 > .sheet-die-icon:before {
|
|
content: "D";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-5 > .sheet-die-icon:before {
|
|
content: "E";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-6 > .sheet-die-icon:before {
|
|
content: "F";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-7 > .sheet-die-icon:before {
|
|
content: "G";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-8 > .sheet-die-icon:before {
|
|
content: "H";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-9 > .sheet-die-icon:before {
|
|
content: "I";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-10 > .sheet-die-icon:before {
|
|
content: "J";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-11 > .sheet-die-icon:before {
|
|
content: "K";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d12.sheet-val-12 > .sheet-die-icon:before {
|
|
content: "L";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20 {
|
|
display: inline-grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "content";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20 > * {
|
|
grid-area: content;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20 > .inlinerollresult {
|
|
opacity: 0;
|
|
text-align: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20 > .sheet-die-icon:before {
|
|
font-family: dicefontd20;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-1 > .sheet-die-icon:before {
|
|
content: "A";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-2 > .sheet-die-icon:before {
|
|
content: "B";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-3 > .sheet-die-icon:before {
|
|
content: "C";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-4 > .sheet-die-icon:before {
|
|
content: "D";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-5 > .sheet-die-icon:before {
|
|
content: "E";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-6 > .sheet-die-icon:before {
|
|
content: "F";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-7 > .sheet-die-icon:before {
|
|
content: "G";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-8 > .sheet-die-icon:before {
|
|
content: "H";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-9 > .sheet-die-icon:before {
|
|
content: "I";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-10 > .sheet-die-icon:before {
|
|
content: "J";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-11 > .sheet-die-icon:before {
|
|
content: "K";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-12 > .sheet-die-icon:before {
|
|
content: "L";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-13 > .sheet-die-icon:before {
|
|
content: "M";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-14 > .sheet-die-icon:before {
|
|
content: "N";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-15 > .sheet-die-icon:before {
|
|
content: "O";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-16 > .sheet-die-icon:before {
|
|
content: "P";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-17 > .sheet-die-icon:before {
|
|
content: "Q";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-18 > .sheet-die-icon:before {
|
|
content: "R";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-19 > .sheet-die-icon:before {
|
|
content: "S";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-d20.sheet-val-20 > .sheet-die-icon:before {
|
|
content: "T";
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 50px);
|
|
grid-template-rows: auto 34px;
|
|
place-content: center;
|
|
grid-column-gap: 10px;
|
|
grid-template-areas: "base-label x-label total-label" "base-damage x-damage total-damage";
|
|
border-radius: 0 0 var(--innerBorderRadius) var(--innerBorderRadius);
|
|
padding: 2px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage span {
|
|
font-size: 2rem;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-base-damage {
|
|
grid-area: base-damage;
|
|
border-width: 2px 5px;
|
|
border-style: solid;
|
|
border-color: var(--fontColor);
|
|
border-radius: var(--templateRadius);
|
|
background-color: white;
|
|
display: grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
place-content: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-base-label {
|
|
grid-area: base-label;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-x-damage {
|
|
grid-area: x-damage;
|
|
border-width: 2px 5px;
|
|
border-style: solid;
|
|
border-color: var(--fontColor);
|
|
border-radius: var(--templateRadius);
|
|
background-color: white;
|
|
display: grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
place-content: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-x-label {
|
|
grid-area: x-label;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-total-damage {
|
|
grid-area: total-damage;
|
|
border-width: 2px 5px;
|
|
border-style: solid;
|
|
border-color: var(--fontColor);
|
|
border-radius: var(--templateRadius);
|
|
background-color: white;
|
|
display: grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
place-content: center;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-damage .sheet-total-label {
|
|
grid-area: total-label;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
flex-wrap: wrap;
|
|
padding: 2px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="!"],
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="~"] {
|
|
background-color: white;
|
|
border-radius: var(--templateRadius);
|
|
border-width: var(--templateBorderW);
|
|
border-color: black;
|
|
text-transform: uppercase;
|
|
color: var(--selectColor);
|
|
text-shadow: var(--selectShadow);
|
|
font-weight: bold;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="!"] :hover,
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="!"] :focus,
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="~"] :hover,
|
|
.sheet-rolltemplate-scp > .sheet-scp .sheet-roll-buttons a[href^="~"] :focus {
|
|
background-color: var(--backColor);
|
|
color: var(--fontColor);
|
|
border-color: var(--borderColor);
|
|
transition: var(--focusTrans);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.sheet-finished {
|
|
border-bottom-width: 2px;
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.sheet-finished .sheet-roll-content {
|
|
border-bottom-left-radius: var(--innerBorderRadius);
|
|
border-bottom-right-radius: var(--innerBorderRadius);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.sheet-finished.sheet-continuation {
|
|
border-radius: 0 0 var(--templateRadius) var(--templateRadius);
|
|
}
|
|
.sheet-rolltemplate-scp > .sheet-scp.sheet-finished:not(.sheet-continuation) {
|
|
border-radius: var(--templateRadius);
|
|
}
|
|
.sheet-rolltemplate-scp .sheet-description {
|
|
border-radius: var(--innerBorderRadius);
|
|
background-color: white;
|
|
}
|
|
.sheet-rolltemplate-scp .sheet-description:empty {
|
|
display: none;
|
|
}
|
|
.sheet-rolltemplate-scp .sheet-description > * {
|
|
padding: 2px;
|
|
}
|
|
.sheet-rolltemplate-scp .sheet-description a,
|
|
.sheet-rolltemplate-scp .sheet-description a[href^="!"],
|
|
.sheet-rolltemplate-scp .sheet-description a[href^="~"] {
|
|
color: var(--selectColor);
|
|
text-shadow: var(--selectShadow);
|
|
font-weight: bold;
|
|
font-style: italic;
|
|
}
|
|
.sheet-rolltemplate-scp .sheet-description .sheet-range {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
padding: 2px;
|
|
} |