mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 19:52:29 +00:00
3316 lines
117 KiB
CSS
3316 lines
117 KiB
CSS
@import url("https://fonts.googleapis.com/css?family=Nova+Cut|Source+Sans+Pro|Special+Elite&display=swap");
|
|
.ui-dialog .tab-content .charsheet .ratio1-1,
|
|
.sheet-rolltemplate-storypath .ratio1-1, .ui-dialog .tab-content .charsheet .dot-button-container .dot,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot {
|
|
aspect-ratio: 1/1;
|
|
}
|
|
|
|
.sheet-rolltemplate-storypath .sheet-template-row, #notes, #equipment, #birthrights, #purview, #calling, #paths, #deeds, #move-defense {
|
|
display: grid;
|
|
}
|
|
|
|
#notes, #equipment, #birthrights, #purview, #calling, #paths, #deeds {
|
|
gap: var(--grid-gap);
|
|
grid-template-areas: "header";
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: 1fr;
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
#calling .short-knack, #paths .short-master, #paths .short-contact, #paths .short-access,
|
|
#paths .short-group, #paths .short-obligation {
|
|
align-items: center;
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet h1.subsystem-style.system-scion-origin, .ui-dialog .tab-content .charsheet h1.subsystem-style.system-scion-hero,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"].subsystem-style.system-scion-origin,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"].subsystem-style.system-scion-hero,
|
|
.sheet-rolltemplate-storypath h1.subsystem-style.system-scion-origin,
|
|
.sheet-rolltemplate-storypath h1.subsystem-style.system-scion-hero,
|
|
.sheet-rolltemplate-storypath *[aria-level="1"].subsystem-style.system-scion-origin,
|
|
.sheet-rolltemplate-storypath *[aria-level="1"].subsystem-style.system-scion-hero {
|
|
background-color: darkgrey;
|
|
color: white;
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button:not(.repcontrol-button--inline), .ui-dialog .tab-content .charsheet .collapse-interface {
|
|
background-color: rgba(220, 220, 220, 0.2);
|
|
border-radius: 5px;
|
|
box-shadow: 0 2px 4px black;
|
|
border-width: 0;
|
|
transition-property: box-shadow, backdrop-filter;
|
|
transition-duration: 200ms;
|
|
transition-timing-function: ease-out;
|
|
backdrop-filter: blur(1px);
|
|
overflow: hidden;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button:is(:hover, :focus):not(.repcontrol-button--inline), .ui-dialog .tab-content .charsheet .collapse-interface:is(:hover, :focus) {
|
|
background-color: rgba(133, 133, 133, 0.5019607843);
|
|
box-shadow: 0 4px 6px black;
|
|
backdrop-filter: blur(2px);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button:active:not(.repcontrol-button--inline), .ui-dialog .tab-content .charsheet .collapse-interface:active {
|
|
background-color: #858585;
|
|
box-shadow: 0 1px 2px black;
|
|
backdrop-filter: blur(0px);
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet .roller:before,
|
|
.sheet-rolltemplate-storypath .roller:before {
|
|
line-height: 14px;
|
|
/*height to vertically center a 2rem dicefontd10*/
|
|
font-size: 2rem;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
padding: 5px 3px 7px;
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button:not(.repcontrol-button--inline), .ui-dialog .tab-content .charsheet .collapse-interface {
|
|
padding: 5px 7px;
|
|
}
|
|
|
|
#birthrights .repcontainer:not(:empty) ~ .add-container:after, .sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:not(:first-child) > .upper-blur, .ui-dialog .tab-content .charsheet .border-control[value=add-detail] + .image-border > .upper-blur,
|
|
.sheet-rolltemplate-storypath .border-control[value=add-detail] + .image-border > .upper-blur, .sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child > .upper-blur, .ui-dialog .tab-content .charsheet .border-control:not([value=add-detail]):not([value*=master]) + .image-border > .upper-blur,
|
|
.sheet-rolltemplate-storypath .border-control:not([value=add-detail]):not([value*=master]) + .image-border > .upper-blur,
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:not(:first-child) > .sheet-upper-blur,
|
|
.ui-dialog .tab-content .charsheet .border-control[value=add-detail] + .image-border > .sheet-upper-blur,
|
|
.sheet-rolltemplate-storypath .border-control[value=add-detail] + .image-border > .sheet-upper-blur,
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child > .sheet-upper-blur,
|
|
.ui-dialog .tab-content .charsheet .border-control:not([value=add-detail]):not([value*=master]) + .image-border > .sheet-upper-blur,
|
|
.sheet-rolltemplate-storypath .border-control:not([value=add-detail]):not([value*=master]) + .image-border > .sheet-upper-blur {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
height: 0px;
|
|
left: calc(var(--inset) / 2);
|
|
right: calc(var(--inset) / 2);
|
|
box-shadow: 0 0 calc(var(--inset) / 2) calc(var(--inset) / 2 + 3px) var(--glowcolor);
|
|
background-color: transparent;
|
|
}
|
|
|
|
#birthrights .repcontainer .repitem:last-child .image-border::after, .sheet-rolltemplate-storypath > .sheet-template:not(.sheet-continuation):first-child > .lower-blur, .ui-dialog .tab-content .charsheet .border-control[value*=master] + .image-border > .lower-blur,
|
|
.sheet-rolltemplate-storypath .border-control[value*=master] + .image-border > .lower-blur, .sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child > .lower-blur, .ui-dialog .tab-content .charsheet .border-control:not([value=add-detail]):not([value*=master]) + .image-border > .lower-blur,
|
|
.sheet-rolltemplate-storypath .border-control:not([value=add-detail]):not([value*=master]) + .image-border > .lower-blur,
|
|
.sheet-rolltemplate-storypath > .sheet-template:not(.sheet-continuation):first-child > .sheet-lower-blur,
|
|
.ui-dialog .tab-content .charsheet .border-control[value*=master] + .image-border > .sheet-lower-blur,
|
|
.sheet-rolltemplate-storypath .border-control[value*=master] + .image-border > .sheet-lower-blur,
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child > .sheet-lower-blur,
|
|
.ui-dialog .tab-content .charsheet .border-control:not([value=add-detail]):not([value*=master]) + .image-border > .sheet-lower-blur,
|
|
.sheet-rolltemplate-storypath .border-control:not([value=add-detail]):not([value*=master]) + .image-border > .sheet-lower-blur {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: 0;
|
|
height: 0px;
|
|
left: calc(var(--inset) / 2);
|
|
right: calc(var(--inset) / 2);
|
|
box-shadow: 0 0 calc(var(--inset) / 2) calc(var(--inset) / 2 + 3px) var(--glowcolor);
|
|
background-color: transparent;
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet .add-container, #main .add-detail {
|
|
column-gap: var(--tiny-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .add-container > button, #main .add-detail > button {
|
|
text-transform: capitalize;
|
|
width: auto;
|
|
height: auto;
|
|
display: flex;
|
|
flex-grow: 1;
|
|
gap: var(--half-gap);
|
|
place-self: stretch;
|
|
justify-content: center;
|
|
font-family: var(--sectionHeaderFont);
|
|
font-size: 1rem;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .add-container > button:not(:first-of-type), #main .add-detail > button:not(:first-of-type) {
|
|
border-top-left-radius: 0;
|
|
border-bottom-left-radius: 0;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .add-container > button:not(:last-of-type), #main .add-detail > button:not(:last-of-type) {
|
|
border-top-right-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
|
|
#deeds [aria-level="3"], .ui-dialog .tab-content .charsheet h2.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.subsystem-style,
|
|
.sheet-rolltemplate-storypath *[aria-level="2"].subsystem-style {
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
background-size: min(100%, 1000px) 100%;
|
|
background-color: initial;
|
|
filter: drop-shadow(0px 2px black) drop-shadow(-1px 0px black) drop-shadow(1px 0px black) drop-shadow(0px -0.5px black);
|
|
}
|
|
|
|
#health .repcontainer {
|
|
column-width: 190px;
|
|
gap: var(--grid-gap);
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet .split {
|
|
display: flex;
|
|
gap: var(--grid-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .split > * {
|
|
width: 0px !important;
|
|
flex: 1 1 0;
|
|
}
|
|
|
|
#deeds [aria-level="3"], .ui-dialog .tab-content .charsheet h2.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.subsystem-style,
|
|
.sheet-rolltemplate-storypath *[aria-level="2"].subsystem-style {
|
|
font-family: var(--sectionHeaderFont);
|
|
}
|
|
|
|
#deeds .system-scion-demigod[aria-level="3"], .ui-dialog .tab-content .charsheet h2.system-scion-demigod.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .system-scion-demigod[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.system-scion-demigod.subsystem-style,
|
|
.sheet-rolltemplate-storypath .system-scion-demigod[aria-level="2"].subsystem-style, #deeds .sheet-system-scion-demigod[aria-level="3"], .ui-dialog .tab-content .charsheet h2.sheet-system-scion-demigod.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-demigod[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-demigod.subsystem-style,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-demigod[aria-level="2"].subsystem-style, #deeds .system-scion-hero[aria-level="3"], .ui-dialog .tab-content .charsheet h2.system-scion-hero.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .system-scion-hero[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.system-scion-hero.subsystem-style,
|
|
.sheet-rolltemplate-storypath .system-scion-hero[aria-level="2"].subsystem-style, #deeds .sheet-system-scion-hero[aria-level="3"], .ui-dialog .tab-content .charsheet h2.sheet-system-scion-hero.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-hero[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-hero.subsystem-style,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-hero[aria-level="2"].subsystem-style, #deeds .system-scion-origin[aria-level="3"], .ui-dialog .tab-content .charsheet h2.system-scion-origin.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .system-scion-origin[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.system-scion-origin.subsystem-style,
|
|
.sheet-rolltemplate-storypath .system-scion-origin[aria-level="2"].subsystem-style, #deeds .sheet-system-scion-origin[aria-level="3"], .ui-dialog .tab-content .charsheet h2.sheet-system-scion-origin.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-origin[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-origin.subsystem-style,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-origin[aria-level="2"].subsystem-style {
|
|
color: white;
|
|
}
|
|
#deeds .system-scion-demigod[aria-level="3"] > *, .ui-dialog .tab-content .charsheet h2.system-scion-demigod.subsystem-style > *,
|
|
.ui-dialog .tab-content .charsheet .system-scion-demigod[aria-level="2"].subsystem-style > *,
|
|
.sheet-rolltemplate-storypath h2.system-scion-demigod.subsystem-style > *,
|
|
.sheet-rolltemplate-storypath .system-scion-demigod[aria-level="2"].subsystem-style > *, #deeds .sheet-system-scion-demigod[aria-level="3"] > *, .ui-dialog .tab-content .charsheet h2.sheet-system-scion-demigod.subsystem-style > *,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-demigod[aria-level="2"].subsystem-style > *,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-demigod.subsystem-style > *,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-demigod[aria-level="2"].subsystem-style > *, #deeds .system-scion-hero[aria-level="3"] > *, .ui-dialog .tab-content .charsheet h2.system-scion-hero.subsystem-style > *,
|
|
.ui-dialog .tab-content .charsheet .system-scion-hero[aria-level="2"].subsystem-style > *,
|
|
.sheet-rolltemplate-storypath h2.system-scion-hero.subsystem-style > *,
|
|
.sheet-rolltemplate-storypath .system-scion-hero[aria-level="2"].subsystem-style > *, #deeds .sheet-system-scion-hero[aria-level="3"] > *, .ui-dialog .tab-content .charsheet h2.sheet-system-scion-hero.subsystem-style > *,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-hero[aria-level="2"].subsystem-style > *,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-hero.subsystem-style > *,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-hero[aria-level="2"].subsystem-style > *, #deeds .system-scion-origin[aria-level="3"] > *, .ui-dialog .tab-content .charsheet h2.system-scion-origin.subsystem-style > *,
|
|
.ui-dialog .tab-content .charsheet .system-scion-origin[aria-level="2"].subsystem-style > *,
|
|
.sheet-rolltemplate-storypath h2.system-scion-origin.subsystem-style > *,
|
|
.sheet-rolltemplate-storypath .system-scion-origin[aria-level="2"].subsystem-style > *, #deeds .sheet-system-scion-origin[aria-level="3"] > *, .ui-dialog .tab-content .charsheet h2.sheet-system-scion-origin.subsystem-style > *,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-origin[aria-level="2"].subsystem-style > *,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-origin.subsystem-style > *,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-origin[aria-level="2"].subsystem-style > * {
|
|
display: inline;
|
|
color: white;
|
|
}
|
|
|
|
#deeds .system-scion-origin[aria-level="3"], .ui-dialog .tab-content .charsheet h2.system-scion-origin.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .system-scion-origin[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.system-scion-origin.subsystem-style,
|
|
.sheet-rolltemplate-storypath .system-scion-origin[aria-level="2"].subsystem-style, #deeds .sheet-system-scion-origin[aria-level="3"], .ui-dialog .tab-content .charsheet h2.sheet-system-scion-origin.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-origin[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-origin.subsystem-style,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-origin[aria-level="2"].subsystem-style {
|
|
background-image: url("https://s3.amazonaws.com/files.d20.io/images/251683060/8CsXGJVVouL_mx7pYiMMbg/original.png");
|
|
padding-top: var(--half-gap);
|
|
}
|
|
|
|
#deeds .system-scion-hero[aria-level="3"], .ui-dialog .tab-content .charsheet h2.system-scion-hero.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .system-scion-hero[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.system-scion-hero.subsystem-style,
|
|
.sheet-rolltemplate-storypath .system-scion-hero[aria-level="2"].subsystem-style, #deeds .sheet-system-scion-hero[aria-level="3"], .ui-dialog .tab-content .charsheet h2.sheet-system-scion-hero.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-hero[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-hero.subsystem-style,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-hero[aria-level="2"].subsystem-style {
|
|
background-image: url("https://s3.amazonaws.com/files.d20.io/images/251360621/itDvmUX6IhfnSzD3D4aGnQ/original.png");
|
|
padding-top: var(--half-gap);
|
|
}
|
|
|
|
#deeds .system-scion-demigod[aria-level="3"], .ui-dialog .tab-content .charsheet h2.system-scion-demigod.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .system-scion-demigod[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.system-scion-demigod.subsystem-style,
|
|
.sheet-rolltemplate-storypath .system-scion-demigod[aria-level="2"].subsystem-style, #deeds .sheet-system-scion-demigod[aria-level="3"], .ui-dialog .tab-content .charsheet h2.sheet-system-scion-demigod.subsystem-style,
|
|
.ui-dialog .tab-content .charsheet .sheet-system-scion-demigod[aria-level="2"].subsystem-style,
|
|
.sheet-rolltemplate-storypath h2.sheet-system-scion-demigod.subsystem-style,
|
|
.sheet-rolltemplate-storypath .sheet-system-scion-demigod[aria-level="2"].subsystem-style {
|
|
background-image: url("https://s3.amazonaws.com/files.d20.io/images/251360621/itDvmUX6IhfnSzD3D4aGnQ/original.png");
|
|
padding-top: var(--half-gap);
|
|
}
|
|
|
|
.sheet-rolltemplate-storypath > .sheet-template, .ui-dialog .tab-content .charsheet .bordered-item + fieldset + .repcontainer .image-border,
|
|
.ui-dialog .tab-content .charsheet .bordered-item,
|
|
.ui-dialog .tab-content .charsheet .image-border,
|
|
.sheet-rolltemplate-storypath .bordered-item + fieldset + .repcontainer .image-border,
|
|
.sheet-rolltemplate-storypath .bordered-item,
|
|
.sheet-rolltemplate-storypath .image-border {
|
|
border: 0px solid transparent;
|
|
background-blend-mode: screen;
|
|
transition: none;
|
|
--glowcolor: white;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template:before, .ui-dialog .tab-content .charsheet .bordered-item + fieldset + .repcontainer .image-border:before,
|
|
.ui-dialog .tab-content .charsheet .bordered-item:before,
|
|
.ui-dialog .tab-content .charsheet .image-border:before,
|
|
.sheet-rolltemplate-storypath .bordered-item + fieldset + .repcontainer .image-border:before,
|
|
.sheet-rolltemplate-storypath .bordered-item:before,
|
|
.sheet-rolltemplate-storypath .image-border:before {
|
|
content: "";
|
|
position: absolute;
|
|
right: var(--inset);
|
|
left: var(--inset);
|
|
background: var(--glowcolor);
|
|
border-radius: 2px;
|
|
box-shadow: 0 0 var(--inset) var(--inset) var(--glowcolor);
|
|
}
|
|
|
|
.sheet-rolltemplate-storypath > .sheet-template:not(.sheet-continuation):not(:first-child), .ui-dialog .tab-content .charsheet .bordered-item + fieldset + .repcontainer .image-border,
|
|
.ui-dialog .tab-content .charsheet .bordered-item,
|
|
.sheet-rolltemplate-storypath .bordered-item + fieldset + .repcontainer .image-border,
|
|
.sheet-rolltemplate-storypath .bordered-item {
|
|
padding: calc(var(--inset) / 2);
|
|
clip-path: var(--fullNotch);
|
|
background-image: var(--image-marble-top), var(--image-marble-right), var(--image-marble-left), var(--image-marble-bottom);
|
|
background-repeat: no-repeat, repeat-y, repeat-y, no-repeat;
|
|
background-position: top var(--offset) left, top right var(--offset), top left var(--offset), bottom var(--offset) left;
|
|
background-size: max(1500px, 100%) var(--short-side), var(--short-side) max(981px, 100%), var(--short-side) max(981px, 100%), max(1500px, 100%) var(--short-side);
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template:not(.sheet-continuation):not(:first-child):before, .ui-dialog .tab-content .charsheet .bordered-item + fieldset + .repcontainer .image-border:before,
|
|
.ui-dialog .tab-content .charsheet .bordered-item:before,
|
|
.sheet-rolltemplate-storypath .bordered-item + fieldset + .repcontainer .image-border:before,
|
|
.sheet-rolltemplate-storypath .bordered-item:before {
|
|
top: var(--inset);
|
|
bottom: var(--inset);
|
|
z-index: -1;
|
|
}
|
|
|
|
.sheet-rolltemplate-storypath > .sheet-template:not(.sheet-continuation):first-child, .ui-dialog .tab-content .charsheet .border-control[value*=master] + .image-border,
|
|
.sheet-rolltemplate-storypath .border-control[value*=master] + .image-border {
|
|
padding: calc(var(--inset) / 2) calc(var(--inset) / 2) 0;
|
|
clip-path: var(--topNotch);
|
|
background-image: var(--image-marble-top), var(--image-marble-right), var(--image-marble-left);
|
|
background-repeat: no-repeat, repeat-y, repeat-y;
|
|
background-position: top var(--offset) left, top right var(--offset), top left var(--offset);
|
|
background-size: max(1500px, 100%) var(--short-side), var(--short-side) max(981px, 100%), var(--short-side) max(981px, 100%);
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template:not(.sheet-continuation):first-child:before, .ui-dialog .tab-content .charsheet .border-control[value*=master] + .image-border:before,
|
|
.sheet-rolltemplate-storypath .border-control[value*=master] + .image-border:before {
|
|
top: var(--inset);
|
|
bottom: 0;
|
|
}
|
|
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:not(:first-child), .ui-dialog .tab-content .charsheet .border-control[value=add-detail] + .image-border,
|
|
.sheet-rolltemplate-storypath .border-control[value=add-detail] + .image-border {
|
|
padding: 0 calc(var(--inset) / 2) calc(var(--inset) / 2);
|
|
clip-path: var(--bottomNotch);
|
|
background-image: var(--image-marble-right), var(--image-marble-left), var(--image-marble-bottom);
|
|
background-repeat: repeat-y, repeat-y, no-repeat;
|
|
background-position: top right var(--offset), top left var(--offset), bottom var(--offset) left;
|
|
background-size: var(--short-side) max(981px, 100%), var(--short-side) max(981px, 100%), max(1500px, 100%) var(--short-side);
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:not(:first-child):before, .ui-dialog .tab-content .charsheet .border-control[value=add-detail] + .image-border:before,
|
|
.sheet-rolltemplate-storypath .border-control[value=add-detail] + .image-border:before {
|
|
top: 0;
|
|
bottom: var(--inset);
|
|
}
|
|
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child, .ui-dialog .tab-content .charsheet .border-control:not([value=add-detail]):not([value*=master]) + .image-border,
|
|
.sheet-rolltemplate-storypath .border-control:not([value=add-detail]):not([value*=master]) + .image-border {
|
|
padding: 0 calc(var(--inset) / 2);
|
|
background-image: var(--image-marble-right), var(--image-marble-left);
|
|
background-repeat: repeat-y, repeat-y;
|
|
background-position: top right var(--offset), top left var(--offset);
|
|
background-size: var(--short-side) max(981px, 100%), var(--short-side) max(981px, 100%);
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child:before, .ui-dialog .tab-content .charsheet .border-control:not([value=add-detail]):not([value*=master]) + .image-border:before,
|
|
.sheet-rolltemplate-storypath .border-control:not([value=add-detail]):not([value*=master]) + .image-border:before {
|
|
top: 0;
|
|
bottom: 0;
|
|
}
|
|
|
|
#main, .sheet-rolltemplate-storypath {
|
|
--sheetHeaderFont:Nova Cut;
|
|
--sectionHeaderFont:Special Elite;
|
|
--contentFont:Source Sans Pro;
|
|
--origin-marble-top: url(https://s3.amazonaws.com/files.d20.io/images/249877181/OO8kLtGrKrmbo-zrYj6zrg/original.png);
|
|
--origin-marble-bottom: url(https://s3.amazonaws.com/files.d20.io/images/249879723/iWQ50VC7Lxjz6v_NxSt-iQ/original.png);
|
|
--origin-marble-left: url(https://s3.amazonaws.com/files.d20.io/images/249877911/jArMKf20lWDHWjqI1oH_6g/original.png);
|
|
--origin-marble-right: url(https://s3.amazonaws.com/files.d20.io/images/249877929/tHr_-gJ-BxGB5Fv8o7O27Q/original.png);
|
|
--chamfer: 9.5px;
|
|
--fullNotch:polygon(0% var(--chamfer), var(--chamfer) 0%, calc(100% - var(--chamfer)) 0%, 100% var(--chamfer), 100% calc(100% - var(--chamfer)), calc(100% - var(--chamfer)) 100%, var(--chamfer) 100%, 0% calc(100% - var(--chamfer)));
|
|
--topNotch: polygon(0% var(--chamfer), var(--chamfer) 0%, calc(100% - var(--chamfer)) 0%, 100% var(--chamfer), 100% 100%, 0% 100%);
|
|
--bottomNotch: polygon(0% 0%, 100% 0%, 100% calc(100% - var(--chamfer)), calc(100% - var(--chamfer)) 100%, var(--chamfer) 100%, 0% calc(100% - var(--chamfer)));
|
|
--short-side: 100px;
|
|
--offset: -10px;
|
|
--inset: 20px;
|
|
--image-marble-top: var(--origin-marble-top);
|
|
--image-marble-bottom: var(--origin-marble-bottom);
|
|
--image-marble-left: var(--origin-marble-left);
|
|
--image-marble-right: var(--origin-marble-right);
|
|
}
|
|
#main.system-scion-hero, #main.sheet-system-scion-hero,
|
|
#main > .sheet-template.system-scion-hero,
|
|
#main > .sheet-template.sheet-system-scion-hero, .sheet-rolltemplate-storypath.system-scion-hero, .sheet-rolltemplate-storypath.sheet-system-scion-hero,
|
|
.sheet-rolltemplate-storypath > .sheet-template.system-scion-hero,
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-system-scion-hero {
|
|
--image-marble-top: url(https://s3.amazonaws.com/files.d20.io/images/253888639/8JSfdmx58dzvuz-_Knw88Q/original.png);
|
|
--image-marble-bottom: url(https://s3.amazonaws.com/files.d20.io/images/253874376/bDQw-CkPKzNrwMAQ5aiA0w/original.png);
|
|
--image-marble-left: url(https://s3.amazonaws.com/files.d20.io/images/253053812/MWwzeVDtpJ6Q8-zRkGB-Wg/original.png);
|
|
--image-marble-right: url(https://s3.amazonaws.com/files.d20.io/images/253053813/b3MN3VPqcCFZKe-tjvGoDQ/original.png);
|
|
}
|
|
|
|
#image-head {
|
|
display: grid;
|
|
grid-template-rows: 150px;
|
|
place-content: center;
|
|
grid-column: 1/-1;
|
|
}
|
|
#image-head img {
|
|
height: 100%;
|
|
}
|
|
|
|
@media (max-width: 830px) {
|
|
#main .dot-row.size-number .dot-button-container {
|
|
display: none;
|
|
}
|
|
#main .dot-row.size-number .dot-number {
|
|
display: inline;
|
|
}
|
|
#calling .repitem > .calling {
|
|
grid-template-columns: auto 1fr repeat(2, auto);
|
|
}
|
|
#calling .repitem > .calling .dot-number {
|
|
grid-column: 3/4;
|
|
}
|
|
#calling .repitem > .calling .dot-row {
|
|
grid-row: 1/2;
|
|
}
|
|
}
|
|
@media (min-width: 1060px) {
|
|
.ui-dialog .charsheet {
|
|
--spanSectionColumn:span 2;
|
|
}
|
|
}
|
|
@media touch {
|
|
.small-scale-grid,
|
|
.small-scale-grid + fieldset + .repcontainer {
|
|
grid-template-columns: [header-start] repeat(auto-fit, minmax(20rem, 1fr)) [header-end];
|
|
}
|
|
}
|
|
@media not touch {
|
|
.small-scale-grid,
|
|
.small-scale-grid + fieldset + .repcontainer {
|
|
grid-template-columns: [header-start] repeat(auto-fit, minmax(15rem, 1fr)) [header-end];
|
|
}
|
|
}
|
|
ul.nav-tabs.nav {
|
|
position: sticky;
|
|
top: 0;
|
|
background-color: white;
|
|
z-index: 9999;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.characterviewer {
|
|
background-color: white;
|
|
}
|
|
|
|
#main-nav {
|
|
display: grid;
|
|
place-content: center start;
|
|
grid-auto-flow: column;
|
|
align-items: center;
|
|
gap: 2px;
|
|
position: sticky;
|
|
top: 43px;
|
|
background-color: white;
|
|
padding: var(--grid-gap) 0 0;
|
|
margin-bottom: var(--half-gap);
|
|
border-bottom: 1px solid #dddddd;
|
|
z-index: 999;
|
|
box-shadow: 30px 0 white, -30px 0 white;
|
|
}
|
|
#main-nav .sheet-nav__tab {
|
|
color: black;
|
|
font-style: normal;
|
|
border: 1px solid transparent;
|
|
margin: 0 0 -1px;
|
|
background-color: transparent;
|
|
border-radius: 4px 4px 0 0;
|
|
box-shadow: none;
|
|
font-size: 13px;
|
|
background-image: none;
|
|
padding: 9px 12px;
|
|
}
|
|
#main-nav .sheet-nav__tab:not(.active):hover {
|
|
background-color: #eeeeee;
|
|
}
|
|
#main-nav .sheet-nav__tab.active {
|
|
border-color: #dddddd #dddddd white #dddddd;
|
|
height: 16px;
|
|
}
|
|
|
|
html {
|
|
font-size: 13px;
|
|
}
|
|
|
|
#main .contents,
|
|
#main .contents + fieldset + .repcontainer,
|
|
.sheet-rolltemplate-storypath .contents,
|
|
.sheet-rolltemplate-storypath .contents + fieldset + .repcontainer {
|
|
display: contents;
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet {
|
|
position: relative;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
.ui-dialog .tab-content .charsheet select,
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.ui-dialog .tab-content .charsheet input,
|
|
.ui-dialog .tab-content .charsheet .uneditable-input,
|
|
.ui-dialog .tab-content .charsheet label,
|
|
.ui-dialog .tab-content .charsheet button {
|
|
all: initial;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .flex-box,
|
|
.ui-dialog .tab-content .charsheet .sheet-flex-box {
|
|
display: flex;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .flex-wrap,
|
|
.ui-dialog .tab-content .charsheet .sheet-flex-wrap {
|
|
flex-wrap: wrap;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .justify-space-around,
|
|
.ui-dialog .tab-content .charsheet .sheet-justify-space-around {
|
|
justify-content: space-around;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .justify-space-between,
|
|
.ui-dialog .tab-content .charsheet .sheet-justify-space-between {
|
|
justify-content: space-between;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .justify-center,
|
|
.ui-dialog .tab-content .charsheet .sheet-justify-center {
|
|
justify-content: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .flex-min-content,
|
|
.ui-dialog .tab-content .charsheet .sheet-flex-min-content {
|
|
flex: 1 0 min-content;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .stacked {
|
|
flex-direction: column;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .stacked.center > * {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .stacked:not(.center) {
|
|
align-items: start;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .stacked > [name]:not([type=number]):not([type=checkbox]):not([type=radio]) {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .flex-column,
|
|
.ui-dialog .tab-content .charsheet .sheet-flex-column {
|
|
flex-direction: column;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .flex-row-reverse,
|
|
.ui-dialog .tab-content .charsheet .sheet-flex-row-revers {
|
|
flex-direction: row-reverse;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .flex-column-reverse,
|
|
.ui-dialog .tab-content .charsheet .sheet-flex-column-reverse {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .normal-gap,
|
|
.ui-dialog .tab-content .charsheet .sheet-normal-gap {
|
|
gap: var(--normal-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .normal-gap-x,
|
|
.ui-dialog .tab-content .charsheet .sheet-normal-gap-x {
|
|
column-gap: var(--normal-gap-x);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .normal-gap-y,
|
|
.ui-dialog .tab-content .charsheet .sheet-normal-gap-y {
|
|
row-gap: var(--normal-gap-y);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .half-gap,
|
|
.ui-dialog .tab-content .charsheet .sheet-half-gap {
|
|
gap: var(--half-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .half-gap-x,
|
|
.ui-dialog .tab-content .charsheet .sheet-half-gap-x {
|
|
column-gap: var(--half-gap-x);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .half-gap-y,
|
|
.ui-dialog .tab-content .charsheet .sheet-half-gap-y {
|
|
row-gap: var(--half-gap-y);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .tiny-gap,
|
|
.ui-dialog .tab-content .charsheet .sheet-tiny-gap {
|
|
gap: var(--tiny-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .tiny-gap-x,
|
|
.ui-dialog .tab-content .charsheet .sheet-tiny-gap-x {
|
|
column-gap: var(--tiny-gap-x);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .tiny-gap-y,
|
|
.ui-dialog .tab-content .charsheet .sheet-tiny-gap-y {
|
|
row-gap: var(--tiny-gap-y);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .big-gap,
|
|
.ui-dialog .tab-content .charsheet .sheet-big-gap {
|
|
gap: var(--big-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .big-gap-x,
|
|
.ui-dialog .tab-content .charsheet .sheet-big-gap-x {
|
|
column-gap: var(--big-gap-x);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .big-gap-y,
|
|
.ui-dialog .tab-content .charsheet .sheet-big-gap-y {
|
|
row-gap: var(--big-gap-y);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .grid,
|
|
.ui-dialog .tab-content .charsheet .sheet-grid {
|
|
display: grid;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .grid-span-2,
|
|
.ui-dialog .tab-content .charsheet .sheet-grid-span-2 {
|
|
grid-column: span 2;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .grid-span-all,
|
|
.ui-dialog .tab-content .charsheet .sheet-grid-span-all {
|
|
grid-column: 1/-1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .grid-column,
|
|
.ui-dialog .tab-content .charsheet .sheet-grid-column {
|
|
grid-auto-flow: column;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .grid-dense,
|
|
.ui-dialog .tab-content .charsheet .sheet-grid-dense {
|
|
grid-auto-flow: dense;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed,
|
|
.ui-dialog .tab-content .charsheet .sheet-boxed {
|
|
border: 2px solid var(--borderColor);
|
|
border-radius: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed.thick-left,
|
|
.ui-dialog .tab-content .charsheet .sheet-boxed.thick-left {
|
|
border-left-width: 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed.thick-bottom,
|
|
.ui-dialog .tab-content .charsheet .sheet-boxed.thick-bottom {
|
|
border-bottom-width: 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed.thick-right,
|
|
.ui-dialog .tab-content .charsheet .sheet-boxed.thick-right {
|
|
border-right-width: 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed.thick-top,
|
|
.ui-dialog .tab-content .charsheet .sheet-boxed.thick-top {
|
|
border-top-width: 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .underlined,
|
|
.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);
|
|
}
|
|
.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;
|
|
}
|
|
.ui-dialog .tab-content .charsheet :is(.underlined, .boxed):not([readonly]):not([type=checkbox]):not([type=radio]):is(:focus, :focus-within) {
|
|
background-color: var(--disabledColor);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .underlined--invisible {
|
|
border-color: transparent !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .ratio1-1,
|
|
.ui-dialog .tab-content .charsheet .sheet-ratio1-1 {
|
|
aspect-ratio: 1/1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet span,
|
|
.ui-dialog .tab-content .charsheet input,
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.ui-dialog .tab-content .charsheet button,
|
|
.ui-dialog .tab-content .charsheet select {
|
|
line-height: normal;
|
|
color: inherit;
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
line-height: inherit;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-1,
|
|
.ui-dialog .tab-content .charsheet .sheet-text-1 {
|
|
font-size: var(--size1);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-2,
|
|
.ui-dialog .tab-content .charsheet .sheet-text-2 {
|
|
font-size: var(--size2);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-3,
|
|
.ui-dialog .tab-content .charsheet .sheet-text-3 {
|
|
font-size: var(--size3);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-4,
|
|
.ui-dialog .tab-content .charsheet .sheet-text-4 {
|
|
font-size: var(--size4);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-5,
|
|
.ui-dialog .tab-content .charsheet .sheet-text-5 {
|
|
font-size: var(--size5);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-6,
|
|
.ui-dialog .tab-content .charsheet .sheet-text-6 {
|
|
font-size: var(--size6);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-7,
|
|
.ui-dialog .tab-content .charsheet .sheet-text-7 {
|
|
font-size: var(--size7);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .capitalize,
|
|
.ui-dialog .tab-content .charsheet .sheet-capitalize {
|
|
text-transform: capitalize !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .lowercase,
|
|
.ui-dialog .tab-content .charsheet .sheet-lowercase {
|
|
text-transform: lowercase !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .uppercase,
|
|
.ui-dialog .tab-content .charsheet .sheet-uppercase {
|
|
text-transform: uppercase !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .sheet-material-icons,
|
|
.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 */
|
|
}
|
|
.ui-dialog .tab-content .charsheet .material-symbol,
|
|
.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;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .sheet-italics,
|
|
.ui-dialog .tab-content .charsheet .italics {
|
|
font-style: italic;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1 *,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1 *:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"] *:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h2, .ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name], .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name],
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h2:not(input), .ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name]:not(input), .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name]:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h2 *, .ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name] *, .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name] *,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h2 *:not(input), .ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name] *:not(input), .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name] *:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"] *:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h3,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h3:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h3 *,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h3 *:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"] *:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4:not(:where(input)),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"]:not(:where(input)) {
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4 *,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4 *:not(:where(input)),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"] *:not(:where(input)) {
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4 *:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"] *:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5:not(:where(input)),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"]:not(:where(input)) {
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5 *,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5 *:not(:where(input)),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"] *:not(:where(input)) {
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5 *:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"] *:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h6,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h6:not(:where(input)),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="6"]:not(:where(input)) {
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h6:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="6"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h6 *,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h6 *:not(:where(input)),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="6"] *:not(:where(input)) {
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h6 *:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="6"] *:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .sheet-pictos,
|
|
.ui-dialog .tab-content .charsheet .pictos {
|
|
font-family: pictos;
|
|
text-transform: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pictos3,
|
|
.ui-dialog .tab-content .charsheet .sheet-pictos3 {
|
|
font-family: pictos three;
|
|
text-transform: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pictoscustom,
|
|
.ui-dialog .tab-content .charsheet .sheet-pictoscustom {
|
|
font-family: pictos custom;
|
|
text-transform: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .d4,
|
|
.ui-dialog .tab-content .charsheet .sheet-d4 {
|
|
font-family: dicefontd4 !important;
|
|
text-transform: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .d6,
|
|
.ui-dialog .tab-content .charsheet .sheet-d6 {
|
|
font-family: dicefontd6 !important;
|
|
text-transform: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .d8,
|
|
.ui-dialog .tab-content .charsheet .sheet-d8 {
|
|
font-family: dicefontd8 !important;
|
|
text-transform: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .d10,
|
|
.ui-dialog .tab-content .charsheet .sheet-d10 {
|
|
font-family: dicefontd10 !important;
|
|
text-transform: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .d12,
|
|
.ui-dialog .tab-content .charsheet .sheet-d12 {
|
|
font-family: dicefontd12 !important;
|
|
text-transform: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .d20,
|
|
.ui-dialog .tab-content .charsheet .sheet-d20 {
|
|
font-family: dicefontd20 !important;
|
|
text-transform: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .d30,
|
|
.ui-dialog .tab-content .charsheet .sheet-d30 {
|
|
font-family: dicefontd30 !important;
|
|
text-transform: none !important;
|
|
}
|
|
.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";
|
|
}
|
|
.ui-dialog .tab-content .charsheet input[type=checkbox]:not(.collapse):not(.fill-left__radio):checked {
|
|
background-color: var(--checkedBackColor);
|
|
}
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet input[type=number] {
|
|
width: 3rem;
|
|
-moz-appearance: textfield !important;
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input[type=number]::-webkit-inner-spin-button, .ui-dialog .tab-content .charsheet input[type=number]::-webkit-outer-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
.ui-dialog .tab-content .charsheet select,
|
|
.ui-dialog .tab-content .charsheet .pseudo-select span,
|
|
.ui-dialog .tab-content .charsheet .sheet-pseudo-select span,
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.ui-dialog .tab-content .charsheet input:not(:is([type=radio], [type=checkbox])),
|
|
.ui-dialog .tab-content .charsheet .uneditable-input {
|
|
padding: var(--inputPadding);
|
|
}
|
|
.ui-dialog .tab-content .charsheet input:is([type=text], [type=number]), .ui-dialog .tab-content .charsheet textarea {
|
|
cursor: auto;
|
|
}
|
|
.ui-dialog .tab-content .charsheet select,
|
|
.ui-dialog .tab-content .charsheet .pseudo-select span,
|
|
.ui-dialog .tab-content .charsheet .sheet-pseudo-select span,
|
|
.ui-dialog .tab-content .charsheet input:not(:where([type=checkbox], [type=radio])),
|
|
.ui-dialog .tab-content .charsheet .uneditable-input,
|
|
.ui-dialog .tab-content .charsheet textarea {
|
|
border-width: 1px 3px;
|
|
border-style: solid;
|
|
border-radius: 5px;
|
|
border-color: transparent;
|
|
box-sizing: border-box;
|
|
}
|
|
.ui-dialog .tab-content .charsheet select,
|
|
.ui-dialog .tab-content .charsheet .sheet-pseudo-select span,
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet input {
|
|
width: auto;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input:placeholder {
|
|
color: var(--placeholderColor);
|
|
}
|
|
.ui-dialog .tab-content .charsheet input.plus-control:not([value*="-"]) + span:before {
|
|
content: "+";
|
|
}
|
|
.ui-dialog .tab-content .charsheet textarea {
|
|
resize: var(--textareaResize);
|
|
white-space: pre-wrap;
|
|
}
|
|
.ui-dialog .tab-content .charsheet textarea.fixed {
|
|
resize: none;
|
|
overflow: auto;
|
|
}
|
|
.ui-dialog .tab-content .charsheet button {
|
|
cursor: pointer;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .roller {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--half-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .roller:before {
|
|
content: "T";
|
|
font-family: dicefontd20;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .collapse-container {
|
|
display: grid;
|
|
position: relative;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-collapse {
|
|
cursor: pointer;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
}
|
|
.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 */
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-collapse__text {
|
|
display: inline;
|
|
}
|
|
.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;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .text-collapse__check:checked + .text-collapse:before {
|
|
content: var(--collapsedSymbol);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem:hover > .collapse, .ui-dialog .tab-content .charsheet .repitem:hover .roll-container,
|
|
.ui-dialog .tab-content .charsheet .collapse-container:hover > .collapse,
|
|
.ui-dialog .tab-content .charsheet .collapse-container:hover .roll-container {
|
|
opacity: var(--collapseHoverOpacity);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse,
|
|
.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;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse:before,
|
|
.ui-dialog .tab-content .charsheet .collapse-container > .collapse:before {
|
|
content: "y";
|
|
font-family: pictos;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse:checked,
|
|
.ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked {
|
|
color: var(--collapseCollapsedColor);
|
|
background-color: transparent;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse:checked ~ .expanded,
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse:checked ~ .collapse-container .expanded,
|
|
.ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked ~ .expanded,
|
|
.ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked ~ .collapse-container .expanded {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
|
.ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
|
.ui-dialog .tab-content .charsheet .collapse-container > .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + * {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse:not(:checked) ~ .collapsed,
|
|
.ui-dialog .tab-content .charsheet .collapse-container > .collapse:not(:checked) ~ .collapsed {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem > .collapse:hover,
|
|
.ui-dialog .tab-content .charsheet .collapse-container > .collapse:hover {
|
|
color: var(--collapseExpandedColor);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontainer.editmode .collapse {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .fill-left {
|
|
display: var(--fillLeftDisplay);
|
|
align-self: var(--fillLeftAlignment);
|
|
box-sizing: border-box;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .fill-left__radio {
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
background-color: var(--fillLeftSelectedColor);
|
|
width: 100%;
|
|
height: 100%;
|
|
cursor: pointer;
|
|
}
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .fill-left__radio:checked ~ .fill-left__radio {
|
|
background-color: var(--fillLeftUnselectedColor);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label {
|
|
display: inline-flex;
|
|
gap: var(--input-label-gap);
|
|
align-items: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label:not(.stacked) > input[type=text] {
|
|
flex: 1 1 0;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label:not(.stacked) > :not([name]) {
|
|
flex: 0 0 auto;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label > :is(span, button) {
|
|
text-transform: var(--input-label-text-transform);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label--dual {
|
|
grid-template-columns: 1fr auto 1fr;
|
|
grid-template-areas: "over over over" "under under under";
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label--dual > span:last-of-type {
|
|
grid-column: 1/-1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label--dual > input:not([type=number]):not([type=checkbox]):not([type=radio]) {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label--dual > .slash {
|
|
line-height: 0rem;
|
|
font-weight: normal;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .headed-textarea {
|
|
display: grid;
|
|
grid-template-rows: auto 1fr;
|
|
grid-template-columns: auto;
|
|
grid-column: 1/-1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .headed-textarea :not(textarea):not(.adaptive) {
|
|
justify-self: start;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .headed-textarea .headed-textarea__header {
|
|
grid-area: initial;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive {
|
|
display: grid;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "content";
|
|
position: relative;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive > * {
|
|
grid-area: content;
|
|
}
|
|
.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;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--text {
|
|
min-height: 4rem;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--text__span {
|
|
white-space: pre-wrap;
|
|
padding: 2px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--text__textarea {
|
|
width: 100%;
|
|
height: 100%;
|
|
resize: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--text__textarea,
|
|
.ui-dialog .tab-content .charsheet .adaptive--input__input {
|
|
position: absolute;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--input__input {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--input__span {
|
|
padding: 2px;
|
|
min-height: 1.5rem;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem > input:not([type=checkbox]) {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem .headed-textarea,
|
|
.ui-dialog .tab-content .charsheet .repitem .description {
|
|
grid-column: 1/-1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontainer {
|
|
display: grid;
|
|
gap: var(--normal-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repeating-container {
|
|
display: grid;
|
|
grid-template-areas: "header";
|
|
align-self: start;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repeating-container > .header {
|
|
grid-area: header;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repeating-container :is(.repcontrol-button, .repcontrol_edit) {
|
|
opacity: 0;
|
|
transition: var(--revealTrans);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repeating-container:is(:hover, :focus-within, :focus) :is(.repcontrol-button, .repcontrol_edit) {
|
|
opacity: 1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button {
|
|
align-self: start;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button ~ .repcontrol {
|
|
justify-self: end;
|
|
z-index: 100;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button ~ .repcontrol > .repcontrol_add {
|
|
display: none !important;
|
|
}
|
|
.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);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button--add::before {
|
|
inset: 0;
|
|
place-self: center;
|
|
font-family: var(--font-icon);
|
|
font-size: 12px;
|
|
content: "add";
|
|
}
|
|
.ui-dialog .tab-content .charsheet .kmodal__button {
|
|
all: initial;
|
|
display: flex;
|
|
margin: 0;
|
|
padding: 0;
|
|
cursor: pointer;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .kmodal__checkbox[type=checkbox] {
|
|
display: none;
|
|
}
|
|
.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;
|
|
}
|
|
.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;
|
|
}
|
|
.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);
|
|
}
|
|
.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;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .kmodal__close:after,
|
|
.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;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .kmodal__close:hover:after,
|
|
.ui-dialog .tab-content .charsheet .kmodal__close:hover:before {
|
|
background: var(--kmodal-close-hover-color);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .kmodal__close:before {
|
|
transform: rotate(-45deg);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .kmodal__checkbox:not(:checked) + .kmodal__outer {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .kmodal__checkbox:checked + .kmodal__outer {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .kmodal__checkbox:checked + .kmodal__outer .kmodal__inner {
|
|
top: 0;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .tabs__container:not(.k-active-tab) {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .tabs__nav-item {
|
|
list-style: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .tabs__nav-list {
|
|
display: flex;
|
|
}
|
|
|
|
.sheet-rolltemplate-storypath {
|
|
--inlineRollFont: var(--font6);
|
|
--inlineRollSize: var(--size6);
|
|
--inlineRollCritFont: var(--inlineRollFont);
|
|
--inlineRollCritSize: var(--inlineRollSize);
|
|
--inlineRollFumbleFont: var(--inlineRollFont);
|
|
--inlineRollFumbleSize: var(--inlineRollSize);
|
|
--inlineRollImportantFont: var(--inlineRollFont);
|
|
--inlineRollImportantSize: var(--inlineRollSize);
|
|
--lm-inlineRollBackColor: transparent;
|
|
--dm-inlineRollBackColor: transparent;
|
|
--inlineRollBackColor: var(--lm-inlineRollBackColor);
|
|
--inlineRollColor: var(--fontColor);
|
|
--lm-inlineRollCritBackColor: var(--lm-inlineRollBackColor);
|
|
--dm-inlineRollCritBackColor: var(--dm-inlineRollBackColor);
|
|
--inlineRollCritBackColor: var(--lm-inlineRollCritBackColor);
|
|
--lm-inlineRollCritColor: #40E240;
|
|
--dm-inlineRollCritColor: #40E240;
|
|
--inlineRollCritColor: var(--lm-inlineRollCritColor);
|
|
--lm-inlineRollFumbleBackColor: var(--lm-inlineRollBackColor);
|
|
--dm-inlineRollFumbleBackColor: var(--dm-inlineRollBackColor);
|
|
--inlineRollFumbleBackColor: var(--lm-inlineRollFumbleBackColor);
|
|
--lm-inlineRollFumbleColor: #C70000;
|
|
--dm-inlineRollFumbleColor: #C70000;
|
|
--inlineRollFumbleColor: var(--lm-inlineRollCritColor);
|
|
--lm-inlineRollImportantBackColor: var(--lm-inlineRollBackColor);
|
|
--dm-inlineRollImportantBackColor: var(--dm-inlineRollBackColor);
|
|
--inlineRollImportantBackColor: var(--lm-inlineRollImportantBackColor);
|
|
--lm-inlineRollImportantColor: #000352;
|
|
--dm-inlineRollImportantColor: #000352;
|
|
--inlineRollImportantColor: var(--lm-inlineRollCritColor);
|
|
--inlineRollPadTop: 0;
|
|
--inlineRollPadRight: 0;
|
|
--inlineRollPadBottom: 0;
|
|
--inlineRollPadLeft: 0;
|
|
--inlineRollMarginTop: 0;
|
|
--inlineRollMarginRight: 0;
|
|
--inlineRollMarginBottom: 0;
|
|
--inlineRollMarginLeft: 0;
|
|
--inlineRollBorderTop: 0;
|
|
--inlineRollBorderRight: 0;
|
|
--inlineRollBorderBottom: 0;
|
|
--inlineRollBorderLeft: 0;
|
|
--inlineRollPadding:
|
|
var(--inlineRollPadTop)
|
|
var(--inlineRollPadRight)
|
|
var(--inlineRollPadBottom)
|
|
var(--inlineRollPadLeft);
|
|
--inlineRollMargin:
|
|
var(--inlineRollMarginTop)
|
|
var(--inlineRollMarginRight)
|
|
var(--inlineRollMarginBottom)
|
|
var(--inlineRollMarginLeft);
|
|
--inlineRollBorder:
|
|
var(--inlineRollBorderTop)
|
|
var(--inlineRollBorderRight)
|
|
var(--inlineRollBorderBottom)
|
|
var(--inlineRollBorderLeft);
|
|
}
|
|
.sheet-rolltemplate-storypath .inlinerollresult {
|
|
background-color: var(--inlineRollBackColor);
|
|
color: var(--inlineRollColor);
|
|
font-family: var(--inlineRollFont);
|
|
font-size: var(--inlineRollSize);
|
|
padding: var(--inlineRollPadding);
|
|
border: var(--inlineRollBorder);
|
|
margin: var(--inlineRollMargin);
|
|
}
|
|
.sheet-rolltemplate-storypath .inlinerollresult.fullcrit {
|
|
background-color: var(--inlineRollCritBackColor);
|
|
color: var(--inlineRollCritColor);
|
|
font-family: var(--inlineRollCritFont);
|
|
font-size: var(--inlineRollCritSize);
|
|
padding: var(--inlineRollCritPadding);
|
|
border: var(--inlineRollCritBorder);
|
|
margin: var(--inlineRollCritMargin);
|
|
}
|
|
.sheet-rolltemplate-storypath .inlinerollresult.fullfail {
|
|
background-color: var(--inlineRollFumbleBackColor);
|
|
color: var(--inlineRollFumbleColor);
|
|
font-family: var(--inlineRollFumbleFont);
|
|
font-size: var(--inlineRollFumbleSize);
|
|
padding: var(--inlineRollFumblePadding);
|
|
border: var(--inlineRollFumbleBorder);
|
|
margin: var(--inlineRollFumbleMargin);
|
|
}
|
|
.sheet-rolltemplate-storypath .inlinerollresult.importantroll {
|
|
background-color: var(--inlineRollImportantBackColor);
|
|
color: var(--inlineRollImportantColor);
|
|
font-family: var(--inlineRollImportantFont);
|
|
font-size: var(--inlineRollImportantSize);
|
|
padding: var(--inlineRollImportantPadding);
|
|
border: var(--inlineRollImportantBorder);
|
|
margin: var(--inlineRollImportantMargin);
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet,
|
|
.sheet-rolltemplate-storypath {
|
|
--grid-gap: 1rem;
|
|
--half-gap: calc(var(--grid-gap) / 2);
|
|
--tiny-gap: calc(var(--half-gap) / 2);
|
|
--big-gap: calc(var(--grid-gap) * 2);
|
|
--revealTime: 500ms;
|
|
--delayTime: 200ms;
|
|
--inputSwap: opacity var(--revealTime) ease var(--delayTime);
|
|
--focusTiming: 500ms ease;
|
|
--focusTrans: all var(--focusTiming);
|
|
--borderColor: black;
|
|
--fontColor: black;
|
|
--backColor: #ffffff;
|
|
--spanSectionColumn:1/-1;
|
|
--displayBorderWidth: 2px;
|
|
--innerFillPoint: 2px;
|
|
--outerFillPoint: 5.5px;
|
|
--midColor: transparent;
|
|
--selectedRadio: black;
|
|
--checkedBackColor: var(--selectedRadio);
|
|
position: relative;
|
|
gap: var(--grid-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label > .adaptive,
|
|
.sheet-rolltemplate-storypath .input-label > .adaptive {
|
|
align-self: stretch;
|
|
}
|
|
.ui-dialog .tab-content .charsheet select,
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.ui-dialog .tab-content .charsheet input,
|
|
.ui-dialog .tab-content .charsheet .uneditable-input,
|
|
.ui-dialog .tab-content .charsheet label,
|
|
.ui-dialog .tab-content .charsheet button,
|
|
.sheet-rolltemplate-storypath select,
|
|
.sheet-rolltemplate-storypath textarea,
|
|
.sheet-rolltemplate-storypath input,
|
|
.sheet-rolltemplate-storypath .uneditable-input,
|
|
.sheet-rolltemplate-storypath label,
|
|
.sheet-rolltemplate-storypath button {
|
|
all: initial;
|
|
font-family: var(--contentFont);
|
|
}
|
|
.ui-dialog .tab-content .charsheet *,
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.sheet-rolltemplate-storypath *,
|
|
.sheet-rolltemplate-storypath textarea {
|
|
color: black;
|
|
transition: var(--focusTrans);
|
|
font-family: var(--contentFont);
|
|
}
|
|
.ui-dialog .tab-content .charsheet button,
|
|
.sheet-rolltemplate-storypath button {
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
}
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.sheet-rolltemplate-storypath textarea {
|
|
resize: vertical;
|
|
min-height: 3.5rem;
|
|
white-space: pre-wrap;
|
|
}
|
|
.ui-dialog .tab-content .charsheet select,
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.ui-dialog .tab-content .charsheet .adaptive--text__span,
|
|
.ui-dialog .tab-content .charsheet input:not(:is([type=radio], [type=checkbox])),
|
|
.ui-dialog .tab-content .charsheet .uneditable-input,
|
|
.sheet-rolltemplate-storypath select,
|
|
.sheet-rolltemplate-storypath textarea,
|
|
.sheet-rolltemplate-storypath .adaptive--text__span,
|
|
.sheet-rolltemplate-storypath input:not(:is([type=radio], [type=checkbox])),
|
|
.sheet-rolltemplate-storypath .uneditable-input {
|
|
padding: 2px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet select,
|
|
.ui-dialog .tab-content .charsheet input:not(:where([type=checkbox], [type=radio])),
|
|
.ui-dialog .tab-content .charsheet .uneditable-input,
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.sheet-rolltemplate-storypath select,
|
|
.sheet-rolltemplate-storypath input:not(:where([type=checkbox], [type=radio])),
|
|
.sheet-rolltemplate-storypath .uneditable-input,
|
|
.sheet-rolltemplate-storypath textarea {
|
|
border-width: 1px 3px;
|
|
border-style: solid;
|
|
border-radius: 5px;
|
|
border-color: transparent;
|
|
box-sizing: border-box;
|
|
}
|
|
.ui-dialog .tab-content .charsheet select:not([readonly]):is(:hover, :focus),
|
|
.ui-dialog .tab-content .charsheet input:not(:where([type=checkbox], [type=radio])):not([readonly]):is(:hover, :focus),
|
|
.ui-dialog .tab-content .charsheet .uneditable-input:not([readonly]):is(:hover, :focus),
|
|
.ui-dialog .tab-content .charsheet textarea:not([readonly]):is(:hover, :focus),
|
|
.sheet-rolltemplate-storypath select:not([readonly]):is(:hover, :focus),
|
|
.sheet-rolltemplate-storypath input:not(:where([type=checkbox], [type=radio])):not([readonly]):is(:hover, :focus),
|
|
.sheet-rolltemplate-storypath .uneditable-input:not([readonly]):is(:hover, :focus),
|
|
.sheet-rolltemplate-storypath textarea:not([readonly]):is(:hover, :focus) {
|
|
border-width: 1px 3px;
|
|
border-style: solid;
|
|
border-color: black;
|
|
border-radius: 5px;
|
|
box-sizing: border-box;
|
|
transition: var(--focusTrans);
|
|
}
|
|
.ui-dialog .tab-content .charsheet select:not([readonly]):focus,
|
|
.ui-dialog .tab-content .charsheet input:not(:where([type=checkbox], [type=radio])):not([readonly]):focus,
|
|
.ui-dialog .tab-content .charsheet .uneditable-input:not([readonly]):focus,
|
|
.ui-dialog .tab-content .charsheet textarea:not([readonly]):focus,
|
|
.sheet-rolltemplate-storypath select:not([readonly]):focus,
|
|
.sheet-rolltemplate-storypath input:not(:where([type=checkbox], [type=radio])):not([readonly]):focus,
|
|
.sheet-rolltemplate-storypath .uneditable-input:not([readonly]):focus,
|
|
.sheet-rolltemplate-storypath textarea:not([readonly]):focus {
|
|
background-color: #DCDCDC;
|
|
transition: var(--focusTrans);
|
|
}
|
|
.ui-dialog .tab-content .charsheet select,
|
|
.sheet-rolltemplate-storypath select {
|
|
-webkit-apperance: none;
|
|
appearance: none;
|
|
text-transform: capitalize;
|
|
overflow: hidden !important;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet label[for],
|
|
.ui-dialog .tab-content .charsheet .pointer,
|
|
.sheet-rolltemplate-storypath label[for],
|
|
.sheet-rolltemplate-storypath .pointer {
|
|
cursor: pointer;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input,
|
|
.sheet-rolltemplate-storypath input {
|
|
width: auto;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input:placeholder,
|
|
.sheet-rolltemplate-storypath input:placeholder {
|
|
color: rgba(237, 237, 237, 0.5019607843);
|
|
}
|
|
.ui-dialog .tab-content .charsheet input.plus-control:not([value*="-"]) + span:before,
|
|
.sheet-rolltemplate-storypath input.plus-control:not([value*="-"]) + span:before {
|
|
content: "+";
|
|
}
|
|
.ui-dialog .tab-content .charsheet span,
|
|
.ui-dialog .tab-content .charsheet input,
|
|
.ui-dialog .tab-content .charsheet textarea,
|
|
.sheet-rolltemplate-storypath span,
|
|
.sheet-rolltemplate-storypath input,
|
|
.sheet-rolltemplate-storypath textarea {
|
|
font-size: 1rem;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .hidden,
|
|
.sheet-rolltemplate-storypath .hidden {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .italics,
|
|
.sheet-rolltemplate-storypath .italics {
|
|
font-style: italic;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1,
|
|
.ui-dialog .tab-content .charsheet h2,
|
|
.ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name],
|
|
.ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name],
|
|
.ui-dialog .tab-content .charsheet h3,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"],
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"],
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"],
|
|
.sheet-rolltemplate-storypath h1,
|
|
.sheet-rolltemplate-storypath h2,
|
|
.sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive).large > [name],
|
|
.sheet-rolltemplate-storypath h3,
|
|
.sheet-rolltemplate-storypath *[aria-level="1"],
|
|
.sheet-rolltemplate-storypath *[aria-level="2"],
|
|
.sheet-rolltemplate-storypath *[aria-level="3"] {
|
|
text-transform: uppercase;
|
|
font-weight: bold;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1,
|
|
.ui-dialog .tab-content .charsheet h2,
|
|
.ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name],
|
|
.ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name],
|
|
.ui-dialog .tab-content .charsheet h3,
|
|
.ui-dialog .tab-content .charsheet h4,
|
|
.ui-dialog .tab-content .charsheet h5,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"],
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"],
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"],
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"],
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"],
|
|
.ui-dialog .tab-content .charsheet span,
|
|
.ui-dialog .tab-content .charsheet label,
|
|
.sheet-rolltemplate-storypath h1,
|
|
.sheet-rolltemplate-storypath h2,
|
|
.sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive).large > [name],
|
|
.sheet-rolltemplate-storypath h3,
|
|
.sheet-rolltemplate-storypath h4,
|
|
.sheet-rolltemplate-storypath h5,
|
|
.sheet-rolltemplate-storypath *[aria-level="1"],
|
|
.sheet-rolltemplate-storypath *[aria-level="2"],
|
|
.sheet-rolltemplate-storypath *[aria-level="3"],
|
|
.sheet-rolltemplate-storypath *[aria-level="4"],
|
|
.sheet-rolltemplate-storypath *[aria-level="5"],
|
|
.sheet-rolltemplate-storypath span,
|
|
.sheet-rolltemplate-storypath label {
|
|
line-height: normal;
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"],
|
|
.sheet-rolltemplate-storypath h1,
|
|
.sheet-rolltemplate-storypath *[aria-level="1"] {
|
|
font-size: 3rem;
|
|
display: block;
|
|
font-family: var(--sheetHeaderFont);
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"]:not(input),
|
|
.sheet-rolltemplate-storypath h1:not(input),
|
|
.sheet-rolltemplate-storypath *[aria-level="1"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h2, .ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name], .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name],
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"],
|
|
.sheet-rolltemplate-storypath h2,
|
|
.sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive).large > [name],
|
|
.sheet-rolltemplate-storypath *[aria-level="2"] {
|
|
font-size: 2.5rem;
|
|
display: block;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h2:not(input), .ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name]:not(input), .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name]:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"]:not(input),
|
|
.sheet-rolltemplate-storypath h2:not(input),
|
|
.sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive).large > [name]:not(input),
|
|
.sheet-rolltemplate-storypath *[aria-level="2"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h3,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"],
|
|
.sheet-rolltemplate-storypath h3,
|
|
.sheet-rolltemplate-storypath *[aria-level="3"] {
|
|
font-size: 2rem;
|
|
display: block;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h3:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"]:not(input),
|
|
.sheet-rolltemplate-storypath h3:not(input),
|
|
.sheet-rolltemplate-storypath *[aria-level="3"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"],
|
|
.sheet-rolltemplate-storypath h4,
|
|
.sheet-rolltemplate-storypath *[aria-level="4"] {
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
display: block;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"]:not(input),
|
|
.sheet-rolltemplate-storypath h4:not(input),
|
|
.sheet-rolltemplate-storypath *[aria-level="4"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"],
|
|
.sheet-rolltemplate-storypath h5,
|
|
.sheet-rolltemplate-storypath *[aria-level="5"] {
|
|
font-size: 1rem;
|
|
font-style: italic;
|
|
display: block;
|
|
font-weight: bold;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5:not(input),
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"]:not(input),
|
|
.sheet-rolltemplate-storypath h5:not(input),
|
|
.sheet-rolltemplate-storypath *[aria-level="5"]:not(input) {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h1,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="1"],
|
|
.sheet-rolltemplate-storypath h1,
|
|
.sheet-rolltemplate-storypath *[aria-level="1"] {
|
|
display: block;
|
|
white-space: nowrap;
|
|
margin-top: 0px;
|
|
margin-bottom: 0px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h2, .ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive).large > [name], .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name],
|
|
.ui-dialog .tab-content .charsheet *[aria-level="2"],
|
|
.sheet-rolltemplate-storypath h2,
|
|
.sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive).large > [name],
|
|
.sheet-rolltemplate-storypath *[aria-level="2"] {
|
|
display: block;
|
|
white-space: nowrap;
|
|
margin-top: 0px;
|
|
margin-bottom: 0px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h3,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"],
|
|
.sheet-rolltemplate-storypath h3,
|
|
.sheet-rolltemplate-storypath *[aria-level="3"] {
|
|
display: block;
|
|
white-space: nowrap;
|
|
margin-top: 0px;
|
|
margin-bottom: 0px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"],
|
|
.sheet-rolltemplate-storypath h4,
|
|
.sheet-rolltemplate-storypath *[aria-level="4"] {
|
|
display: block;
|
|
white-space: nowrap;
|
|
margin-top: 0px;
|
|
margin-bottom: 0px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"],
|
|
.sheet-rolltemplate-storypath h5,
|
|
.sheet-rolltemplate-storypath *[aria-level="5"] {
|
|
display: block;
|
|
white-space: nowrap;
|
|
margin-top: 0px;
|
|
margin-bottom: 0px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .roller,
|
|
.sheet-rolltemplate-storypath .roller {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: var(--half-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .roller:before,
|
|
.sheet-rolltemplate-storypath .roller:before {
|
|
content: "K";
|
|
font-family: dicefontd10;
|
|
text-transform: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pictos,
|
|
.sheet-rolltemplate-storypath .pictos {
|
|
font-family: pictos;
|
|
text-transform: initial;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pictos3,
|
|
.sheet-rolltemplate-storypath .pictos3 {
|
|
font-family: pictos three;
|
|
text-transform: initial;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pictoscustom,
|
|
.sheet-rolltemplate-storypath .pictoscustom {
|
|
font-family: pictos custom;
|
|
text-transform: initial;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input[type=checkbox],
|
|
.sheet-rolltemplate-storypath input[type=checkbox] {
|
|
align-self: center;
|
|
border-radius: 3px;
|
|
border: 1px solid black;
|
|
width: 10px;
|
|
min-width: 10px;
|
|
height: 10px;
|
|
min-height: 10px;
|
|
cursor: pointer;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input[type=checkbox]:checked,
|
|
.sheet-rolltemplate-storypath input[type=checkbox]:checked {
|
|
background-color: black;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input[type=radio],
|
|
.sheet-rolltemplate-storypath input[type=radio] {
|
|
appearance: radio;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input[type=number],
|
|
.sheet-rolltemplate-storypath input[type=number] {
|
|
width: 2em;
|
|
-moz-appearance: textfield !important;
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input[type=number]::-webkit-inner-spin-button, .ui-dialog .tab-content .charsheet input[type=number]::-webkit-outer-spin-button,
|
|
.sheet-rolltemplate-storypath input[type=number]::-webkit-inner-spin-button,
|
|
.sheet-rolltemplate-storypath input[type=number]::-webkit-outer-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
.ui-dialog .tab-content .charsheet input input textarea.fixed,
|
|
.sheet-rolltemplate-storypath input input textarea.fixed {
|
|
resize: none;
|
|
overflow: auto;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .disable,
|
|
.sheet-rolltemplate-storypath .disable {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .span-all,
|
|
.sheet-rolltemplate-storypath .span-all {
|
|
grid-column: 1/-1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet section.page,
|
|
.sheet-rolltemplate-storypath section.page {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .navigable-section:not(.active),
|
|
.sheet-rolltemplate-storypath .navigable-section:not(.active) {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-button,
|
|
.sheet-rolltemplate-storypath .pseudo-button {
|
|
display: inline;
|
|
cursor: pointer;
|
|
border-radius: 5px;
|
|
text-transform: uppercase;
|
|
border: 1px solid black;
|
|
text-align: center;
|
|
padding: 0 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label,
|
|
.sheet-rolltemplate-storypath .input-label {
|
|
display: inline-flex;
|
|
gap: var(--half-gap);
|
|
align-items: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label.stacked,
|
|
.sheet-rolltemplate-storypath .input-label.stacked {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label.stacked.center > *,
|
|
.sheet-rolltemplate-storypath .input-label.stacked.center > * {
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label.stacked:not(.center) > *,
|
|
.sheet-rolltemplate-storypath .input-label.stacked:not(.center) > * {
|
|
text-align: left;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label.stacked > [name],
|
|
.sheet-rolltemplate-storypath .input-label.stacked > [name] {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive) > [name]:not([type=number], [type=checkbox], [type=radio], [type=roll], [type=action], select),
|
|
.sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive) > [name]:not([type=number], [type=checkbox], [type=radio], [type=roll], [type=action], select) {
|
|
width: 0;
|
|
flex: 1 1 0;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .input-label:not(.stacked):not(.input-label--adaptive) > :not([name]),
|
|
.sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive) > :not([name]) {
|
|
flex: 0 0 auto;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dual.input-label,
|
|
.sheet-rolltemplate-storypath .dual.input-label {
|
|
grid-template-columns: 1fr auto 1fr;
|
|
grid-template-areas: "over over over" "under under under";
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dual.input-label > span:last-of-type,
|
|
.sheet-rolltemplate-storypath .dual.input-label > span:last-of-type {
|
|
grid-column: 1/-1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dual.input-label > input,
|
|
.sheet-rolltemplate-storypath .dual.input-label > input {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dual.input-label > .slash,
|
|
.sheet-rolltemplate-storypath .dual.input-label > .slash {
|
|
line-height: 0rem;
|
|
font-weight: normal;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .headed-textarea,
|
|
.sheet-rolltemplate-storypath .headed-textarea {
|
|
display: grid;
|
|
grid-template-rows: auto 1fr;
|
|
grid-template-columns: auto;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed,
|
|
.sheet-rolltemplate-storypath .boxed {
|
|
border: 1px solid black;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed.thick-left,
|
|
.sheet-rolltemplate-storypath .boxed.thick-left {
|
|
border-left-width: 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed.thick-bottom,
|
|
.sheet-rolltemplate-storypath .boxed.thick-bottom {
|
|
border-bottom-width: 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed.thick-right,
|
|
.sheet-rolltemplate-storypath .boxed.thick-right {
|
|
border-right-width: 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .boxed.thick-top,
|
|
.sheet-rolltemplate-storypath .boxed.thick-top {
|
|
border-top-width: 5px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .underlined,
|
|
.sheet-rolltemplate-storypath .underlined {
|
|
border-radius: 0;
|
|
border-bottom: 1px solid black;
|
|
transition: var(--focusTrans);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .small-scale-grid,
|
|
.ui-dialog .tab-content .charsheet .small-scale-grid + fieldset + .repcontainer,
|
|
.sheet-rolltemplate-storypath .small-scale-grid,
|
|
.sheet-rolltemplate-storypath .small-scale-grid + fieldset + .repcontainer {
|
|
display: grid;
|
|
grid-template-columns: [header-start] repeat(auto-fit, minmax(15rem, 1fr)) [header-end];
|
|
grid-template-rows: [header-start] auto [header-end];
|
|
gap: var(--half-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .small-scale-grid > .repitem,
|
|
.ui-dialog .tab-content .charsheet .small-scale-grid + fieldset + .repcontainer > .repitem,
|
|
.sheet-rolltemplate-storypath .small-scale-grid > .repitem,
|
|
.sheet-rolltemplate-storypath .small-scale-grid + fieldset + .repcontainer > .repitem {
|
|
display: flex;
|
|
gap: var(--half-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .small-scale-grid > .repitem > :is(.dot-row, input[type=text]),
|
|
.ui-dialog .tab-content .charsheet .small-scale-grid + fieldset + .repcontainer > .repitem > :is(.dot-row, input[type=text]),
|
|
.sheet-rolltemplate-storypath .small-scale-grid > .repitem > :is(.dot-row, input[type=text]),
|
|
.sheet-rolltemplate-storypath .small-scale-grid + fieldset + .repcontainer > .repitem > :is(.dot-row, input[type=text]) {
|
|
flex: 1 1 0;
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol_move,
|
|
.sheet-rolltemplate-storypath .repcontrol_move {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .short-text,
|
|
.sheet-rolltemplate-storypath .short-text {
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-transform: initial;
|
|
}
|
|
|
|
*[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet {
|
|
padding-top: 0px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet :placeholder-shown {
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive {
|
|
display: grid;
|
|
position: relative;
|
|
grid-template-columns: auto;
|
|
grid-template-rows: auto;
|
|
grid-template-areas: "content";
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive > * {
|
|
grid-area: content;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive > span {
|
|
opacity: 0;
|
|
z-index: -10;
|
|
text-transform: initial;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--text {
|
|
--height:4rem;
|
|
min-block-size: var(--height);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--text__span {
|
|
white-space: pre-wrap;
|
|
display: block;
|
|
min-block-size: var(--height);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--text__textarea {
|
|
resize: none;
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
min-height: 0px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--text__textarea,
|
|
.ui-dialog .tab-content .charsheet .adaptive--text__span {
|
|
font-family: var(--contentFont);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--input {
|
|
--inputMin:4rem;
|
|
--inputMax:14rem;
|
|
width: fit-content;
|
|
overflow: hidden;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--input__span {
|
|
white-space: nowrap;
|
|
max-width: var(--inputMax);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .adaptive--input__input:not([type=number]) {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontainer {
|
|
padding-top: var(--half-gap);
|
|
background-color: white;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer .roller {
|
|
place-self: center end;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer .repcontrol-button--edit {
|
|
position: absolute;
|
|
grid-column-end: -1;
|
|
grid-row: 1/2;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer .description {
|
|
grid-column: 1/-1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem {
|
|
position: relative;
|
|
background-color: white;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem input[type=text],
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem select {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem[data-reprowid=-COMPLETEHEADERSTYLE] {
|
|
grid-column: 1/-1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem > div:not(:is(.itemcontrol,
|
|
.image-border,
|
|
.display-target)) {
|
|
padding: var(--tiny-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem .display-target {
|
|
gap: var(--half-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem .btn.collapse {
|
|
grid-area: collapse-button;
|
|
position: absolute;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem .itemcontrol {
|
|
padding: 0 var(--tiny-gap);
|
|
border: 1px solid transparent;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
z-index: 10;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem .itemcontrol .btn {
|
|
border-radius: 4px;
|
|
border: 1px solid #ccc;
|
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
|
|
display: inline-block;
|
|
padding: 0px 5px;
|
|
margin: 0;
|
|
font-size: 13px;
|
|
line-height: 18px;
|
|
color: #333;
|
|
text-align: center;
|
|
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
|
|
vertical-align: middle;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .pseudo-control + fieldset + .repcontainer > .repitem .itemcontrol .btn-danger {
|
|
background-color: #da4f49;
|
|
background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);
|
|
background-repeat: repeat-x;
|
|
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .add-container {
|
|
display: flex;
|
|
position: relative;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem:is([data-reprowid^=-ADD],
|
|
[data-reprowid^=-COMPLETEHEADERSTYLE]) {
|
|
margin-bottom: var(--half-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem:is([data-reprowid^=-ADD],
|
|
[data-reprowid^=-COMPLETEHEADERSTYLE]) > .itemcontrol {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .display-target {
|
|
border: 0px solid transparent;
|
|
padding: calc(var(--inset) / 2);
|
|
}
|
|
.ui-dialog .tab-content .charsheet :is(.image-borders, .bordered-item) + fieldset + .repcontainer > .repitem {
|
|
display: grid;
|
|
grid-template-areas: "content";
|
|
}
|
|
.ui-dialog .tab-content .charsheet :is(.image-borders, .bordered-item) + fieldset + .repcontainer > .repitem > * {
|
|
grid-area: content;
|
|
}
|
|
.ui-dialog .tab-content .charsheet :is(.image-borders, .bordered-item) + fieldset + .repcontainer > .repitem .itemcontrol {
|
|
align-self: start;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .image-border ~ * {
|
|
z-index: 1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .display-control:not(:checked) + .display-target {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .display-control:checked + .display-target {
|
|
display: grid;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .display-control:checked + .display-target.add-detail {
|
|
display: flex;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .display-control[value=""] + :is(label, .input-label) {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .expanded-control + .display-target .conditional-show {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .expanded-control[value*=short] + .display-target {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .expanded-control:not([value*=short]) + .display-target {
|
|
display: grid;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button:not(.repcontrol-button--inline) {
|
|
align-self: center;
|
|
text-transform: none;
|
|
transition: opacity var(--revealTime);
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button--add:before {
|
|
font-family: pictos;
|
|
content: "&";
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button--edit:before {
|
|
font-family: pictos;
|
|
content: "p";
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repcontrol-button--inline {
|
|
align-self: start;
|
|
}
|
|
.ui-dialog .tab-content .charsheet section > .repcontrol-button--add {
|
|
place-self: center start;
|
|
margin-left: 5px;
|
|
border-color: transparent;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .subsystem-style ~ .repcontrol-button--edit,
|
|
.ui-dialog .tab-content .charsheet .subsystem-style ~ .repcontrol-button--add {
|
|
justify-self: start;
|
|
grid-area: header;
|
|
z-index: 10;
|
|
color: white;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .subsystem-style ~ .repcontrol-button--edit {
|
|
justify-self: end;
|
|
margin-right: var(--half-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .collapse-interface {
|
|
position: absolute;
|
|
grid-column: 1/2;
|
|
grid-row: 1/2;
|
|
left: -24px;
|
|
top: 0;
|
|
font-family: pictos;
|
|
opacity: 0;
|
|
cursor: pointer;
|
|
transition: var(--focusTrans) 500ms;
|
|
padding: 3px 4px;
|
|
}
|
|
.ui-dialog .tab-content .charsheet div:is(:hover,
|
|
:focus,
|
|
:focus-within) > .collapse-interface {
|
|
opacity: 1;
|
|
transition: var(--focusTrans);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .collapse-control[value="0"] + .collapse-interface:before {
|
|
content: "_";
|
|
}
|
|
.ui-dialog .tab-content .charsheet .collapse-control:not([value="0"]) + .collapse-interface:before {
|
|
content: "|";
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem:hover .collapse, .ui-dialog .tab-content .charsheet .repitem:hover .roll-container,
|
|
.ui-dialog .tab-content .charsheet .collapse-container:hover .collapse,
|
|
.ui-dialog .tab-content .charsheet .collapse-container:hover .roll-container {
|
|
opacity: 1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse {
|
|
opacity: 0;
|
|
position: absolute;
|
|
right: -10px;
|
|
top: 0px;
|
|
border: 0px solid black;
|
|
border-radius: 0;
|
|
color: var(--selectedColor);
|
|
text-transform: none;
|
|
background-color: transparent;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse:before,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse:before {
|
|
content: "y";
|
|
font-family: pictos;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse:checked,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked {
|
|
color: var(--unselectedColor1);
|
|
background-color: transparent;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse:checked ~ .expanded,
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse:checked ~ .collapse-container .expanded,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked ~ .expanded,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked ~ .collapse-container .expanded {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked ~ .expanded--empty:is(:not([value]), [value=""]) + *,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse:checked ~ .collapse-container ~ .expanded--empty:is(:not([value]), [value=""]) + * {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse:not(:checked) ~ .collapsed,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse:not(:checked) ~ .collapsed {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .repitem .collapse:hover,
|
|
.ui-dialog .tab-content .charsheet .collapse-container .collapse:hover {
|
|
color: var(--selectedColor);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .split {
|
|
display: flex;
|
|
gap: var(--grid-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-row {
|
|
align-items: center;
|
|
gap: var(--tiny-gap);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-row:not(.contents) {
|
|
display: flex;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-row.boxes .dot {
|
|
border-radius: 0;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-row .dot-number {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-row > :not(:is(.dot-button-container, .dot-number)):is(:first-child, :last-child) {
|
|
place-self: center start;
|
|
flex: 1 1 0;
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-row > :not(:is(.dot-button-container, .dot-number)):first-child {
|
|
text-align: left;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-row > :not(:is(.dot-button-container, .dot-number)):last-child {
|
|
text-align: right;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container {
|
|
display: inline-flex;
|
|
gap: var(--tiny-gap);
|
|
align-items: center;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot {
|
|
-webkit-apperance: none;
|
|
appearance: none;
|
|
width: 12px;
|
|
border: 1px solid black;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot.no-fill,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot.no-fill {
|
|
background: white;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot:not(.no-fill), .ui-dialog .tab-content .charsheet .dot-button-container .dot.no-fill:checked,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot:not(.no-fill),
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot.no-fill:checked {
|
|
background-color: var(--selectedRadio);
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot:not(.no-fill),
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot:not(.no-fill) {
|
|
order: 1;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot:not(.no-fill):not(.no-clear):checked,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot:not(.no-fill):not(.no-clear):checked {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot:not(.no-fill).clearer,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot:not(.no-fill).clearer {
|
|
order: 2;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot:not(.no-fill).clearer:checked,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot:not(.no-fill).clearer:checked {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot:not(.no-fill):checked ~ .dot,
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .readonly-dot:not(.no-fill):checked ~ .dot {
|
|
order: 3;
|
|
background-color: white;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot {
|
|
cursor: pointer;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container .dot[value="0"] + .readonly-dot {
|
|
display: none;
|
|
}
|
|
.ui-dialog .tab-content .charsheet .dot-button-container:is(:hover,
|
|
:focus-within,
|
|
:focus) .clearer {
|
|
background-color: var(--selectedRadio);
|
|
background-image: linear-gradient(45deg, transparent 0% 48%, white 48% calc(48% + 1px), transparent calc(48% + 1px)), linear-gradient(-45deg, transparent 0% 48%, white 48% calc(48% + 1px), transparent calc(48% + 1px));
|
|
border-color: transparent;
|
|
}
|
|
|
|
#sheet {
|
|
display: grid;
|
|
align-items: start;
|
|
gap: var(--big-gap);
|
|
grid-template-columns: repeat(auto-fit, minmax(375px, 1fr));
|
|
}
|
|
#sheet > section {
|
|
align-self: start;
|
|
}
|
|
#sheet > section h2, #sheet > section .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > [name], .ui-dialog .tab-content .charsheet #sheet > section .input-label:not(.stacked).large > [name],
|
|
#sheet > section .sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive).large > [name],
|
|
.sheet-rolltemplate-storypath #sheet > section .input-label:not(.stacked):not(.input-label--adaptive).large > [name],
|
|
#sheet > section [aria-level="2"] {
|
|
grid-area: header;
|
|
width: 100%;
|
|
}
|
|
#sheet > section h2.collapse ~ *:not(h2, [aria-level="2"]), #sheet > section .ui-dialog .tab-content .charsheet .input-label:not(.stacked).large > .collapse[name] ~ *:not(h2, [aria-level="2"]), .ui-dialog .tab-content .charsheet #sheet > section .input-label:not(.stacked).large > .collapse[name] ~ *:not(h2, [aria-level="2"]),
|
|
#sheet > section .sheet-rolltemplate-storypath .input-label:not(.stacked):not(.input-label--adaptive).large > .collapse[name] ~ *:not(h2, [aria-level="2"]),
|
|
.sheet-rolltemplate-storypath #sheet > section .input-label:not(.stacked):not(.input-label--adaptive).large > .collapse[name] ~ *:not(h2, [aria-level="2"]),
|
|
#sheet > section [aria-level="2"].collapse ~ *:not(h2, [aria-level="2"]) {
|
|
display: none;
|
|
}
|
|
#sheet > section h3.collapse ~ *:not(h2,
|
|
[aria-level="2"]),
|
|
#sheet > section [aria-level="3"].collapse ~ *:not(h2,
|
|
[aria-level="2"]) {
|
|
display: none;
|
|
}
|
|
|
|
#main :is(article, .subsystem-display):not(.active) {
|
|
display: none;
|
|
}
|
|
#main .repeat-columns {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
place-items: center;
|
|
}
|
|
#main .display-target:not([class*=short]) .clash {
|
|
grid-column: 1/-1;
|
|
display: grid;
|
|
grid-template-columns: auto 1fr;
|
|
}
|
|
#main .display-target:not([class*=short]) .clash .select-container {
|
|
grid-template-columns: 1fr auto 1fr;
|
|
}
|
|
#main .display-target:not([class*=short]) .clash .select-container .vs {
|
|
grid-column: 1/-1;
|
|
}
|
|
#main .display-target > .clash {
|
|
gap: var(--half-gap);
|
|
}
|
|
#main .display-target > .clash .select-container {
|
|
grid-column: span 2;
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
}
|
|
#main .display-target > .clash .select-container span {
|
|
place-self: center;
|
|
text-transform: uppercase;
|
|
}
|
|
#main .display-target[class*=short] .clash {
|
|
grid-column: span 2;
|
|
display: none;
|
|
grid-template-columns: repeat(4, auto) 1fr repeat(3, auto);
|
|
}
|
|
#main .display-target[class*=short] .clash span {
|
|
place-self: center;
|
|
text-transform: uppercase;
|
|
}
|
|
#main .display-target[class*=short] .clash-display-control:not([value=select]) ~ .clash {
|
|
display: grid;
|
|
}
|
|
#main .image-display-control:is([value=""], :not([value])) + img {
|
|
display: none;
|
|
}
|
|
#main .inline-fieldset__summary {
|
|
padding: 0;
|
|
}
|
|
#main .statblock__row {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
grid-template-columns: auto;
|
|
grid-auto-flow: column;
|
|
grid-auto-columns: 1fr;
|
|
margin-bottom: var(--tiny-gap);
|
|
}
|
|
#main .statblock__row--auto-grid {
|
|
grid-auto-columns: auto;
|
|
justify-content: start;
|
|
}
|
|
#main .statblock__row--inline-container {
|
|
grid-template-columns: auto 1fr repeat(2, auto);
|
|
}
|
|
#main .statblock__row--flex {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--half-gap);
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer {
|
|
display: flex;
|
|
align-content: center;
|
|
flex-wrap: wrap;
|
|
gap: var(--tiny-gap);
|
|
padding: 0;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer > .repitem {
|
|
display: inline;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer > .repitem .repcontrol_move {
|
|
display: none;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer > .repitem > .display-control:checked + .inline-fieldset__summary {
|
|
display: inline;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer > .repitem:not(:last-child) > .inline-fieldset__summary .inline-fieldset__summary__text:after {
|
|
content: ",";
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer > .repitem:first-child .collapse-interface {
|
|
top: 2rem;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer .statblock__row--flex {
|
|
justify-content: space-between;
|
|
gap: var(--half-gap);
|
|
padding-inline: 0;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer .statblock__row--flex > .input-label {
|
|
max-width: 100%;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer .input-label {
|
|
flex: 1 1 0;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer .input-label:last-child {
|
|
width: 100%;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer .input-label__input[type=number] {
|
|
min-width: 2rem;
|
|
}
|
|
#main .inline-fieldset + fieldset + .repcontainer .input-label__input:not([type=number]) {
|
|
min-width: 4rem;
|
|
}
|
|
#main .hide-control:checked + .display-target {
|
|
display: none;
|
|
}
|
|
.has-label--uppercase {
|
|
text-transform: uppercase !important;
|
|
}
|
|
.has-label--lowercase {
|
|
text-transform: lowercase !important;
|
|
}
|
|
.has-label--capitalize {
|
|
text-transform: capitalize !important;
|
|
}
|
|
|
|
.ui-dialog .tab-content .charsheet h3.subsystem-style.system-scion-origin, .ui-dialog .tab-content .charsheet h3.subsystem-style.system-scion-hero,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"].subsystem-style.system-scion-origin,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="3"].subsystem-style.system-scion-hero,
|
|
.sheet-rolltemplate-storypath h3.subsystem-style.system-scion-origin,
|
|
.sheet-rolltemplate-storypath h3.subsystem-style.system-scion-hero,
|
|
.sheet-rolltemplate-storypath *[aria-level="3"].subsystem-style.system-scion-origin,
|
|
.sheet-rolltemplate-storypath *[aria-level="3"].subsystem-style.system-scion-hero {
|
|
background-color: darkgrey;
|
|
color: white;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h4.subsystem-style.system-scion-origin, .ui-dialog .tab-content .charsheet h4.subsystem-style.system-scion-hero,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"].subsystem-style.system-scion-origin,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="4"].subsystem-style.system-scion-hero,
|
|
.sheet-rolltemplate-storypath h4.subsystem-style.system-scion-origin,
|
|
.sheet-rolltemplate-storypath h4.subsystem-style.system-scion-hero,
|
|
.sheet-rolltemplate-storypath *[aria-level="4"].subsystem-style.system-scion-origin,
|
|
.sheet-rolltemplate-storypath *[aria-level="4"].subsystem-style.system-scion-hero {
|
|
background-color: darkgrey;
|
|
color: white;
|
|
}
|
|
.ui-dialog .tab-content .charsheet h5.subsystem-style.system-scion-origin, .ui-dialog .tab-content .charsheet h5.subsystem-style.system-scion-hero,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"].subsystem-style.system-scion-origin,
|
|
.ui-dialog .tab-content .charsheet *[aria-level="5"].subsystem-style.system-scion-hero,
|
|
.sheet-rolltemplate-storypath h5.subsystem-style.system-scion-origin,
|
|
.sheet-rolltemplate-storypath h5.subsystem-style.system-scion-hero,
|
|
.sheet-rolltemplate-storypath *[aria-level="5"].subsystem-style.system-scion-origin,
|
|
.sheet-rolltemplate-storypath *[aria-level="5"].subsystem-style.system-scion-hero {
|
|
background-color: darkgrey;
|
|
color: white;
|
|
}
|
|
#settings {
|
|
display: grid;
|
|
grid-template-columns: [header-start] repeat(auto-fit, minmax(315px, 1fr)) [header-end];
|
|
grid-template-rows: [header-start] auto [header-end];
|
|
gap: var(--big-gap);
|
|
}
|
|
#settings h1 {
|
|
grid-area: header;
|
|
}
|
|
#settings > section {
|
|
border: 1px solid black;
|
|
padding: 5px;
|
|
display: grid;
|
|
grid-template-columns: [header-start] repeat(auto-fit, minmax(150px, 1fr)) [header-end];
|
|
gap: var(--grid-gap);
|
|
align-content: start;
|
|
}
|
|
#settings > section > h2 {
|
|
grid-column: 1/-1;
|
|
}
|
|
|
|
#antagonist {
|
|
--antagonistHeadColor:transparent;
|
|
--antagonistHeadFontColor:black;
|
|
display: grid;
|
|
gap: var(--big-gap);
|
|
grid-template-columns: minmax(375px, 1fr);
|
|
}
|
|
#antagonist h1,
|
|
#antagonist *[aria-level="1"] {
|
|
font-size: 2rem;
|
|
}
|
|
#antagonist h2,
|
|
#antagonist *[aria-level="2"] {
|
|
font-size: 1.75rem;
|
|
}
|
|
#antagonist h3,
|
|
#antagonist *[aria-level="3"] {
|
|
font-size: 1.5rem;
|
|
}
|
|
#antagonist h4,
|
|
#antagonist *[aria-level="4"] {
|
|
font-size: 1.25rem;
|
|
}
|
|
#antagonist h5,
|
|
#antagonist *[aria-level="5"] {
|
|
font-size: 1rem;
|
|
}
|
|
#antagonist.subsystem-style.system-scion-origin .statblock__row--header {
|
|
--antagonistHeadColor:#323f28;
|
|
--antagonistHeadFontColor:white ;
|
|
}
|
|
#antagonist.subsystem-style.system-scion-hero .statblock__row--header {
|
|
--antagonistHeadColor:#504436;
|
|
--antagonistHeadFontColor:white;
|
|
}
|
|
#antagonist .statblock__row--header {
|
|
background-color: var(--antagonistHeadColor);
|
|
}
|
|
#antagonist .statblock__row--header input:not(:where([type=checkbox], [type=radio])):not([readonly]):focus {
|
|
color: black;
|
|
}
|
|
#antagonist .statblock__row--header * {
|
|
color: var(--antagonistHeadFontColor);
|
|
}
|
|
#antagonist [class*=statblock__row] {
|
|
margin-bottom: var(--grid-gap);
|
|
}
|
|
|
|
#gm-screen,
|
|
#party-screen {
|
|
display: grid;
|
|
gap: var(--big-gap);
|
|
grid-template-columns: repeat(auto-fill, minmax(375px, 1fr));
|
|
}
|
|
#gm-screen > *,
|
|
#party-screen > * {
|
|
align-self: start;
|
|
}
|
|
|
|
#tension,
|
|
#party-momentum {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
}
|
|
#tension > .dot-row,
|
|
#party-momentum > .dot-row {
|
|
place-self: center;
|
|
}
|
|
|
|
#character_details {
|
|
grid-column: 1/-1;
|
|
display: grid;
|
|
grid-gap: var(--half-gap);
|
|
grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
|
|
}
|
|
#character_details > .input-label {
|
|
width: 100%;
|
|
}
|
|
|
|
#momentum {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
}
|
|
#momentum:not(.system-scion-hero) {
|
|
grid-template-columns: 1fr;
|
|
grid-template-areas: "header" "buttons";
|
|
}
|
|
#momentum.system-scion-hero {
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-template-areas: "header header" "momentum legend" "momentum legend-max";
|
|
align-items: center;
|
|
}
|
|
#momentum.system-scion-hero .momentum-content {
|
|
grid-area: momentum;
|
|
}
|
|
#momentum.system-scion-hero .legend-content {
|
|
grid-area: legend;
|
|
}
|
|
#momentum.system-scion-hero .legend-max-content {
|
|
grid-area: legend-max;
|
|
}
|
|
#momentum > .dot-row {
|
|
place-self: center;
|
|
}
|
|
#momentum.system-scion-demigod {
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-template-areas: "header header" "momentum legend" "momentum legend-max";
|
|
align-items: center;
|
|
}
|
|
#momentum.system-scion-demigod .momentum-content {
|
|
grid-area: momentum;
|
|
}
|
|
#momentum.system-scion-demigod .legend-content {
|
|
grid-area: legend;
|
|
}
|
|
#momentum.system-scion-demigod .legend-max-content {
|
|
grid-area: legend-max;
|
|
}
|
|
#momentum > .dot-row {
|
|
place-self: center;
|
|
}
|
|
|
|
#divinity {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
grid-template-areas: "header";
|
|
}
|
|
#divinity.system-scion-demigod {
|
|
grid-template-areas: "header";
|
|
align-items: center;
|
|
}
|
|
#divinity > .dot-row {
|
|
place-self: center;
|
|
}
|
|
|
|
#virtue {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
grid-template-areas: "header";
|
|
}
|
|
|
|
#skills {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
grid-template-areas: "header";
|
|
grid-column: 1/-1;
|
|
}
|
|
#skills .repcontainer {
|
|
display: grid;
|
|
column-gap: var(--big-gap);
|
|
row-gap: var(--half-gap);
|
|
grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
|
|
}
|
|
#skills .repcontainer .repitem {
|
|
display: inline-flex;
|
|
gap: var(--half-gap);
|
|
width: 100%;
|
|
}
|
|
#skills .repcontainer .repitem > button {
|
|
flex: 1 1 0;
|
|
}
|
|
#skills .repcontainer .repitem .dot-row {
|
|
flex: 1 1 auto;
|
|
gap: var(--half-gap);
|
|
}
|
|
#skills .repcontainer .repitem .dot-row > input {
|
|
width: 0;
|
|
flex: 1 1 0;
|
|
}
|
|
|
|
#attributes {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
grid-column: var(--spanSectionColumn);
|
|
grid-template-rows: repeat(4, auto);
|
|
grid-template-columns: auto repeat(3, 1fr);
|
|
gap: var(--half-gap) var(--grid-gap);
|
|
grid-template-areas: "header header header header" ". mental-head physical-head social-head" "power-head mental-power physical-power social-power " "finesse-head mental-finesse physical-finesse social-finesse " "resistance-head mental-resistance physical-resistance social-resistance ";
|
|
}
|
|
#attributes > .approach-container {
|
|
display: contents;
|
|
}
|
|
#attributes > .approach-container.power h4 {
|
|
grid-area: power-head;
|
|
}
|
|
#attributes > .approach-container.finesse h4 {
|
|
grid-area: finesse-head;
|
|
}
|
|
#attributes > .approach-container.reistance h4 {
|
|
grid-area: reistance-head;
|
|
}
|
|
#attributes > .approach-container > :nth-child(2) {
|
|
grid-column: 2;
|
|
}
|
|
#attributes > .approach-container > :nth-child(3) {
|
|
grid-column: 3;
|
|
}
|
|
#attributes > .approach-container > :nth-child(4) {
|
|
grid-column: 4;
|
|
}
|
|
#attributes .dot-row {
|
|
display: grid;
|
|
grid-template-columns: 9rem auto;
|
|
place-content: center;
|
|
}
|
|
#attributes h3[data-i18n=mental] {
|
|
grid-area: mental-head;
|
|
}
|
|
#attributes h3[data-i18n=physical] {
|
|
grid-area: physical-head;
|
|
}
|
|
#attributes h3[data-i18n=social] {
|
|
grid-area: social-head;
|
|
}
|
|
#attributes h4 {
|
|
place-self: center start;
|
|
}
|
|
|
|
#health {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-template-areas: "header header";
|
|
}
|
|
#health .input-label--button {
|
|
justify-self: center;
|
|
}
|
|
#health .repitem {
|
|
align-self: start;
|
|
display: inline-block;
|
|
margin-bottom: var(--half-gap);
|
|
}
|
|
#health .repcontainer {
|
|
display: block;
|
|
grid-column: 1/-1;
|
|
}
|
|
#health .type-control[value="taken out"] ~ .type,
|
|
#health .type-control:not([value="taken out"]) ~ .taken-out {
|
|
display: none;
|
|
}
|
|
#health .type-control[value*=short-] ~ .type > .adaptive--text {
|
|
display: none;
|
|
}
|
|
#health .taken-out {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
grid-template-columns: auto auto;
|
|
}
|
|
#health .type {
|
|
display: grid;
|
|
gap: var(--half-gap);
|
|
grid-template-columns: auto auto 1fr;
|
|
grid-template-areas: "checkbox select name" "description description description";
|
|
}
|
|
#health .repitem:last-of-type > .itemcontrol {
|
|
display: none;
|
|
}
|
|
#health .initiative-label {
|
|
grid-column: 1/-1;
|
|
justify-self: center;
|
|
}
|
|
|
|
#deeds {
|
|
gap: var(--half-gap);
|
|
}
|
|
#deeds .content,
|
|
#deeds .header {
|
|
display: contents;
|
|
}
|
|
#deeds .display-control:not([value=header]) ~ .header,
|
|
#deeds .display-control:is([value=header],
|
|
[value=loading]) ~ .content {
|
|
display: none;
|
|
}
|
|
#deeds input[type=checkbox] {
|
|
flex: 0 0 auto;
|
|
}
|
|
#deeds .repcontainer {
|
|
row-gap: var(--half-gap);
|
|
}
|
|
#deeds .repitem {
|
|
display: grid;
|
|
grid-template-columns: auto 1fr auto;
|
|
gap: var(--tiny-gap);
|
|
align-items: start;
|
|
}
|
|
#deeds .repitem input[type=checkbox] {
|
|
align-self: unset;
|
|
}
|
|
#deeds .adaptive--text {
|
|
--height:1.5rem;
|
|
}
|
|
#deeds .experience {
|
|
--inputSize:10rem;
|
|
padding: 5px;
|
|
display: grid;
|
|
grid-template-columns: repeat(3, minmax(calc(var(--inputSize) / 2), var(--inputSize)));
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: var(--half-gap);
|
|
}
|
|
#deeds .experience :first-child {
|
|
line-height: 1rem;
|
|
grid-column: 1/-1;
|
|
}
|
|
#deeds .experience .slash {
|
|
place-self: center;
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
line-height: 1rem;
|
|
}
|
|
#deeds .experience input[type=number] {
|
|
width: 100%;
|
|
}
|
|
#paths {
|
|
gap: var(--half-gap);
|
|
--masterColumns: 6rem 1fr auto;
|
|
}
|
|
#paths h5 {
|
|
place-self: center start;
|
|
}
|
|
#paths .dot-row,
|
|
#paths .dot-number {
|
|
place-self: center end;
|
|
}
|
|
#paths .short-master {
|
|
grid-template-areas: "type name status" "description description description";
|
|
}
|
|
#paths .short-master span[role=heading] {
|
|
text-align: left;
|
|
}
|
|
#paths .short-master,
|
|
#paths .master {
|
|
grid-template-columns: var(--masterColumns);
|
|
}
|
|
#paths .master {
|
|
grid-template-areas: "type name status" "skills skills skills" "description description description";
|
|
}
|
|
#paths .master .skills {
|
|
grid-area: skills;
|
|
}
|
|
#paths .short-contact {
|
|
grid-template-columns: auto repeat(2, 1fr) 2rem;
|
|
}
|
|
#paths .contact {
|
|
grid-template-columns: auto repeat(2, 1fr) auto;
|
|
grid-template-areas: "header name tag dot" "description description description description";
|
|
}
|
|
#paths .short-access,
|
|
#paths .short-group {
|
|
grid-template-columns: auto 1fr;
|
|
grid-template-areas: "header description";
|
|
}
|
|
#paths .access,
|
|
#paths .group {
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: repeat(2, auto);
|
|
grid-template-areas: "header" "description";
|
|
}
|
|
#paths .short-obligation {
|
|
grid-template-columns: auto 1fr auto;
|
|
}
|
|
#paths .obligation {
|
|
grid-template-columns: 1fr auto;
|
|
grid-template-rows: repeat(2, auto);
|
|
grid-template-areas: "header select" "description description";
|
|
}
|
|
|
|
#calling {
|
|
gap: var(--half-gap);
|
|
}
|
|
#calling .calling {
|
|
grid-template-columns: auto 1fr repeat(5, auto);
|
|
grid-template-areas: "button name dots";
|
|
}
|
|
#calling .calling .dot-button-container {
|
|
grid-area: dots;
|
|
}
|
|
#calling .calling .used {
|
|
--selectedRadio: grey;
|
|
}
|
|
#calling .calling .used .dot + .readonly-dot {
|
|
z-index: 10;
|
|
}
|
|
#calling .calling .used .dot:checked + .readonly-dot ~ .readonly-dot {
|
|
z-index: -10;
|
|
}
|
|
#calling .short-knack {
|
|
grid-template-columns: auto 1fr auto auto;
|
|
}
|
|
#calling .knack {
|
|
grid-template-columns: auto 1fr auto auto;
|
|
grid-template-areas: "enable name select roll" ". . . ." ". description description description";
|
|
}
|
|
#calling .knack .description {
|
|
grid-area: description;
|
|
}
|
|
#calling .repitem > .display-target > .clash {
|
|
grid-column: 2/-1;
|
|
}
|
|
|
|
#purview .short-master * {
|
|
text-align: left;
|
|
}
|
|
#purview .boon,
|
|
#purview .short-boon {
|
|
grid-template-columns: repeat(2, 1fr);
|
|
}
|
|
#purview .boon .name,
|
|
#purview .short-boon .name {
|
|
text-align: left;
|
|
}
|
|
|
|
#birthrights {
|
|
--startRow:
|
|
"header header header"
|
|
"name name rating" ;
|
|
}
|
|
#birthrights .repitem:not(:last-child) {
|
|
margin-bottom: var(--half-gap);
|
|
}
|
|
#birthrights .display-target {
|
|
grid-template-areas: var(--startRow);
|
|
}
|
|
#birthrights .display-target:not([class*=short]) {
|
|
grid-template-columns: 2fr repeat(2, 1fr);
|
|
}
|
|
#birthrights .display-target[class*=short] {
|
|
grid-template-columns: 1fr 1fr 2rem;
|
|
}
|
|
#birthrights .display-target[class*=short] .input-label:nth-child(odd) {
|
|
grid-column: span 2;
|
|
}
|
|
#birthrights .display-target .detail-container {
|
|
grid-column: 1/-1;
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
gap: var(--half-gap);
|
|
}
|
|
#birthrights .display-target .name {
|
|
grid-area: name;
|
|
}
|
|
#birthrights .display-target .rating {
|
|
grid-area: rating;
|
|
}
|
|
#birthrights .display-target > h5 {
|
|
grid-column: 1/-1;
|
|
place-self: center start;
|
|
}
|
|
#birthrights .expanded-control[value=relic] + .display-target .relic {
|
|
display: flex;
|
|
}
|
|
#birthrights .expanded-control[value=guide] + .display-target .guide {
|
|
display: flex;
|
|
}
|
|
#birthrights .expanded-control[value=creature] + .display-target .creature {
|
|
display: flex;
|
|
}
|
|
#birthrights .expanded-control[value=follower] + .display-target .follower {
|
|
display: flex;
|
|
}
|
|
#birthrights *[role=heading] {
|
|
place-self: center start;
|
|
}
|
|
#birthrights .repcontainer:not(:empty) ~ .add-container {
|
|
margin-top: -14px;
|
|
background-image: var(--image-marble-right), var(--image-marble-left), var(--image-marble-bottom);
|
|
background-repeat: repeat-y, repeat-y, no-repeat;
|
|
background-position: top right var(--offset), top left var(--offset), bottom var(--offset) left;
|
|
background-size: var(--short-side) max(981px, 100%), var(--short-side) max(981px, 100%), max(1500px, 100%) var(--short-side);
|
|
clip-path: var(--bottomNotch);
|
|
}
|
|
#birthrights .repcontainer .repitem:last-child .image-border {
|
|
clip-path: var(--topNotch);
|
|
background-image: var(--image-marble-top), var(--image-marble-right), var(--image-marble-left);
|
|
background-repeat: no-repeat, repeat-y, repeat-y;
|
|
background-position: top var(--offset) left, top right var(--offset), top left var(--offset);
|
|
background-size: max(1500px, 100%) var(--short-side), var(--short-side) max(981px, 100%), var(--short-side) max(981px, 100%);
|
|
}
|
|
#birthrights .repcontrol-button.repcontrol-button--add {
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
#equipment .display-control[value*=short] + .image-border {
|
|
display: none;
|
|
}
|
|
#equipment .repcontainer {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
|
|
gap: var(--tiny-gap) var(--grid-gap);
|
|
}
|
|
#equipment .repitem {
|
|
align-self: start;
|
|
display: inline-grid;
|
|
width: 100%;
|
|
margin-bottom: var(--half-gap);
|
|
box-sizing: border-box;
|
|
}
|
|
#equipment .display-target {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
#equipment .display-target span {
|
|
min-height: 1rem;
|
|
}
|
|
#equipment .display-target > span:first-of-type {
|
|
place-self: end start;
|
|
}
|
|
#equipment .display-target > span:not(:first-of-type) {
|
|
place-self: end end;
|
|
}
|
|
#equipment .display-target.short-equipment {
|
|
border-bottom: 1px solid black;
|
|
}
|
|
#equipment .display-target.short-equipment > * {
|
|
align-self: start;
|
|
}
|
|
#equipment .detail-container {
|
|
grid-column: 1/-1;
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
gap: var(--half-gap);
|
|
}
|
|
#equipment .name {
|
|
grid-area: name;
|
|
}
|
|
#equipment .rating {
|
|
grid-area: rating;
|
|
}
|
|
#equipment > h5 {
|
|
grid-column: 1/-1;
|
|
place-self: center start;
|
|
}
|
|
#equipment .marvels, #equipment .special {
|
|
grid-column: 1/-1;
|
|
}
|
|
#equipment .marvels .adaptive, #equipment .special .adaptive {
|
|
flex: 1 auto;
|
|
}
|
|
|
|
.expanded-control[value=boon] + .display-target .boon {
|
|
display: flex;
|
|
}
|
|
|
|
.expanded-control[value=marvel] + .display-target .marvel {
|
|
display: flex;
|
|
}
|
|
|
|
.expanded-control[value=special] + .display-target .special {
|
|
display: flex;
|
|
}
|
|
|
|
.expanded-control[value=scale] + .display-target .scale {
|
|
display: flex;
|
|
}
|
|
|
|
#notes {
|
|
grid-column-end: -1;
|
|
grid-template-areas: "header" "content";
|
|
}
|
|
#notes .adaptive--text {
|
|
grid-column: 1/-1;
|
|
}
|
|
|
|
#move-defense {
|
|
place-content: start center;
|
|
grid-template-columns: auto 3em;
|
|
}
|
|
#move-defense :not(input) {
|
|
justify-self: start;
|
|
}
|
|
|
|
#collateral {
|
|
--buttonSize:30px;
|
|
display: grid;
|
|
grid-template-columns: 1fr var(--buttonSize) auto var(--buttonSize) 1fr;
|
|
row-gap: var(--half-gap);
|
|
grid-template-areas: "header header header header header" ". . fill button .";
|
|
}
|
|
#collateral h2 {
|
|
grid-area: header;
|
|
}
|
|
#collateral .dot-row {
|
|
grid-area: fill;
|
|
}
|
|
#collateral button {
|
|
grid-area: button;
|
|
justify-items: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-storypath {
|
|
--templateRadius: 1rem;
|
|
--dieSize: 50px;
|
|
--templateBorderW: 2px 5px 2px 5px;
|
|
--fumbleColor: red;
|
|
--critColor: green;
|
|
--innerBorderRadius: 5px;
|
|
--borderSize:1px;
|
|
font-size: 13px;
|
|
margin-left: -40px;
|
|
margin-right: -5px;
|
|
filter: drop-shadow(var(--borderSize) 0 black) drop-shadow(calc(var(--borderSize) * -1) 0 black);
|
|
}
|
|
.sheet-rolltemplate-storypath:not(:first-child) {
|
|
margin-top: 10px;
|
|
}
|
|
.sheet-rolltemplate-storypath:not(:first-child):has(.sheet-continuation) {
|
|
margin-top: -33px;
|
|
}
|
|
.sheet-rolltemplate-storypath:first-child .sheet-continuation {
|
|
margin-top: -9px;
|
|
}
|
|
.sheet-rolltemplate-storypath span {
|
|
font-size: 1em;
|
|
}
|
|
.sheet-rolltemplate-storypath h3 {
|
|
font-size: 1.75em;
|
|
}
|
|
.sheet-rolltemplate-storypath h4 {
|
|
font-size: 1.5em;
|
|
}
|
|
.sheet-rolltemplate-storypath h5 {
|
|
font-size: 1em;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template {
|
|
overflow: hidden;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template:before,
|
|
.sheet-rolltemplate-storypath > .sheet-template > .sheet-upper-blur,
|
|
.sheet-rolltemplate-storypath > .sheet-template > .sheet-lower-blur {
|
|
z-index: -1;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation .sheet-results {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: end;
|
|
gap: var(--half-gap);
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child:before,
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child > .sheet-upper-blur,
|
|
.sheet-rolltemplate-storypath > .sheet-template.sheet-continuation:first-child > .sheet-lower-blur {
|
|
z-index: 0;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template .inlinerollresult {
|
|
position: relative;
|
|
font-size: 1.5em;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template .inlinerollresult[title*="[computed value]"], .sheet-rolltemplate-storypath > .sheet-template .inlinerollresult[original-title*="[computed value]"] {
|
|
pointer-events: none;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template .inlinerollresult, .sheet-rolltemplate-storypath > .sheet-template .inlinerollresult.fullcrit, .sheet-rolltemplate-storypath > .sheet-template .inlinerollresult.fullfail, .sheet-rolltemplate-storypath > .sheet-template .inlinerollresult.importantroll {
|
|
border: none;
|
|
background-color: transparent;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template .inlinerollresult.fullcrit {
|
|
color: green;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template .inlinerollresult.fullfail {
|
|
color: red;
|
|
}
|
|
.sheet-rolltemplate-storypath > .sheet-template .inlinerollresult.importantroll {
|
|
color: blue;
|
|
}
|
|
.sheet-rolltemplate-storypath .sheet-header {
|
|
padding: 5px;
|
|
display: grid;
|
|
grid-template-columns: 1fr 2rem 1fr;
|
|
gap: var(--half-gap);
|
|
}
|
|
.sheet-rolltemplate-storypath .sheet-header .sheet-character_name {
|
|
grid-column: 1/-1;
|
|
place-self: center end;
|
|
}
|
|
.sheet-rolltemplate-storypath .sheet-header .sheet-title {
|
|
grid-column: 1/-1;
|
|
place-self: center;
|
|
}
|
|
.sheet-rolltemplate-storypath .sheet-template-row {
|
|
padding: 5px;
|
|
grid-template-columns: minmax(6em, 1fr) repeat(auto-fit, minmax(1rem, 1fr));
|
|
place-items: center;
|
|
}
|
|
.sheet-rolltemplate-storypath .sheet-template-row:nth-child(odd) {
|
|
background-color: lightgrey;
|
|
}
|
|
.sheet-rolltemplate-storypath .sheet-template-row > *:first-child {
|
|
place-self: center start;
|
|
} |