mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 11:42:29 +00:00
fredhicks
e8726d6890
Bug fixed in CSS (paragraph styling reached outside the sheet itself and caused issues). Support for Final Mystery Moves added. Minor text alterations done to more closely match the edited text of the core game.
1223 lines
42 KiB
CSS
1223 lines
42 KiB
CSS
@import url("https://fonts.googleapis.com/css2?family=Amatic+SC:wght@400;700&display=swap");
|
|
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,1,0");
|
|
@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,400;0,700;1,400;1,700&display=swap");
|
|
:root, .sheet-rolltemplate-2d6-roll, .sheet-rolltemplate-bondspend {
|
|
--ak-fg: black;
|
|
--ak-bg: white;
|
|
--ak-pink: #82174a;
|
|
--ak-alert: #046466;
|
|
font-family: Nunito, sans-serif;
|
|
}
|
|
|
|
.sheet-darkmode, .sheet-rolltemplate-darkmode {
|
|
--ak-fg: white;
|
|
--ak-bg: #1f1f1f;
|
|
--ak-darkpink: #ac1d4a;
|
|
--ak-mediumpink: #da255e;
|
|
--ak-lightpink: #e5668e;
|
|
--ak-pink: #bd66e5;
|
|
--ak-alert: #08c1c4;
|
|
}
|
|
.sheet-darkmode .ui-dialog .charsheet .doomclock, .sheet-rolltemplate-darkmode .ui-dialog .charsheet .doomclock {
|
|
background-image: url(https://raw.githubusercontent.com/fredhicks/ehp-roll20/master/art/alldoom-darkmode.svg);
|
|
}
|
|
|
|
.wrapper p,
|
|
.ui-dialog .charsheet {
|
|
font-family: Nunito, sans-serif;
|
|
font-size: 16px;
|
|
color: var(--ak-fg) !important;
|
|
background-color: var(--ak-bg);
|
|
line-height: unset;
|
|
}
|
|
|
|
.menu {
|
|
position: fixed;
|
|
width: calc(100% - 40px);
|
|
bottom: 0;
|
|
background-color: var(--ak-bg);
|
|
border-top: 1px solid var(--ak-pink);
|
|
margin-left: -30px;
|
|
padding-left: 30px;
|
|
margin-right: -12px;
|
|
margin-bottom: 0px;
|
|
padding-bottom: 10px;
|
|
padding-top: 12px;
|
|
-webkit-box-shadow: 0px -10px 8px var(--ak-bg);
|
|
box-shadow: 0px -10px 8px var(--ak-bg);
|
|
z-index: 5;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.sheet-darkmode .menu {
|
|
padding-bottom: 0px;
|
|
}
|
|
|
|
.largedialog textarea {
|
|
width: calc(100% - 12px);
|
|
}
|
|
.largedialog .charsheet textarea.bio {
|
|
height: 80px;
|
|
}
|
|
.largedialog .charsheet textarea.notes {
|
|
font-size: 16px;
|
|
height: 200px;
|
|
}
|
|
|
|
.ui-dialog .charsheet .wrapper {
|
|
padding-bottom: 60px;
|
|
margin-top: -10px;
|
|
}
|
|
|
|
.sheet-darkmode .ui-dialog .charsheet .wrapper {
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.rightwards {
|
|
text-align: right;
|
|
}
|
|
|
|
.ui-dialog .charsheet ul {
|
|
list-style: none;
|
|
}
|
|
.ui-dialog .charsheet ul li::before {
|
|
font-family: Pictos Custom;
|
|
content: "t ";
|
|
width: 21px;
|
|
margin-left: -21px;
|
|
color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet p + ul {
|
|
margin-top: -9px;
|
|
}
|
|
.ui-dialog .charsheet input, .ui-dialog .charsheet select, .ui-dialog .charsheet textarea {
|
|
color: var(--ak-fg);
|
|
background-color: var(--ak-bg);
|
|
}
|
|
.ui-dialog .charsheet textarea {
|
|
border-color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet a, .ui-dialog .charsheet a.icon {
|
|
text-decoration: none;
|
|
color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet a.fglink {
|
|
color: var(--ak-fg);
|
|
}
|
|
.ui-dialog .charsheet a:hover, .ui-dialog .charsheet a.icon:hover {
|
|
color: var(--ak-fg);
|
|
}
|
|
.ui-dialog .charsheet .colorized {
|
|
color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet .dicespace {
|
|
width: 28px;
|
|
display: inline-block;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll]:hover, .ui-dialog .charsheet button[type=roll].hfade:hover:before, .ui-dialog .charsheet button[type=roll].colorized:hover:before, .ui-dialog .charsheet button[type=roll].colorized:hover, .ui-dialog .charsheet button[type=action]:hover, .ui-dialog .charsheet button[type=action].hfade:hover:before, .ui-dialog .charsheet button[type=action].colorized:hover:before, .ui-dialog .charsheet button[type=action].colorized:hover, .ui-dialog .charsheet a:hover, .ui-dialog .charsheet a.hfade:hover:before, .ui-dialog .charsheet a.colorized:hover:before, .ui-dialog .charsheet a.colorized:hover, .ui-dialog .charsheet a.icon:hover, .ui-dialog .charsheet a.icon.hfade:hover:before, .ui-dialog .charsheet a.icon.colorized:hover:before, .ui-dialog .charsheet a.icon.colorized:hover {
|
|
color: var(--ak-fg);
|
|
background-color: var(--ak-bg);
|
|
text-shadow: 1px 1px var(--ak-bg), -1px 1px var(--ak-bg), 1px -1px var(--ak-bg), -1px -1px var(--ak-bg), 0 0 2px var(--ak-fg), 0 0 6px var(--ak-fg);
|
|
}
|
|
.ui-dialog .charsheet button[type=roll]:active, .ui-dialog .charsheet button[type=roll].hfade:active:before, .ui-dialog .charsheet button[type=roll].colorized:active:before, .ui-dialog .charsheet button[type=roll].colorized:active, .ui-dialog .charsheet button[type=action]:active, .ui-dialog .charsheet button[type=action].hfade:active:before, .ui-dialog .charsheet button[type=action].colorized:active:before, .ui-dialog .charsheet button[type=action].colorized:active, .ui-dialog .charsheet a:active, .ui-dialog .charsheet a.hfade:active:before, .ui-dialog .charsheet a.colorized:active:before, .ui-dialog .charsheet a.colorized:active, .ui-dialog .charsheet a.icon:active, .ui-dialog .charsheet a.icon.hfade:active:before, .ui-dialog .charsheet a.icon.colorized:active:before, .ui-dialog .charsheet a.icon.colorized:active {
|
|
color: var(--ak-bg);
|
|
text-shadow: 1px 1px var(--ak-fg), -1px 1px var(--ak-fg), 1px -1px var(--ak-fg), -1px -1px var(--ak-fg), 0 0 2px var(--ak-fg), 0 0 6px var(--ak-fg);
|
|
}
|
|
.ui-dialog .charsheet button[type=roll], .ui-dialog .charsheet button[type=action], .ui-dialog .charsheet .icon {
|
|
padding: 0px;
|
|
font-size: 100%;
|
|
margin: 0px 0px 0px 0px;
|
|
line-height: unset;
|
|
border: unset;
|
|
background: unset;
|
|
color: unset;
|
|
text-shadow: unset;
|
|
border-radius: unset;
|
|
-webkit-box-shadow: unset;
|
|
box-shadow: unset;
|
|
vertical-align: unset;
|
|
/* &.counterclockwise
|
|
* transform: scale(-1,1) */
|
|
}
|
|
.ui-dialog .charsheet button[type=roll]:before, .ui-dialog .charsheet button[type=action]:before, .ui-dialog .charsheet .icon:before {
|
|
content: "";
|
|
font-family: "Pictos";
|
|
vertical-align: 0px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].hfade, .ui-dialog .charsheet button[type=roll].hfade:before, .ui-dialog .charsheet button[type=roll].colorized, .ui-dialog .charsheet button[type=roll].colorized:before, .ui-dialog .charsheet button[type=action].hfade, .ui-dialog .charsheet button[type=action].hfade:before, .ui-dialog .charsheet button[type=action].colorized, .ui-dialog .charsheet button[type=action].colorized:before, .ui-dialog .charsheet .icon.hfade, .ui-dialog .charsheet .icon.hfade:before, .ui-dialog .charsheet .icon.colorized, .ui-dialog .charsheet .icon.colorized:before {
|
|
color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].hfade:before, .ui-dialog .charsheet button[type=action].hfade:before, .ui-dialog .charsheet .icon.hfade:before {
|
|
font-size: 80%;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].expand:before, .ui-dialog .charsheet button[type=action].expand:before, .ui-dialog .charsheet .icon.expand:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "expand";
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].contract:before, .ui-dialog .charsheet button[type=action].contract:before, .ui-dialog .charsheet .icon.contract:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "compress";
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].contract.hfade:before, .ui-dialog .charsheet button[type=action].contract.hfade:before, .ui-dialog .charsheet .icon.contract.hfade:before {
|
|
vertical-align: -4px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].expand.hfade:before, .ui-dialog .charsheet button[type=action].expand.hfade:before, .ui-dialog .charsheet .icon.expand.hfade:before {
|
|
vertical-align: -4px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].view:before, .ui-dialog .charsheet button[type=action].view:before, .ui-dialog .charsheet .icon.view:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "visibility";
|
|
vertical-align: -3px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].dismiss:before, .ui-dialog .charsheet button[type=action].dismiss:before, .ui-dialog .charsheet .icon.dismiss:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "visibility_off";
|
|
vertical-align: -3px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].edit:before, .ui-dialog .charsheet button[type=action].edit:before, .ui-dialog .charsheet .icon.edit:before {
|
|
content: "p";
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].uparrow:before, .ui-dialog .charsheet button[type=action].uparrow:before, .ui-dialog .charsheet .icon.uparrow:before {
|
|
content: "{";
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].downarrow:before, .ui-dialog .charsheet button[type=action].downarrow:before, .ui-dialog .charsheet .icon.downarrow:before {
|
|
content: "}";
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].locked:before, .ui-dialog .charsheet button[type=action].locked:before, .ui-dialog .charsheet .icon.locked:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "lock";
|
|
font-size: 110%;
|
|
vertical-align: -4px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].unlocked:before, .ui-dialog .charsheet button[type=action].unlocked:before, .ui-dialog .charsheet .icon.unlocked:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "no_encryption";
|
|
font-size: 110%;
|
|
vertical-align: -4px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].dice:before, .ui-dialog .charsheet button[type=action].dice:before, .ui-dialog .charsheet .icon.dice:before {
|
|
content: "FA";
|
|
font-family: "dicefontd6";
|
|
vertical-align: -1px;
|
|
font-size: 110%;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].checked:before, .ui-dialog .charsheet button[type=action].checked:before, .ui-dialog .charsheet .icon.checked:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "check_box";
|
|
font-size: 110%;
|
|
vertical-align: -4px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].checked.hfade:before, .ui-dialog .charsheet button[type=action].checked.hfade:before, .ui-dialog .charsheet .icon.checked.hfade:before {
|
|
font-size: 80%;
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].unchecked:before, .ui-dialog .charsheet button[type=action].unchecked:before, .ui-dialog .charsheet .icon.unchecked:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "check_box_outline_blank";
|
|
font-size: 110%;
|
|
vertical-align: -4px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].unchecked.hfade:before, .ui-dialog .charsheet button[type=action].unchecked.hfade:before, .ui-dialog .charsheet .icon.unchecked.hfade:before {
|
|
font-size: 80%;
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].bothchecks:before, .ui-dialog .charsheet button[type=action].bothchecks:before, .ui-dialog .charsheet .icon.bothchecks:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "check_box_outline_blankcheck_box";
|
|
font-size: 110%;
|
|
vertical-align: -4px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].bothchecks.hfade:before, .ui-dialog .charsheet button[type=action].bothchecks.hfade:before, .ui-dialog .charsheet .icon.bothchecks.hfade:before {
|
|
font-size: 80%;
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].checked.tightright:before, .ui-dialog .charsheet button[type=roll].unchecked.tightright:before, .ui-dialog .charsheet button[type=roll].bothchecks.tightright:before, .ui-dialog .charsheet button[type=action].checked.tightright:before, .ui-dialog .charsheet button[type=action].unchecked.tightright:before, .ui-dialog .charsheet button[type=action].bothchecks.tightright:before, .ui-dialog .charsheet .icon.checked.tightright:before, .ui-dialog .charsheet .icon.unchecked.tightright:before, .ui-dialog .charsheet .icon.bothchecks.tightright:before {
|
|
margin-right: -4px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].vexpand:before, .ui-dialog .charsheet button[type=action].vexpand:before, .ui-dialog .charsheet .icon.vexpand:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "last_page";
|
|
font-size: 30px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].vcontract:before, .ui-dialog .charsheet button[type=action].vcontract:before, .ui-dialog .charsheet .icon.vcontract:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "first_page";
|
|
font-size: 30px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].rarrow:before, .ui-dialog .charsheet button[type=action].rarrow:before, .ui-dialog .charsheet .icon.rarrow:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "arrow_forward";
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].document:before, .ui-dialog .charsheet button[type=action].document:before, .ui-dialog .charsheet .icon.document:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "density_small";
|
|
font-style: normal;
|
|
vertical-align: -3px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].clockwise:before, .ui-dialog .charsheet button[type=action].clockwise:before, .ui-dialog .charsheet .icon.clockwise:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "add_circle";
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].counterclockwise:before, .ui-dialog .charsheet button[type=action].counterclockwise:before, .ui-dialog .charsheet .icon.counterclockwise:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "do_not_disturb_on";
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].enact:before, .ui-dialog .charsheet button[type=action].enact:before, .ui-dialog .charsheet .icon.enact:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "clear_day";
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].warning:before, .ui-dialog .charsheet button[type=action].warning:before, .ui-dialog .charsheet .icon.warning:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "warning";
|
|
color: var(--ak-pink);
|
|
vertical-align: -2px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].star:before, .ui-dialog .charsheet button[type=action].star:before, .ui-dialog .charsheet .icon.star:before {
|
|
font-family: "Material Symbols Outlined";
|
|
content: "star";
|
|
color: var(--ak-pink);
|
|
vertical-align: -1px;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll].alert:before, .ui-dialog .charsheet button[type=action].alert:before, .ui-dialog .charsheet .icon.alert:before {
|
|
color: var(--ak-alert);
|
|
}
|
|
.ui-dialog .charsheet .titlebar button {
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .charsheet .titlebar button:hover {
|
|
width: 100%;
|
|
background: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet input[type=text], .ui-dialog .charsheet input[type=number], .ui-dialog .charsheet select {
|
|
border: none;
|
|
border-bottom: 1px solid var(--ak-bg);
|
|
font-size: 18px;
|
|
}
|
|
.ui-dialog .charsheet input[type=text]:hover, .ui-dialog .charsheet input[type=number]:hover, .ui-dialog .charsheet select:hover {
|
|
border-bottom: 1px solid var(--ak-fg);
|
|
}
|
|
.ui-dialog .charsheet input.fillme {
|
|
border-bottom: 1px solid var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet input.bigname {
|
|
font-family: "Amatic SC", sans-serif;
|
|
font-size: 36px;
|
|
line-height: 36px;
|
|
font-weight: 700;
|
|
padding-left: 0px;
|
|
color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet input.view[value="1"] ~ .viewable {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet input.view ~ .viewable {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet input.nullview[value="0"] ~ .viewable {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet input.nullview ~ .viewable {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet input.antiview[value="0"] ~ .viewable {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet input.antiview ~ .viewable {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .columns, .ui-dialog .charsheet .topline {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
}
|
|
.ui-dialog .charsheet .topline input[type=text] {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
}
|
|
.ui-dialog .charsheet .divlinetop {
|
|
margin-top: 6px;
|
|
margin-left: -6px;
|
|
margin-right: -6px;
|
|
padding-top: 3px;
|
|
border-top: 1px solid var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet .columns .wide {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
max-width: 100%;
|
|
}
|
|
.ui-dialog .charsheet .columns .middling {
|
|
margin-right: 18px;
|
|
width: 40%;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
}
|
|
.ui-dialog .charsheet .columns .narrow {
|
|
margin-right: 18px;
|
|
width: 25%;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
}
|
|
.ui-dialog .charsheet .columns .narrow select {
|
|
width: 100%;
|
|
height: 40px;
|
|
}
|
|
.ui-dialog .charsheet .columns .sidetab {
|
|
width: 30px;
|
|
padding-top: 6px;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
}
|
|
.ui-dialog .charsheet .header, .ui-dialog .charsheet .subheader {
|
|
margin-top: 12px;
|
|
font-family: "Amatic SC", sans-serif;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-webkit-box-align: start;
|
|
-ms-flex-align: start;
|
|
align-items: flex-start;
|
|
}
|
|
.ui-dialog .charsheet .header .title, .ui-dialog .charsheet .subheader .title {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
}
|
|
.ui-dialog .charsheet .header {
|
|
font-size: 36px;
|
|
line-height: 36px;
|
|
font-weight: 700;
|
|
color: var(--ak-fg);
|
|
border-bottom: 0.5px solid var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet .header.fixed {
|
|
margin-top: 16px;
|
|
}
|
|
.ui-dialog .charsheet .subheader {
|
|
font-size: 30px;
|
|
line-height: 30px;
|
|
font-weight: 400;
|
|
color: var(--ak-fg);
|
|
}
|
|
.ui-dialog .charsheet .move, .ui-dialog .charsheet .bond, .ui-dialog .charsheet .checklist1box, .ui-dialog .charsheet .checklist2box, .ui-dialog .charsheet .striker {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
}
|
|
.ui-dialog .charsheet .striker .text {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
}
|
|
.ui-dialog .charsheet .striker .text .stricken + span {
|
|
text-decoration: none;
|
|
}
|
|
.ui-dialog .charsheet .striker .text .stricken[value="1"] + span {
|
|
text-decoration: line-through;
|
|
}
|
|
.ui-dialog .charsheet .bond {
|
|
margin-top: 10px;
|
|
}
|
|
.ui-dialog .charsheet .bond input[type=number] {
|
|
font-size: 16px;
|
|
width: 50px;
|
|
height: 18px;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
text-align: right;
|
|
border-bottom: 1px solid var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet .bond input[type=text] {
|
|
font-size: 16px;
|
|
height: 18px;
|
|
-ms-flex-negative: 1;
|
|
flex-shrink: 1;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
width: 100%;
|
|
border-bottom: 1px solid var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet .bondzone .btn {
|
|
color: var(--ak-pink);
|
|
background: var(--ak-bg);
|
|
border-color: var(--ak-pink);
|
|
margin-top: 6px;
|
|
text-shadow: unset;
|
|
}
|
|
.ui-dialog .charsheet .bondzone .btn:hover {
|
|
color: var(--ak-fg);
|
|
border-color: var(--ak-fg);
|
|
background-color: var(--ak-bg);
|
|
text-shadow: 1px 1px var(--ak-bg), -1px 1px var(--ak-bg), 1px -1px var(--ak-bg), -1px -1px var(--ak-bg), 0 0 2px var(--ak-fg), 0 0 6px var(--ak-fg);
|
|
opacity: 1;
|
|
}
|
|
.ui-dialog .charsheet .bondzone .btn:active {
|
|
color: var(--ak-bg);
|
|
border-color: var(--ak-fg);
|
|
text-shadow: 1px 1px var(--ak-fg), -1px 1px var(--ak-fg), 1px -1px var(--ak-fg), -1px -1px var(--ak-fg), 0 0 2px var(--ak-fg), 0 0 6px var(--ak-fg);
|
|
}
|
|
.ui-dialog .charsheet .bondspend {
|
|
text-align: left;
|
|
}
|
|
.ui-dialog .charsheet .bondspend .spendline {
|
|
height: 24px;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
max-width: 300px;
|
|
}
|
|
.ui-dialog .charsheet .bondspend .spendline input[type=number] {
|
|
height: 21px;
|
|
font-size: 16px;
|
|
width: 50px;
|
|
border-bottom: 1px solid var(--ak-pink);
|
|
text-align: right;
|
|
}
|
|
.ui-dialog .charsheet .bondspend .btn {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .checklist1box .buttons, .ui-dialog .charsheet .checklist2box .buttons, .ui-dialog .charsheet .striker .buttons {
|
|
white-space: nowrap;
|
|
padding-right: 6px;
|
|
height: 24px;
|
|
text-align: right;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
}
|
|
.ui-dialog .charsheet .checklist1box .buttons, .ui-dialog .charsheet .striker .buttons {
|
|
width: 18px;
|
|
}
|
|
.ui-dialog .charsheet .checklist2box .buttons {
|
|
width: 36px;
|
|
}
|
|
.ui-dialog .charsheet .move .buttons {
|
|
white-space: nowrap;
|
|
padding-right: 6px;
|
|
width: 36px;
|
|
height: 24px;
|
|
text-align: right;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
}
|
|
.ui-dialog .charsheet input.checksonly ~ div input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet input.checksonly[value="1"] ~ div input.checker[value="0"] + .move {
|
|
display: none !important;
|
|
}
|
|
.ui-dialog .charsheet .movemark {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .moveselector + .movemark + div input.checker + .move {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .moveselector + .movemark[value="1"] + div input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet .moveselector[value=summoned] + .movemark + div.pbsummoned input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet .moveselector[value=surge] + .movemark + div.pbsurge input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet .moveselector[value=found] + .movemark + div.pbfound input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet .moveselector[value=shade] + .movemark + div.pbshade input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet .moveselector[value=last] + .movemark + div.pblast input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet .moveselector[value=fallen] + .movemark + div.pbfallen input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet .moveselector[value=hungry] + .movemark + div.pbhungry input.checker + .move {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet .pbid {
|
|
font-size: 80%;
|
|
line-height: 80%;
|
|
font-style: italic;
|
|
}
|
|
.ui-dialog .charsheet .pbselector ~ .pbsummoned {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbselector ~ .pbsurge {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbselector ~ .pbfound {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbselector ~ .pbshade {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbselector ~ .pblast {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbselector ~ .pbfallen {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbselector ~ .pbhungry {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbselector[value=summoned] ~ .pbsummoned {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbselector[value=surge] ~ .pbsurge {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbselector[value=found] ~ .pbfound {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbselector[value=shade] ~ .pbshade {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbselector[value=last] ~ .pblast {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbselector[value=fallen] ~ .pbfallen {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbselector[value=hungry] ~ .pbhungry {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector ~ .pbsummoned {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector ~ .pbsurge {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector ~ .pbfound {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector ~ .pbshade {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector ~ .pblast {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector ~ .pbfallen {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector ~ .pbhungry {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector[value=summoned] ~ .pbsummoned {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector[value=surge] ~ .pbsurge {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector[value=found] ~ .pbfound {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector[value=shade] ~ .pbshade {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector[value=last] ~ .pblast {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector[value=fallen] ~ .pbfallen {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .pbunselector[value=hungry] ~ .pbhungry {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .rollup ~ .roller {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .rollup[value="0"] ~ .roller {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .rollup[value="1"] ~ .roller {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .toggle + * + *, .ui-dialog .charsheet .toggle + * {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .toggle[value="0"] + * + * {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .toggle[value="1"] + * {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .trigger, .ui-dialog .charsheet .term, .ui-dialog .charsheet .bold {
|
|
font-weight: bold;
|
|
}
|
|
.ui-dialog .charsheet .italic {
|
|
font-style: italic;
|
|
}
|
|
.ui-dialog .charsheet .trigger, .ui-dialog .charsheet .term {
|
|
color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet .movename {
|
|
font-weight: bold;
|
|
font-variant: small-caps;
|
|
}
|
|
.ui-dialog .charsheet .spaceunder {
|
|
margin-bottom: 3px;
|
|
}
|
|
.ui-dialog .charsheet .result {
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
font-size: 90%;
|
|
color: white;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
background-color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet input.tokens {
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 300%;
|
|
font-weight: bold;
|
|
}
|
|
.ui-dialog .charsheet .minihead {
|
|
margin-top: 6px;
|
|
text-transform: uppercase;
|
|
font-weight: bold;
|
|
}
|
|
.ui-dialog .charsheet .instruction {
|
|
font-size: 90%;
|
|
font-style: italic;
|
|
margin-bottom: 3px;
|
|
color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet .conditions .checklist1box .conditiontext, .ui-dialog .charsheet .conditions .checklist2box .conditiontext {
|
|
text-transform: capitalize;
|
|
font-size: 16px;
|
|
}
|
|
.ui-dialog .charsheet .conditions .checklist1box .conditiontext input[type=text], .ui-dialog .charsheet .conditions .checklist2box .conditiontext input[type=text] {
|
|
font-size: 16px;
|
|
height: 18px;
|
|
border-bottom: 1px solid var(--ak-pink);
|
|
width: 100%;
|
|
}
|
|
.ui-dialog .charsheet .conditions .checklist1box .buttons .unlocked {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet .conditions .checklist1box:hover .buttons input.toggle[value="0"] ~ .unlocked {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet .conditiontext {
|
|
text-transform: capitalize;
|
|
}
|
|
.ui-dialog .charsheet input.hidecheckboxesnotnull[value=""] ~ div input.masker + .checklist1box, .ui-dialog .charsheet input.hidecheckboxesnotnull[value=""] ~ div input.masker + .checklist2box {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui-dialog .charsheet input.hidecheckboxesnotnull:not([value=""]) ~ div input.masker[value="0"] + .checklist1box, .ui-dialog .charsheet input.hidecheckboxesnotnull:not([value=""]) ~ div input.masker[value="0"] + .checklist2box {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet input.hideempty[value=""] + * {
|
|
display: none;
|
|
}
|
|
.ui-dialog .charsheet input.hideempty + * {
|
|
display: initial;
|
|
}
|
|
.ui-dialog .charsheet input.colorizewhenactive[value="1"] + .tokens {
|
|
color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet button.topspace {
|
|
margin-top: 6px;
|
|
}
|
|
.ui-dialog .charsheet .doomclock {
|
|
display: inline-block;
|
|
min-height: 160px;
|
|
min-width: 160px;
|
|
height: 160px;
|
|
width: 160px;
|
|
margin-bottom: 0px;
|
|
background-image: url(https://raw.githubusercontent.com/fredhicks/ehp-roll20/master/art/alldoom.svg);
|
|
background-repeat: no-repeat;
|
|
background-size: 2080px 960px;
|
|
background-clip: padding-box;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="2"] + input.clocksegment[value="0"] + .doomclock {
|
|
background-position: top 0px left 0px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="2"] + input.clocksegment[value="1"] + .doomclock {
|
|
background-position: top 0px left -160px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="2"] + input.clocksegment[value="2"] + .doomclock {
|
|
background-position: top 0px left -320px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="4"] + input.clocksegment[value="0"] + .doomclock {
|
|
background-position: top -160px left 0px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="4"] + input.clocksegment[value="1"] + .doomclock {
|
|
background-position: top -160px left -160px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="4"] + input.clocksegment[value="2"] + .doomclock {
|
|
background-position: top -160px left -320px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="4"] + input.clocksegment[value="3"] + .doomclock {
|
|
background-position: top -160px left -480px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="4"] + input.clocksegment[value="4"] + .doomclock {
|
|
background-position: top -160px left -640px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="6"] + input.clocksegment[value="0"] + .doomclock {
|
|
background-position: top -320px left 0px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="6"] + input.clocksegment[value="1"] + .doomclock {
|
|
background-position: top -320px left -160px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="6"] + input.clocksegment[value="2"] + .doomclock {
|
|
background-position: top -320px left -320px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="6"] + input.clocksegment[value="3"] + .doomclock {
|
|
background-position: top -320px left -480px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="6"] + input.clocksegment[value="4"] + .doomclock {
|
|
background-position: top -320px left -640px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="6"] + input.clocksegment[value="5"] + .doomclock {
|
|
background-position: top -320px left -800px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="6"] + input.clocksegment[value="6"] + .doomclock {
|
|
background-position: top -320px left -960px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="0"] + .doomclock {
|
|
background-position: top -480px left 0px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="1"] + .doomclock {
|
|
background-position: top -480px left -160px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="2"] + .doomclock {
|
|
background-position: top -480px left -320px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="3"] + .doomclock {
|
|
background-position: top -480px left -480px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="4"] + .doomclock {
|
|
background-position: top -480px left -640px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="5"] + .doomclock {
|
|
background-position: top -480px left -800px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="6"] + .doomclock {
|
|
background-position: top -480px left -960px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="7"] + .doomclock {
|
|
background-position: top -480px left -1120px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="8"] + input.clocksegment[value="8"] + .doomclock {
|
|
background-position: top -480px left -1280px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="0"] + .doomclock {
|
|
background-position: top -640px left 0px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="1"] + .doomclock {
|
|
background-position: top -640px left -160px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="2"] + .doomclock {
|
|
background-position: top -640px left -320px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="3"] + .doomclock {
|
|
background-position: top -640px left -480px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="4"] + .doomclock {
|
|
background-position: top -640px left -640px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="5"] + .doomclock {
|
|
background-position: top -640px left -800px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="6"] + .doomclock {
|
|
background-position: top -640px left -960px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="7"] + .doomclock {
|
|
background-position: top -640px left -1120px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="8"] + .doomclock {
|
|
background-position: top -640px left -1280px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="9"] + .doomclock {
|
|
background-position: top -640px left -1440px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="10"] + input.clocksegment[value="10"] + .doomclock {
|
|
background-position: top -640px left -1600px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="0"] + .doomclock {
|
|
background-position: top -800px left 0px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="1"] + .doomclock {
|
|
background-position: top -800px left -160px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="2"] + .doomclock {
|
|
background-position: top -800px left -320px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="3"] + .doomclock {
|
|
background-position: top -800px left -480px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="4"] + .doomclock {
|
|
background-position: top -800px left -640px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="5"] + .doomclock {
|
|
background-position: top -800px left -800px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="6"] + .doomclock {
|
|
background-position: top -800px left -960px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="7"] + .doomclock {
|
|
background-position: top -800px left -1120px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="8"] + .doomclock {
|
|
background-position: top -800px left -1280px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="9"] + .doomclock {
|
|
background-position: top -800px left -1440px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="10"] + .doomclock {
|
|
background-position: top -800px left -1600px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="11"] + .doomclock {
|
|
background-position: top -800px left -1760px;
|
|
}
|
|
.ui-dialog .charsheet input.clocksize[value="12"] + input.clocksegment[value="12"] + .doomclock {
|
|
background-position: top -800px left -1920px;
|
|
}
|
|
.ui-dialog .charsheet .doomclock .clockcontrol {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
opacity: 0;
|
|
margin-top: 30px;
|
|
margin-left: 29px;
|
|
min-height: 100px;
|
|
height: 100px;
|
|
width: 100px;
|
|
border-radius: 50px;
|
|
background-color: var(--ak-bg);
|
|
}
|
|
.ui-dialog .charsheet .doomclock .clockcontrol .clockwise, .ui-dialog .charsheet .doomclock .clockcontrol .counterclockwise {
|
|
font-size: 40px;
|
|
background: none;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
line-height: 1;
|
|
}
|
|
.ui-dialog .charsheet .doomclock:hover .clockcontrol {
|
|
opacity: 0.8;
|
|
}
|
|
.ui-dialog .charsheet .doomclock:hover .clockcontrol + * {
|
|
opacity: 1;
|
|
}
|
|
.ui-dialog .charsheet .clocktitle {
|
|
text-align: center;
|
|
font-size: 80%;
|
|
font-weight: bold;
|
|
}
|
|
.ui-dialog .charsheet .centered {
|
|
text-align: center;
|
|
}
|
|
|
|
.ui-dialog .charsheet input.scrollstyle ~ .wrapper .scrollable::-webkit-scrollbar {
|
|
width: 8px;
|
|
}
|
|
.ui-dialog .charsheet input.scrollstyle ~ .wrapper .scrollable::-webkit-scrollbar-track {
|
|
background: var(--ak-bg);
|
|
}
|
|
.ui-dialog .charsheet input.scrollstyle ~ .wrapper .scrollable::-webkit-scrollbar-thumb {
|
|
background-color: var(--ak-bg);
|
|
border-radius: 4px;
|
|
border: 1px solid var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet input.scrollstyle ~ .wrapper .scrollable::-webkit-scrollbar-thumb:hover {
|
|
background-color: var(--ak-pink);
|
|
}
|
|
.ui-dialog .charsheet input.scrollstyle[value=""] ~ .wrapper .scrollable {
|
|
overflow-y: initial;
|
|
overflow-x: initial;
|
|
}
|
|
.ui-dialog .charsheet input.scrollstyle[value=compact] ~ .wrapper .scrollable,
|
|
.ui-dialog .charsheet input.scrollstyle[value=comfy] ~ .wrapper .scrollable,
|
|
.ui-dialog .charsheet input.scrollstyle[value=tall] ~ .wrapper .scrollable,
|
|
.ui-dialog .charsheet input.scrollstyle[value=mixed] ~ .wrapper .scrollable {
|
|
border-bottom: 1px dotted rgba(122, 122, 122, 0.75);
|
|
padding: 2px;
|
|
padding-left: 6px;
|
|
padding-right: 6px;
|
|
margin-right: 0px;
|
|
}
|
|
.ui-dialog .charsheet input.scrollstyle[value=compact] ~ .wrapper .scrollable {
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
height: 496px;
|
|
}
|
|
.ui-dialog .charsheet input.scrollstyle[value=comfy] ~ .wrapper .scrollable {
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
height: 696px;
|
|
}
|
|
.ui-dialog .charsheet input.scrollstyle[value=tall] ~ .wrapper .scrollable {
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
height: 896px;
|
|
}
|
|
.ui-dialog .charsheet .tipper {
|
|
position: relative;
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped {
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
position: absolute;
|
|
background: var(--ak-bg);
|
|
color: var(--ak-alert);
|
|
padding: 6px 6px 6px 6px;
|
|
border: 1px solid var(--ak-alert);
|
|
text-shadow: none;
|
|
font-family: Nunito, sans-serif;
|
|
font-size: 12px;
|
|
line-height: 16px;
|
|
white-space: normal;
|
|
margin: 0px;
|
|
width: 100px;
|
|
border-radius: 6px;
|
|
-webkit-box-shadow: 0 0 2px var(--ak-alert);
|
|
box-shadow: 0 0 2px var(--ak-alert);
|
|
text-align: center;
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped:after {
|
|
border: 6px solid var(--ak-alert);
|
|
position: absolute;
|
|
content: "";
|
|
top: calc( 50% - 6px );
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.smalltip {
|
|
width: 50px;
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.midtip {
|
|
width: 75px;
|
|
}
|
|
.ui-dialog .charsheet input.tipsuppressor[value="1"] ~ .wrapper .tipper:hover .tipped {
|
|
visibility: visible;
|
|
opacity: 1;
|
|
z-index: 10;
|
|
-webkit-transition: opacity 0.25s;
|
|
transition: opacity 0.25s;
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.tipleft {
|
|
margin-left: 6px;
|
|
left: 50%;
|
|
top: 50%;
|
|
-webkit-transform: translateY(-50%);
|
|
transform: translateY(-50%);
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.tipleft:after {
|
|
left: -12px;
|
|
border-color: transparent var(--ak-alert) transparent transparent;
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.tipright {
|
|
margin-right: 18px;
|
|
right: 40%;
|
|
top: 50%;
|
|
-webkit-transform: translateY(-50%);
|
|
transform: translateY(-50%);
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.tipright:after {
|
|
right: -12px;
|
|
border-color: transparent transparent transparent var(--ak-alert);
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.tipunder {
|
|
margin-top: 24px;
|
|
left: 0%;
|
|
top: 100%;
|
|
-webkit-transform: translateY(-50%);
|
|
transform: translateY(-50%);
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.tipunder:after {
|
|
left: 50%;
|
|
-webkit-transform: translateX(-50%);
|
|
transform: translateX(-50%);
|
|
top: -12px;
|
|
border-color: transparent transparent var(--ak-alert) transparent;
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.tipover {
|
|
margin-bottom: 6px;
|
|
left: 50%;
|
|
bottom: 100%;
|
|
-webkit-transform: translateX(-50%);
|
|
transform: translateX(-50%);
|
|
}
|
|
.ui-dialog .charsheet .tipper .tipped.tipover:after {
|
|
left: 50%;
|
|
-webkit-transform: translateX(-50%);
|
|
transform: translateX(-50%);
|
|
top: 100%;
|
|
border-color: var(--ak-alert) transparent transparent transparent;
|
|
}
|
|
|
|
.sheet-rolltemplate-2d6-roll,
|
|
.sheet-rolltemplate-bondspend {
|
|
font-family: Nunito, sans-serif;
|
|
font-size: 16px;
|
|
color: var(--ak-fg);
|
|
background-color: var(--ak-bg);
|
|
line-height: unset;
|
|
}
|
|
|
|
.rollspend, .sheet-rolltemplate-2d6-roll .sheet-rollspend, .sheet-rolltemplate-bondspend .sheet-rollspend {
|
|
padding: 6px;
|
|
border: 1px solid var(--ak-pink);
|
|
background-color: var(--ak-bg);
|
|
color: var(--ak-fg);
|
|
text-align: left;
|
|
}
|
|
|
|
.ui-dialog .charsheet input[type=number].narrower {
|
|
width: 40px;
|
|
height: 21px;
|
|
border-bottom: 1px solid var(--ak-pink);
|
|
}
|
|
|
|
.titlebar, .sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-titlebar, .sheet-rolltemplate-bondspend .sheet-rollspend .sheet-titlebar, .titlebar button span {
|
|
color: white;
|
|
font-size: 80%;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
text-transform: uppercase;
|
|
margin-top: -6px;
|
|
margin-left: -6px;
|
|
margin-right: -6px;
|
|
margin-bottom: 3px;
|
|
background-color: var(--ak-pink);
|
|
}
|
|
|
|
.titlebar .tipper .tipped span {
|
|
text-transform: none;
|
|
color: var(--ak-alert);
|
|
background-color: var(--ak-bg);
|
|
font-size: 12px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.titlebar.subtitle {
|
|
margin-top: 0px;
|
|
margin-bottom: -6px;
|
|
}
|
|
|
|
input.spacetoggle[value="1"] + .titlebar.subtitle {
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-2d6-roll .sheet-rollspend,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend {
|
|
text-align: center;
|
|
}
|
|
.sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollcontainer,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollcontainer {
|
|
padding-top: 10px;
|
|
padding-bottom: 6px;
|
|
}
|
|
.sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollcontainer .inlinerollresult,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollcontainer .inlinerollresult {
|
|
background: none;
|
|
text-align: center;
|
|
padding-left: 7px;
|
|
padding-right: 7px;
|
|
}
|
|
.sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollcontainer .sheet-perfect .inlinerollresult, .sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollcontainer .sheet-miss .inlinerollresult, .sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollcontainer .sheet-disastrous .inlinerollresult,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollcontainer .sheet-perfect .inlinerollresult,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollcontainer .sheet-miss .inlinerollresult,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollcontainer .sheet-disastrous .inlinerollresult {
|
|
background: none;
|
|
text-align: center;
|
|
padding-left: 7px;
|
|
padding-right: 7px;
|
|
}
|
|
.sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollcontainer .sheet-perfect .inlinerollresult,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollcontainer .sheet-perfect .inlinerollresult {
|
|
border: 1px solid var(--ak-pink);
|
|
background-color: white;
|
|
color: var(--ak-pink);
|
|
}
|
|
.sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollcontainer .sheet-miss .inlinerollresult,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollcontainer .sheet-miss .inlinerollresult {
|
|
border: 1px solid var(--ak-pink);
|
|
background-color: black;
|
|
color: white;
|
|
}
|
|
.sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollcontainer .sheet-disastrous .inlinerollresult,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollcontainer .sheet-disastrous .inlinerollresult {
|
|
border: 1px solid var(--ak-fg);
|
|
background-color: var(--ak-pink);
|
|
color: white;
|
|
}
|
|
.sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-rollresult,
|
|
.sheet-rolltemplate-bondspend .sheet-rollspend .sheet-rollresult {
|
|
padding-bottom: 10px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.footnote, .sheet-rolltemplate-2d6-roll .sheet-rollspend .sheet-footnote, .bondspend .footnote, .sheet-rolltemplate-bondspend .sheet-rollspend .sheet-footnote {
|
|
font-size: 80%;
|
|
line-height: 1;
|
|
}
|
|
|
|
.spaceup {
|
|
margin-top: 6px;
|
|
}
|
|
|
|
.spaceupmini {
|
|
margin-top: 3px;
|
|
} |