mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 19:52:29 +00:00
2811 lines
50 KiB
CSS
2811 lines
50 KiB
CSS
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* GENERIC STYLING */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
.charsheet
|
|
{
|
|
position: relative;
|
|
min-width: 852px;
|
|
margin: 0;
|
|
padding: 0;
|
|
min-height: 16px;
|
|
}
|
|
|
|
.charsheet *
|
|
{
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* editable field color scheme */
|
|
input[type=number], input[type=text], textarea, select
|
|
{
|
|
background-color: #CCE;
|
|
border-top: 1px solid transparent;
|
|
border-bottom: 1px solid grey;
|
|
border-left: 1px solid transparent;
|
|
border-right: 1px solid transparent;
|
|
border-radius: 4px;
|
|
box-shadow: none;
|
|
font-family: cursive;
|
|
font-size: 12px;
|
|
font-style: italic;
|
|
}
|
|
|
|
/* non-editable field color scheme */
|
|
span.sheet-field,
|
|
div.sheet-button > button[type=roll],
|
|
div.sheet-button > span
|
|
{
|
|
background-color: #DDD;
|
|
border-top: 1px solid #CCC;
|
|
border-bottom: 1px solid grey;
|
|
border-left: 1px solid #CCC;
|
|
border-right: 1px solid #CCC;
|
|
border-radius: 4px;
|
|
font-family: cursive;
|
|
font-size: 12px;
|
|
font-style: italic;
|
|
overflow: hidden;
|
|
}
|
|
|
|
input[type=number], input[type=text], textarea, select, span.sheet-field
|
|
{
|
|
height: 20px;
|
|
line-height: 18px;
|
|
padding: 0 8px;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
span.sheet-field
|
|
{
|
|
display: block;
|
|
overflow-x: hidden;
|
|
white-space: pre;
|
|
margin-right: 0;
|
|
}
|
|
|
|
input[type=checkbox]
|
|
{
|
|
margin-top: -2px;
|
|
}
|
|
|
|
select
|
|
{
|
|
height: 20px;
|
|
}
|
|
|
|
input[type=number]
|
|
{
|
|
text-align: center;
|
|
-moz-appearance: textfield;
|
|
}
|
|
|
|
input[type=text]
|
|
{
|
|
text-align: left;
|
|
}
|
|
|
|
input[type=number]::-webkit-inner-spin-button,
|
|
input[type=number]::-webkit-outer-spin-button
|
|
{
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
div.sheet-line
|
|
{
|
|
display: flex;
|
|
flex-direction: row;
|
|
border: none;
|
|
padding: 0;
|
|
height: 20px;
|
|
width: 100%;
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
.sheet-heads
|
|
{
|
|
font-weight: bold;
|
|
vertical-align: text-bottom;
|
|
font-size: 110%;
|
|
}
|
|
|
|
.sheet-heads + .sheet-heads
|
|
{
|
|
margin-top: -8px;
|
|
}
|
|
|
|
.sheet-indent /* used for text labels */
|
|
{
|
|
padding-left: 8px; /* do not use percentage */
|
|
}
|
|
|
|
.sheet-break
|
|
{
|
|
margin-top: 8px;
|
|
}
|
|
|
|
.sheet-underline
|
|
{
|
|
border-bottom: solid 1px #BBB !important;
|
|
}
|
|
|
|
div.sheet-justify
|
|
{
|
|
display: flex;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
div.sheet-justify > *
|
|
{
|
|
width: 100%;
|
|
}
|
|
|
|
div.sheet-justify > *:first-child
|
|
{
|
|
width: unset;
|
|
padding-right: 8px;
|
|
}
|
|
|
|
div.sheet-justify input[type=text],
|
|
div.sheet-justify input[type=number],
|
|
div.sheet-justify select
|
|
{
|
|
width: 100%;
|
|
}
|
|
|
|
span.sheet-clean, input[type=text].sheet-clean, input[type=number].sheet-clean
|
|
{
|
|
background-color: transparent;
|
|
border: none;
|
|
font-family: inherit;
|
|
font-style: inherit;
|
|
}
|
|
|
|
div.sheet-small, input[type=text].sheet-small, input[type=number].sheet-small
|
|
{
|
|
font-size: 80%;
|
|
}
|
|
|
|
div.sheet-bold, input[type=text].sheet-bold, input[type=number].sheet-bold
|
|
{
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.repcontrol
|
|
{
|
|
display: none;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
div.itemcontrol
|
|
{
|
|
z-index: 5;
|
|
}
|
|
|
|
div.repcontrol .btn, div.itemcontrol .btn
|
|
{
|
|
padding: 0 11px 0;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* ROLL BUTTON & CHECKBOX BUTTONS */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
/* animations to make buttons flash */
|
|
/* Safari 4.0 - 8.0 */
|
|
@-webkit-keyframes flash1 {
|
|
to { background: #DDD; }
|
|
}
|
|
|
|
/* Standard syntax */
|
|
@keyframes flash2 {
|
|
to { background: #DDD; }
|
|
}
|
|
|
|
/* Safari 4.0 - 8.0 */
|
|
@-webkit-keyframes flash1 {
|
|
to { background: #DDD; }
|
|
}
|
|
|
|
/* Standard syntax */
|
|
@keyframes flash2 {
|
|
to { background: #DDD; }
|
|
}
|
|
|
|
div.sheet-button
|
|
{
|
|
position: relative;
|
|
height: 100%;
|
|
margin-top: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
div.sheet-button > input[type=text],
|
|
div.sheet-button > input[type=number],
|
|
div.sheet-button > input[type=checkbox],
|
|
div.sheet-button > button[type=roll]
|
|
{
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
div.sheet-button > input[type=checkbox],
|
|
div.sheet-button > button[type=roll]
|
|
{
|
|
opacity: 0;
|
|
}
|
|
|
|
div.sheet-button > span
|
|
{
|
|
display: block;
|
|
height: 100%;
|
|
width: 100%;
|
|
background-image: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
input[type=checkbox].sheet-flash ~ span.sheet-flash
|
|
{
|
|
-webkit-animation-name: flash1; /* Safari 4.0 - 8.0 */
|
|
-webkit-animation-duration: .1s; /* Safari 4.0 - 8.0 */
|
|
animation-name: flash1;
|
|
animation-duration: .1s;
|
|
}
|
|
|
|
input[type=checkbox].sheet-flash:checked ~ span.sheet-flash
|
|
{
|
|
-webkit-animation-name: flash2; /* Safari 4.0 - 8.0 */
|
|
-webkit-animation-duration: .1s; /* Safari 4.0 - 8.0 */
|
|
animation-name: flash2;
|
|
animation-duration: .1s;
|
|
}
|
|
|
|
input[type=checkbox].sheet-play-mode:checked ~ div.sheet-tabbed-content div.sheet-button:hover > span
|
|
{
|
|
color: white;
|
|
background: radial-gradient(#AAA, #444);
|
|
}
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* TOOLTIPS */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
.sheet-tooltip ~ span.sheet-tooltiptext
|
|
{
|
|
position: absolute;
|
|
height: 18px;
|
|
line-height: 18px;
|
|
width: unset!important;
|
|
padding: 0 10px!important;
|
|
border: none;
|
|
border-radius: 4px;
|
|
background: #444!important;
|
|
color: yellow!important;
|
|
font-family: unset;
|
|
font-style: unset;
|
|
font-size: 10px;
|
|
top: -20px;
|
|
z-index: 5;
|
|
pointer-events: none;
|
|
opacity: 0;
|
|
transform: scale(0);
|
|
transition: opacity .5s, transform .3s;
|
|
transition-timing-function: ease-out;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.sheet-tooltip:hover ~ span.sheet-tooltiptext
|
|
{
|
|
opacity: 1;
|
|
transform: scale(1);
|
|
}
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* CONFIGURATION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
input[type=checkbox].sheet-configuration
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-fixed-page-width:checked ~ div.sheet-tabbed-content
|
|
{
|
|
width: 852px;
|
|
}
|
|
|
|
input[type=checkbox].sheet-zoom1:checked ~ div.sheet-tabbed-content
|
|
{
|
|
transform: scale(.9);
|
|
transform-origin: top left;
|
|
}
|
|
|
|
input[type=checkbox].sheet-zoom2:checked ~ div.sheet-tabbed-content
|
|
{
|
|
transform: scale(.8);
|
|
transform-origin: top left;
|
|
}
|
|
|
|
span.sheet-version
|
|
{
|
|
position: absolute;
|
|
margin-top: -1.1%;
|
|
right: 2%;
|
|
text-align: right;
|
|
color: #B8B8B8;
|
|
transform: scaleY(.8);
|
|
}
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* PAGE STYLES */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
.sheet-page
|
|
{
|
|
position: relative;
|
|
top: 23px;
|
|
left: 0;
|
|
display: none;
|
|
}
|
|
|
|
input[type=radio].sheet-hidden, input[type=radio].sheet-hidden + span
|
|
{
|
|
/* ************************************ */
|
|
/* choose to display hidden page or not */
|
|
/* ************************************ */
|
|
display: none;
|
|
/* display: block; */
|
|
}
|
|
|
|
input[type=text].sheet-hidden,
|
|
input[type=number].sheet-hidden,
|
|
div.sheet-hidden,
|
|
p.sheet-hidden
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* PAGE HEADER */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-header
|
|
{
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
|
|
div.sheet-banner
|
|
{
|
|
display: block;
|
|
width: 66%;
|
|
padding-left: 4px;
|
|
padding-bottom: 8px;
|
|
}
|
|
|
|
div.sheet-identity
|
|
{
|
|
border: solid black 3px;
|
|
border-radius: 12px;
|
|
padding-top: 8px;
|
|
padding-bottom: 6px;
|
|
}
|
|
|
|
div.sheet-nameline
|
|
{
|
|
margin: 8px 8px 3px 8px;
|
|
}
|
|
|
|
div.sheet-nameline div
|
|
{
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
margin-top: 6px;
|
|
}
|
|
|
|
div.sheet-nameline:first-child
|
|
{
|
|
font-family: Arial Black, Gadget, sans-serif;
|
|
}
|
|
|
|
div.sheet-nameline input[type=text],
|
|
div.sheet-nameline span.sheet-field
|
|
{
|
|
height: 30px;
|
|
line-height: 28px;
|
|
font-size: 18px;
|
|
}
|
|
|
|
/*
|
|
div.sheet-nameline span.sheet-field
|
|
{
|
|
padding-top: 5px;
|
|
}
|
|
*/
|
|
|
|
div.sheet-logo
|
|
{
|
|
width: 33%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-logo img
|
|
{
|
|
height: 100px;
|
|
width: 270px;
|
|
object-fit: cover;
|
|
margin-top: 16px;
|
|
}
|
|
|
|
div.sheet-alternate2
|
|
{
|
|
flex-direction: column;
|
|
margin-left: 4px;
|
|
}
|
|
|
|
div.sheet-banner.sheet-alternate2
|
|
{
|
|
border: solid black 3px;
|
|
border-radius: 12px;
|
|
margin-bottom: 8px;
|
|
padding: 8px;
|
|
}
|
|
|
|
div.sheet-alternate2 div.sheet-stat,
|
|
div.sheet-alternate2 div.sheet-phases,
|
|
div.sheet-alternate2 div.sheet-stat-cvs
|
|
{
|
|
border: solid #DDD 3px;
|
|
}
|
|
|
|
div.sheet-alternate2 > div
|
|
{
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
div.sheet-alternate2 > div.sheet-line
|
|
{
|
|
display: block;
|
|
width: 50%;
|
|
margin-left: 16px;
|
|
transform: scale(1.8);
|
|
transform-origin: top left;
|
|
}
|
|
|
|
div.sheet-alternate2 > div.sheet-line > input[type=text]
|
|
{
|
|
width: 100%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-alternate2 > div > div.sheet-line
|
|
{
|
|
margin-top: 4px;
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
div.sheet-alternate2 > div > div.sheet-line > *
|
|
{
|
|
font-weight: normal;
|
|
}
|
|
|
|
div.sheet-alternate2 > div > div.sheet-line > div
|
|
{
|
|
font-weight: bold;
|
|
}
|
|
|
|
input[type=checkbox].sheet-alternate-header:checked ~ div.sheet-tabbed-content div.sheet-alternate1,
|
|
input[type=checkbox].sheet-alternate-header ~ div.sheet-tabbed-content div.sheet-alternate2
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-alternate-header ~ div.sheet-tabbed-content div.sheet-alternate1
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
input[type=checkbox].sheet-alternate-header:checked ~ div.sheet-tabbed-content div.sheet-alternate2
|
|
{
|
|
display: flex;
|
|
}
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* SHEET TABS */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
.sheet-tabbed-content
|
|
{
|
|
position: relative;
|
|
width: 100%;
|
|
float: left;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button, input[type=radio].sheet-tab-button + span,
|
|
input[type=checkbox].sheet-tab-button, input[type=checkbox].sheet-tab-button + span
|
|
{
|
|
position: absolute;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button, input[type=checkbox].sheet-tab-button
|
|
{
|
|
transform: scale(.9);
|
|
transform-origin: top left;
|
|
opacity: 0;
|
|
z-index: 2;
|
|
font-size: 16px;
|
|
padding: 1px;
|
|
height: 24px;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button + span, input[type=checkbox].sheet-tab-button + span
|
|
{
|
|
transform: scale(.9);
|
|
transform-origin: top left;
|
|
background-color: #CCC;
|
|
border: solid 2px black;
|
|
border-radius: 14px;
|
|
color: black;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
padding: 1px;
|
|
user-select: none;
|
|
height: 24px;
|
|
}
|
|
|
|
|
|
input[type=radio].sheet-tab-button:checked + span
|
|
{
|
|
background-color: #EEE;
|
|
}
|
|
|
|
input[type=checkbox].sheet-tab-button:checked + span
|
|
{
|
|
color: white;
|
|
background-color: red;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-core,
|
|
input[type=radio].sheet-tab-button.sheet-core + span
|
|
{
|
|
width: 63px;
|
|
left: 6px;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-combat,
|
|
input[type=radio].sheet-tab-button.sheet-combat + span
|
|
{
|
|
width: 82px;
|
|
left: 71px;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-powers,
|
|
input[type=radio].sheet-tab-button.sheet-powers + span
|
|
{
|
|
width: 82px;
|
|
left: 153px;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-skills,
|
|
input[type=radio].sheet-tab-button.sheet-skills + span
|
|
{
|
|
width: 66px;
|
|
left: 235px;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-background,
|
|
input[type=radio].sheet-tab-button.sheet-background + span
|
|
{
|
|
width: 113px;
|
|
left: 303px;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-options,
|
|
input[type=radio].sheet-tab-button.sheet-options + span
|
|
{
|
|
width: 32px;
|
|
left: 414px;
|
|
margin-top: -3px;
|
|
font-family: "Pictos";
|
|
font-style: normal;
|
|
}
|
|
|
|
input[type=checkbox].sheet-tab-button.sheet-edit-toggle,
|
|
input[type=checkbox].sheet-tab-button.sheet-edit-toggle + span
|
|
{
|
|
width: 50px;
|
|
left: 500px;
|
|
margin-top: -1px;
|
|
padding: 0;
|
|
transform: scale(.7);
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-hidden,
|
|
input[type=radio].sheet-tab-button.sheet-hidden + span
|
|
{
|
|
width: 79px;
|
|
left: 505px;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-core:checked ~ .sheet-page.sheet-core,
|
|
input[type=radio].sheet-tab-button.sheet-skills:checked ~ .sheet-page.sheet-skills,
|
|
input[type=radio].sheet-tab-button.sheet-combat:checked ~ .sheet-page.sheet-combat,
|
|
input[type=radio].sheet-tab-button.sheet-powers:checked ~ .sheet-page.sheet-powers,
|
|
input[type=radio].sheet-tab-button.sheet-background:checked ~ .sheet-page.sheet-background,
|
|
input[type=radio].sheet-tab-button.sheet-options:checked ~ .sheet-page.sheet-options
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-button.sheet-hidden:checked ~ .sheet-hidden
|
|
{
|
|
display: block;
|
|
position: relative;
|
|
top: 32px;
|
|
left: 8px;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* EDIT MODE */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
.sheet-edit-show, div.repcontrol
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ .sheet-tabbed-content > .sheet-header .sheet-edit-show
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ .sheet-tabbed-content > .sheet-header .sheet-edit-hide
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ .sheet-tabbed-content > .sheet-page div.repcontrol
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ .sheet-tabbed-content > .sheet-page .sheet-edit-show
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ .sheet-tabbed-content > .sheet-page .sheet-edit-show.sheet-stat
|
|
{
|
|
display: inline-block;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ .sheet-tabbed-content > .sheet-page .sheet-edit-hide
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* GROUP STYLES */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-column-100
|
|
{
|
|
width: 99%;
|
|
float: left;
|
|
}
|
|
|
|
div.sheet-column-66
|
|
{
|
|
float: left;
|
|
width: 66%;
|
|
}
|
|
|
|
div.sheet-column-60
|
|
{
|
|
width: 59.4%;
|
|
float: left;
|
|
}
|
|
|
|
/* for the nested column-60 */
|
|
div.sheet-column-66 > div.sheet-column-60
|
|
{
|
|
width: 60.4%;
|
|
float: left;
|
|
}
|
|
|
|
div.sheet-column-50
|
|
{
|
|
width: 49.5%;
|
|
float: left;
|
|
}
|
|
|
|
div.sheet-column-40
|
|
{
|
|
width: 39.6%;
|
|
float: left;
|
|
}
|
|
|
|
div.sheet-column-33
|
|
{
|
|
width: 33%;
|
|
float: left;
|
|
}
|
|
|
|
div.sheet-column-26
|
|
{
|
|
width: 26.4%;
|
|
float: left;
|
|
}
|
|
|
|
div.sheet-section
|
|
{
|
|
position: relative;
|
|
margin-bottom: 8px;
|
|
margin-left: 4px;
|
|
margin-right: 4px;
|
|
border: 3px solid black;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
div.sheet-sectionless
|
|
{
|
|
display: flex;
|
|
margin-top: 0;
|
|
margin-bottom: 8px;
|
|
margin-left: 4px;
|
|
margin-right: 4px;
|
|
padding: 0;
|
|
}
|
|
|
|
div.sheet-section-title,
|
|
span.sheet-section-title,
|
|
input[type=checkbox].sheet-section-title
|
|
{
|
|
text-align: center;
|
|
font-family: Arial Black, Gadget, sans-serif;
|
|
font-size: 120%;
|
|
font-weight: bold;
|
|
width: 100%;
|
|
height: 32px;
|
|
padding-top: 4px;
|
|
padding-bottom: 4px;
|
|
border-bottom: 3px solid black;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
input[type=checkbox].sheet-section-title
|
|
{
|
|
opacity: 0;
|
|
cursor: default;
|
|
}
|
|
|
|
span.sheet-section-title
|
|
{
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: -2;
|
|
}
|
|
|
|
div.sheet-footer
|
|
{
|
|
width: 100%;
|
|
margin-top: 32px;
|
|
}
|
|
|
|
div.sheet-footer > div
|
|
{
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-subsection
|
|
{
|
|
display: block;
|
|
position: relative;
|
|
padding-top: 0;
|
|
padding-left: 6px;
|
|
padding-right: 6px;
|
|
padding-bottom: 6px;
|
|
}
|
|
|
|
/* collapsing sections */
|
|
|
|
input[type=checkbox].sheet-collapsing-sections:checked ~ div.sheet-tabbed-content span.sheet-section-title
|
|
{
|
|
border-bottom: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-collapsing-sections:checked ~ div.sheet-tabbed-content input[type=checkbox].sheet-section-title
|
|
{
|
|
cursor: pointer;
|
|
}
|
|
|
|
input[type=checkbox].sheet-collapsing-sections:checked ~ div.sheet-tabbed-content input[type=checkbox].sheet-section-title:checked ~ span.sheet-section-title
|
|
{
|
|
height: 32px;
|
|
border-bottom: 3px solid black;
|
|
}
|
|
|
|
input[type=checkbox].sheet-collapsing-sections:checked ~ div.sheet-tabbed-content input[type=checkbox].sheet-section-title ~ div.sheet-subsection
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-collapsing-sections:checked ~ div.sheet-tabbed-content input[type=checkbox].sheet-section-title:checked ~ div.sheet-subsection
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* CHARACTERISTICS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-ch1, input[type=number].sheet-ch1, span.sheet-ch1, span.sheet-ch4
|
|
{
|
|
width: 20%;
|
|
margin-right: 5%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-ch2
|
|
{
|
|
width: 20%;
|
|
text-align: left;
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-ch3, input[type=number].sheet-ch3
|
|
{
|
|
width: 20%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-ch3
|
|
{
|
|
padding: 0 8px 1px;
|
|
margin: 0 3px 3px 0;
|
|
}
|
|
|
|
div.sheet-ch4.sheet-button
|
|
{
|
|
width: 20%;
|
|
margin-right: 3px;
|
|
text-align: right;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* VITAL INFORMATION SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-vs1
|
|
{
|
|
display: flex
|
|
}
|
|
|
|
div.sheet-vs1 > div
|
|
{
|
|
padding-right: 6px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-vs1 > div > span
|
|
{
|
|
font-weight: normal;
|
|
padding-left: 8px;
|
|
}
|
|
|
|
div.sheet-vs2
|
|
{
|
|
display: flex;
|
|
}
|
|
|
|
div.sheet-vs2 > div:first-child
|
|
{
|
|
width: 40%;
|
|
margin-right: 5%;
|
|
}
|
|
|
|
div.sheet-vs2 > div
|
|
{
|
|
width: 55%;
|
|
}
|
|
|
|
div.sheet-vs2 > div > div
|
|
{
|
|
font-weight: bold;
|
|
}
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* MOVEMENT SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-mv1, input[type=text].sheet-mv1, span.sheet-mv1,
|
|
div.sheet-mv1, input[type=text].sheet-mv1, span.sheet-mv1
|
|
{
|
|
width: 41.5%;
|
|
margin-right: 1.5%;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-mv2, input[type=text].sheet-mv2, span.sheet-mv2
|
|
{
|
|
width: 27%;
|
|
margin-right: 1.5%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-mv3, input[type=text].sheet-mv3, span.sheet-mv3
|
|
{
|
|
width: 27%;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* INFO SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-stat-wrap
|
|
{
|
|
width: 75%;
|
|
}
|
|
|
|
div.sheet-stat
|
|
{
|
|
position: relative;
|
|
width: 24%;
|
|
height: 52px;
|
|
float: left;
|
|
margin-right: 2.5%;
|
|
margin-bottom: 8px;
|
|
border: 3px solid black;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
div.sheet-stat > div:first-child
|
|
{
|
|
float: left;
|
|
position: relative;
|
|
width: 47px;
|
|
top: 47px;
|
|
margin: 0;
|
|
margin-left: 8px;
|
|
font-weight: bold;
|
|
color: #888;
|
|
text-align: center;
|
|
transform: rotate(-90deg);
|
|
transform-origin: top left;
|
|
}
|
|
|
|
div.sheet-stat > div + div input[type=text],
|
|
div.sheet-stat > div + div span
|
|
{
|
|
position: absolute;
|
|
top: 16%;
|
|
left: 32%;
|
|
width: 60%;
|
|
height: 32px;
|
|
line-height: 30px;
|
|
font-size: 180%;
|
|
border-radius: 8px;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
}
|
|
|
|
div.sheet-stat > div + div input[type=text],
|
|
{
|
|
padding-top: 0;
|
|
}
|
|
|
|
span.sheet-stat
|
|
{
|
|
padding: 6px 8px 1px;
|
|
font-family: cursive;
|
|
font-style: italic;
|
|
}
|
|
|
|
div.sheet-stat-buttons
|
|
{
|
|
width: 18%;
|
|
height: 52px;
|
|
float: left;
|
|
margin-bottom: 8px;
|
|
margin-right: 2%;
|
|
}
|
|
|
|
div.sheet-stat-buttons > div
|
|
{
|
|
position: relative;
|
|
width: 100%;
|
|
height: 40%;
|
|
}
|
|
|
|
div.sheet-stat-buttons > div:first-child
|
|
{
|
|
margin-bottom: 10%;
|
|
}
|
|
|
|
div.sheet-stat-buttons > div input[type=checkbox],
|
|
div.sheet-stat-buttons > div span.sheet-stat-button
|
|
{
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
margin-top: 0;
|
|
padding: 0;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
div.sheet-stat-buttons > div input[type=checkbox]
|
|
{
|
|
display: block;
|
|
position: absolute;
|
|
top: 0;
|
|
opacity: 0;
|
|
}
|
|
|
|
div.sheet-stat-buttons > div span.sheet-stat-button
|
|
{
|
|
padding-top: 1px;
|
|
color: #DDD;
|
|
background: linear-gradient(to bottom right, #999, #555);
|
|
border: solid #111 1px;
|
|
text-align: center;
|
|
font-size: 12px;
|
|
z-index: -2;
|
|
}
|
|
|
|
div.sheet-stat-buttons > div:hover span.sheet-stat-button
|
|
{
|
|
color: yellow;
|
|
}
|
|
|
|
div.sheet-phases
|
|
{
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-right: 2%;
|
|
padding: 4px;
|
|
border: 3px solid black;
|
|
border-radius: 12px;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-in1
|
|
{
|
|
display: flex;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 18px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
div.sheet-in1 + div.sheet-line
|
|
{
|
|
justify-content: space-evenly;
|
|
}
|
|
|
|
div.sheet-in1 > div
|
|
{
|
|
width: auto;
|
|
overflow: hidden;
|
|
transform: scaleX(1.8);
|
|
font-weight: bold;
|
|
}
|
|
|
|
input[type=checkbox].sheet-fast,
|
|
input[type=checkbox].sheet-in2
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
span.sheet-in2
|
|
{
|
|
display: inline-block;
|
|
width: 7%;
|
|
font-weight: bold;
|
|
margin-left: .2%;
|
|
margin-right: 0;
|
|
padding-top: 1px;
|
|
border: solid 1px black;
|
|
border-radius: 16px;
|
|
font-size: 13px;
|
|
text-align: center;
|
|
}
|
|
|
|
input[type=checkbox].sheet-fast:checked ~ span.sheet-in2,
|
|
input[type=checkbox].sheet-in2:checked + span.sheet-in2
|
|
{
|
|
color: white;
|
|
background-color: #BBB;
|
|
text-shadow: 0 0 1px black;
|
|
}
|
|
|
|
input[type=checkbox].sheet-fast:checked ~ input[type=checkbox].sheet-in2:checked + span.sheet-in2
|
|
{
|
|
background-color: #555;
|
|
}
|
|
|
|
div.sheet-stat-cvs
|
|
{
|
|
width: 25%;
|
|
padding: 4px 0 4px 8px;
|
|
border: 3px solid black;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
div.sheet-stat-cvs > div.sheet-line
|
|
{
|
|
margin-top: 4px;
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
div.sheet-in3
|
|
{
|
|
Width: 55%;
|
|
font-size: 135%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-in4
|
|
{
|
|
margin-top: 0!important;
|
|
float: left;
|
|
height: 20px;
|
|
width: 40%;
|
|
margin-top: 0;
|
|
}
|
|
|
|
div.sheet-in4 > span
|
|
{
|
|
border-radius: 16px;
|
|
font-size: 16px;
|
|
line-height: 16px;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* HIT LOCATION SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-hl1,
|
|
div.sheet-hl2,
|
|
div.sheet-hl3,
|
|
div.sheet-hl4, span.sheet-hl4,
|
|
div.sheet-hl5,
|
|
div.sheet-hl6, span.sheet-hl6,
|
|
div.sheet-hl7,
|
|
div.sheet-hl8,
|
|
div.sheet-hl9, span.sheet-hl9,
|
|
div.sheet-hl10,
|
|
div.sheet-hl11, span.sheet-hl11,
|
|
div.sheet-hl12, span.sheet-hl12
|
|
{
|
|
padding-left: 1px;
|
|
padding-right: 1px;
|
|
text-align: center;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
|
|
div.sheet-hl1
|
|
{
|
|
float: left;
|
|
width: 10%;
|
|
margin-right: 2%;
|
|
}
|
|
|
|
div.sheet-hl2
|
|
{
|
|
float: left;
|
|
width: 13%;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-hl3, span.sheet-hl3
|
|
{
|
|
float: left;
|
|
width: 8%;
|
|
}
|
|
|
|
div.sheet-hl4, span.sheet-hl4
|
|
{
|
|
float: left;
|
|
width: 8%;
|
|
margin-left: 3.5%;
|
|
}
|
|
|
|
div.sheet-hl3 + div.sheet-hl4,
|
|
div.sheet-hl3 + span.sheet-hl4
|
|
{
|
|
margin-left: 2%;
|
|
}
|
|
|
|
div.sheet-hl5
|
|
{
|
|
float: left;
|
|
width: 2%;
|
|
}
|
|
|
|
div.sheet-hl6, span.sheet-hl6
|
|
{
|
|
float: left;
|
|
width: 8%;
|
|
}
|
|
|
|
input[type=text].sheet-hl7, span.sheet-hl7
|
|
{
|
|
float: left;
|
|
width: 99%;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* RESERVES / CHARGES / BATTERIES SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-rs1, input[type=text].sheet-rs1, span.sheet-rs1,
|
|
div.sheet-rs2, input[type=number].sheet-rs2
|
|
{
|
|
margin-right: 1.5%;
|
|
}
|
|
|
|
div.sheet-rs1.sheet-edit-hide, span.sheet-rs1
|
|
{
|
|
width: 63.5%;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-rs1.sheet-edit-show, input[type=text].sheet-rs1.sheet-edit-show
|
|
{
|
|
width: 46%;
|
|
text-align: left;
|
|
}
|
|
|
|
input[type=number].sheet-rs2
|
|
{
|
|
width: 16%;
|
|
}
|
|
|
|
div.sheet-rs2
|
|
{
|
|
width: 16%;
|
|
height: 100%;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* SENSES SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-es1, input[type=text].sheet-es1, span.sheet-es1,
|
|
div.sheet-es2, input[type=number].sheet-es2,
|
|
div.sheet-es3
|
|
{
|
|
margin-right: 1.5%;
|
|
}
|
|
|
|
div.sheet-es0:first-child
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
div.sheet-es0 + div.sheet-es0
|
|
{
|
|
margin-bottom: 16px;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ .sheet-tabbed-content > .sheet-page .sheet-es0.sheet-edit-show
|
|
{
|
|
display: flex;
|
|
}
|
|
|
|
|
|
div.sheet-es1, span.sheet-es1
|
|
{
|
|
width: 81%;
|
|
}
|
|
|
|
div.sheet-es1.sheet-edit-show, input[type=text].sheet-es1.sheet-edit-show, span.sheet-es1.sheet-edit-show
|
|
{
|
|
width: 63.5%;
|
|
}
|
|
|
|
div.sheet-es1
|
|
{
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-es1 > span
|
|
{
|
|
font-weight: normal;
|
|
padding-left: 8px;
|
|
}
|
|
|
|
div.sheet-es2, input[type=number].sheet-es2
|
|
{
|
|
width: 16%;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* DEFENSES SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-def1
|
|
{
|
|
width: 60%;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-def2, span.sheet-def2
|
|
{
|
|
width: 38%;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* COMBAT PREVIEW */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
input[type=checkbox].sheet-combat-preview ~ div.sheet-tabbed-content div.sheet-combat-preview
|
|
{
|
|
display:none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-combat-preview:checked ~ div.sheet-tabbed-content div.sheet-combat-preview
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
div.sheet-cp1, span.sheet-cp1
|
|
{
|
|
width: 4%;
|
|
text-align: center;
|
|
margin-left: 2%;
|
|
margin-right: 1%;
|
|
}
|
|
|
|
div.sheet-cp1
|
|
{
|
|
font-weight: bold;
|
|
transform: scale(1.2);
|
|
}
|
|
|
|
div.sheet-cp2, span.sheet-cp2,
|
|
div.sheet-cp3, span.sheet-cp3
|
|
{
|
|
width: 6%;
|
|
text-align: center;
|
|
margin-left: 1%;
|
|
}
|
|
|
|
span.sheet-cp3
|
|
{
|
|
background-color: #666;
|
|
color: white;
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-cp1
|
|
{
|
|
font-family: Arial Black, Gadget, sans-serif;
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-cp4, span.sheet-cp4
|
|
{
|
|
width: 9%;
|
|
text-align: center;
|
|
margin-left: 2%;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* ATTACKS & MANEUVERS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-am0, input[type=radio].sheet-am0,
|
|
div.sheet-am1, input[type=text].sheet-am1, span.sheet-am1,
|
|
div.sheet-am2, select.sheet-am2, span.sheet-am2,
|
|
div.sheet-am3, input[type=text].sheet-am3, span.sheet-am3,
|
|
div.sheet-am4, input[type=text].sheet-am4, span.sheet-am4
|
|
{
|
|
margin-right: 1%;
|
|
}
|
|
|
|
input[type=text].sheet-am1, span.sheet-am1,
|
|
select.sheet-am2, span.sheet-am2,
|
|
input[type=text].sheet-am3, span.sheet-am3,
|
|
input[type=text].sheet-am4, span.sheet-am4
|
|
{
|
|
font-size: 11px;
|
|
}
|
|
|
|
div.sheet-am0
|
|
{
|
|
width: 3%;
|
|
}
|
|
|
|
div.sheet-am1, input[type=text].sheet-am1, span.sheet-am1
|
|
{
|
|
width: 24%;
|
|
text-align: left;
|
|
}
|
|
|
|
input[type=text].sheet-am2,
|
|
div.sheet-am2, select.sheet-am2, span.sheet-am2,
|
|
div.sheet-am3, select.sheet-am3, span.sheet-am3
|
|
{
|
|
width: 8%;
|
|
text-align: center;
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
|
|
select.sheet-am2
|
|
{
|
|
opacity: 0;
|
|
}
|
|
|
|
|
|
span.sheet-am2.sheet-hidearrow1,
|
|
span.sheet-am2.sheet-hidearrow2,
|
|
span.sheet-am2.sheet-hidearrow3,
|
|
span.sheet-am2.sheet-hidearrow4
|
|
{
|
|
position: absolute;
|
|
z-index: -1;
|
|
background-color: #CCE;
|
|
}
|
|
|
|
span.sheet-am2.sheet-hidearrow1
|
|
{
|
|
left: 29%;
|
|
}
|
|
|
|
span.sheet-am2.sheet-hidearrow2
|
|
{
|
|
left: 38%;
|
|
}
|
|
|
|
span.sheet-am2.sheet-hidearrow3
|
|
{
|
|
left: 47%;
|
|
}
|
|
|
|
span.sheet-am2.sheet-hidearrow4
|
|
{
|
|
left: 56%;
|
|
}
|
|
|
|
div.sheet-am4, input[type=text].sheet-am4, span.sheet-am4
|
|
{
|
|
width: 34%;
|
|
text-align: left;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* COMBAT SKILL LEVELS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-cs0, input[type=checkbox].sheet-cs0
|
|
{
|
|
width: 3%;
|
|
margin-right: 1%;
|
|
}
|
|
|
|
div.sheet-cs1, input[type=text].sheet-cs1, span.sheet-cs1
|
|
{
|
|
width: 36%;
|
|
margin-right: 0;
|
|
}
|
|
|
|
div.sheet-cs2, div.sheet-cs3, div.sheet-cs4, div.sheet-cs5, div.sheet-cs6
|
|
{
|
|
width: 12%;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* OTHER MODIFIERS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-om1, input[type=number].sheet-om1,
|
|
div.sheet-om2, input[type=checkbox].sheet-om2,
|
|
div.sheet-om3, input[type=number].sheet-om3
|
|
{
|
|
display: block;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-om1, input[type=number].sheet-om1
|
|
{
|
|
width: 15%;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
|
|
div.sheet-om2, input[type=checkbox].sheet-om2
|
|
{
|
|
width: 19%;
|
|
margin-right: 4%;
|
|
}
|
|
|
|
input[type=checkbox].sheet-om2
|
|
{
|
|
position:relative;
|
|
top: 3px;
|
|
}
|
|
|
|
div.sheet-om2, div.sheet-om3
|
|
{
|
|
white-space: nowrap;
|
|
}
|
|
|
|
div.sheet-om3, input[type=number].sheet-om3
|
|
{
|
|
width: 18%;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
}
|
|
|
|
input[type=number].sheet-om3
|
|
{
|
|
text-align: right;
|
|
}
|
|
|
|
div.sheet-om4
|
|
{
|
|
width: 3%;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* COMBAT MODIFIERS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-cm-wrap
|
|
{
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
div.sheet-cm-wrap div.sheet-cm4,
|
|
div.sheet-cm-wrap div.sheet-cm6,
|
|
div.sheet-cm-wrap div.sheet-cm9
|
|
{
|
|
border-bottom: 1px solid #BBB !important;
|
|
padding-bottom: 2px;
|
|
}
|
|
|
|
div.sheet-cm-gap
|
|
{
|
|
width: 12%;
|
|
}
|
|
|
|
div.sheet-cm0
|
|
{
|
|
margin-top: 8px;
|
|
position: relative;
|
|
top: 6px;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
div.sheet-cm1
|
|
{
|
|
width: 24%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-cm2
|
|
{
|
|
width: 11%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-cm3
|
|
{
|
|
width: 16%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-cm4
|
|
{
|
|
width: 6%
|
|
}
|
|
|
|
div.sheet-cm5
|
|
{
|
|
width: 58%;
|
|
text-align: left;
|
|
white-space: pre;
|
|
}
|
|
|
|
div.sheet-cm6
|
|
{
|
|
width: 12%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-cm7
|
|
{
|
|
width: 15%;
|
|
margin-left: 2%;
|
|
}
|
|
|
|
div.sheet-cm7 > div
|
|
{
|
|
padding: 0 6px;
|
|
margin-left: -6px;
|
|
}
|
|
|
|
div.sheet-cm7.sheet-button:hover > div
|
|
{
|
|
border-radius: 10px;
|
|
color: yellow;
|
|
background: linear-gradient(to bottom right, #999, #555);
|
|
}
|
|
|
|
div.sheet-cm8
|
|
{
|
|
width: 100%;
|
|
text-align: center;
|
|
font-style: italic;
|
|
}
|
|
|
|
div.sheet-cm9
|
|
{
|
|
width: 25%;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* PENALTY SKILL LEVELS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-ps0, input[type=checkbox].sheet-ps0
|
|
{
|
|
width: 4.5%;
|
|
margin-right: 1.5%;
|
|
}
|
|
|
|
div.sheet-ps1, input[type=text].sheet-ps1, span.sheet-ps1
|
|
{
|
|
width: 46%;
|
|
margin-right: 0;
|
|
}
|
|
|
|
div.sheet-ps2, div.sheet-ps3, div.sheet-ps4
|
|
{
|
|
width: 16%;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* SKILLS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-sk1, input[type=text].sheet-sk1, span.sheet-sk1,
|
|
div.sheet-sk2, select.sheet-sk2,
|
|
div.sheet-sk3, input[type=number].sheet-sk3, span.sheet-sk3,
|
|
div.sheet-sk4, span.sheet-sk4,
|
|
div.sheet-sk5
|
|
{
|
|
height: 20px;
|
|
margin-right: 1%;
|
|
}
|
|
|
|
div.sheet-sk1.sheet-edit-hide, span.sheet-sk1
|
|
{
|
|
width: 83.5%;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-sk1.sheet-edit-show, input[type=text].sheet-sk1
|
|
{
|
|
width: 52%;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-sk2, select.sheet-sk2
|
|
{
|
|
width: 17.5%;
|
|
text-align: center;
|
|
}
|
|
|
|
input[type=checkbox].sheet-sk3
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
div.sheet-sk3, input[type=number].sheet-sk3
|
|
{
|
|
width: 12%;
|
|
text-align: center;
|
|
}
|
|
|
|
input[type=number].sheet-sk3
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ div.sheet-tabbed-content input[type=checkbox].sheet-sk3:checked + input[type=number].sheet-sk3
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
input[type=checkbox].sheet-sk4
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
button.sheet-sk4
|
|
{
|
|
opacity: none;
|
|
}
|
|
|
|
div.sheet-sk4
|
|
{
|
|
width: 12%;
|
|
text-align: right;
|
|
}
|
|
|
|
input[type=checkbox].sheet-edit-mode:checked ~ div.sheet-tabbed-content div.sheet-sk4
|
|
{
|
|
/* if "increase" field is not shown */
|
|
margin-left: 13%;
|
|
}
|
|
|
|
input[type=checkbox].sheet-sk3:checked ~ div.sheet-sk4
|
|
{
|
|
margin-left: 0!important;
|
|
}
|
|
|
|
div.sheet-sk4
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-sk4:checked + div.sheet-sk4
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* PERKS & TALENTS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-pk1, input[type=text].sheet-pk1, span.sheet-pk1
|
|
{
|
|
width: 99%;
|
|
margin-right: 0;
|
|
}
|
|
|
|
div.sheet-pk1, input[type=text].sheet-pk1
|
|
{
|
|
width: 99%;
|
|
text-align: left;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* SKILL LEVELS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-sl0
|
|
{
|
|
width: 6%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-sl1, input[type=text].sheet-sl1, span.sheet-sl1
|
|
{
|
|
width: 93%;
|
|
margin-right: 0;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* POWERS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-pow-container
|
|
{
|
|
display: flex;
|
|
flex-direction: row;
|
|
height: auto;
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
div.sheet-pow0, span.sheet-pow0,
|
|
div.sheet-pow1, input[type=text].sheet-pow1, span.sheet-pow1,
|
|
div.sheet-pow2, input[type=text].sheet-pow2, span.sheet-pow2,
|
|
div.sheet-pow3, textarea.sheet-pow3, span.sheet-pow3,
|
|
div.sheet-pow4
|
|
{
|
|
margin-right: .5%;
|
|
}
|
|
|
|
div.sheet-pow0
|
|
{
|
|
width: 3%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pow1, input[type=text].sheet-pow1, span.sheet-pow1
|
|
{
|
|
width: 6.6%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pow2
|
|
{
|
|
width: 15%;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-pow2 > input[type=text],
|
|
div.sheet-pow2 > span
|
|
{
|
|
height: auto;
|
|
padding: 0 8px 1px;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-pow3
|
|
{
|
|
height: auto;
|
|
width: 63.9%;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-pow3 > textarea
|
|
{
|
|
height: auto;
|
|
min-height: 20px;
|
|
overflow: hidden;
|
|
resize: vertical;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
div.sheet-pow3 > span
|
|
{
|
|
height: auto;
|
|
min-height: 20px;
|
|
text-align: left;
|
|
padding: 0 8px;
|
|
resize: none;
|
|
white-space: unset;
|
|
overflow: hidden;
|
|
}
|
|
|
|
div.sheet-pow3 > button[type=roll]
|
|
{
|
|
height: 100%;
|
|
}
|
|
|
|
div.sheet-pow4
|
|
{
|
|
width: 6.6%;
|
|
height: 20px;
|
|
margin-right: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
/* end_cost or remaining_charges? */
|
|
div.sheet-button > span.sheet-end-cost
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
div.sheet-button > span.sheet-remaining-charges
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-remaining-charges:checked ~ div.sheet-tabbed-content span.sheet-end-cost
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox].sheet-remaining-charges:checked ~ div.sheet-tabbed-content span.sheet-remaining-charges
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* POWER DETAIL EXPANDED AREA */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
input[type=checkbox].sheet-pow-expand, input[type=checkbox].sheet-pow-expand + span
|
|
{
|
|
height: 16px;
|
|
width: 16px;
|
|
position: absolute;
|
|
top: -2px;
|
|
right: .5%;
|
|
text-align: center;
|
|
}
|
|
|
|
input[type=checkbox].sheet-pow-expand
|
|
{
|
|
opacity: 0;
|
|
z-index: 2;
|
|
}
|
|
|
|
input[type=checkbox].sheet-pow-expand + span
|
|
{
|
|
font-family: "Pictos";
|
|
font-size: 16px;
|
|
font-style: normal;
|
|
color: #AAA;
|
|
user-select: none;
|
|
height: 16px;
|
|
}
|
|
|
|
input[type=checkbox].sheet-pow-expand:checked + span
|
|
{
|
|
color: black;
|
|
}
|
|
|
|
input[type=checkbox].sheet-pow-expand:hover + span
|
|
{
|
|
color: yellow;
|
|
text-shadow: 0 0 1px black;
|
|
}
|
|
|
|
div.sheet-pow-detail
|
|
{
|
|
width: 71%;
|
|
display: none;
|
|
margin-left: 22.5%;
|
|
margin-bottom: -8%;
|
|
transform: scale(.9);
|
|
transform-origin: top center;
|
|
}
|
|
|
|
input[type=checkbox].sheet-pow-expand:checked ~ div.sheet-pow-detail
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
div.sheet-pd-section-head
|
|
{
|
|
display: flex;
|
|
flex-direction: row;
|
|
width: 100%;
|
|
height: 8px;
|
|
margin-top: 8px;
|
|
}
|
|
|
|
div.sheet-pd-section-head div
|
|
{
|
|
width: 40%;
|
|
height: 100%;
|
|
}
|
|
|
|
div.sheet-pd-section-head div:first-child
|
|
{
|
|
border-top: solid 3px #BBB;
|
|
border-left: solid 3px #BBB;
|
|
border-top-left-radius: 6px;
|
|
}
|
|
|
|
div.sheet-pd-section-head div:first-child + div
|
|
{
|
|
width: 20%;
|
|
margin-top: -4px;
|
|
color: #BBB;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd-section-head div:first-child + div + div
|
|
{
|
|
border-top: solid 3px #BBB;
|
|
border-right: solid 3px #BBB;
|
|
border-top-right-radius: 6px;
|
|
}
|
|
|
|
div.sheet-pd-section
|
|
{
|
|
width: 100%;
|
|
margin-bottom: 4px;
|
|
padding: 8px;
|
|
border-left: solid 3px #BBB;
|
|
border-right: solid 3px #BBB;
|
|
border-bottom: solid 3px #BBB;
|
|
border-bottom-left-radius: 6px;
|
|
border-bottom-right-radius: 6px;
|
|
}
|
|
|
|
div.sheet-pd-attack-wrapper
|
|
{
|
|
border-left: solid 3px #BBB;
|
|
padding-left: 8px;
|
|
margin-left: 17px;
|
|
}
|
|
|
|
div.sheet-pd-attack-wrapper input[type=number],
|
|
div.sheet-pd-attack-wrapper input[type=text],
|
|
div.sheet-pd-attack-wrapper select,
|
|
div.sheet-pd-attack-wrapper span
|
|
{
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
}
|
|
|
|
div.sheet-pd-row
|
|
{
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: row;
|
|
height: 20px;
|
|
width: 100%;
|
|
margin-top: 3px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
div.sheet-pd-row.sheet-heads
|
|
{
|
|
height: 20px;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
div.sheet-pd-row.sheet-pd-gap
|
|
{
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
div.sheet-math
|
|
{
|
|
height: 16px;
|
|
width: 5%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd6, select.sheet-pd6, span.sheet-pd6,
|
|
div.sheet-pd7, input[type=text].sheet-pd7, span.sheet-pd7,
|
|
div.sheet-pd8, select.sheet-pd8, span.sheet-pd8,
|
|
div.sheet-pd9, input[type=number].sheet-pd9, span.sheet-pd9,
|
|
div.sheet-pd10, select.sheet-pd10, span.sheet-pd10,
|
|
div.sheet-pd11, input[type=text].sheet-pd11, span.sheet-pd11,
|
|
div.sheet-pd12, input[type=checkbox].sheet-pd12,
|
|
div.sheet-pd13, select.sheet-pd13, span.sheet-pd13,
|
|
div.sheet-pd14, input[type=number].sheet-pd14, span.sheet-pd14,
|
|
div.sheet-pd15, input[type=checkbox].sheet-pd15,
|
|
div.sheet-pd-attack-config, select.sheet-pd-attack-config, span.sheet-pd-attack-config,
|
|
div.sheet-pd16, select.sheet-pd16, span.sheet-pd16,
|
|
div.sheet-pd17, select.sheet-pd17, span.sheet-pd17,
|
|
div.sheet-pd18, select.sheet-pd18, span.sheet-pd18,
|
|
div.sheet-pd19, input[type=text].sheet-pd19, span.sheet-pd19,
|
|
div.sheet-pd20,
|
|
div.sheet-pd21, input[type=number].sheet-pd21, span.sheet-pd21,
|
|
div.sheet-pd22,
|
|
div.sheet-pd23, input[type=text].sheet-pd23, span.sheet-pd23,
|
|
div.sheet-pd24, select.sheet-pd24, span.sheet-pd24,
|
|
div.sheet-pd25, input[type=text].sheet-pd25, span.sheet-pd25,
|
|
div.sheet-pd26
|
|
{
|
|
margin-right: 1%;
|
|
}
|
|
|
|
div.sheet-pd1, input[type=number].sheet-pd1, span.sheet-pd1,
|
|
div.sheet-pd2, input[type=number].sheet-pd2, span.sheet-pd2,
|
|
div.sheet-pd3, input[type=number].sheet-pd3, span.sheet-pd3,
|
|
div.sheet-pd4, input[type=number].sheet-pd4, span.sheet-pd4,
|
|
div.sheet-pd5, input[type=number].sheet-pd5, span.sheet-pd5
|
|
{
|
|
width: 15%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd6, select.sheet-pd6, span.sheet-pd6
|
|
{
|
|
width: 40%;
|
|
}
|
|
|
|
div.sheet-pd7, input[type=text].sheet-pd7, span.sheet-pd7
|
|
{
|
|
width: 58%;
|
|
}
|
|
|
|
div.sheet-pd8, select.sheet-pd8, span.sheet-pd8
|
|
{
|
|
width: 17.5%;
|
|
}
|
|
|
|
div.sheet-pd9, input[type=number].sheet-pd9, span.sheet-pd9
|
|
{
|
|
width: 14%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd10, select.sheet-pd10, span.sheet-pd10
|
|
{
|
|
width: 17%;
|
|
}
|
|
|
|
div.sheet-pd11, input[type=text].sheet-pd11, span.sheet-pd11
|
|
{
|
|
width: 34%;
|
|
}
|
|
|
|
div.sheet-pd12
|
|
{
|
|
width: 14.5%;
|
|
margin-left: -2%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd13, select.sheet-pd13, span.sheet-pd13
|
|
{
|
|
width: 31.66%;
|
|
}
|
|
|
|
div.sheet-pd14, input[type=number].sheet-pd14, span.sheet-pd14
|
|
{
|
|
width: 14%;
|
|
margin-right: 3%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd15, input[type=checkbox].sheet-pd15
|
|
{
|
|
float: left;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
div.sheet-pd-attack-config, select.sheet-pd-attack-config, span.sheet-pd-attack-config
|
|
{
|
|
width: 33%;
|
|
}
|
|
|
|
/* disable attack section if not in use */
|
|
input[type=checkbox].sheet-pd15 + div.sheet-pd-attack-wrapper *
|
|
{
|
|
opacity: .6;
|
|
z-index: -1;
|
|
pointer-events: none;
|
|
-webkit-user-select: none; /* Safari 3.1+ */
|
|
-moz-user-select: none; /* Firefox 2+ */
|
|
-ms-user-select: none; /* IE 10+ */
|
|
user-select: none; /* Standard syntax */
|
|
}
|
|
|
|
input[type=checkbox].sheet-pd15:checked + div.sheet-pd-attack-wrapper *
|
|
{
|
|
opacity: 1;
|
|
z-index: 0;
|
|
pointer-events: auto;
|
|
pointer-events: auto;
|
|
-webkit-user-select: auto; /* Safari 3.1+ */
|
|
-moz-user-select: auto; /* Firefox 2+ */
|
|
-ms-user-select: auto; /* IE 10+ */
|
|
user-select: auto; /* Standard syntax */
|
|
}
|
|
|
|
div.sheet-pd16, select.sheet-pd16, span.sheet-pd16
|
|
{
|
|
width: 16.5%;
|
|
}
|
|
|
|
div.sheet-pd17, select.sheet-pd17, span.sheet-pd17
|
|
{
|
|
width: 27%;
|
|
}
|
|
|
|
div.sheet-pd18, select.sheet-pd18, span.sheet-pd18
|
|
{
|
|
width: 19%;
|
|
}
|
|
|
|
div.sheet-pd19, input[type=text].sheet-pd19, span.sheet-pd19
|
|
{
|
|
width: 12%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd20
|
|
{
|
|
width: 8%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd21, input[type=number].sheet-pd21, span.sheet-pd21
|
|
{
|
|
width: 14%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd22
|
|
{
|
|
width: 11%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd23, input[type=text].sheet-pd23, span.sheet-pd23
|
|
{
|
|
width: 25.4%;
|
|
}
|
|
|
|
div.sheet-pd24, select.sheet-pd24, span.sheet-pd24
|
|
{
|
|
width: 17%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd25, input[type=text].sheet-pd25, span.sheet-pd25
|
|
{
|
|
width: 39.5%;
|
|
}
|
|
|
|
div.sheet-pd26
|
|
{
|
|
width: 10%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd27, span.sheet-pd27,
|
|
div.sheet-pd28, span.sheet-pd28
|
|
{
|
|
width: 12%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd29, span.sheet-pd29
|
|
{
|
|
width: 16.5%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-pd30, span.sheet-pd30
|
|
{
|
|
width: 24%;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* BACKGROUND SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-background
|
|
{
|
|
height: auto;
|
|
margin-bottom: 3px;
|
|
text-align: left;
|
|
}
|
|
|
|
div.sheet-background > textarea
|
|
{
|
|
height: auto;
|
|
min-height: 126px;
|
|
resize: vertical;
|
|
}
|
|
|
|
div.sheet-background > span
|
|
{
|
|
height: auto;
|
|
min-height: 20px;
|
|
max-height: 126px;
|
|
resize: none;
|
|
white-space: pre-wrap;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
div.sheet-app1, input[type=text].sheet-app1, span.sheet-app1,
|
|
div.sheet-app2, input[type=text].sheet-app2, span.sheet-app2,
|
|
div.sheet-app3, input[type=text].sheet-app3, span.sheet-app3
|
|
{
|
|
margin-right: 2%;
|
|
}
|
|
|
|
div.sheet-app1, div.sheet-app2, div.sheet-app3
|
|
{
|
|
font-weight: bold;
|
|
}
|
|
|
|
div.sheet-app1
|
|
{
|
|
width: 12%;
|
|
}
|
|
|
|
div.sheet-app2
|
|
{
|
|
width: 8%;
|
|
}
|
|
|
|
div.sheet-app3
|
|
{
|
|
width: 12%;
|
|
}
|
|
|
|
input[type=text].sheet-app1, span.sheet-app1,
|
|
input[type=text].sheet-app2, span.sheet-app2,
|
|
input[type=text].sheet-app3, span.sheet-app3
|
|
{
|
|
width: 15%;
|
|
text-align: center;
|
|
}
|
|
|
|
input[type=text].sheet-app1, span.sheet-app1,
|
|
input[type=text].sheet-app2, span.sheet-app2
|
|
{
|
|
margin-right: 6.6%;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* COMPLICATIONS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-comp1, input[type=number].sheet-comp1, span.sheet-comp1,
|
|
div.sheet-comp2, input[type=text].sheet-comp2, span.sheet-comp2
|
|
{
|
|
}
|
|
|
|
div.sheet-comp1, input[type=number].sheet-comp1, span.sheet-comp1
|
|
{
|
|
width: 15%;
|
|
margin-right: 1%;
|
|
text-align: center;
|
|
}
|
|
|
|
div.sheet-comp2, input[type=text].sheet-comp2, span.sheet-comp2
|
|
{
|
|
width: 83%;
|
|
text-align: left;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* EXPERIENCE POINTS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-xp1,
|
|
div.sheet-xp2, input[type=number].sheet-xp2, span.sheet-xp2
|
|
{
|
|
}
|
|
|
|
div.sheet-xp1, div.sheet-xp2
|
|
{
|
|
width: 50%;
|
|
}
|
|
|
|
input[type=number].sheet-xp2, span.sheet-xp2
|
|
{
|
|
width: 15%;
|
|
margin-right: 10%;
|
|
}
|
|
|
|
div.sheet-xp1
|
|
{
|
|
font-weight: bold;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* OPTIONS SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
input[type=checkbox].sheet-op0
|
|
{
|
|
width: 10%;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
div.sheet-op1
|
|
{
|
|
width: 48%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
input[type=checkbox].sheet-op0 + div.sheet-op1
|
|
{
|
|
width: auto;
|
|
}
|
|
|
|
select.sheet-op2, span.sheet-op2
|
|
{
|
|
width: 48%;
|
|
}
|
|
|
|
label.sheet-op2
|
|
{
|
|
font-size: 12px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
label.sheet-op2 > input[type=radio]
|
|
{
|
|
margin-right: 3%;
|
|
}
|
|
|
|
div.sheet-option-break
|
|
{
|
|
padding: 0 8px;
|
|
margin: 8px 0;
|
|
border-top: solid 2px lightgrey;
|
|
}
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* HIDDEN SECTION */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
div.sheet-hd1
|
|
{
|
|
float: left;
|
|
width: 50%;
|
|
margin: 1%;
|
|
font-weight: bold;
|
|
text-align: right;
|
|
}
|
|
|
|
input[type=text].sheet-hd2,
|
|
input[type=number].sheet-hd2,
|
|
input[type=checkbox].sheet-hd2
|
|
{
|
|
width: 40%;
|
|
margin: 1%;
|
|
text-align: left;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ------------------------------------------------------- */
|
|
/* */
|
|
/* ROLL TEMPLATE(S) */
|
|
/* */
|
|
/* ------------------------------------------------------- */
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-main-wrap
|
|
{
|
|
padding-top: 16px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template span.sheet-rt-roll > span.inlinerollresult
|
|
{
|
|
padding: 1px 4px 0 4px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-main
|
|
{
|
|
position: relative;
|
|
margin-right: 16px;
|
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
background-color: white;
|
|
border: solid black 2px;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-callout-wrapper
|
|
{
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-around;
|
|
position: absolute;
|
|
top: -16px;
|
|
right: -16px;
|
|
height: 47px;
|
|
width: 47px;
|
|
border-radius: 24px;
|
|
background-color: black;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-callout
|
|
{
|
|
position: relative;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-callout > div:first-child
|
|
{
|
|
color: #CCC;
|
|
font-size: 30px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
padding-right: 1px;
|
|
}
|
|
|
|
/* callout tooltip container */
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-callout > div + div
|
|
{
|
|
display: none;
|
|
flex-direction: column;
|
|
width: fit-content;
|
|
|
|
position: absolute;
|
|
bottom: 24px;
|
|
right: 0;
|
|
|
|
color: yellow;
|
|
background-color: black;
|
|
opacity: .9;
|
|
border-radius: 4px;
|
|
|
|
padding: 4px 8px;
|
|
}
|
|
|
|
/* make tooltip visible */
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-callout:hover > div + div
|
|
{
|
|
display: flex;
|
|
}
|
|
|
|
/* tooltip detail */
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-callout-mod
|
|
{
|
|
display: flex;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-callout-mod span
|
|
{
|
|
display: block;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-callout-mod span:first-child
|
|
{
|
|
width: 13px;
|
|
padding-right: 8px;
|
|
text-align: right;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-title
|
|
{
|
|
min-height: 16px;
|
|
margin-top: -2px;
|
|
padding: 3px 18px 2px 0;
|
|
text-align: center;
|
|
color: #DDD;
|
|
background-color: black;
|
|
border-top-left-radius: 8px;
|
|
border-top-right-radius: 8px;
|
|
border-bottom: solid black 2px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-title > span
|
|
{
|
|
display: block;
|
|
width: 60%;
|
|
margin-left: 4.5%;
|
|
transform: scalex(1.5);
|
|
transform-origin: bottom left;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-line
|
|
{
|
|
font-size: 12px;
|
|
margin-top: 2px;
|
|
margin-bottom: 2px;
|
|
padding: 3px 8px 2px 8px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-head
|
|
{
|
|
line-height: 16px;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
padding-top: 8px;
|
|
padding-bottom: 4px;
|
|
padding-right: 16px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-line > span:first-child
|
|
{
|
|
font-weight: bold;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-body
|
|
{
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
padding: 12px 0 8px 8px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-body > span:first-child
|
|
{
|
|
border: solid black 2px;
|
|
background-color: #e6e6e6;
|
|
padding: 0 5px;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-damage
|
|
{
|
|
height: 24px;
|
|
font-size: 12px;
|
|
padding: 12px 8px .379px 8px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-damage > span
|
|
{
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-dcvhit
|
|
{
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
padding: 12px 8px 8px 8px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-dcvhit > span:first-child
|
|
{
|
|
border: solid black 2px;
|
|
background-color: #e6e6e6;
|
|
padding: 0 5px;
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
margin-right: 3px;
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-hero6template div.sheet-rt-divider
|
|
{
|
|
border-bottom: solid #DDD 1px; /* yeah, it's not rem */
|
|
} |