mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
4002 lines
151 KiB
CSS
4002 lines
151 KiB
CSS
@import url("https://fonts.googleapis.com/css?family=Material+Icons|Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200|Galdeano|Marcellus+SC|Sorts+Mill+Goudy&display=swap");
|
||
html {
|
||
font-size: 16px;
|
||
}
|
||
|
||
body {
|
||
--font1:var(--topHeadFont);
|
||
--font2:var(--topHeadFont);
|
||
--font3:var(--midHeadFont);
|
||
--font4:var(--midHeadFont);
|
||
--font5:var(--midHeadFont);
|
||
--font6:var(--contentHeadFont);
|
||
--font7:var(--contentHeadFont);
|
||
--baseFontSize: 16px;
|
||
--size1:300%;
|
||
--size2:250%;
|
||
--size3:200%;
|
||
--size4:150%;
|
||
--size5:125%;
|
||
--size6:100%;
|
||
--size7:87.5%;
|
||
--icon-size:24px;
|
||
--font-icon: "Material Icons";
|
||
--normal-gap-x:1rem;
|
||
--normal-gap-y:1rem;
|
||
--normal-gap: var(--normal-gap-x);
|
||
--half-gap-x:calc(var(--normal-gap-x) / 2);
|
||
--half-gap-y:calc(var(--normal-gap-y) / 2);
|
||
--half-gap: var(--half-gap-x);
|
||
--tiny-gap-x:calc(var(--half-gap-x) / 2);
|
||
--tiny-gap-y:calc(var(--half-gap-y) / 2);
|
||
--tiny-gap: var(--tiny-gap-x);
|
||
--big-gap-x:calc(var(--normal-gap-x) * 2);
|
||
--big-gap-y:calc(var(--normal-gap-y) * 2);
|
||
--big-gap: var(--big-gap-x);
|
||
--lm-backColor:#fff;
|
||
--dm-backColor:var(--dark-surface1);
|
||
--backColor:var(--lm-backColor);
|
||
--lm-selectedColor:#000;
|
||
--dm-selectedColor:#007476;
|
||
--selectedColor:var(--lm-selectedColor);
|
||
--lm-unselectedColor1:lightgrey;
|
||
--dm-unselectedColor1:#0e0e0e;
|
||
--unselectedColor1:var(--lm-unselectedColor1);
|
||
--lm-unselectedColor2:transparent;
|
||
--dm-unselectedColor2:transparent;
|
||
--unselectedColor2:var(--lm-unselectedColor2);
|
||
--lm-checkColor:#000;
|
||
--dm-checkColor:#ff0000;
|
||
--checkColor:var(--lm-checkColor);
|
||
--lm-checkedBackColor:transparent;
|
||
--dm-checkedBackColor:transparent;
|
||
--checkedBackColor:var(--lm-checkedBackColor);
|
||
--lm-borderColor:#000;
|
||
--dm-borderColor:lightgrey;
|
||
--borderColor:var(--lm-borderColor);
|
||
--lm-fontColor:#0f0f0f;
|
||
--dm-fontColor:var(--dark-primarytext);
|
||
--fontColor:var(--lm-fontColor);
|
||
--lm-disabledColor:var(--lm-unselectedColor1);
|
||
--dm-disabledColor:var(--dm-unselectedColor1);
|
||
--disabledColor:var(--lm-disabledColor);
|
||
--checkContent: "✓";
|
||
--checkWeight: bold;
|
||
--checkSize: 150%;
|
||
--checkLineHeight: calc(var(--checkSize) / 3);
|
||
--checkboxBorderWidth: var(--borderWidth);
|
||
--checkboxBorderStyle: var(--borderStyle);
|
||
--lm-checkboxBorderColor: var(--lm-borderColor);
|
||
--dm-checkboxBorderColor: var(--dm-borderColor);
|
||
--checkboxBorderColor: var(--lm-checkBorderColor);
|
||
--checkboxWidth: 14px;
|
||
--checkboxHeight: 14px;
|
||
--inputTopPadding: 2px;
|
||
--inputRightPadding: 2px;
|
||
--inputBottomPadding: 2px;
|
||
--inputLeftPadding: 2px;
|
||
--inputPadding:
|
||
var(--inputTopPadding)
|
||
var(--inputRightPadding)
|
||
var(--inputBottomPadding)
|
||
var(--inputLeftPadding);
|
||
--lm-placeholderColor:#ededed80;
|
||
--dm-placeholderColor:#3f3f3f80;
|
||
--placeholderColor: var(--lm-placeholderColor);
|
||
--textareaResize: vertical;
|
||
--borderWidth:1px;
|
||
--borderStyle:solid;
|
||
--expandedSymbol:"unfold_less";
|
||
--collapsedSymbol: "unfold_more";
|
||
--collapseHoverOpacity: 1;
|
||
--collapseBaseOpacity: 0;
|
||
--lm-collapseExpandedColor:var(--lm-selectedColor);
|
||
--dm-collapseExpandedColor:var(--dm-selectedColor);
|
||
--collapseExpandedColor: var(--lm-collapseExpandedColor);
|
||
--lm-collapseCollapsedColor:var(--lm-unselectedColor);
|
||
--dm-collapseCollapsedColor:var(--dm-unselectedColor);
|
||
--collapseCollapsedColor: var(--lm-collapseCollapsedColor);
|
||
--fillLeftDisplay: flex;
|
||
--fillLeftAlignment: center;
|
||
--fillLeftDataTransform: uppercase;
|
||
--fillLeftDataSize: var(--size6);
|
||
--lm-fillLeftSelectedColor: var(--lm-selectedColor);
|
||
--dm-fillLeftSelectedColor: var(--dm-selectedColor);
|
||
--fillLeftSelectedColor: var(--lm-fillLeftSelectedColor);
|
||
--lm-fillLeftUnselectedColor: var(--lm-unselectedColor);
|
||
--dm-fillLeftUnselectedColor: var(--dm-unselectedColor);
|
||
--fillLeftUnselectedColor: var(--lm-fillLeftUnselectedColor);
|
||
--lm-fillLeftDataColor: var(--lm-backColor);
|
||
--dm-fillLeftDataColor: var(--dm-backColor);
|
||
--fillLeftDataColor: var(--lm-fillLeftDataColor);
|
||
--lm-selectColor: var(--lm-fontColor);
|
||
--dm-selectColor: var(--dm-fontColor);
|
||
--selectColor: var(--lm-fontColor);
|
||
--selectTextOverflow: var(--textOverflow);
|
||
--selectTextAlign: center;
|
||
--selectTextTransform: capitalize;
|
||
--revealTime:500ms;
|
||
--revealFunction: ease-in-out;
|
||
--revealTrans: var(--revealTime) var(--revealFunction);
|
||
--kmodal-width:fit-content;
|
||
--kmodal-height:fit-content;
|
||
--kmodal-max-width:90vw;
|
||
--kmodal-max-height:90vh;
|
||
--lm-kmodal-overlay-background:rgba(0,0,0,.9);
|
||
--dm-kmodal-overlay-background:rgba(0,0,0,.9);
|
||
--kmodal-overlay-background: var(--lm-kmodal-overlay-background);
|
||
--lm-kmodal-dialog-background:var(--lm-backColor);
|
||
--dm-kmodal-dialog-background:var(--dm-backColor);
|
||
--kmodal-dialog-background: var(--lm-kmodal-dialog-background);
|
||
--kmodal-border-width:0px;
|
||
--kmodal-border-color:transparent;
|
||
--lm-kmodal-box-shadow-color1:rgba(0, 0, 0, 0.25);
|
||
--dm-kmodal-box-shadow-color1:rgba(0, 0, 0, 0.25);
|
||
--kmodal-box-shadow-color1:var(--lm-kmodal-box-shadow-color1);
|
||
--kmodal-box-shadow-blur1:28px;
|
||
--kmodal-box-shadow-x1:0px;
|
||
--kmodal-box-shadow-y1:14px;
|
||
--kmodal-box-shadow-spread1:0px;
|
||
--lm-kmodal-box-shadow-color2:rgba(0, 0, 0, 0.22);
|
||
--dm-kmodal-box-shadow-color2:rgba(0, 0, 0, 0.22);
|
||
--kmodal-box-shadow-color2:var(--lm-kmodal-box-shadow-color2);
|
||
--kmodal-box-shadow-blur2:10px;
|
||
--kmodal-box-shadow-x2:0px;
|
||
--kmodal-box-shadow-y2:10px;
|
||
--kmodal-box-shadow-spread2:0px;
|
||
--kmodal-box-shadow:
|
||
var(--kmodal-box-shadow-x1) var(--kmodal-box-shadow-y1) var(--kmodal-box-shadow-blur1) var(--kmodal-box-shadow-spread1) var(--kmodal-box-shadow-color1),
|
||
var(--kmodal-box-shadow-x2) var(--kmodal-box-shadow-y2) var(--kmodal-box-shadow-blur2) var(--kmodal-box-shadow-spread2) var(--kmodal-box-shadow-color2);
|
||
--kmodal-close-width:1rem;
|
||
--kmodal-close-height:1rem;
|
||
--lm-kmodal-close-color:#ccc;
|
||
--dm-kmodal-close-color:#aaa;
|
||
--kmodal-close-color:var(--lm-kmodal-close-color);
|
||
--lm-kmodal-close-hover-color:#aaa;
|
||
--dm-kmodal-close-hover-color:#aaa;
|
||
--kmodal-close-hover-color:var(--lm-kmodal-close-hover-color);
|
||
--kmodal-close-line-thickness:2px;
|
||
--kmodal-close-line-length:calc(var(--kmodal-close-width) * 1.5);
|
||
--input-label-gap: var(--half-gap);
|
||
--lm-fontColor:black;
|
||
--dm-fontColor: beige;
|
||
--checkedColor: var(--selectedColor);
|
||
--dm-collapseExpandedColor: var(--dm-fontColor);
|
||
--dm-checkColor: var(--dm-fontColor);
|
||
--checkColor: var(--selectedColor);
|
||
--fontColor:var(--lm-fontColor);
|
||
--lm-backColor: var(--lm-parchment);
|
||
--dm-backColor: var(--dm-parchment);
|
||
--backColor: var(--lm-backColor);
|
||
--lm-r20Back: white;
|
||
--dm-r20Back: var(--dark-surface1);
|
||
--r20Back: var(--lm-r20Back);
|
||
--lm-darkBack: #b09d8d;
|
||
--dm-darkBack: #453b30;
|
||
--darkBack: var(--lm-darkBack);
|
||
--lm-inputBack: white;
|
||
--dm-inputBack: #3d3d3d;
|
||
--inputBack: var(--lm-inputBack);
|
||
--lm-borderColor: #42351F;
|
||
--dm-borderColor: #e6d6b7;
|
||
--borderColor: var(--lm-borderColor);
|
||
--lm-rowHighlight: #e2dcd5;
|
||
--dm-rowHighlight: #443b30;
|
||
--rowHighlight: var(--lm-rowHighlight);
|
||
--size1: 225%;
|
||
--size2: 200%;
|
||
--size3: 175%;
|
||
--size4: 150%;
|
||
--size5: 125%;
|
||
--size6: 100%;
|
||
--size7: 75%;
|
||
--topHeadFont:"Marcellus SC", serif;
|
||
--midHeadFont:"Galdeano", sans-serif;
|
||
--contentHeadFont:"Sorts Mill Goudy", serif;
|
||
--lm-borderColor: #4d3510;
|
||
--dm-dieBorderColor: #f5f5d6;
|
||
--dieBorderColor: var(--lm-borderColor);
|
||
--notchSize: 7px;
|
||
--notchBorderSize: 1px;
|
||
--notchColor: var(--lm-backColor);
|
||
color: var(--fontColor);
|
||
font-family: var(--contentHeadFont);
|
||
--lm-parchment: #f3f2ef;
|
||
--dm-parchment: var(--dark-surface1);
|
||
--parchment: var(--lm-parchment);
|
||
--lm-nested: #e5e1de;
|
||
--lm-alternate_row: #dfd7cf;
|
||
--lm-deep: #b09d8d;
|
||
--lm-border: #42351F;
|
||
--border-line: url(https://s3.amazonaws.com/files.d20.io/images/354260458/QSLIwKH8i0rWtAfvzvyYTw/med.gif);
|
||
--border-spiral: url(https://s3.amazonaws.com/files.d20.io/images/353247502/JUPOhxkDzTvuzSIGayuVpQ/med.png);
|
||
--border-spiral__corner: url(https://s3.amazonaws.com/files.d20.io/images/353248611/qKAMrL2mNWA3jauOBQtDxQ/med.png);
|
||
--border-spiral__reversed: url(https://s3.amazonaws.com/files.d20.io/images/353782683/z50SyhtDvmDnbZNO7IKnRQ/max.gif);
|
||
--border-cut_corner: url(https://s3.amazonaws.com/files.d20.io/images/353253271/z5vgCnG_oc_mbc4rL1C72Q/med.gif);
|
||
--border-cut_corner_dark: url(https://s3.amazonaws.com/files.d20.io/images/353253768/YdoOfSDPqxCW_h5Q7ramTg/med.gif);
|
||
--img-corner_cross: url(https://s3.amazonaws.com/files.d20.io/images/353250224/y6YkpNVtnCC_BP8aPwBaPQ/med.png);
|
||
--img-corner_spiral: url(https://s3.amazonaws.com/files.d20.io/images/353250203/dWS_YKqBcSs5zPPxvtUKrg/med.png);
|
||
--img-sheet_border: url(https://s3.amazonaws.com/files.d20.io/images/353777784/JQDvWnTsln9g83JP9ZOGzw/max.gif);
|
||
--img-line: url(https://s3.amazonaws.com/files.d20.io/images/353785283/sQHeKJJEYhXMCjHRv1_HoA/max.png);
|
||
--dm-border-spiral: url(https://s3.amazonaws.com/files.d20.io/images/354150545/r6qzd_bHDWWq_Fqsz89Lpw/med.png);
|
||
--dm-border-spiral__corner: url(https://s3.amazonaws.com/files.d20.io/images/354161587/MTnXp9y_1CDymRMg0Ad2Qw/med.png);
|
||
--dm-border-line: url(https://s3.amazonaws.com/files.d20.io/images/354161251/1GHDY8-5xfu2btEVIRXDpg/med.png);
|
||
--dm-border__reversed: url(https://s3.amazonaws.com/files.d20.io/images/354133538/eLHCNHY2X6SySWYyzjpTrw/max.png);
|
||
--dm-border-cut_corner: url(https://s3.amazonaws.com/files.d20.io/images/354133635/uVF9Q15LFoWTimaAppBjuw/max.png);
|
||
--dm-border-sheet_border: url(https://s3.amazonaws.com/files.d20.io/images/354133958/4ZyrQb9jkuBrLxoh0zCMiw/max.png);
|
||
--dm-corner_corner: url(https://s3.amazonaws.com/files.d20.io/images/354133708/5R4IDVmeqs4sNLvIlsAuNw/med.png);
|
||
--dm-corner_spiral: url(https://s3.amazonaws.com/files.d20.io/images/354133709/ClJHw1We_GgDpManWP_vCA/med.png);
|
||
--dm-line: url(https://s3.amazonaws.com/files.d20.io/images/354134034/iCKf8NbpzY-F9Ki6IrQ0_Q/max.png);
|
||
--lm-vaesen-bullet: url(https://files.d20.io/images/432554587/JbsbSlbOBmn-s7c9wJKq5w/original.png);
|
||
--dm-vaesen-bullet: url(https://files.d20.io/images/432554587/JbsbSlbOBmn-s7c9wJKq5w/original.png);
|
||
--vaesen-bullet: var(--lm-vaesen-bullet);
|
||
color: var(--fontColor);
|
||
font-size: 1rem;
|
||
}
|
||
body .ui-dialog .nav-tabs {
|
||
position: sticky;
|
||
top: 0;
|
||
z-index: 1000;
|
||
background-color: var(--r20Back);
|
||
}
|
||
body .ui-dialog .nav-tabs a {
|
||
font-family: var(--font3);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet {
|
||
position: relative;
|
||
top: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
/* width */
|
||
/* Track */
|
||
/* Handle */
|
||
/* Handle on hover */
|
||
background: var(--parchment);
|
||
border: 1px solid black;
|
||
border-image: var(--img-sheet_border) 60;
|
||
border-image-width: 2em;
|
||
padding: 1.5em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet select,
|
||
body .ui-dialog .tab-content .charsheet textarea,
|
||
body .ui-dialog .tab-content .charsheet input,
|
||
body .ui-dialog .tab-content .charsheet .uneditable-input,
|
||
body .ui-dialog .tab-content .charsheet label,
|
||
body .ui-dialog .tab-content .charsheet button {
|
||
all: initial;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .flex-box,
|
||
body .ui-dialog .tab-content .charsheet .sheet-flex-box {
|
||
display: flex;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .flex-wrap,
|
||
body .ui-dialog .tab-content .charsheet .sheet-flex-wrap {
|
||
flex-wrap: wrap;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .justify-space-around,
|
||
body .ui-dialog .tab-content .charsheet .sheet-justify-space-around {
|
||
justify-content: space-around;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .justify-space-between,
|
||
body .ui-dialog .tab-content .charsheet .sheet-justify-space-between {
|
||
justify-content: space-between;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .justify-center,
|
||
body .ui-dialog .tab-content .charsheet .sheet-justify-center {
|
||
justify-content: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .flex-min-content,
|
||
body .ui-dialog .tab-content .charsheet .sheet-flex-min-content {
|
||
flex: 1 0 min-content;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .stacked {
|
||
flex-direction: column;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .stacked.center > * {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .stacked:not(.center) {
|
||
align-items: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .stacked > [name]:not([type=number]):not([type=checkbox]):not([type=radio]) {
|
||
width: 100%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .flex-column,
|
||
body .ui-dialog .tab-content .charsheet .sheet-flex-column {
|
||
flex-direction: column;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .flex-row-reverse,
|
||
body .ui-dialog .tab-content .charsheet .sheet-flex-row-revers {
|
||
flex-direction: row-reverse;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .flex-column-reverse,
|
||
body .ui-dialog .tab-content .charsheet .sheet-flex-column-reverse {
|
||
flex-direction: column-reverse;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .normal-gap,
|
||
body .ui-dialog .tab-content .charsheet .sheet-normal-gap {
|
||
gap: var(--normal-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .normal-gap-x,
|
||
body .ui-dialog .tab-content .charsheet .sheet-normal-gap-x {
|
||
column-gap: var(--normal-gap-x);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .normal-gap-y,
|
||
body .ui-dialog .tab-content .charsheet .sheet-normal-gap-y {
|
||
row-gap: var(--normal-gap-y);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .half-gap,
|
||
body .ui-dialog .tab-content .charsheet .sheet-half-gap {
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .half-gap-x,
|
||
body .ui-dialog .tab-content .charsheet .sheet-half-gap-x {
|
||
column-gap: var(--half-gap-x);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .half-gap-y,
|
||
body .ui-dialog .tab-content .charsheet .sheet-half-gap-y {
|
||
row-gap: var(--half-gap-y);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tiny-gap,
|
||
body .ui-dialog .tab-content .charsheet .sheet-tiny-gap {
|
||
gap: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tiny-gap-x,
|
||
body .ui-dialog .tab-content .charsheet .sheet-tiny-gap-x {
|
||
column-gap: var(--tiny-gap-x);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tiny-gap-y,
|
||
body .ui-dialog .tab-content .charsheet .sheet-tiny-gap-y {
|
||
row-gap: var(--tiny-gap-y);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .big-gap,
|
||
body .ui-dialog .tab-content .charsheet .sheet-big-gap {
|
||
gap: var(--big-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .big-gap-x,
|
||
body .ui-dialog .tab-content .charsheet .sheet-big-gap-x {
|
||
column-gap: var(--big-gap-x);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .big-gap-y,
|
||
body .ui-dialog .tab-content .charsheet .sheet-big-gap-y {
|
||
row-gap: var(--big-gap-y);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .grid,
|
||
body .ui-dialog .tab-content .charsheet .sheet-grid {
|
||
display: grid;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .grid-span-2,
|
||
body .ui-dialog .tab-content .charsheet .sheet-grid-span-2 {
|
||
grid-column: span 2;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .grid-span-all,
|
||
body .ui-dialog .tab-content .charsheet .sheet-grid-span-all {
|
||
grid-column: 1/-1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .grid-column,
|
||
body .ui-dialog .tab-content .charsheet .sheet-grid-column {
|
||
grid-auto-flow: column;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .grid-dense,
|
||
body .ui-dialog .tab-content .charsheet .sheet-grid-dense {
|
||
grid-auto-flow: dense;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .boxed,
|
||
body .ui-dialog .tab-content .charsheet .sheet-boxed {
|
||
border: 2px solid var(--borderColor);
|
||
border-radius: 0;
|
||
box-sizing: border-box;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .boxed.thick-left,
|
||
body .ui-dialog .tab-content .charsheet .sheet-boxed.thick-left {
|
||
border-left-width: 5px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .boxed.thick-bottom,
|
||
body .ui-dialog .tab-content .charsheet .sheet-boxed.thick-bottom {
|
||
border-bottom-width: 5px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .boxed.thick-right,
|
||
body .ui-dialog .tab-content .charsheet .sheet-boxed.thick-right {
|
||
border-right-width: 5px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .boxed.thick-top,
|
||
body .ui-dialog .tab-content .charsheet .sheet-boxed.thick-top {
|
||
border-top-width: 5px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .underlined,
|
||
body .ui-dialog .tab-content .charsheet .sheet-underlined {
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-radius: 5px;
|
||
border-color: transparent;
|
||
box-sizing: border-box;
|
||
border-radius: 0;
|
||
border-bottom: 1px solid var(--borderColor);
|
||
transition: border-radius border var(--revealTrans);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet :is(.underlined, .boxed):not([readonly]):not([type=checkbox]):not([type=radio]):is(:hover, :focus, :focus-within) {
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-color: var(--borderColor);
|
||
border-radius: 5px;
|
||
box-sizing: border-box;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet :is(.underlined, .boxed):not([readonly]):not([type=checkbox]):not([type=radio]):is(:focus, :focus-within) {
|
||
background-color: var(--disabledColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .underlined--invisible {
|
||
border-color: transparent !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .ratio1-1,
|
||
body .ui-dialog .tab-content .charsheet .sheet-ratio1-1 {
|
||
aspect-ratio: 1/1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet span,
|
||
body .ui-dialog .tab-content .charsheet input,
|
||
body .ui-dialog .tab-content .charsheet textarea,
|
||
body .ui-dialog .tab-content .charsheet button,
|
||
body .ui-dialog .tab-content .charsheet select {
|
||
line-height: normal;
|
||
color: inherit;
|
||
font-family: inherit;
|
||
font-size: inherit;
|
||
line-height: inherit;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-1,
|
||
body .ui-dialog .tab-content .charsheet .sheet-text-1 {
|
||
font-size: var(--size1);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-2,
|
||
body .ui-dialog .tab-content .charsheet .sheet-text-2 {
|
||
font-size: var(--size2);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-3,
|
||
body .ui-dialog .tab-content .charsheet .sheet-text-3 {
|
||
font-size: var(--size3);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-4,
|
||
body .ui-dialog .tab-content .charsheet .sheet-text-4 {
|
||
font-size: var(--size4);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-5,
|
||
body .ui-dialog .tab-content .charsheet .sheet-text-5 {
|
||
font-size: var(--size5);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-6,
|
||
body .ui-dialog .tab-content .charsheet .sheet-text-6 {
|
||
font-size: var(--size6);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-7,
|
||
body .ui-dialog .tab-content .charsheet .sheet-text-7 {
|
||
font-size: var(--size7);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .capitalize,
|
||
body .ui-dialog .tab-content .charsheet .sheet-capitalize {
|
||
text-transform: capitalize !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .lowercase,
|
||
body .ui-dialog .tab-content .charsheet .sheet-lowercase {
|
||
text-transform: lowercase !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .uppercase,
|
||
body .ui-dialog .tab-content .charsheet .sheet-uppercase {
|
||
text-transform: uppercase !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .sheet-material-icons,
|
||
body .ui-dialog .tab-content .charsheet .material-icons {
|
||
font-family: "Material Icons";
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
font-size: var(--icon-size); /* Preferred icon size */
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .material-symbol,
|
||
body .ui-dialog .tab-content .charsheet .sheet-material-symbol {
|
||
font-family: "Material Symbols Outlined";
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
font-size: 24px; /* Preferred icon size */
|
||
display: inline-block;
|
||
line-height: 1;
|
||
text-transform: none;
|
||
letter-spacing: normal;
|
||
word-wrap: normal;
|
||
white-space: nowrap;
|
||
direction: ltr;
|
||
font-variation-settings: "FILL" 1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .sheet-italics,
|
||
body .ui-dialog .tab-content .charsheet .italics {
|
||
font-style: italic;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h1,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="1"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size1);
|
||
font-family: var(--font1);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h1:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="1"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h1 *,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="1"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size1);
|
||
font-family: var(--font1);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h1 *:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="1"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h2, body .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name],
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="2"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size2);
|
||
font-family: var(--font2);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h2:not(input), body .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name]:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="2"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h2 *, body .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name] *,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="2"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size2);
|
||
font-family: var(--font2);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h2 *:not(input), body .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name] *:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="2"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h3,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="3"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size3);
|
||
font-family: var(--font3);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h3:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="3"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h3 *,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="3"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size3);
|
||
font-family: var(--font3);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h3 *:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="3"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h4,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="4"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size4);
|
||
font-family: var(--font4);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h4:not(:where(input)),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="4"]:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h4:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="4"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h4 *,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="4"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size4);
|
||
font-family: var(--font4);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h4 *:not(:where(input)),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="4"] *:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h4 *:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="4"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h5,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="5"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size5);
|
||
font-style: normal;
|
||
font-family: var(--font5);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h5:not(:where(input)),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="5"]:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h5:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="5"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h5 *,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="5"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size5);
|
||
font-style: normal;
|
||
font-family: var(--font5);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h5 *:not(:where(input)),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="5"] *:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h5 *:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="5"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h6,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="6"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size5);
|
||
font-style: normal;
|
||
font-family: var(--font5);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h6:not(:where(input)),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="6"]:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h6:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="6"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h6 *,
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="6"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size5);
|
||
font-style: normal;
|
||
font-family: var(--font5);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h6 *:not(:where(input)),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="6"] *:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h6 *:not(input),
|
||
body .ui-dialog .tab-content .charsheet *[aria-level="6"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .sheet-pictos,
|
||
body .ui-dialog .tab-content .charsheet .pictos {
|
||
font-family: pictos;
|
||
text-transform: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .pictos3,
|
||
body .ui-dialog .tab-content .charsheet .sheet-pictos3 {
|
||
font-family: pictos three;
|
||
text-transform: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .pictoscustom,
|
||
body .ui-dialog .tab-content .charsheet .sheet-pictoscustom {
|
||
font-family: pictos custom;
|
||
text-transform: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .d4,
|
||
body .ui-dialog .tab-content .charsheet .sheet-d4 {
|
||
font-family: dicefontd4 !important;
|
||
text-transform: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .d6,
|
||
body .ui-dialog .tab-content .charsheet .sheet-d6 {
|
||
font-family: dicefontd6 !important;
|
||
text-transform: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .d8,
|
||
body .ui-dialog .tab-content .charsheet .sheet-d8 {
|
||
font-family: dicefontd8 !important;
|
||
text-transform: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .d10,
|
||
body .ui-dialog .tab-content .charsheet .sheet-d10 {
|
||
font-family: dicefontd10 !important;
|
||
text-transform: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .d12,
|
||
body .ui-dialog .tab-content .charsheet .sheet-d12 {
|
||
font-family: dicefontd12 !important;
|
||
text-transform: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .d20,
|
||
body .ui-dialog .tab-content .charsheet .sheet-d20 {
|
||
font-family: dicefontd20 !important;
|
||
text-transform: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .d30,
|
||
body .ui-dialog .tab-content .charsheet .sheet-d30 {
|
||
font-family: dicefontd30 !important;
|
||
text-transform: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input[type=checkbox] {
|
||
border: 1px solid var(--checkboxBorderColor);
|
||
cursor: pointer;
|
||
-webkit-appearance: none;
|
||
appearance: none;
|
||
width: var(--checkboxWidth);
|
||
min-width: var(--checkboxWidth);
|
||
height: var(--checkboxHeight);
|
||
min-height: var(--checkboxHeight);
|
||
display: grid;
|
||
grid-template-columns: 1fr;
|
||
grid-template-areas: "content";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input[type=checkbox]:not(.collapse):not(.fill-left__radio):checked {
|
||
background-color: var(--checkedBackColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input[type=checkbox]:not(.collapse):not(.fill-left__radio):checked:before {
|
||
content: var(--checkContent);
|
||
grid-area: content;
|
||
font-weight: var(--checkWeight);
|
||
place-self: start center;
|
||
color: var(--checkColor);
|
||
font-size: var(--checkSize);
|
||
line-height: var(--checkLineHeight);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input[type=number] {
|
||
width: 3rem;
|
||
-moz-appearance: textfield !important;
|
||
text-align: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input[type=number]::-webkit-inner-spin-button, body .ui-dialog .tab-content .charsheet input[type=number]::-webkit-outer-spin-button {
|
||
-webkit-appearance: none;
|
||
margin: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet select,
|
||
body .ui-dialog .tab-content .charsheet .pseudo-select span,
|
||
body .ui-dialog .tab-content .charsheet .sheet-pseudo-select span,
|
||
body .ui-dialog .tab-content .charsheet textarea,
|
||
body .ui-dialog .tab-content .charsheet input:not(:is([type=radio], [type=checkbox])),
|
||
body .ui-dialog .tab-content .charsheet .uneditable-input {
|
||
padding: var(--inputPadding);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input:is([type=text], [type=number]), body .ui-dialog .tab-content .charsheet textarea {
|
||
cursor: auto;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet select,
|
||
body .ui-dialog .tab-content .charsheet .pseudo-select span,
|
||
body .ui-dialog .tab-content .charsheet .sheet-pseudo-select span,
|
||
body .ui-dialog .tab-content .charsheet input:not(:where([type=checkbox], [type=radio])),
|
||
body .ui-dialog .tab-content .charsheet .uneditable-input,
|
||
body .ui-dialog .tab-content .charsheet textarea {
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-radius: 5px;
|
||
border-color: transparent;
|
||
box-sizing: border-box;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet select,
|
||
body .ui-dialog .tab-content .charsheet .sheet-pseudo-select span,
|
||
body .ui-dialog .tab-content .charsheet .pseudo-select span {
|
||
-webkit-apperance: none;
|
||
appearance: none;
|
||
text-transform: var(--selectTextTransform);
|
||
overflow: hidden !important;
|
||
white-space: nowrap;
|
||
text-overflow: var(--selectTextOverflow);
|
||
text-align: var(--selectTextAlign);
|
||
color: var(--selectColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input {
|
||
width: auto;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input:placeholder {
|
||
color: var(--placeholderColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet input.plus-control:not([value*="-"]) + span:before {
|
||
content: "+";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet textarea {
|
||
resize: var(--textareaResize);
|
||
white-space: pre-wrap;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet textarea.fixed {
|
||
resize: none;
|
||
overflow: auto;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet button {
|
||
cursor: pointer;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .roller {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .roller:before {
|
||
content: "T";
|
||
font-family: dicefontd20;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .collapse-container {
|
||
display: grid;
|
||
position: relative;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-collapse {
|
||
cursor: pointer;
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
align-items: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-collapse:before {
|
||
content: var(--expandedSymbol);
|
||
font-family: "Material Icons";
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
font-size: var(--icon-size); /* Preferred icon size */
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-collapse__text {
|
||
display: inline;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-collapse__check:not(:checked) + .text-collapse {
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-color: var(--borderColor);
|
||
border-radius: 5px;
|
||
box-sizing: border-box;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .text-collapse__check:checked + .text-collapse:before {
|
||
content: var(--collapsedSymbol);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem:hover > .collapse, body .ui-dialog .tab-content .charsheet .repitem:hover .roll-container,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container:hover > .collapse,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container:hover .roll-container {
|
||
opacity: var(--collapseHoverOpacity);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse {
|
||
opacity: var(--collapseBaseOpacity);
|
||
position: absolute;
|
||
right: -10px;
|
||
top: 0px;
|
||
border: 0px solid black;
|
||
border-radius: 0;
|
||
color: var(--collapseExpandedColor);
|
||
text-transform: none;
|
||
background-color: transparent;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse:before,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse:before {
|
||
content: "y";
|
||
font-family: pictos;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse:checked,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked {
|
||
color: var(--collapseCollapsedColor);
|
||
background-color: transparent;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse:checked ~ .expanded,
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse:checked ~ .collapse-container .expanded,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked ~ .expanded,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked ~ .collapse-container .expanded {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + * {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse:not(:checked) ~ .collapsed,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse:not(:checked) ~ .collapsed {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem > .collapse:hover,
|
||
body .ui-dialog .tab-content .charsheet .collapse-container > .collapse:hover {
|
||
color: var(--collapseExpandedColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontainer.editmode .collapse {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .fill-left {
|
||
display: var(--fillLeftDisplay);
|
||
align-self: var(--fillLeftAlignment);
|
||
box-sizing: border-box;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .fill-left__radio {
|
||
appearance: none;
|
||
-webkit-appearance: none;
|
||
background-color: var(--fillLeftSelectedColor);
|
||
width: 100%;
|
||
height: 100%;
|
||
cursor: pointer;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .fill-left__radio[data-value]:checked:before {
|
||
content: attr(data-value);
|
||
color: var(--fillLeftDataColor);
|
||
font-size: var(--fillLeftDataSize);
|
||
place-self: center;
|
||
text-transform: var(--fillLeftDataTransform);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .fill-left__radio:checked ~ .fill-left__radio {
|
||
background-color: var(--fillLeftUnselectedColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label {
|
||
display: inline-flex;
|
||
gap: var(--input-label-gap);
|
||
align-items: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label:not(.stacked) > input[type=text] {
|
||
flex: 1 1 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label:not(.stacked) > :not([name]) {
|
||
flex: 0 0 auto;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label > :is(span, button) {
|
||
text-transform: var(--input-label-text-transform);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label--dual {
|
||
grid-template-columns: 1fr auto 1fr;
|
||
grid-template-areas: "over over over" "under under under";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label--dual > span:last-of-type {
|
||
grid-column: 1/-1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label--dual > input:not([type=number]):not([type=checkbox]):not([type=radio]) {
|
||
width: 100%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label--dual > .slash {
|
||
line-height: 0rem;
|
||
font-weight: normal;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .headed-textarea {
|
||
display: grid;
|
||
grid-template-rows: auto 1fr;
|
||
grid-template-columns: auto;
|
||
grid-column: 1/-1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .headed-textarea :not(textarea):not(.adaptive) {
|
||
justify-self: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .headed-textarea .headed-textarea__header {
|
||
grid-area: initial;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive {
|
||
display: grid;
|
||
grid-template-columns: auto;
|
||
grid-template-rows: auto;
|
||
grid-template-areas: "content";
|
||
position: relative;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive > * {
|
||
grid-area: content;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive > span {
|
||
opacity: 0;
|
||
z-index: -10;
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-radius: 5px;
|
||
border-color: transparent;
|
||
box-sizing: border-box;
|
||
text-transform: initial;
|
||
border-radius: 0px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive--text {
|
||
min-height: 4rem;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive--text__span {
|
||
white-space: pre-wrap;
|
||
padding: 2px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive--text__textarea {
|
||
width: 100%;
|
||
height: 100%;
|
||
resize: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive--text__textarea,
|
||
body .ui-dialog .tab-content .charsheet .adaptive--input__input {
|
||
position: absolute;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive--input__input {
|
||
width: 100%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive--input__span {
|
||
padding: 2px;
|
||
min-height: 1.5rem;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem > input:not([type=checkbox]) {
|
||
width: 100%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repitem .headed-textarea,
|
||
body .ui-dialog .tab-content .charsheet .repitem .description {
|
||
grid-column: 1/-1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontainer {
|
||
display: grid;
|
||
gap: var(--normal-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container {
|
||
display: grid;
|
||
grid-template-areas: "header";
|
||
align-self: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container > .header {
|
||
grid-area: header;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container :is(.repcontrol-button, .repcontrol_edit) {
|
||
opacity: 0;
|
||
transition: var(--revealTrans);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container:is(:hover, :focus-within, :focus) :is(.repcontrol-button, .repcontrol_edit) {
|
||
opacity: 1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol-button {
|
||
align-self: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol-button ~ .repcontrol {
|
||
justify-self: end;
|
||
z-index: 100;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol-button ~ .repcontrol > .repcontrol_add {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol-button--add {
|
||
justify-self: start;
|
||
width: 15px;
|
||
height: 15px;
|
||
padding: 4px;
|
||
font-size: 0;
|
||
color: var(--col-alt);
|
||
border: 1px solid var(--col-alt);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol-button--add::before {
|
||
inset: 0;
|
||
place-self: center;
|
||
font-family: var(--font-icon);
|
||
font-size: 12px;
|
||
content: "add";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__button {
|
||
all: initial;
|
||
display: flex;
|
||
margin: 0;
|
||
padding: 0;
|
||
cursor: pointer;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__checkbox[type=checkbox] {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__outer {
|
||
opacity: 0;
|
||
visibility: hidden;
|
||
position: fixed;
|
||
top: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
text-align: left;
|
||
background: var(--kmodal-overlay-background);
|
||
transition: opacity 0.25s ease;
|
||
z-index: 999;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__background {
|
||
all: initial;
|
||
margin: 0;
|
||
padding: 0;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
cursor: pointer;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__inner {
|
||
position: fixed;
|
||
width: var(--kmodal-width);
|
||
height: var(--kmodal-height);
|
||
inset: 0;
|
||
margin: auto;
|
||
overflow: auto;
|
||
background: var(--kmodal-dialog-background);
|
||
border-radius: 5px;
|
||
padding: var(--kmodal-close-height) calc(var(--kmodal-close-width) * 3) var(--kmodal-close-height) calc(var(--kmodal-close-width) * 2);
|
||
max-width: var(--kmodal-max-width);
|
||
max-height: var(--kmodal-max-height);
|
||
transition: opacity 0.25s ease;
|
||
box-shadow: var(--kmodal-box-shadow);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__close {
|
||
position: absolute;
|
||
right: var(--kmodal-close-width);
|
||
top: var(--kmodal-close-height);
|
||
width: var(--kmodal-close-width);
|
||
height: var(--kmodal-close-height);
|
||
cursor: pointer;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__close:after,
|
||
body .ui-dialog .tab-content .charsheet .kmodal__close:before {
|
||
content: "";
|
||
position: absolute;
|
||
width: var(--kmodal-close-line-thickness);
|
||
height: var(--kmodal-close-line-length);
|
||
background: var(--kmodal-close-color);
|
||
display: block;
|
||
transform: rotate(45deg);
|
||
left: 50%;
|
||
margin: -3px 0 0 -1px;
|
||
top: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__close:hover:after,
|
||
body .ui-dialog .tab-content .charsheet .kmodal__close:hover:before {
|
||
background: var(--kmodal-close-hover-color);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__close:before {
|
||
transform: rotate(-45deg);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__checkbox:not(:checked) + .kmodal__outer {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__checkbox:checked + .kmodal__outer {
|
||
opacity: 1;
|
||
visibility: visible;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .kmodal__checkbox:checked + .kmodal__outer .kmodal__inner {
|
||
top: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs__container:not(.k-active-tab) {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs__nav-item {
|
||
list-style: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs__nav-list {
|
||
display: flex;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet ::-webkit-scrollbar {
|
||
width: 8px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet ::-webkit-scrollbar-track {
|
||
background: #f1f1f1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet ::-webkit-scrollbar-thumb {
|
||
background: #888;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet ::-webkit-scrollbar-thumb:hover {
|
||
background: var(--elementColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=border], body .ui-dialog .tab-content .charsheet [class^=sheet-border] {
|
||
position: relative;
|
||
--__background: transparent;
|
||
border: 1px solid black;
|
||
border-image: var(--border-spiral) 65;
|
||
border-image-width: 3.5em;
|
||
border-image-repeat: repeat;
|
||
border-image-outset: 0.5em;
|
||
border-radius: 2em 0 0 0;
|
||
background: var(--__background);
|
||
min-height: 2em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=border]:not(:has(> .scroll-container)),
|
||
body .ui-dialog .tab-content .charsheet [class^=border] > .scroll-container, body .ui-dialog .tab-content .charsheet [class^=sheet-border]:not(:has(> .scroll-container)),
|
||
body .ui-dialog .tab-content .charsheet [class^=sheet-border] > .scroll-container {
|
||
padding: 1em 0.7em 0.7em 0.7em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=border][class*=__line], body .ui-dialog .tab-content .charsheet [class^=sheet-border][class*=__line] {
|
||
border-image: var(--border-line) 20;
|
||
border-image-width: 1em;
|
||
border-image-repeat: repeat;
|
||
border-image-outset: 0.5em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=border][class*=__spiral], body .ui-dialog .tab-content .charsheet [class^=sheet-border][class*=__spiral] {
|
||
border-image: var(--border-spiral__corner) 40;
|
||
border-image-width: 2.5em;
|
||
border-image-repeat: repeat;
|
||
border-image-outset: 0.7em 0.5em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=border][class*=__spiral]::before, body .ui-dialog .tab-content .charsheet [class^=sheet-border][class*=__spiral]::before {
|
||
--__square: 1.5em;
|
||
position: absolute;
|
||
content: "";
|
||
height: var(--__square);
|
||
aspect-ratio: 1;
|
||
background: var(--img-corner_spiral);
|
||
background-size: var(--__square);
|
||
rotate: 180deg;
|
||
bottom: 0;
|
||
right: 0;
|
||
translate: 50% 50%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=border][class*=__cross], body .ui-dialog .tab-content .charsheet [class^=sheet-border][class*=__cross] {
|
||
border-image: var(--border-spiral__reversed) 65;
|
||
border-image-width: 2.5em;
|
||
border-image-repeat: repeat;
|
||
border-image-outset: 0.7em 0.5em;
|
||
border-radius: 0 0 2em 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=border][class*=__cross]::before, body .ui-dialog .tab-content .charsheet [class^=sheet-border][class*=__cross]::before {
|
||
--__square: 1.5em;
|
||
position: absolute;
|
||
content: "";
|
||
height: var(--__square);
|
||
aspect-ratio: 1;
|
||
background: var(--img-corner_cross);
|
||
background-size: var(--__square);
|
||
top: 0;
|
||
left: 0;
|
||
translate: -40% -40%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=tag], body .ui-dialog .tab-content .charsheet [class^=sheet-tag] {
|
||
position: relative;
|
||
border: 1px solid black;
|
||
border-image: var(--border-cut_corner) 20 fill;
|
||
border-image-width: 0.75em;
|
||
border-image-repeat: round;
|
||
padding: 0.4em;
|
||
filter: drop-shadow(2px 4px 1px rgba(0, 0, 0, 0.2));
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [class^=tag][class*=__dark], body .ui-dialog .tab-content .charsheet [class^=sheet-tag][class*=__dark] {
|
||
border: 1px solid black;
|
||
border-image: var(--border-cut_corner_dark) 20 fill;
|
||
border-image-width: 0.75em;
|
||
border-image-repeat: round;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .underline,
|
||
body .ui-dialog .tab-content .charsheet .sheet-underline {
|
||
background-image: var(--img-line);
|
||
background-size: 800px 30px;
|
||
background-position: center -100%;
|
||
background-repeat: repeat-x;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet textarea.underline, body .ui-dialog .tab-content .charsheet textarea.sheet-underline {
|
||
background-repeat: repeat;
|
||
background-size: 800px 23px;
|
||
line-height: normal;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label {
|
||
display: flex;
|
||
position: relative;
|
||
line-height: 2;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label span, body .ui-dialog .tab-content .charsheet .input-label button {
|
||
font-size: 0.5em;
|
||
font-weight: bold;
|
||
text-transform: uppercase;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label input {
|
||
border: none;
|
||
padding: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label.underline {
|
||
background-position: center 1em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label.super span {
|
||
position: absolute;
|
||
top: -0.3em;
|
||
left: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label.super input {
|
||
position: relative;
|
||
top: 0.2em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label.sub.underline {
|
||
background-position: center 0.4em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label.sub span {
|
||
position: absolute;
|
||
bottom: -0.3em;
|
||
left: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .input-label.sub input {
|
||
position: relative;
|
||
bottom: 0.4em;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .display-control:not(:checked) + .controlled-display {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .display-control--inverted:checked + .controlled-display {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .display-control--non-zero:is([value="0"], :not([value]), [value=""]) + .controlled-display {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .display-control--zero:not([value="0"], :not([value]), [value=""]) + .controlled-display {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet label, body .ui-dialog .tab-content .charsheet select, body .ui-dialog .tab-content .charsheet input, body .ui-dialog .tab-content .charsheet textarea {
|
||
color: inherit;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet h2, body .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name] {
|
||
font-family: var(--topHeaderFont);
|
||
font-size: 1em;
|
||
margin: 0;
|
||
padding: 0;
|
||
text-align: center;
|
||
text-transform: uppercase;
|
||
font-weight: bold;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [type=roll]:before {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .itemcontrol {
|
||
z-index: 100;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive {
|
||
font-family: "Times New Roman", Times, serif;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive, body .ui-dialog .tab-content .charsheet input, body .ui-dialog .tab-content .charsheet select {
|
||
line-height: normal;
|
||
font-weight: normal;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .adaptive > span {
|
||
font-weight: inherit;
|
||
font-family: inherit;
|
||
font-size: inherit;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet [hidden] {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .flex-span-all {
|
||
flex: 1 0 100%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet ::placeholder {
|
||
text-transform: capitalize;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .disabled {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs__nav-item:has(.disabled) {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched, body .ui-dialog .tab-content .charsheet .upgrade-section .repitem,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched {
|
||
display: grid;
|
||
grid-template-areas: "content";
|
||
box-sizing: border-box;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched > *, body .ui-dialog .tab-content .charsheet .upgrade-section .repitem > *,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched > * {
|
||
grid-area: content !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched:has(> .notch-container > [type=number]), body .ui-dialog .tab-content .charsheet .upgrade-section .repitem:has(> .notch-container > [type=number]),
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched:has(> .notch-container > [type=number]) {
|
||
width: 45px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched-label--number,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched-label--number {
|
||
width: 100px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched.notch-input > .notch-container > *, body .ui-dialog .tab-content .charsheet .upgrade-section .notch-input.repitem > .notch-container > *, body .ui-dialog .tab-content .charsheet .notched.sheet-notch-results > .sheet-notch-container > *, body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-notch-results.repitem > .sheet-notch-container > *,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched.notch-input > .notch-container > *,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched.sheet-notch-results > .sheet-notch-container > * {
|
||
background-color: var(--inputBack);
|
||
width: 100%;
|
||
border-width: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched--labelled .input-label,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched--labelled .input-label {
|
||
gap: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched--labelled .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched--labelled .notch-container {
|
||
background-color: var(--inputBack);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched--labelled input,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched--labelled input {
|
||
width: 100%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched:not(.notch-input) > .notch-container, body .ui-dialog .tab-content .charsheet .upgrade-section .repitem:not(.notch-input) > .notch-container, body .ui-dialog .tab-content .charsheet .notched:not(.sheet-notch-input) > .sheet-notch-container, body .ui-dialog .tab-content .charsheet .upgrade-section .repitem:not(.sheet-notch-input) > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched:not(.notch-input) > .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched:not(.sheet-notch-input) > .sheet-notch-container {
|
||
padding: calc(var(--notchSize) / 2) var(--notchSize);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched:after, body .ui-dialog .tab-content .charsheet .upgrade-section .repitem:after,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched:after {
|
||
content: "";
|
||
z-index: 10;
|
||
grid-area: content;
|
||
--_notchPattern: var(--notchColor), var(--notchColor) var(--notchSize),transparent var(--notchSize);
|
||
background-image: radial-gradient(circle at top left, var(--_notchPattern)), radial-gradient(circle at top right, var(--_notchPattern)), radial-gradient(circle at bottom left, var(--_notchPattern)), radial-gradient(circle at bottom right, var(--_notchPattern));
|
||
pointer-events: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched.bordered:after, body .ui-dialog .tab-content .charsheet .upgrade-section .notched.repitem:after, body .ui-dialog .tab-content .charsheet .upgrade-section .bordered.repitem:after, body .ui-dialog .tab-content .charsheet .upgrade-section .repitem:after, body .ui-dialog .tab-content .charsheet .notched.sheet-bordered:after, body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-bordered.repitem:after,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched.bordered:after,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-notched.repitem:after,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched.sheet-bordered:after {
|
||
--_notchPattern: var(--notchColor), var(--notchColor) calc(var(--notchSize) - var(--notchBorderSize)), var(--borderColor) calc(var(--notchSize) - var(--notchBorderSize)), var(--borderColor) var(--notchSize),transparent var(--notchSize) ;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched.bordered > .notch-container, body .ui-dialog .tab-content .charsheet .upgrade-section .notched.repitem > .notch-container, body .ui-dialog .tab-content .charsheet .upgrade-section .bordered.repitem > .notch-container, body .ui-dialog .tab-content .charsheet .upgrade-section .repitem > .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .notched.bordered > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .notched.repitem > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .bordered.repitem > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem > .sheet-notch-container, body .ui-dialog .tab-content .charsheet .notched.sheet-bordered > .notch-container, body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-bordered.repitem > .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .notched.sheet-bordered > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-bordered.repitem > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched.bordered > .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-notched.repitem > .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched.bordered > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-notched.repitem > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched.sheet-bordered > .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-notched.sheet-bordered > .sheet-notch-container {
|
||
border: 1px solid var(--borderColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notch-container .adaptive {
|
||
width: 100%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched-checkbox {
|
||
--notchSize: 2px;
|
||
--notchBorderSize: 1px;
|
||
--_clipSize: calc(var(--notchSize) * 1.7072135785);
|
||
display: inline-grid;
|
||
grid-template-areas: "content";
|
||
clip-path: polygon(var(--_clipSize) 0, calc(100% - var(--_clipSize)) 0, 100% var(--_clipSize), 100% calc(100% - var(--_clipSize)), calc(100% - var(--_clipSize)) 100%, var(--_clipSize) 100%, 0 calc(100% - var(--_clipSize)), 0 var(--_clipSize));
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched-checkbox > * {
|
||
grid-area: content;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched-checkbox > input {
|
||
background-color: var(--inputBack);
|
||
border: var(--notchBorderSize) solid var(--borderColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched-checkbox > input:checked {
|
||
background-color: var(--borderColor) !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched-checkbox > input:checked:before {
|
||
content: initial !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched-checkbox:after {
|
||
--_nS: var(--notchSize);
|
||
--_bS: var(--notchBorderSize);
|
||
content: "";
|
||
grid-area: content;
|
||
background-image: linear-gradient(45deg, var(--borderColor) calc(var(--_nS) + var(--_bS)), transparent calc(var(--_nS) + var(--_bS))), linear-gradient(135deg, var(--borderColor) calc(var(--_nS) + var(--_bS)), transparent calc(var(--_nS) + var(--_bS))), linear-gradient(225deg, var(--borderColor) calc(var(--_nS) + var(--_bS)), transparent calc(var(--_nS) + var(--_bS))), linear-gradient(315deg, var(--borderColor) calc(var(--_nS) + var(--_bS)), transparent calc(var(--_nS) + var(--_bS)));
|
||
pointer-events: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notched-checkbox {
|
||
aspect-ratio: 1/1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .alternating-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-alternating-container {
|
||
display: grid;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .alternating-container > *,
|
||
body .ui-dialog .tab-content .charsheet .sheet-alternating-container > * {
|
||
padding: var(--tiny-gap) var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .alternating-container > *:nth-child(even),
|
||
body .ui-dialog .tab-content .charsheet .sheet-alternating-container > *:nth-child(even) {
|
||
background-color: var(--rowHighlight);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .alternating-container > *:nth-child(even) .notched, body .ui-dialog .tab-content .charsheet .alternating-container > *:nth-child(even) .upgrade-section .repitem, body .ui-dialog .tab-content .charsheet .upgrade-section .alternating-container > *:nth-child(even) .repitem,
|
||
body .ui-dialog .tab-content .charsheet .sheet-alternating-container > *:nth-child(even) .notched,
|
||
body .ui-dialog .tab-content .charsheet .sheet-alternating-container > *:nth-child(even) .upgrade-section .repitem,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-alternating-container > *:nth-child(even) .repitem {
|
||
--notchColor: var(--rowHighlight);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .headed-section,
|
||
body .ui-dialog .tab-content .charsheet .sheet-headed-section {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .headed-section:has(> .header), body .ui-dialog .tab-content .charsheet .headed-section:has(> .sheet-header),
|
||
body .ui-dialog .tab-content .charsheet .sheet-headed-section:has(> .header),
|
||
body .ui-dialog .tab-content .charsheet .sheet-headed-section:has(> .sheet-header) {
|
||
grid-template-rows: auto 1fr;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .headed-section:not(:has(> .header)), body .ui-dialog .tab-content .charsheet .headed-section:not(:has(> .sheet-header)),
|
||
body .ui-dialog .tab-content .charsheet .sheet-headed-section:not(:has(> .header)),
|
||
body .ui-dialog .tab-content .charsheet .sheet-headed-section:not(:has(> .sheet-header)) {
|
||
grid-template-rows: 1fr;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .header,
|
||
body .ui-dialog .tab-content .charsheet .sheet-header {
|
||
color: var(--borderColor);
|
||
background-color: var(--darkBack);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .header > .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .header > .sheet-notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-header > .notch-container,
|
||
body .ui-dialog .tab-content .charsheet .sheet-header > .sheet-notch-container {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .header .notched, body .ui-dialog .tab-content .charsheet .header .upgrade-section .repitem, body .ui-dialog .tab-content .charsheet .upgrade-section .header .repitem,
|
||
body .ui-dialog .tab-content .charsheet .header .sheet-notched,
|
||
body .ui-dialog .tab-content .charsheet .sheet-header .notched,
|
||
body .ui-dialog .tab-content .charsheet .sheet-header .upgrade-section .repitem,
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .sheet-header .repitem,
|
||
body .ui-dialog .tab-content .charsheet .sheet-header .sheet-notched {
|
||
--notchColor: var(--darkBack);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-relationships {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-advantages {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magic-item-section {
|
||
display: contents;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-equipment {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
grid-template-columns: 1fr 1fr;
|
||
grid-template-rows: auto 1fr;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .facilities-edit {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-insights {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-mementos {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-talents {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-weapons {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
grid-template-columns: 1fr 1fr 1fr;
|
||
grid-template-areas: "name name name" "skill skill availability" "damage range bonus";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-magical-powers {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-magic-items {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-conditions {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
grid-template-columns: auto 1fr;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-conditions .notched-checkbox {
|
||
place-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-conditions .effect-input {
|
||
grid-column: 2;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-conditions .notched:has[type=checkbox], body .ui-dialog .tab-content .charsheet .edit-section-conditions .upgrade-section .repitem:has[type=checkbox], body .ui-dialog .tab-content .charsheet .upgrade-section .edit-section-conditions .repitem:has[type=checkbox] {
|
||
place-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-section-attacks {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
grid-template-columns: 1fr 1fr;
|
||
grid-template-areas: "name name" "damage range";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .facilities-edit {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .scroll-container {
|
||
overflow: hidden auto;
|
||
max-height: 100%;
|
||
max-width: 100%;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .edit-header {
|
||
text-wrap: wrap;
|
||
text-transform: capitalize;
|
||
font-size: var(--size4);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .complex-section + fieldset + .repcontainer .edit-button:before {
|
||
content: "p";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .complex-section + fieldset + .repcontainer + .repcontrol > .repcontrol_add {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal {
|
||
--modalWidth: 300px;
|
||
position: fixed;
|
||
top: var(--big-gap);
|
||
right: 25px;
|
||
background-color: var(--backColor);
|
||
z-index: 1000;
|
||
filter: drop-shadow(rgba(0, 0, 0, 0.45) 0px 25px 20px);
|
||
box-sizing: border-box;
|
||
min-width: var(--modalWidth);
|
||
max-width: var(--modalWidth);
|
||
max-height: 80vh;
|
||
display: grid;
|
||
grid-template-areas: "content";
|
||
grid-template-rows: 1fr;
|
||
padding: 2px 1px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal > * {
|
||
grid-area: content;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal > .scroll-container {
|
||
padding: var(--big-gap);
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
grid-template-rows: auto auto auto;
|
||
grid-template-areas: "header header" "content content" "save trash";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal > .scroll-container > .edit-header {
|
||
grid-area: header;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal > .scroll-container > .controlled-display {
|
||
grid-area: content;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal > .scroll-container > button[name$=save] {
|
||
grid-area: save;
|
||
justify-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal > .scroll-container > button[name$=cancel] {
|
||
grid-area: trash;
|
||
justify-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal-control:not(:checked) + .vaesen-modal {
|
||
display: none;
|
||
animation: slideout 1s both;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-modal-control:checked + .vaesen-modal {
|
||
animation: slidein 1s both;
|
||
}
|
||
@keyframes slidein {
|
||
from {
|
||
transform: translate(100%);
|
||
opacity: 0;
|
||
}
|
||
to {
|
||
transform: translate(0);
|
||
opacity: 1;
|
||
}
|
||
}
|
||
@keyframes slideout {
|
||
from {
|
||
display: block;
|
||
transform: translate(0);
|
||
opacity: 1;
|
||
}
|
||
to {
|
||
display: none;
|
||
transform: translate(100%);
|
||
opacity: 0;
|
||
}
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--settings {
|
||
display: flex;
|
||
gap: var(--half-gap);
|
||
flex-wrap: wrap;
|
||
justify-content: space-around;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--pc {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||
grid-auto-flow: dense;
|
||
gap: var(--normal-gap);
|
||
align-items: start;
|
||
}
|
||
@container vaesen (min-width: 520px) {
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--pc .character-section,
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--pc .equipment-container,
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--pc .skill-container {
|
||
grid-column: span 2;
|
||
}
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--pc .nested-pc-grid {
|
||
display: grid;
|
||
gap: var(--normal-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--hq {
|
||
display: grid;
|
||
gap: var(--normal-gap);
|
||
grid-template-columns: 1fr 1fr;
|
||
align-items: start;
|
||
}
|
||
@container vaesen (max-width: 500px) {
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--hq {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--vaesen {
|
||
--_layout-gap: var(--normal-gap);
|
||
display: block;
|
||
column-width: 300px;
|
||
column-gap: var(--_layout-gap);
|
||
column-fill: balance;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--vaesen > * {
|
||
break-inside: avoid;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--vaesen > *:not(.header):not(.text-container):not(.text-container + *) {
|
||
margin-top: var(--_layout-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--vaesen .header, body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--vaesen .text-container {
|
||
column-span: all;
|
||
margin-bottom: var(--_layout-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--vaesen .text-container {
|
||
gap: var(--_layout-gap);
|
||
flex-wrap: wrap;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--vaesen .text-container > * {
|
||
flex: 1 0 300px;
|
||
width: 300px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--npc .flex-box {
|
||
align-content: start;
|
||
align-items: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--npc .header input {
|
||
width: 100%;
|
||
font-weight: bold;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .npc-skill-container {
|
||
display: flex;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .npc-skill-container .notched, body .ui-dialog .tab-content .charsheet .npc-skill-container .upgrade-section .repitem, body .ui-dialog .tab-content .charsheet .upgrade-section .npc-skill-container .repitem {
|
||
width: 150px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .skill-collapse:checked ~ .skill-display-control:is([value="0"], [value=""], :not([value])) + .controlled-skill {
|
||
display: none !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--animal {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--animal .notched, body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--animal .upgrade-section .repitem, body .ui-dialog .tab-content .charsheet .upgrade-section .tabs--vaesen__container--animal .repitem {
|
||
width: 100px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen__container--animal .header input {
|
||
width: 100%;
|
||
font-weight: bold;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .notch-container:has(.repeating-container) {
|
||
background-color: var(--inputBack);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container {
|
||
display: grid;
|
||
grid-template-columns: auto 1fr;
|
||
grid-template-areas: "header header" "repeat repeat" "add edit";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container > .repcontainer {
|
||
grid-area: repeat;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container .edit-button {
|
||
right: 0;
|
||
z-index: 10;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container .repitem:not(:last-child) {
|
||
border-bottom: 2px solid var(--borderColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container .repcontrol-button--add {
|
||
grid-area: add;
|
||
place-self: center start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repeating-container .repcontrol {
|
||
grid-area: edit;
|
||
place-self: center end;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .character-section {
|
||
display: flex;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .character-section > * {
|
||
flex-grow: 1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .relationship-section .fieldset-headers {
|
||
display: grid;
|
||
grid-template-columns: subgrid;
|
||
grid-area: header;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .relationship-section .repcontainer {
|
||
display: grid;
|
||
grid-template-columns: subgrid;
|
||
grid-area: repeat;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .relationship-section .repitem {
|
||
display: grid;
|
||
grid-template-columns: subgrid;
|
||
grid-column: 1/-1;
|
||
align-items: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .experience-container {
|
||
display: flex;
|
||
gap: var(--tiny-gap);
|
||
align-items: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .experience-checks {
|
||
display: grid;
|
||
grid-template-columns: repeat(5, auto);
|
||
grid-template-rows: repeat(2, auto);
|
||
justify-content: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .custom-fill-left .notched-checkbox:has(~ .notched-checkbox > input:checked) > input {
|
||
background-color: var(--borderColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .attribute-row {
|
||
min-height: 30px;
|
||
align-items: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .condition-container .alternating-container {
|
||
grid-template-columns: auto 1fr auto;
|
||
align-items: center;
|
||
gap: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .condition-container .alternating-container .condition-line {
|
||
grid-column: 1/-1;
|
||
display: grid;
|
||
grid-template-columns: subgrid;
|
||
align-items: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .condition-container .alternating-container .condition-line span {
|
||
grid-column: 2;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .skill-layout {
|
||
column-width: 252px;
|
||
display: block;
|
||
column-gap: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .skill-layout > * {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .armor-container {
|
||
display: grid;
|
||
grid-template-columns: auto 1fr auto auto;
|
||
grid-template-rows: auto auto;
|
||
gap: 0 var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .armor-container .notched:has([type=number]), body .ui-dialog .tab-content .charsheet .armor-container .upgrade-section .repitem:has([type=number]), body .ui-dialog .tab-content .charsheet .upgrade-section .armor-container .repitem:has([type=number]) {
|
||
justify-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .armor-container .notched, body .ui-dialog .tab-content .charsheet .armor-container .upgrade-section .repitem, body .ui-dialog .tab-content .charsheet .upgrade-section .armor-container .repitem {
|
||
align-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .armor-container span {
|
||
place-self: end center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .armor-container h3 {
|
||
place-self: end start;
|
||
grid-column: span 2;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container {
|
||
grid-template-columns: 1fr auto auto auto 30px;
|
||
grid-template-rows: auto 1fr auto;
|
||
grid-template-areas: "header header header header" "repeat repeat repeat repeat" "add . . edit";
|
||
gap: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .damage, body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .range, body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .bonus {
|
||
justify-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .repeat-header {
|
||
grid-template-areas: ". damage range bonus .";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .repeat-header .damage {
|
||
grid-area: damage;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .repeat-header .range {
|
||
grid-area: range;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .repeat-header .bonus {
|
||
grid-area: bonus;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .repeat-header,
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .repcontainer,
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container .repitem,
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container [type=roll] {
|
||
grid-column: 1/-1;
|
||
display: grid;
|
||
grid-template-columns: subgrid;
|
||
gap: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .repeating-container [type=roll]:before {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .weapon-container .notched, body .ui-dialog .tab-content .charsheet .weapon-container .upgrade-section .repitem, body .ui-dialog .tab-content .charsheet .upgrade-section .weapon-container .repitem {
|
||
grid-template-areas: "content content content content";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .right-align {
|
||
margin-left: auto;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .equipment-container .repitem {
|
||
display: grid;
|
||
grid-template-columns: auto 1fr 30px;
|
||
grid-template-rows: auto auto 1fr;
|
||
grid-template-areas: "button name bonus";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .equipment-container .repitem .roll-button {
|
||
grid-area: button;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .equipment-container .repitem .summary {
|
||
grid-area: name;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .talent-container .repitem {
|
||
display: grid;
|
||
grid-template-columns: auto 1fr;
|
||
grid-template-rows: auto 1fr;
|
||
grid-template-areas: "button name" "description description";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .talent-container .repitem .roll-button {
|
||
grid-area: button;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .talent-container .repitem .summary {
|
||
grid-area: name;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .talent-container .repitem .controlled-display {
|
||
grid-area: description;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .summary {
|
||
cursor: pointer;
|
||
align-items: center;
|
||
gap: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .summary > .summary__arrow:before {
|
||
font-family: "Material Icons";
|
||
content: "expand_more" !important;
|
||
font-weight: normal !important;
|
||
font-style: normal !important;
|
||
font-size: 100% !important; /* Preferred icon size */
|
||
display: inline-block !important;
|
||
line-height: 1 !important;
|
||
text-transform: none !important;
|
||
letter-spacing: normal !important;
|
||
word-wrap: normal !important;
|
||
white-space: nowrap !important;
|
||
direction: ltr;
|
||
rotate: -90deg;
|
||
transition-property: rotate;
|
||
transition-duration: 0.5s;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .summary > .summary__arrow:checked:before {
|
||
rotate: 0deg;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .slide-down-control:not(:checked) + .controlled-display {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .advantage-container .used {
|
||
place-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .advantage-container .repitem {
|
||
display: grid;
|
||
grid-template-columns: auto auto 1fr;
|
||
grid-template-rows: auto 1fr;
|
||
grid-template-areas: "check button name" "description description description";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .advantage-container .repitem .roll-button {
|
||
grid-area: button;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .advantage-container .repitem .summary {
|
||
grid-area: name;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .advantage-container .repitem .controlled-display {
|
||
grid-area: description;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .insight-container .repitem {
|
||
display: grid;
|
||
grid-template-columns: auto 1fr;
|
||
grid-template-rows: auto 1fr;
|
||
grid-template-areas: "button name" "description description";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .insight-container .repitem .roll-button {
|
||
grid-area: button;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .insight-container .repitem .summary {
|
||
grid-area: name;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .insight-container .repitem .controlled-display {
|
||
grid-area: description;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .hq-section {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .hq-section .header .notched, body .ui-dialog .tab-content .charsheet .hq-section .header .upgrade-section .repitem, body .ui-dialog .tab-content .charsheet .upgrade-section .hq-section .header .repitem {
|
||
width: 75px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .history-section h3 {
|
||
text-align: left;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .history-section .notched, body .ui-dialog .tab-content .charsheet .history-section .upgrade-section .repitem, body .ui-dialog .tab-content .charsheet .upgrade-section .history-section .repitem {
|
||
background-color: var(--inputBack);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .hq-display-container {
|
||
gap: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .hq-display-container:has(.hq-display-line:empty) {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .hq-display-line {
|
||
font-size: var(--size7) !important;
|
||
font-weight: normal !important;
|
||
text-transform: none !important;
|
||
flex: 1;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .hq-display-line {
|
||
border-bottom: 2px solid #937e6d;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||
gap: var(--normal-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section h3, body .ui-dialog .tab-content .charsheet .upgrade-section h4, body .ui-dialog .tab-content .charsheet .upgrade-section h5 {
|
||
text-align: left;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repeating-container {
|
||
gap: var(--half-gap);
|
||
align-self: stretch;
|
||
grid-template-rows: auto 1fr auto;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repcontainer {
|
||
display: block;
|
||
column-width: 150px;
|
||
column-gap: var(--half-gap);
|
||
align-self: start;
|
||
column-fill: balance;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem {
|
||
background-color: var(--inputBack);
|
||
break-inside: avoid;
|
||
margin-bottom: var(--half-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem .summary {
|
||
align-items: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem .summary .summary__arrow {
|
||
margin-top: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem .summary span {
|
||
text-wrap: wrap;
|
||
text-align: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem:not(:last-child) {
|
||
border-bottom: 0px solid transparent;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem .item-description {
|
||
font-style: italic;
|
||
font-size: var(--size7);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem .edit-button {
|
||
right: -5px;
|
||
top: 10px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .upgrade-section .repitem .notch-container {
|
||
display: grid;
|
||
gap: var(--tiny-gap);
|
||
grid-template-rows: auto 1fr;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magical-powers-container .repcontainer {
|
||
gap: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magical-powers-container .repitem {
|
||
--_scale: 0.7rem;
|
||
display: inline;
|
||
margin-left: 1rem;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magical-powers-container .repitem:before {
|
||
content: "";
|
||
display: inline-block;
|
||
background-image: var(--vaesen-bullet);
|
||
background-size: contain;
|
||
background-repeat: no-repeat;
|
||
width: var(--_scale);
|
||
height: var(--_scale);
|
||
position: absolute;
|
||
left: -1rem;
|
||
top: 0.25rem;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magical-powers-container .repitem span:first-of-type {
|
||
font-weight: bold;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magical-powers-container .repitem span:first-of-type:after {
|
||
content: ": ";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magical-powers-container .repitem span:first-of-type:empty {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magical-powers-container .repitem:not(:last-child) {
|
||
border: 0px solid transparent;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magic-items-control:checked + .controlled-display:has(.repcontainer:empty) {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magic-items-container .repeating-container {
|
||
grid-template-columns: 60px 1fr;
|
||
grid-template-areas: "header header" "label label" "repeat repeat" "add edit";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magic-items-container .section-labels,
|
||
body .ui-dialog .tab-content .charsheet .magic-items-container .repcontainer,
|
||
body .ui-dialog .tab-content .charsheet .magic-items-container .repitem {
|
||
grid-column: 1/-1;
|
||
display: grid;
|
||
grid-template-columns: subgrid;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magic-items-container .repcontainer {
|
||
gap: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magic-items-container .repitem {
|
||
padding: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magic-items-container .repitem:not(:last-child):not(:nth-child(odd)) {
|
||
border-bottom: 0px solid transparent;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .magic-items-container .repitem:nth-child(odd) {
|
||
background-color: var(--rowHighlight);
|
||
border-block: 1px solid color-mix(in lch, var(--rowHighlight) 80%, black);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .plus-control:not([value^="-"]):not([value^="+"]) + .controlled-plus:before {
|
||
content: "+";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-condition-container .repcontainer {
|
||
gap: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-condition-container .repitem {
|
||
display: inline-flex;
|
||
gap: var(--tiny-gap);
|
||
align-items: start;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-condition-container .repitem:not(:last-child) {
|
||
border-bottom: 0px solid transparent;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-condition-container .repitem .inline-display > :not(:empty):not(:last-child):after {
|
||
content: " ";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-condition-container .repitem .description:not(:empty):before {
|
||
content: "– ";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repeating-container {
|
||
grid-template-columns: 1fr 100px 100px;
|
||
grid-template-areas: "header header" "label label" "repeat repeat" "add edit";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .section-labels,
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repcontainer,
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repitem,
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repitem > [type=roll] {
|
||
grid-column: 1/-1;
|
||
display: grid;
|
||
grid-template-columns: subgrid;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repcontainer {
|
||
gap: 0;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .section-labels :not(:first-child),
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repitem > [type=roll] :not(:first-child) {
|
||
justify-self: center;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repitem {
|
||
padding: var(--tiny-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repitem .hider {
|
||
left: -10px;
|
||
right: auto;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repitem:not(:last-child):not(:nth-child(odd)) {
|
||
border-bottom: 0px solid transparent;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .vaesen-combat-container .repitem:nth-child(odd) {
|
||
background-color: var(--rowHighlight);
|
||
border-block: 1px solid color-mix(in lch, var(--rowHighlight) 80%, black);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs--vaesen {
|
||
container: vaesen/inline-size;
|
||
padding-top: var(--normal-gap);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .tabs__header {
|
||
position: absolute;
|
||
top: 10px;
|
||
right: 30px;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .description,
|
||
body .ui-dialog .tab-content .charsheet .repitem .description {
|
||
white-space: pre-wrap;
|
||
grid-column: initial;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .display-contents {
|
||
display: contents;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .bold {
|
||
font-weight: bold;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .hider:before {
|
||
content: "unfold_less" !important;
|
||
font-family: Material Icons !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .hider:checked:before {
|
||
content: "unfold_more" !important;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet option {
|
||
color: var(--lm-fontColor);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .token-overlay {
|
||
position: absolute;
|
||
width: 80px;
|
||
z-index: 100;
|
||
top: -20px;
|
||
left: -22px;
|
||
filter: drop-shadow(rgba(0, 0, 0, 0.19) 0px 10px 20px) drop-shadow(rgba(0, 0, 0, 0.23) 0px 6px 6px);
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .token-overlay:not([src]) {
|
||
display: none;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol_edit {
|
||
display: grid;
|
||
grid-template-columns: auto 0;
|
||
overflow: hidden;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol_edit:before {
|
||
content: "edit_note";
|
||
font-family: "Material Icons";
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol_edit,
|
||
body .ui-dialog .tab-content .charsheet .repcontrol-button--add {
|
||
font-size: 100%;
|
||
width: auto;
|
||
height: auto;
|
||
display: grid;
|
||
}
|
||
body .ui-dialog .tab-content .charsheet .repcontrol_edit:before,
|
||
body .ui-dialog .tab-content .charsheet .repcontrol-button--add:before {
|
||
font-size: 130%;
|
||
line-height: normal;
|
||
}
|
||
body.sheet-darkmode {
|
||
--backColor:var(--dm-backColor);
|
||
--selectedColor:var(--dm-selectedColor);
|
||
--unselectedColor1:var(--dm-unselectedColor1);
|
||
--unselectedColor2:var(--dm-unselectedColor2);
|
||
--checkColor:var(--dm-checkColor);
|
||
--checkedBackColor:var(--dm-checkedBackColor);
|
||
--borderColor:var(--dm-borderColor);
|
||
--fontColor:var(--dm-fontColor);
|
||
--disabledColor:var(--dm-disabledColor);
|
||
--fontColor: var(--dm-fontColor);
|
||
color: var(--fontColor);
|
||
--collapseExpandedColor: var(--dm-collapseExpandedColor);
|
||
--backColor: var(--dm-backColor);
|
||
--borderColor: var(--dm-borderColor);
|
||
--inputBack: var(--dm-inputBack);
|
||
--parchment: var(--dm-parchment);
|
||
--darkBack: var(--dm-darkBack);
|
||
--r20Back: var(--dm-r20Back);
|
||
--border-line: var(--dm-border-line);
|
||
--border-spiral: var(--dm-border-spiral);
|
||
--border-spiral__corner: var(--dm-border-spiral__corner);
|
||
--border-spiral__reversed: var(--dm-border__reversed);
|
||
--border-cut_corner: var(--dm-border-cut_corner);
|
||
--border-sheet_border: var(--dm-border-sheet_border);
|
||
--img-corner_cross: var(--dm-corner_corner);
|
||
--img-corner_spiral: var(--dm-corner_spiral);
|
||
--img-sheet_border: var(--dm-border-sheet_border);
|
||
--img-line: var(--dm-line);
|
||
--vaesen-bullet: var(--dm-vaesen-bullet);
|
||
--dieBorderColor: var(--dm-borderColor);
|
||
--notchColor: var(--dm-backColor);
|
||
--rowHighlight: var(--dm-rowHighlight);
|
||
}
|
||
|
||
.sheet-rolltemplate-vaesen {
|
||
--font1:var(--topHeadFont);
|
||
--font2:var(--topHeadFont);
|
||
--font3:var(--midHeadFont);
|
||
--font4:var(--midHeadFont);
|
||
--font5:var(--midHeadFont);
|
||
--font6:var(--contentHeadFont);
|
||
--font7:var(--contentHeadFont);
|
||
--baseFontSize: 16px;
|
||
--size1:300%;
|
||
--size2:250%;
|
||
--size3:200%;
|
||
--size4:150%;
|
||
--size5:125%;
|
||
--size6:100%;
|
||
--size7:87.5%;
|
||
--icon-size:24px;
|
||
--font-icon: "Material Icons";
|
||
--normal-gap-x:1rem;
|
||
--normal-gap-y:1rem;
|
||
--normal-gap: var(--normal-gap-x);
|
||
--half-gap-x:calc(var(--normal-gap-x) / 2);
|
||
--half-gap-y:calc(var(--normal-gap-y) / 2);
|
||
--half-gap: var(--half-gap-x);
|
||
--tiny-gap-x:calc(var(--half-gap-x) / 2);
|
||
--tiny-gap-y:calc(var(--half-gap-y) / 2);
|
||
--tiny-gap: var(--tiny-gap-x);
|
||
--big-gap-x:calc(var(--normal-gap-x) * 2);
|
||
--big-gap-y:calc(var(--normal-gap-y) * 2);
|
||
--big-gap: var(--big-gap-x);
|
||
--lm-backColor:#fff;
|
||
--dm-backColor:var(--dark-surface1);
|
||
--backColor:var(--lm-backColor);
|
||
--lm-selectedColor:#000;
|
||
--dm-selectedColor:#007476;
|
||
--selectedColor:var(--lm-selectedColor);
|
||
--lm-unselectedColor1:lightgrey;
|
||
--dm-unselectedColor1:#0e0e0e;
|
||
--unselectedColor1:var(--lm-unselectedColor1);
|
||
--lm-unselectedColor2:transparent;
|
||
--dm-unselectedColor2:transparent;
|
||
--unselectedColor2:var(--lm-unselectedColor2);
|
||
--lm-checkColor:#000;
|
||
--dm-checkColor:#ff0000;
|
||
--checkColor:var(--lm-checkColor);
|
||
--lm-checkedBackColor:transparent;
|
||
--dm-checkedBackColor:transparent;
|
||
--checkedBackColor:var(--lm-checkedBackColor);
|
||
--lm-borderColor:#000;
|
||
--dm-borderColor:lightgrey;
|
||
--borderColor:var(--lm-borderColor);
|
||
--lm-fontColor:#0f0f0f;
|
||
--dm-fontColor:var(--dark-primarytext);
|
||
--fontColor:var(--lm-fontColor);
|
||
--lm-disabledColor:var(--lm-unselectedColor1);
|
||
--dm-disabledColor:var(--dm-unselectedColor1);
|
||
--disabledColor:var(--lm-disabledColor);
|
||
--checkContent: "✓";
|
||
--checkWeight: bold;
|
||
--checkSize: 150%;
|
||
--checkLineHeight: calc(var(--checkSize) / 3);
|
||
--checkboxBorderWidth: var(--borderWidth);
|
||
--checkboxBorderStyle: var(--borderStyle);
|
||
--lm-checkboxBorderColor: var(--lm-borderColor);
|
||
--dm-checkboxBorderColor: var(--dm-borderColor);
|
||
--checkboxBorderColor: var(--lm-checkBorderColor);
|
||
--checkboxWidth: 14px;
|
||
--checkboxHeight: 14px;
|
||
--inputTopPadding: 2px;
|
||
--inputRightPadding: 2px;
|
||
--inputBottomPadding: 2px;
|
||
--inputLeftPadding: 2px;
|
||
--inputPadding:
|
||
var(--inputTopPadding)
|
||
var(--inputRightPadding)
|
||
var(--inputBottomPadding)
|
||
var(--inputLeftPadding);
|
||
--lm-placeholderColor:#ededed80;
|
||
--dm-placeholderColor:#3f3f3f80;
|
||
--placeholderColor: var(--lm-placeholderColor);
|
||
--textareaResize: vertical;
|
||
--borderWidth:1px;
|
||
--borderStyle:solid;
|
||
--expandedSymbol:"unfold_less";
|
||
--collapsedSymbol: "unfold_more";
|
||
--collapseHoverOpacity: 1;
|
||
--collapseBaseOpacity: 0;
|
||
--lm-collapseExpandedColor:var(--lm-selectedColor);
|
||
--dm-collapseExpandedColor:var(--dm-selectedColor);
|
||
--collapseExpandedColor: var(--lm-collapseExpandedColor);
|
||
--lm-collapseCollapsedColor:var(--lm-unselectedColor);
|
||
--dm-collapseCollapsedColor:var(--dm-unselectedColor);
|
||
--collapseCollapsedColor: var(--lm-collapseCollapsedColor);
|
||
--fillLeftDisplay: flex;
|
||
--fillLeftAlignment: center;
|
||
--fillLeftDataTransform: uppercase;
|
||
--fillLeftDataSize: var(--size6);
|
||
--lm-fillLeftSelectedColor: var(--lm-selectedColor);
|
||
--dm-fillLeftSelectedColor: var(--dm-selectedColor);
|
||
--fillLeftSelectedColor: var(--lm-fillLeftSelectedColor);
|
||
--lm-fillLeftUnselectedColor: var(--lm-unselectedColor);
|
||
--dm-fillLeftUnselectedColor: var(--dm-unselectedColor);
|
||
--fillLeftUnselectedColor: var(--lm-fillLeftUnselectedColor);
|
||
--lm-fillLeftDataColor: var(--lm-backColor);
|
||
--dm-fillLeftDataColor: var(--dm-backColor);
|
||
--fillLeftDataColor: var(--lm-fillLeftDataColor);
|
||
--lm-selectColor: var(--lm-fontColor);
|
||
--dm-selectColor: var(--dm-fontColor);
|
||
--selectColor: var(--lm-fontColor);
|
||
--selectTextOverflow: var(--textOverflow);
|
||
--selectTextAlign: center;
|
||
--selectTextTransform: capitalize;
|
||
--revealTime:500ms;
|
||
--revealFunction: ease-in-out;
|
||
--revealTrans: var(--revealTime) var(--revealFunction);
|
||
--kmodal-width:fit-content;
|
||
--kmodal-height:fit-content;
|
||
--kmodal-max-width:90vw;
|
||
--kmodal-max-height:90vh;
|
||
--lm-kmodal-overlay-background:rgba(0,0,0,.9);
|
||
--dm-kmodal-overlay-background:rgba(0,0,0,.9);
|
||
--kmodal-overlay-background: var(--lm-kmodal-overlay-background);
|
||
--lm-kmodal-dialog-background:var(--lm-backColor);
|
||
--dm-kmodal-dialog-background:var(--dm-backColor);
|
||
--kmodal-dialog-background: var(--lm-kmodal-dialog-background);
|
||
--kmodal-border-width:0px;
|
||
--kmodal-border-color:transparent;
|
||
--lm-kmodal-box-shadow-color1:rgba(0, 0, 0, 0.25);
|
||
--dm-kmodal-box-shadow-color1:rgba(0, 0, 0, 0.25);
|
||
--kmodal-box-shadow-color1:var(--lm-kmodal-box-shadow-color1);
|
||
--kmodal-box-shadow-blur1:28px;
|
||
--kmodal-box-shadow-x1:0px;
|
||
--kmodal-box-shadow-y1:14px;
|
||
--kmodal-box-shadow-spread1:0px;
|
||
--lm-kmodal-box-shadow-color2:rgba(0, 0, 0, 0.22);
|
||
--dm-kmodal-box-shadow-color2:rgba(0, 0, 0, 0.22);
|
||
--kmodal-box-shadow-color2:var(--lm-kmodal-box-shadow-color2);
|
||
--kmodal-box-shadow-blur2:10px;
|
||
--kmodal-box-shadow-x2:0px;
|
||
--kmodal-box-shadow-y2:10px;
|
||
--kmodal-box-shadow-spread2:0px;
|
||
--kmodal-box-shadow:
|
||
var(--kmodal-box-shadow-x1) var(--kmodal-box-shadow-y1) var(--kmodal-box-shadow-blur1) var(--kmodal-box-shadow-spread1) var(--kmodal-box-shadow-color1),
|
||
var(--kmodal-box-shadow-x2) var(--kmodal-box-shadow-y2) var(--kmodal-box-shadow-blur2) var(--kmodal-box-shadow-spread2) var(--kmodal-box-shadow-color2);
|
||
--kmodal-close-width:1rem;
|
||
--kmodal-close-height:1rem;
|
||
--lm-kmodal-close-color:#ccc;
|
||
--dm-kmodal-close-color:#aaa;
|
||
--kmodal-close-color:var(--lm-kmodal-close-color);
|
||
--lm-kmodal-close-hover-color:#aaa;
|
||
--dm-kmodal-close-hover-color:#aaa;
|
||
--kmodal-close-hover-color:var(--lm-kmodal-close-hover-color);
|
||
--kmodal-close-line-thickness:2px;
|
||
--kmodal-close-line-length:calc(var(--kmodal-close-width) * 1.5);
|
||
--input-label-gap: var(--half-gap);
|
||
--lm-fontColor:black;
|
||
--dm-fontColor: beige;
|
||
--checkedColor: var(--selectedColor);
|
||
--dm-collapseExpandedColor: var(--dm-fontColor);
|
||
--dm-checkColor: var(--dm-fontColor);
|
||
--checkColor: var(--selectedColor);
|
||
--fontColor:var(--lm-fontColor);
|
||
--lm-backColor: var(--lm-parchment);
|
||
--dm-backColor: var(--dm-parchment);
|
||
--backColor: var(--lm-backColor);
|
||
--lm-r20Back: white;
|
||
--dm-r20Back: var(--dark-surface1);
|
||
--r20Back: var(--lm-r20Back);
|
||
--lm-darkBack: #b09d8d;
|
||
--dm-darkBack: #453b30;
|
||
--darkBack: var(--lm-darkBack);
|
||
--lm-inputBack: white;
|
||
--dm-inputBack: #3d3d3d;
|
||
--inputBack: var(--lm-inputBack);
|
||
--lm-borderColor: #42351F;
|
||
--dm-borderColor: #e6d6b7;
|
||
--borderColor: var(--lm-borderColor);
|
||
--lm-rowHighlight: #e2dcd5;
|
||
--dm-rowHighlight: #443b30;
|
||
--rowHighlight: var(--lm-rowHighlight);
|
||
--size1: 225%;
|
||
--size2: 200%;
|
||
--size3: 175%;
|
||
--size4: 150%;
|
||
--size5: 125%;
|
||
--size6: 100%;
|
||
--size7: 75%;
|
||
--topHeadFont:"Marcellus SC", serif;
|
||
--midHeadFont:"Galdeano", sans-serif;
|
||
--contentHeadFont:"Sorts Mill Goudy", serif;
|
||
--lm-borderColor: #4d3510;
|
||
--dm-dieBorderColor: #f5f5d6;
|
||
--dieBorderColor: var(--lm-borderColor);
|
||
--notchSize: 7px;
|
||
--notchBorderSize: 1px;
|
||
--notchColor: var(--lm-backColor);
|
||
color: var(--fontColor);
|
||
font-family: var(--contentHeadFont);
|
||
--lm-parchment: #f3f2ef;
|
||
--dm-parchment: var(--dark-surface1);
|
||
--parchment: var(--lm-parchment);
|
||
--lm-nested: #e5e1de;
|
||
--lm-alternate_row: #dfd7cf;
|
||
--lm-deep: #b09d8d;
|
||
--lm-border: #42351F;
|
||
--border-line: url(https://s3.amazonaws.com/files.d20.io/images/354260458/QSLIwKH8i0rWtAfvzvyYTw/med.gif);
|
||
--border-spiral: url(https://s3.amazonaws.com/files.d20.io/images/353247502/JUPOhxkDzTvuzSIGayuVpQ/med.png);
|
||
--border-spiral__corner: url(https://s3.amazonaws.com/files.d20.io/images/353248611/qKAMrL2mNWA3jauOBQtDxQ/med.png);
|
||
--border-spiral__reversed: url(https://s3.amazonaws.com/files.d20.io/images/353782683/z50SyhtDvmDnbZNO7IKnRQ/max.gif);
|
||
--border-cut_corner: url(https://s3.amazonaws.com/files.d20.io/images/353253271/z5vgCnG_oc_mbc4rL1C72Q/med.gif);
|
||
--border-cut_corner_dark: url(https://s3.amazonaws.com/files.d20.io/images/353253768/YdoOfSDPqxCW_h5Q7ramTg/med.gif);
|
||
--img-corner_cross: url(https://s3.amazonaws.com/files.d20.io/images/353250224/y6YkpNVtnCC_BP8aPwBaPQ/med.png);
|
||
--img-corner_spiral: url(https://s3.amazonaws.com/files.d20.io/images/353250203/dWS_YKqBcSs5zPPxvtUKrg/med.png);
|
||
--img-sheet_border: url(https://s3.amazonaws.com/files.d20.io/images/353777784/JQDvWnTsln9g83JP9ZOGzw/max.gif);
|
||
--img-line: url(https://s3.amazonaws.com/files.d20.io/images/353785283/sQHeKJJEYhXMCjHRv1_HoA/max.png);
|
||
--dm-border-spiral: url(https://s3.amazonaws.com/files.d20.io/images/354150545/r6qzd_bHDWWq_Fqsz89Lpw/med.png);
|
||
--dm-border-spiral__corner: url(https://s3.amazonaws.com/files.d20.io/images/354161587/MTnXp9y_1CDymRMg0Ad2Qw/med.png);
|
||
--dm-border-line: url(https://s3.amazonaws.com/files.d20.io/images/354161251/1GHDY8-5xfu2btEVIRXDpg/med.png);
|
||
--dm-border__reversed: url(https://s3.amazonaws.com/files.d20.io/images/354133538/eLHCNHY2X6SySWYyzjpTrw/max.png);
|
||
--dm-border-cut_corner: url(https://s3.amazonaws.com/files.d20.io/images/354133635/uVF9Q15LFoWTimaAppBjuw/max.png);
|
||
--dm-border-sheet_border: url(https://s3.amazonaws.com/files.d20.io/images/354133958/4ZyrQb9jkuBrLxoh0zCMiw/max.png);
|
||
--dm-corner_corner: url(https://s3.amazonaws.com/files.d20.io/images/354133708/5R4IDVmeqs4sNLvIlsAuNw/med.png);
|
||
--dm-corner_spiral: url(https://s3.amazonaws.com/files.d20.io/images/354133709/ClJHw1We_GgDpManWP_vCA/med.png);
|
||
--dm-line: url(https://s3.amazonaws.com/files.d20.io/images/354134034/iCKf8NbpzY-F9Ki6IrQ0_Q/max.png);
|
||
--lm-vaesen-bullet: url(https://files.d20.io/images/432554587/JbsbSlbOBmn-s7c9wJKq5w/original.png);
|
||
--dm-vaesen-bullet: url(https://files.d20.io/images/432554587/JbsbSlbOBmn-s7c9wJKq5w/original.png);
|
||
--vaesen-bullet: var(--lm-vaesen-bullet);
|
||
--lm-diceFilter:brightness(0) saturate(100%) invert(20%) sepia(40%) saturate(666%) hue-rotate(358deg) brightness(94%) contrast(95%);
|
||
--dm-diceFilter: brightness(0) saturate(100%) invert(97%) sepia(7%) saturate(1482%) hue-rotate(317deg) brightness(110%) contrast(92%);
|
||
--diceFilter: var(--lm-diceFilter);
|
||
--lm-sixFilter: brightness(0) saturate(100%) invert(25%) sepia(86%) saturate(1239%) hue-rotate(327deg) brightness(97%) contrast(98%);
|
||
--dm-sixFilter: brightness(0) saturate(100%) invert(25%) sepia(86%) saturate(1239%) hue-rotate(327deg) brightness(97%) contrast(98%);
|
||
--sixFilter:var(--lm-sixFilter);
|
||
--dice1: url(https://files.d20.io/images/433187756/FQyHLvNR7UhQB5gd-9EMsA/original.png);
|
||
--dice2: url(https://files.d20.io/images/433187755/YuR6HwmlFtqBor9THoUwZg/original.png);
|
||
--dice3: url(https://files.d20.io/images/433187754/LnB6qAatYec_VI7Cjfy0-w/original.png);
|
||
--dice4: url(https://files.d20.io/images/433187757/uG0Pv1yIKLnOcN92NCzFfw/original.png);
|
||
--dice5: url(https://files.d20.io/images/433187758/vqwQUYqu-1ZU2Ub1uGk2fQ/original.png);
|
||
--dice6: url(https://files.d20.io/images/433187759/v2gJINkFKUj-52fhQg8vJA/original.png);
|
||
padding-block: 15px;
|
||
margin-left: -15px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template {
|
||
position: relative;
|
||
top: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
/* width */
|
||
/* Track */
|
||
/* Handle */
|
||
/* Handle on hover */
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template select,
|
||
.sheet-rolltemplate-vaesen .sheet-template textarea,
|
||
.sheet-rolltemplate-vaesen .sheet-template input,
|
||
.sheet-rolltemplate-vaesen .sheet-template .uneditable-input,
|
||
.sheet-rolltemplate-vaesen .sheet-template label,
|
||
.sheet-rolltemplate-vaesen .sheet-template button {
|
||
all: initial;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .flex-box,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-flex-box {
|
||
display: flex;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .flex-wrap,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-flex-wrap {
|
||
flex-wrap: wrap;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .justify-space-around,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-justify-space-around {
|
||
justify-content: space-around;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .justify-space-between,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-justify-space-between {
|
||
justify-content: space-between;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .justify-center,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-justify-center {
|
||
justify-content: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .flex-min-content,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-flex-min-content {
|
||
flex: 1 0 min-content;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .stacked {
|
||
flex-direction: column;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .stacked.center > * {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .stacked:not(.center) {
|
||
align-items: start;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .stacked > [name]:not([type=number]):not([type=checkbox]):not([type=radio]) {
|
||
width: 100%;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .flex-column,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-flex-column {
|
||
flex-direction: column;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .flex-row-reverse,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-flex-row-revers {
|
||
flex-direction: row-reverse;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .flex-column-reverse,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-flex-column-reverse {
|
||
flex-direction: column-reverse;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .normal-gap,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-normal-gap {
|
||
gap: var(--normal-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .normal-gap-x,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-normal-gap-x {
|
||
column-gap: var(--normal-gap-x);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .normal-gap-y,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-normal-gap-y {
|
||
row-gap: var(--normal-gap-y);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .half-gap,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-half-gap {
|
||
gap: var(--half-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .half-gap-x,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-half-gap-x {
|
||
column-gap: var(--half-gap-x);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .half-gap-y,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-half-gap-y {
|
||
row-gap: var(--half-gap-y);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .tiny-gap,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-tiny-gap {
|
||
gap: var(--tiny-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .tiny-gap-x,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-tiny-gap-x {
|
||
column-gap: var(--tiny-gap-x);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .tiny-gap-y,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-tiny-gap-y {
|
||
row-gap: var(--tiny-gap-y);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .big-gap,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-big-gap {
|
||
gap: var(--big-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .big-gap-x,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-big-gap-x {
|
||
column-gap: var(--big-gap-x);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .big-gap-y,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-big-gap-y {
|
||
row-gap: var(--big-gap-y);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .grid,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-grid {
|
||
display: grid;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .grid-span-2,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-grid-span-2 {
|
||
grid-column: span 2;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .grid-span-all,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-grid-span-all {
|
||
grid-column: 1/-1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .grid-column,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-grid-column {
|
||
grid-auto-flow: column;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .grid-dense,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-grid-dense {
|
||
grid-auto-flow: dense;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .boxed,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-boxed {
|
||
border: 2px solid var(--borderColor);
|
||
border-radius: 0;
|
||
box-sizing: border-box;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .boxed.thick-left,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-boxed.thick-left {
|
||
border-left-width: 5px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .boxed.thick-bottom,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-boxed.thick-bottom {
|
||
border-bottom-width: 5px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .boxed.thick-right,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-boxed.thick-right {
|
||
border-right-width: 5px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .boxed.thick-top,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-boxed.thick-top {
|
||
border-top-width: 5px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .underlined,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-underlined {
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-radius: 5px;
|
||
border-color: transparent;
|
||
box-sizing: border-box;
|
||
border-radius: 0;
|
||
border-bottom: 1px solid var(--borderColor);
|
||
transition: border-radius border var(--revealTrans);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template :is(.underlined, .boxed):not([readonly]):not([type=checkbox]):not([type=radio]):is(:hover, :focus, :focus-within) {
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-color: var(--borderColor);
|
||
border-radius: 5px;
|
||
box-sizing: border-box;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template :is(.underlined, .boxed):not([readonly]):not([type=checkbox]):not([type=radio]):is(:focus, :focus-within) {
|
||
background-color: var(--disabledColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .underlined--invisible {
|
||
border-color: transparent !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .ratio1-1,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-ratio1-1 {
|
||
aspect-ratio: 1/1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template span,
|
||
.sheet-rolltemplate-vaesen .sheet-template input,
|
||
.sheet-rolltemplate-vaesen .sheet-template textarea,
|
||
.sheet-rolltemplate-vaesen .sheet-template button,
|
||
.sheet-rolltemplate-vaesen .sheet-template select {
|
||
line-height: normal;
|
||
color: inherit;
|
||
font-family: inherit;
|
||
font-size: inherit;
|
||
line-height: inherit;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-1,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-text-1 {
|
||
font-size: var(--size1);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-2,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-text-2 {
|
||
font-size: var(--size2);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-3,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-text-3 {
|
||
font-size: var(--size3);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-4,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-text-4 {
|
||
font-size: var(--size4);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-5,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-text-5 {
|
||
font-size: var(--size5);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-6,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-text-6 {
|
||
font-size: var(--size6);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-7,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-text-7 {
|
||
font-size: var(--size7);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .capitalize,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-capitalize {
|
||
text-transform: capitalize !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .lowercase,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-lowercase {
|
||
text-transform: lowercase !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .uppercase,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-uppercase {
|
||
text-transform: uppercase !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-material-icons,
|
||
.sheet-rolltemplate-vaesen .sheet-template .material-icons {
|
||
font-family: "Material Icons";
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
font-size: var(--icon-size); /* Preferred icon size */
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .material-symbol,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-material-symbol {
|
||
font-family: "Material Symbols Outlined";
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
font-size: 24px; /* Preferred icon size */
|
||
display: inline-block;
|
||
line-height: 1;
|
||
text-transform: none;
|
||
letter-spacing: normal;
|
||
word-wrap: normal;
|
||
white-space: nowrap;
|
||
direction: ltr;
|
||
font-variation-settings: "FILL" 1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-italics,
|
||
.sheet-rolltemplate-vaesen .sheet-template .italics {
|
||
font-style: italic;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h1,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="1"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size1);
|
||
font-family: var(--font1);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h1:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="1"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h1 *,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="1"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size1);
|
||
font-family: var(--font1);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h1 *:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="1"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h2, .sheet-rolltemplate-vaesen .sheet-template .input-label:not(.stacked).large > [name],
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="2"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size2);
|
||
font-family: var(--font2);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h2:not(input), .sheet-rolltemplate-vaesen .sheet-template .input-label:not(.stacked).large > [name]:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="2"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h2 *, .sheet-rolltemplate-vaesen .sheet-template .input-label:not(.stacked).large > [name] *,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="2"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size2);
|
||
font-family: var(--font2);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h2 *:not(input), .sheet-rolltemplate-vaesen .sheet-template .input-label:not(.stacked).large > [name] *:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="2"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h3,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="3"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size3);
|
||
font-family: var(--font3);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h3:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="3"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h3 *,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="3"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
text-transform: uppercase;
|
||
font-size: var(--size3);
|
||
font-family: var(--font3);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h3 *:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="3"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h4,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="4"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size4);
|
||
font-family: var(--font4);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h4:not(:where(input)),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="4"]:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h4:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="4"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h4 *,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="4"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size4);
|
||
font-family: var(--font4);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h4 *:not(:where(input)),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="4"] *:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h4 *:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="4"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h5,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="5"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size5);
|
||
font-style: normal;
|
||
font-family: var(--font5);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h5:not(:where(input)),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="5"]:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h5:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="5"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h5 *,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="5"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size5);
|
||
font-style: normal;
|
||
font-family: var(--font5);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h5 *:not(:where(input)),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="5"] *:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h5 *:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="5"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h6,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="6"] {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size5);
|
||
font-style: normal;
|
||
font-family: var(--font5);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h6:not(:where(input)),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="6"]:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h6:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="6"]:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h6 *,
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="6"] * {
|
||
line-height: normal;
|
||
color: var(--fontColor);
|
||
display: block;
|
||
white-space: nowrap;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
font-weight: normal;
|
||
font-size: var(--size5);
|
||
font-style: normal;
|
||
font-family: var(--font5);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h6 *:not(:where(input)),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="6"] *:not(:where(input)) {
|
||
text-transform: capitalize;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h6 *:not(input),
|
||
.sheet-rolltemplate-vaesen .sheet-template *[aria-level="6"] *:not(input) {
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-pictos,
|
||
.sheet-rolltemplate-vaesen .sheet-template .pictos {
|
||
font-family: pictos;
|
||
text-transform: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .pictos3,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-pictos3 {
|
||
font-family: pictos three;
|
||
text-transform: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .pictoscustom,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-pictoscustom {
|
||
font-family: pictos custom;
|
||
text-transform: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .d4,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-d4 {
|
||
font-family: dicefontd4 !important;
|
||
text-transform: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .d6,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-d6 {
|
||
font-family: dicefontd6 !important;
|
||
text-transform: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .d8,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-d8 {
|
||
font-family: dicefontd8 !important;
|
||
text-transform: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .d10,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-d10 {
|
||
font-family: dicefontd10 !important;
|
||
text-transform: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .d12,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-d12 {
|
||
font-family: dicefontd12 !important;
|
||
text-transform: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .d20,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-d20 {
|
||
font-family: dicefontd20 !important;
|
||
text-transform: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .d30,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-d30 {
|
||
font-family: dicefontd30 !important;
|
||
text-transform: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input[type=checkbox] {
|
||
border: 1px solid var(--checkboxBorderColor);
|
||
cursor: pointer;
|
||
-webkit-appearance: none;
|
||
appearance: none;
|
||
width: var(--checkboxWidth);
|
||
min-width: var(--checkboxWidth);
|
||
height: var(--checkboxHeight);
|
||
min-height: var(--checkboxHeight);
|
||
display: grid;
|
||
grid-template-columns: 1fr;
|
||
grid-template-areas: "content";
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input[type=checkbox]:not(.collapse):not(.fill-left__radio):checked {
|
||
background-color: var(--checkedBackColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input[type=checkbox]:not(.collapse):not(.fill-left__radio):checked:before {
|
||
content: var(--checkContent);
|
||
grid-area: content;
|
||
font-weight: var(--checkWeight);
|
||
place-self: start center;
|
||
color: var(--checkColor);
|
||
font-size: var(--checkSize);
|
||
line-height: var(--checkLineHeight);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input[type=number] {
|
||
width: 3rem;
|
||
-moz-appearance: textfield !important;
|
||
text-align: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input[type=number]::-webkit-inner-spin-button, .sheet-rolltemplate-vaesen .sheet-template input[type=number]::-webkit-outer-spin-button {
|
||
-webkit-appearance: none;
|
||
margin: 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template select,
|
||
.sheet-rolltemplate-vaesen .sheet-template .pseudo-select span,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-pseudo-select span,
|
||
.sheet-rolltemplate-vaesen .sheet-template textarea,
|
||
.sheet-rolltemplate-vaesen .sheet-template input:not(:is([type=radio], [type=checkbox])),
|
||
.sheet-rolltemplate-vaesen .sheet-template .uneditable-input {
|
||
padding: var(--inputPadding);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input:is([type=text], [type=number]), .sheet-rolltemplate-vaesen .sheet-template textarea {
|
||
cursor: auto;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template select,
|
||
.sheet-rolltemplate-vaesen .sheet-template .pseudo-select span,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-pseudo-select span,
|
||
.sheet-rolltemplate-vaesen .sheet-template input:not(:where([type=checkbox], [type=radio])),
|
||
.sheet-rolltemplate-vaesen .sheet-template .uneditable-input,
|
||
.sheet-rolltemplate-vaesen .sheet-template textarea {
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-radius: 5px;
|
||
border-color: transparent;
|
||
box-sizing: border-box;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template select,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-pseudo-select span,
|
||
.sheet-rolltemplate-vaesen .sheet-template .pseudo-select span {
|
||
-webkit-apperance: none;
|
||
appearance: none;
|
||
text-transform: var(--selectTextTransform);
|
||
overflow: hidden !important;
|
||
white-space: nowrap;
|
||
text-overflow: var(--selectTextOverflow);
|
||
text-align: var(--selectTextAlign);
|
||
color: var(--selectColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input {
|
||
width: auto;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input:placeholder {
|
||
color: var(--placeholderColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template input.plus-control:not([value*="-"]) + span:before {
|
||
content: "+";
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template textarea {
|
||
resize: var(--textareaResize);
|
||
white-space: pre-wrap;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template textarea.fixed {
|
||
resize: none;
|
||
overflow: auto;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template button {
|
||
cursor: pointer;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .roller {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: var(--half-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .roller:before {
|
||
content: "T";
|
||
font-family: dicefontd20;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container {
|
||
display: grid;
|
||
position: relative;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-collapse {
|
||
cursor: pointer;
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
align-items: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-collapse:before {
|
||
content: var(--expandedSymbol);
|
||
font-family: "Material Icons";
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
font-size: var(--icon-size); /* Preferred icon size */
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-collapse__text {
|
||
display: inline;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-collapse__check:not(:checked) + .text-collapse {
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-color: var(--borderColor);
|
||
border-radius: 5px;
|
||
box-sizing: border-box;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .text-collapse__check:checked + .text-collapse:before {
|
||
content: var(--collapsedSymbol);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem:hover > .collapse, .sheet-rolltemplate-vaesen .sheet-template .repitem:hover .roll-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container:hover > .collapse,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container:hover .roll-container {
|
||
opacity: var(--collapseHoverOpacity);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse {
|
||
opacity: var(--collapseBaseOpacity);
|
||
position: absolute;
|
||
right: -10px;
|
||
top: 0px;
|
||
border: 0px solid black;
|
||
border-radius: 0;
|
||
color: var(--collapseExpandedColor);
|
||
text-transform: none;
|
||
background-color: transparent;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse:before,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse:before {
|
||
content: "y";
|
||
font-family: pictos;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse:checked,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse:checked {
|
||
color: var(--collapseCollapsedColor);
|
||
background-color: transparent;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse:checked ~ .expanded,
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse:checked ~ .collapse-container .expanded,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse:checked ~ .expanded,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse:checked ~ .collapse-container .expanded {
|
||
display: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + * {
|
||
display: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse:not(:checked) ~ .collapsed,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse:not(:checked) ~ .collapsed {
|
||
display: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > .collapse:hover,
|
||
.sheet-rolltemplate-vaesen .sheet-template .collapse-container > .collapse:hover {
|
||
color: var(--collapseExpandedColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repcontainer.editmode .collapse {
|
||
display: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .fill-left {
|
||
display: var(--fillLeftDisplay);
|
||
align-self: var(--fillLeftAlignment);
|
||
box-sizing: border-box;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .fill-left__radio {
|
||
appearance: none;
|
||
-webkit-appearance: none;
|
||
background-color: var(--fillLeftSelectedColor);
|
||
width: 100%;
|
||
height: 100%;
|
||
cursor: pointer;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .fill-left__radio[data-value]:checked:before {
|
||
content: attr(data-value);
|
||
color: var(--fillLeftDataColor);
|
||
font-size: var(--fillLeftDataSize);
|
||
place-self: center;
|
||
text-transform: var(--fillLeftDataTransform);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .fill-left__radio:checked ~ .fill-left__radio {
|
||
background-color: var(--fillLeftUnselectedColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label {
|
||
display: inline-flex;
|
||
gap: var(--input-label-gap);
|
||
align-items: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label:not(.stacked) > input[type=text] {
|
||
flex: 1 1 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label:not(.stacked) > :not([name]) {
|
||
flex: 0 0 auto;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label > :is(span, button) {
|
||
text-transform: var(--input-label-text-transform);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label--dual {
|
||
grid-template-columns: 1fr auto 1fr;
|
||
grid-template-areas: "over over over" "under under under";
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label--dual > span:last-of-type {
|
||
grid-column: 1/-1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label--dual > input:not([type=number]):not([type=checkbox]):not([type=radio]) {
|
||
width: 100%;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label--dual > .slash {
|
||
line-height: 0rem;
|
||
font-weight: normal;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .headed-textarea {
|
||
display: grid;
|
||
grid-template-rows: auto 1fr;
|
||
grid-template-columns: auto;
|
||
grid-column: 1/-1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .headed-textarea :not(textarea):not(.adaptive) {
|
||
justify-self: start;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .headed-textarea .headed-textarea__header {
|
||
grid-area: initial;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive {
|
||
display: grid;
|
||
grid-template-columns: auto;
|
||
grid-template-rows: auto;
|
||
grid-template-areas: "content";
|
||
position: relative;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive > * {
|
||
grid-area: content;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive > span {
|
||
opacity: 0;
|
||
z-index: -10;
|
||
border-width: 1px 3px;
|
||
border-style: solid;
|
||
border-radius: 5px;
|
||
border-color: transparent;
|
||
box-sizing: border-box;
|
||
text-transform: initial;
|
||
border-radius: 0px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive--text {
|
||
min-height: 4rem;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive--text__span {
|
||
white-space: pre-wrap;
|
||
padding: 2px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive--text__textarea {
|
||
width: 100%;
|
||
height: 100%;
|
||
resize: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive--text__textarea,
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive--input__input {
|
||
position: absolute;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive--input__input {
|
||
width: 100%;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .adaptive--input__span {
|
||
padding: 2px;
|
||
min-height: 1.5rem;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem > input:not([type=checkbox]) {
|
||
width: 100%;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem .headed-textarea,
|
||
.sheet-rolltemplate-vaesen .sheet-template .repitem .description {
|
||
grid-column: 1/-1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repcontainer {
|
||
display: grid;
|
||
gap: var(--normal-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repeating-container {
|
||
display: grid;
|
||
grid-template-areas: "header";
|
||
align-self: start;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repeating-container > .header {
|
||
grid-area: header;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repeating-container :is(.repcontrol-button, .repcontrol_edit) {
|
||
opacity: 0;
|
||
transition: var(--revealTrans);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repeating-container:is(:hover, :focus-within, :focus) :is(.repcontrol-button, .repcontrol_edit) {
|
||
opacity: 1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repcontrol-button {
|
||
align-self: start;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repcontrol-button ~ .repcontrol {
|
||
justify-self: end;
|
||
z-index: 100;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repcontrol-button ~ .repcontrol > .repcontrol_add {
|
||
display: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repcontrol-button--add {
|
||
justify-self: start;
|
||
width: 15px;
|
||
height: 15px;
|
||
padding: 4px;
|
||
font-size: 0;
|
||
color: var(--col-alt);
|
||
border: 1px solid var(--col-alt);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .repcontrol-button--add::before {
|
||
inset: 0;
|
||
place-self: center;
|
||
font-family: var(--font-icon);
|
||
font-size: 12px;
|
||
content: "add";
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__button {
|
||
all: initial;
|
||
display: flex;
|
||
margin: 0;
|
||
padding: 0;
|
||
cursor: pointer;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__checkbox[type=checkbox] {
|
||
display: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__outer {
|
||
opacity: 0;
|
||
visibility: hidden;
|
||
position: fixed;
|
||
top: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
text-align: left;
|
||
background: var(--kmodal-overlay-background);
|
||
transition: opacity 0.25s ease;
|
||
z-index: 999;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__background {
|
||
all: initial;
|
||
margin: 0;
|
||
padding: 0;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
cursor: pointer;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__inner {
|
||
position: fixed;
|
||
width: var(--kmodal-width);
|
||
height: var(--kmodal-height);
|
||
inset: 0;
|
||
margin: auto;
|
||
overflow: auto;
|
||
background: var(--kmodal-dialog-background);
|
||
border-radius: 5px;
|
||
padding: var(--kmodal-close-height) calc(var(--kmodal-close-width) * 3) var(--kmodal-close-height) calc(var(--kmodal-close-width) * 2);
|
||
max-width: var(--kmodal-max-width);
|
||
max-height: var(--kmodal-max-height);
|
||
transition: opacity 0.25s ease;
|
||
box-shadow: var(--kmodal-box-shadow);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__close {
|
||
position: absolute;
|
||
right: var(--kmodal-close-width);
|
||
top: var(--kmodal-close-height);
|
||
width: var(--kmodal-close-width);
|
||
height: var(--kmodal-close-height);
|
||
cursor: pointer;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__close:after,
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__close:before {
|
||
content: "";
|
||
position: absolute;
|
||
width: var(--kmodal-close-line-thickness);
|
||
height: var(--kmodal-close-line-length);
|
||
background: var(--kmodal-close-color);
|
||
display: block;
|
||
transform: rotate(45deg);
|
||
left: 50%;
|
||
margin: -3px 0 0 -1px;
|
||
top: 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__close:hover:after,
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__close:hover:before {
|
||
background: var(--kmodal-close-hover-color);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__close:before {
|
||
transform: rotate(-45deg);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__checkbox:not(:checked) + .kmodal__outer {
|
||
display: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__checkbox:checked + .kmodal__outer {
|
||
opacity: 1;
|
||
visibility: visible;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .kmodal__checkbox:checked + .kmodal__outer .kmodal__inner {
|
||
top: 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .tabs__container:not(.k-active-tab) {
|
||
display: none !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .tabs__nav-item {
|
||
list-style: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .tabs__nav-list {
|
||
display: flex;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template ::-webkit-scrollbar {
|
||
width: 8px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template ::-webkit-scrollbar-track {
|
||
background: #f1f1f1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template ::-webkit-scrollbar-thumb {
|
||
background: #888;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template ::-webkit-scrollbar-thumb:hover {
|
||
background: var(--elementColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=border], .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-border] {
|
||
position: relative;
|
||
--__background: transparent;
|
||
border: 1px solid black;
|
||
border-image: var(--border-spiral) 65;
|
||
border-image-width: 3.5em;
|
||
border-image-repeat: repeat;
|
||
border-image-outset: 0.5em;
|
||
border-radius: 2em 0 0 0;
|
||
background: var(--__background);
|
||
min-height: 2em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=border]:not(:has(> .scroll-container)),
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=border] > .scroll-container, .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-border]:not(:has(> .scroll-container)),
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=sheet-border] > .scroll-container {
|
||
padding: 1em 0.7em 0.7em 0.7em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=border][class*=__line], .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-border][class*=__line] {
|
||
border-image: var(--border-line) 20;
|
||
border-image-width: 1em;
|
||
border-image-repeat: repeat;
|
||
border-image-outset: 0.5em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=border][class*=__spiral], .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-border][class*=__spiral] {
|
||
border-image: var(--border-spiral__corner) 40;
|
||
border-image-width: 2.5em;
|
||
border-image-repeat: repeat;
|
||
border-image-outset: 0.7em 0.5em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=border][class*=__spiral]::before, .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-border][class*=__spiral]::before {
|
||
--__square: 1.5em;
|
||
position: absolute;
|
||
content: "";
|
||
height: var(--__square);
|
||
aspect-ratio: 1;
|
||
background: var(--img-corner_spiral);
|
||
background-size: var(--__square);
|
||
rotate: 180deg;
|
||
bottom: 0;
|
||
right: 0;
|
||
translate: 50% 50%;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=border][class*=__cross], .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-border][class*=__cross] {
|
||
border-image: var(--border-spiral__reversed) 65;
|
||
border-image-width: 2.5em;
|
||
border-image-repeat: repeat;
|
||
border-image-outset: 0.7em 0.5em;
|
||
border-radius: 0 0 2em 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=border][class*=__cross]::before, .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-border][class*=__cross]::before {
|
||
--__square: 1.5em;
|
||
position: absolute;
|
||
content: "";
|
||
height: var(--__square);
|
||
aspect-ratio: 1;
|
||
background: var(--img-corner_cross);
|
||
background-size: var(--__square);
|
||
top: 0;
|
||
left: 0;
|
||
translate: -40% -40%;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=tag], .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-tag] {
|
||
position: relative;
|
||
border: 1px solid black;
|
||
border-image: var(--border-cut_corner) 20 fill;
|
||
border-image-width: 0.75em;
|
||
border-image-repeat: round;
|
||
padding: 0.4em;
|
||
filter: drop-shadow(2px 4px 1px rgba(0, 0, 0, 0.2));
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template [class^=tag][class*=__dark], .sheet-rolltemplate-vaesen .sheet-template [class^=sheet-tag][class*=__dark] {
|
||
border: 1px solid black;
|
||
border-image: var(--border-cut_corner_dark) 20 fill;
|
||
border-image-width: 0.75em;
|
||
border-image-repeat: round;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .underline,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-underline {
|
||
background-image: var(--img-line);
|
||
background-size: 800px 30px;
|
||
background-position: center -100%;
|
||
background-repeat: repeat-x;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template textarea.underline, .sheet-rolltemplate-vaesen .sheet-template textarea.sheet-underline {
|
||
background-repeat: repeat;
|
||
background-size: 800px 23px;
|
||
line-height: normal;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label {
|
||
display: flex;
|
||
position: relative;
|
||
line-height: 2;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label span, .sheet-rolltemplate-vaesen .sheet-template .input-label button {
|
||
font-size: 0.5em;
|
||
font-weight: bold;
|
||
text-transform: uppercase;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label input {
|
||
border: none;
|
||
padding: 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label.underline {
|
||
background-position: center 1em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label.super span {
|
||
position: absolute;
|
||
top: -0.3em;
|
||
left: 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label.super input {
|
||
position: relative;
|
||
top: 0.2em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label.sub.underline {
|
||
background-position: center 0.4em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label.sub span {
|
||
position: absolute;
|
||
bottom: -0.3em;
|
||
left: 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .input-label.sub input {
|
||
position: relative;
|
||
bottom: 0.4em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .display-control:not(:checked) + .controlled-display {
|
||
display: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .display-control--inverted:checked + .controlled-display {
|
||
display: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .display-control--non-zero:is([value="0"], :not([value]), [value=""]) + .controlled-display {
|
||
display: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .display-control--zero:not([value="0"], :not([value]), [value=""]) + .controlled-display {
|
||
display: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched {
|
||
display: grid;
|
||
grid-template-areas: "content";
|
||
box-sizing: border-box;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched > *,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched > * {
|
||
grid-area: content !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched:has(> .notch-container > [type=number]),
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched:has(> .notch-container > [type=number]) {
|
||
width: 45px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched-label--number,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched-label--number {
|
||
width: 100px;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched.notch-input > .notch-container > *, .sheet-rolltemplate-vaesen .sheet-template .notched.sheet-notch-results > .sheet-notch-container > *,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched.notch-input > .notch-container > *,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched.sheet-notch-results > .sheet-notch-container > * {
|
||
background-color: var(--inputBack);
|
||
width: 100%;
|
||
border-width: 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched--labelled .input-label,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched--labelled .input-label {
|
||
gap: 0;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched--labelled .notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched--labelled .notch-container {
|
||
background-color: var(--inputBack);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched--labelled input,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched--labelled input {
|
||
width: 100%;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched:not(.notch-input) > .notch-container, .sheet-rolltemplate-vaesen .sheet-template .notched:not(.sheet-notch-input) > .sheet-notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched:not(.notch-input) > .notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched:not(.sheet-notch-input) > .sheet-notch-container {
|
||
padding: calc(var(--notchSize) / 2) var(--notchSize);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched:after,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched:after {
|
||
content: "";
|
||
z-index: 10;
|
||
grid-area: content;
|
||
--_notchPattern: var(--notchColor), var(--notchColor) var(--notchSize),transparent var(--notchSize);
|
||
background-image: radial-gradient(circle at top left, var(--_notchPattern)), radial-gradient(circle at top right, var(--_notchPattern)), radial-gradient(circle at bottom left, var(--_notchPattern)), radial-gradient(circle at bottom right, var(--_notchPattern));
|
||
pointer-events: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched.bordered:after, .sheet-rolltemplate-vaesen .sheet-template .notched.sheet-bordered:after,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched.bordered:after,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched.sheet-bordered:after {
|
||
--_notchPattern: var(--notchColor), var(--notchColor) calc(var(--notchSize) - var(--notchBorderSize)), var(--borderColor) calc(var(--notchSize) - var(--notchBorderSize)), var(--borderColor) var(--notchSize),transparent var(--notchSize) ;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched.bordered > .notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched.bordered > .sheet-notch-container, .sheet-rolltemplate-vaesen .sheet-template .notched.sheet-bordered > .notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .notched.sheet-bordered > .sheet-notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched.bordered > .notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched.bordered > .sheet-notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched.sheet-bordered > .notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-notched.sheet-bordered > .sheet-notch-container {
|
||
border: 1px solid var(--borderColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .notch-container .adaptive {
|
||
width: 100%;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .alternating-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-alternating-container {
|
||
display: grid;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .alternating-container > *,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-alternating-container > * {
|
||
padding: var(--tiny-gap) var(--tiny-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .alternating-container > *:nth-child(even),
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-alternating-container > *:nth-child(even) {
|
||
background-color: var(--rowHighlight);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .alternating-container > *:nth-child(even) .notched,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-alternating-container > *:nth-child(even) .notched {
|
||
--notchColor: var(--rowHighlight);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .headed-section,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-headed-section {
|
||
display: grid;
|
||
gap: var(--half-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .headed-section:has(> .header), .sheet-rolltemplate-vaesen .sheet-template .headed-section:has(> .sheet-header),
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-headed-section:has(> .header),
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-headed-section:has(> .sheet-header) {
|
||
grid-template-rows: auto 1fr;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .headed-section:not(:has(> .header)), .sheet-rolltemplate-vaesen .sheet-template .headed-section:not(:has(> .sheet-header)),
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-headed-section:not(:has(> .header)),
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-headed-section:not(:has(> .sheet-header)) {
|
||
grid-template-rows: 1fr;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .header,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-header {
|
||
color: var(--borderColor);
|
||
background-color: var(--darkBack);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .header > .notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .header > .sheet-notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-header > .notch-container,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-header > .sheet-notch-container {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .header .notched,
|
||
.sheet-rolltemplate-vaesen .sheet-template .header .sheet-notched,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-header .notched,
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-header .sheet-notched {
|
||
--notchColor: var(--darkBack);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-red-header {
|
||
--fontColor: hsl(357, 58%, 48%);
|
||
color: var(--fontColor);
|
||
font-family: var(--fontHeader);
|
||
text-transform: uppercase;
|
||
font-weight: bold;
|
||
line-height: 1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .inlinerollresult {
|
||
display: grid;
|
||
place-content: center;
|
||
font-size: 1em;
|
||
line-height: 0.9;
|
||
position: relative;
|
||
padding: 2px;
|
||
color: var(--dieTextColor);
|
||
height: 24px;
|
||
aspect-ratio: 1;
|
||
border: none;
|
||
border-radius: 6px;
|
||
background: var(--dieBlack);
|
||
text-align: center;
|
||
font-family: var(--font-thick-header);
|
||
font-weight: normal;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .inlinerollresult[original-title*="computed value"], .sheet-rolltemplate-vaesen .sheet-template .inlinerollresult[title*="computed value"] {
|
||
pointer-events: none;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-results {
|
||
margin: var(--normal-gap);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-results .sheet-notch-container {
|
||
background-color: var(--inputBack);
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
gap: var(--half-gap);
|
||
padding: 0.2em 2em;
|
||
padding-left: 2.5em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-results .sheet-notch-container .inlinerollresult {
|
||
font-size: 2em;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base {
|
||
display: contents;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base .inlinerollresult {
|
||
--_notchSize: 3px;
|
||
--_notchBorderSize: 2px;
|
||
--_clipSize: calc(var(--_notchSize) * 1.7072135785);
|
||
--_notchGradSize: calc(var(--_notchSize) + var(--_notchBorderSize));
|
||
border: var(--_notchBorderSize) solid var(--dieBorderColor);
|
||
clip-path: polygon(var(--_clipSize) 0, calc(100% - var(--_clipSize)) 0, 100% var(--_clipSize), 100% calc(100% - var(--_clipSize)), calc(100% - var(--_clipSize)) 100%, var(--_clipSize) 100%, 0 calc(100% - var(--_clipSize)), 0 var(--_clipSize));
|
||
background-image: linear-gradient(45deg, var(--dieBorderColor) var(--_notchSize), transparent var(--_notchSize)), linear-gradient(135deg, var(--dieBorderColor) var(--_notchSize), transparent var(--_notchSize)), linear-gradient(225deg, var(--dieBorderColor) var(--_notchSize), transparent var(--_notchSize)), linear-gradient(315deg, var(--dieBorderColor) var(--_notchSize), transparent var(--_notchSize));
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base > :not(.sheet-dice-6) > .inlinerollresult:after {
|
||
filter: var(--diceFilter);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base > .sheet-dice-1 .inlinerollresult:after {
|
||
background-image: var(--dice1);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base > .sheet-dice-2 .inlinerollresult:after {
|
||
background-image: var(--dice2);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base > .sheet-dice-3 .inlinerollresult:after {
|
||
background-image: var(--dice3);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base > .sheet-dice-4 .inlinerollresult:after {
|
||
background-image: var(--dice4);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base > .sheet-dice-5 .inlinerollresult:after {
|
||
background-image: var(--dice5);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base > .sheet-dice-6 .inlinerollresult {
|
||
--dieBorderColor: #d11f34;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base > .sheet-dice-6 .inlinerollresult:after {
|
||
background-image: var(--dice6);
|
||
filter: var(--sixFilter);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base :has(> .fullcrit),
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base :has(> [original-title="Rolling 6 = 6"]),
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base :has(> [title="Rolling 6 = 6"]) {
|
||
order: -1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base .inlinerollresult {
|
||
color: transparent !important;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base .inlinerollresult::after {
|
||
position: absolute;
|
||
inset: 0;
|
||
content: "";
|
||
background-size: contain;
|
||
background-repeat: no-repeat;
|
||
background-position: center;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base {
|
||
--_circle-color: white;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-base .inlinerollresult:not(.fullcrit):not([original-title="Rolling 6 = 6"]):not([title="Rolling 6 = 6"]) {
|
||
order: 2;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-justify-end {
|
||
justify-content: end;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-header-stack {
|
||
display: grid;
|
||
flex: 1;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-header-stack :first-child {
|
||
justify-self: start;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-headed-section {
|
||
background-color: var(--backColor);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-header > .sheet-notch-container {
|
||
flex-wrap: wrap;
|
||
justify-content: end;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template h1, .sheet-rolltemplate-vaesen .sheet-template h2, .sheet-rolltemplate-vaesen .sheet-template .input-label:not(.stacked).large > [name], .sheet-rolltemplate-vaesen .sheet-template h3, .sheet-rolltemplate-vaesen .sheet-template h4, .sheet-rolltemplate-vaesen .sheet-template h5, .sheet-rolltemplate-vaesen .sheet-template h6 {
|
||
text-wrap: wrap;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template a[href^="~"],
|
||
.sheet-rolltemplate-vaesen .sheet-template a[href^="!"] {
|
||
background-color: hsl(357, 58%, 48%);
|
||
color: inherit;
|
||
border: var(--borderColor);
|
||
font-weight: bold;
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template a:not([href^="~"]):not([href^="!"]) {
|
||
color: hsl(357, 58%, 48%);
|
||
}
|
||
.sheet-rolltemplate-vaesen .sheet-template .sheet-push-container {
|
||
text-transform: uppercase;
|
||
}
|
||
.sheet-rolltemplate-vaesen.sheet-rolltemplate-darkmode {
|
||
--backColor:var(--dm-backColor);
|
||
--selectedColor:var(--dm-selectedColor);
|
||
--unselectedColor1:var(--dm-unselectedColor1);
|
||
--unselectedColor2:var(--dm-unselectedColor2);
|
||
--checkColor:var(--dm-checkColor);
|
||
--checkedBackColor:var(--dm-checkedBackColor);
|
||
--borderColor:var(--dm-borderColor);
|
||
--fontColor:var(--dm-fontColor);
|
||
--disabledColor:var(--dm-disabledColor);
|
||
--fontColor: var(--dm-fontColor);
|
||
color: var(--fontColor);
|
||
--collapseExpandedColor: var(--dm-collapseExpandedColor);
|
||
--backColor: var(--dm-backColor);
|
||
--borderColor: var(--dm-borderColor);
|
||
--inputBack: var(--dm-inputBack);
|
||
--parchment: var(--dm-parchment);
|
||
--darkBack: var(--dm-darkBack);
|
||
--r20Back: var(--dm-r20Back);
|
||
--border-line: var(--dm-border-line);
|
||
--border-spiral: var(--dm-border-spiral);
|
||
--border-spiral__corner: var(--dm-border-spiral__corner);
|
||
--border-spiral__reversed: var(--dm-border__reversed);
|
||
--border-cut_corner: var(--dm-border-cut_corner);
|
||
--border-sheet_border: var(--dm-border-sheet_border);
|
||
--img-corner_cross: var(--dm-corner_corner);
|
||
--img-corner_spiral: var(--dm-corner_spiral);
|
||
--img-sheet_border: var(--dm-border-sheet_border);
|
||
--img-line: var(--dm-line);
|
||
--vaesen-bullet: var(--dm-vaesen-bullet);
|
||
--dieBorderColor: var(--dm-borderColor);
|
||
--notchColor: var(--dm-backColor);
|
||
--rowHighlight: var(--dm-rowHighlight);
|
||
--diceFilter: var(--dm-diceFilter);
|
||
--sixFilter:var(--dm-sixFilter);
|
||
} |