Great Mustache Jonathan
dbdae47020
### 1.8.9.91 on 2017 November 27th * Inventory, Notes, Goals, Beliefs, & Instincts can now be sent to chat * Inventory Area Re-worked
970 lines
34 KiB
CSS
970 lines
34 KiB
CSS
/* Various area/container settings */
|
|
/* the overall page viewed on the website */
|
|
.charsheet {
|
|
font-family: Arial, Verdana, sans-serif;
|
|
padding: 0px;
|
|
-webkit-box-sizing: border-box;
|
|
-mox-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
/* make padding/border/margin appear INSIDE div area */
|
|
.charsheet textarea, div, input, button {
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
/* make it only expand and shrink to so wide & still be centered */
|
|
.sheet-container {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
min-width: 320px;
|
|
padding: 0;
|
|
background-color: white;
|
|
color: black;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
/* make third only expand and shrink to so wide & still be centered */
|
|
.sheet-third {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 275px;
|
|
padding: 0;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
/* make third only expand and shrink to so wide & still be centered */
|
|
.sheet-fifth {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 165px;
|
|
padding: 0;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
/* temp make two-third only expand and shrink to so wide & still be centered */
|
|
.sheet-twoThird {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
max-width: 550px;
|
|
padding: 0;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
/* for show/hide sections of the sheet sliders */
|
|
.sheet-sliders {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 65px;
|
|
padding: 0;
|
|
text-align: center;
|
|
vertical-align: bottom;
|
|
}
|
|
/* Evasion Background paper look */
|
|
.sheet-evasion {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Evasion.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 155px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Toughness Background paper look */
|
|
.sheet-toughness {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Toughness.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 155px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Resolve Background paper look */
|
|
.sheet-resolve {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Resolve.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 155px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Hit Points Background paper look */
|
|
.sheet-hitPoints {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Hit%20Points.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 225px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Speed & Lethal Damage Background paper look */
|
|
.sheet-speedLethalDamage {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Speed%20and%20Lethal%20Damage.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 175px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Wealth Background paper look */
|
|
.sheet-wealth {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Wealth.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 55px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Wealth Background paper look */
|
|
.sheet-attributes {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Attributes.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 100px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Action Top Background paper look */
|
|
.sheet-actionsTop {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Actions%20Top.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 50px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Action Middle Background paper look */
|
|
.sheet-actionsMiddle {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Actions%20Middle.png");
|
|
background-repeat: repeat-y;
|
|
background-position: left top;
|
|
width: 275px;
|
|
min-height: 93px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Action Bottom Background paper look */
|
|
.sheet-actionsBottom {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Actions%20Bottom.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 275px;
|
|
height: 28px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Action Top Background paper look */
|
|
.sheet-equipmentTop {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Equipment%20Top.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 165px;
|
|
height: 15px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Action Middle Background paper look */
|
|
.sheet-equipmentMiddle {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Equipment%20Middle.png");
|
|
background-repeat: repeat-y;
|
|
background-position: left top;
|
|
width: 165px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Action Bottom Background paper look */
|
|
.sheet-equipmentBottom {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Equipment%20Bottom.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 165px;
|
|
height: 20px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Roll Top Background paper look */
|
|
.sheet-rolltemplate-openLegend .sheet-rollTop {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Roll%20Top.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 250px;
|
|
height: 50px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Roll Middle Background paper look */
|
|
.sheet-rolltemplate-openLegend .sheet-rollMiddle {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Roll%20Middle.png");
|
|
background-repeat: repeat-y;
|
|
background-position: left top;
|
|
width: 250px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* Roll Bottom Background paper look */
|
|
.sheet-rolltemplate-openLegend .sheet-rollBottom {
|
|
background-image: url("https://raw.githubusercontent.com/BuildAndDie/roll20-character-sheets/master/Open%20Legend%20Basic%20by%20Great%20Moustache/BG%20Roll%20Bottom.png");
|
|
background-repeat: no-repeat;
|
|
background-position: left top;
|
|
width: 250px;
|
|
height: 50px;
|
|
padding: 0;
|
|
background-color: white;
|
|
}
|
|
/* sometimes you need a row of divs to look and act like a table... deal */
|
|
.sheet-makeTable, .sheet-rolltemplate-openLegend .sheet-makeTable { display: table; }
|
|
|
|
.sheet-makeCell, .sheet-rolltemplate-openLegend .sheet-makeCell { display: table-cell; }
|
|
/* Border effects */
|
|
.sheet-borderRound, .sheet-rolltemplate-openLegend .sheet-borderRound { border-radius: 4px; }
|
|
|
|
.sheet-borderAll, .sheet-rolltemplate-openLegend .sheet-borderAll { border: 1px solid black; }
|
|
.sheet-borderRight, .sheet-rolltemplate-openLegend .sheet-borderRight { border-right: 1px solid black; }
|
|
.sheet-borderLeft, .sheet-rolltemplate-openLegend .sheet-borderLeft { border-left: 1px solid black; }
|
|
.sheet-borderTop, .sheet-rolltemplate-openLegend .sheet-borderTop { border-top: 1px solid black; }
|
|
.sheet-borderBottom, .sheet-rolltemplate-openLegend .sheet-borderBottom { border-bottom: 1px solid black; }
|
|
|
|
.sheet-borderAllDotted, .sheet-rolltemplate-openLegend .sheet-borderAllDotted { border: 1px dashed black; }
|
|
.sheet-borderRightDotted, .sheet-rolltemplate-openLegend .sheet-borderRightDotted { border-right: 1px dashed black; }
|
|
.sheet-borderLeftDotted, .sheet-rolltemplate-openLegend .sheet-borderLeftDotted { border-left: 1px dashed black; }
|
|
.sheet-borderTopDotted, .sheet-rolltemplate-openLegend .sheet-borderTopDotted { border-top: 1px dashed black; }
|
|
.sheet-borderBottomDotted, .sheet-rolltemplate-openLegend .sheet-borderBottomDotted { border-bottom: 1px dashed black; }
|
|
|
|
/* Padding effects */
|
|
.sheet-padAll, .sheet-rolltemplate-openLegend .sheet-padAll {
|
|
padding-Right: 2px;
|
|
padding-Left: 2px;
|
|
padding-Top: 2px;
|
|
padding-Bottom: 2px;
|
|
-webkit-box-sizing: border-box;
|
|
-mox-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.sheet-padRight, .sheet-rolltemplate-openLegend .sheet-padRight {
|
|
padding-Right: 10px;
|
|
-webkit-box-sizing: border-box;
|
|
-mox-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.sheet-padLeft, .sheet-rolltemplate-openLegend .sheet-padLeft {
|
|
padding-Left: 10px;
|
|
-webkit-box-sizing: border-box;
|
|
-mox-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.sheet-padTop, .sheet-rolltemplate-openLegend .sheet-padTop {
|
|
padding-Top: 12px;
|
|
-webkit-box-sizing: border-box;
|
|
-mox-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.sheet-padBottom, .sheet-rolltemplate-openLegend .sheet-padBottom {
|
|
padding-Bottom: 6px;
|
|
-webkit-box-sizing: border-box;
|
|
-mox-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* Resizing text Boxes options */
|
|
.sheet-resizeNone textarea, .sheet-rolltemplate-openLegend .sheet-resizeNone textarea { resize: none; overflow: auto; }
|
|
.sheet-resizeVert textarea, .sheet-rolltemplate-openLegend .sheet-resizeVert textarea { resize: vertical; overflow: auto; }
|
|
.sheet-resizeHorz textarea, .sheet-rolltemplate-openLegend .sheet-resizeHorz textarea { resize: horizontal; overflow: auto; }
|
|
.sheet-resizeBoth textarea, .sheet-rolltemplate-openLegend .sheet-resizeBoth textarea { resize: both; overflow: auto; }
|
|
|
|
/* Text effects */
|
|
.sheet-bold, .sheet-rolltemplate-openLegend .sheet-bold { font-weight: bold; }
|
|
.sheet-bolder, .sheet-rolltemplate-openLegend .sheet-bolder { font-weight: 900; }
|
|
.sheet-italic, .sheet-rolltemplate-openLegend .sheet-italic { font-style: italic; }
|
|
|
|
.sheet-textSmall, .sheet-rolltemplate-openLegend .sheet-textSmall {
|
|
font-size: 0.7em;
|
|
font-family: Verdana, sans-serif;
|
|
}
|
|
.sheet-textMedium, .sheet-rolltemplate-openLegend .sheet-textMedium { font-size: 1.0em; }
|
|
.sheet-textLarge, .sheet-rolltemplate-openLegend .sheet-textLarge { font-size: 1.2em; }
|
|
.sheet-textLarger, .sheet-rolltemplate-openLegend .sheet-textLarger {
|
|
font-size: 1.5em;
|
|
font-family: Georgia, Verdana, sans-serif;
|
|
}
|
|
.sheet-textLargest, .sheet-rolltemplate-openLegend .sheet-textLargest {
|
|
font-size: 2.0em;
|
|
font-family: Georgia, Verdana, sans-serif;
|
|
}
|
|
/* START alignment */
|
|
.sheet-textLeft, .sheet-rolltemplate-openLegend .sheet-textLeft { text-align: left; }
|
|
.sheet-textRight, .sheet-rolltemplate-openLegend .sheet-textRight { text-align: right; }
|
|
.sheet-textCenter, .sheet-rolltemplate-openLegend .sheet-textCenter { text-align: center; }
|
|
|
|
.sheet-vertTop, .sheet-rolltemplate-openLegend .sheet-vertTop { vertical-align: top; }
|
|
.sheet-vertMiddle, .sheet-rolltemplate-openLegend .sheet-vertMiddle { vertical-align: middle; }
|
|
.sheet-vertBottom, .sheet-rolltemplate-openLegend .sheet-vertBottom { vertical-align: bottom; }
|
|
|
|
/* START Display */
|
|
.sheet-inlineBlock, .sheet-rolltemplate-openLegend .sheet-inlineBlock { display: inline-block; }
|
|
.sheet-block, .sheet-rolltemplate-openLegend .sheet-block { display: block; }
|
|
.sheet-inline, .sheet-rolltemplate-openLegend .sheet-inline { display: inline; }
|
|
|
|
.sheet-marginCenter, .sheet-rolltemplate-openLegend .sheet-marginCenter { margin: 0 auto; }
|
|
.sheet-marginTop, .sheet-rolltemplate-openLegend .sheet-marginTop { margin-top: 5px; }
|
|
.sheet-marginBottom, .sheet-rolltemplate-openLegend .sheet-margiBottom { margin-bottom: 5px; }
|
|
.sheet-marginLeft, .sheet-rolltemplate-openLegend .sheet-marginLeft { margin-left: 5px; }
|
|
.sheet-marginRight, .sheet-rolltemplate-openLegend .sheet-marginRight { margin-right: 5px; }
|
|
|
|
/* add shadows to text or divs/boxes */
|
|
.sheet-boxShadow, .sheet-rolltemplate-openLegend .sheet-boxShadow { box-shadow: 0 2px 8px rgba(0, 0, 0, .3); }
|
|
.sheet-textShadow, .sheet-rolltemplate-openLegend .sheet-textShadow { text-shadow: 2px 2px 8px #000000; }
|
|
|
|
.sheet-scroll, .sheet-rolltemplate-openLegend .sheet-scroll { overflow-y: auto; }
|
|
/* Text & Number formatting */
|
|
.charsheet input, .charsheet select {
|
|
display: inline-block;
|
|
width: 95%;
|
|
padding-Top: 0;
|
|
padding-Bottom: 0;
|
|
}
|
|
/*** Remove the 'spinners' (up/down graphic arrows), mouse wheel still works as well as up/down arrows on keyboard ***/
|
|
input[type=number]::-webkit-inner-spin-button,
|
|
input[type=number]::-webkit-outer-spin-button {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: textfield;
|
|
appearance: none;
|
|
margin: 0;
|
|
}
|
|
input[type=number] {
|
|
-moz-appearance: textfield;
|
|
}
|
|
/*** Select fields (options) without border or down arrow ***/
|
|
.sheet-inputSelect select {
|
|
border: 0px;
|
|
background: #AAAAAA;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
-webkit-border-radius: 2px;
|
|
border-radius: 2px;
|
|
color: white;
|
|
text-align: center;
|
|
display: inline-block;
|
|
font-size: 16px;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
line-height: 18px;
|
|
height: 18px;
|
|
}
|
|
/*** Input as numbers ***/
|
|
.sheet-inputNumber input[type=number], .sheet-inputNumber30 input[type=number], .sheet-inputNumber60 input[type=number] {
|
|
border-bottom: 1px solid #AAAAAA;
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: textfield;
|
|
-webkit-border-radius: 0px;
|
|
border-radius: 10px;
|
|
color: black;
|
|
text-align: center;
|
|
}
|
|
.sheet-inputNumber30 input[type=number] {
|
|
width: 30px;
|
|
height: 18px;
|
|
line-height: 18px;
|
|
}
|
|
.sheet-inputNumber60 input[type=number] {
|
|
width: 60px;
|
|
height: 18px;
|
|
line-height: 18px;
|
|
background-color: silver;
|
|
}
|
|
.sheet-inputNumberLarge input[type=number] {
|
|
border-bottom: 0px;
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: #cccccc;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: textfield;
|
|
height: 70px;
|
|
width: 80px;
|
|
text-align: center;
|
|
color: black;
|
|
font-size: 40px;
|
|
}
|
|
.sheet-inputNumberLargeSkinny input[type=number] {
|
|
border-bottom: 0px;
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: #111111;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: textfield;
|
|
height: 70px;
|
|
width: 60px;
|
|
text-align: center;
|
|
color: #cccccc;
|
|
font-size: 40px;
|
|
}
|
|
/*** Input as text for skill name (or just a blank line) ***/
|
|
.sheet-inputName input[type=text] {
|
|
border-bottom: 1px solid #AAAAAA;
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
-webkit-border-radius: 0px;
|
|
border-radius: 10px;
|
|
color: black;
|
|
}
|
|
.sheet-inputNameShort input[type=text] {
|
|
border-bottom: 1px solid #AAAAAA;
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: none;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
-webkit-border-radius: 0px;
|
|
border-radius: 10px;
|
|
color: black;
|
|
height: 18px;
|
|
line-height: 18px;
|
|
}
|
|
/*** Input as text for dice size (usually d4/d6/d8/d10 etc) ***/
|
|
.sheet-inputDice input[type=text] {
|
|
background: none;
|
|
border: dashed 1px #111111;
|
|
-webkit-border-radius: 4px;
|
|
border-radius: 4px;
|
|
text-align: center;
|
|
}
|
|
/*** Input as number for level of skill (typically 1 digit) ***/
|
|
.sheet-inputLevel input[type=number] {
|
|
border-bottom: 0px;
|
|
border-top: 0px;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
background: #AAAAAA;
|
|
box-shadow: none;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: textfield;
|
|
-webkit-border-radius: 20px;
|
|
border-radius: 20px;
|
|
text-align: center;
|
|
color: white;
|
|
width: 30px;
|
|
}
|
|
/*** Attribute Button formatting to make the line clickable ***/
|
|
.sheet-attributeButton button[type=roll] {
|
|
background-color: transparent;
|
|
color: black;
|
|
font-style: italic;
|
|
text-align: left;
|
|
border: none;
|
|
line-height: 18px;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
margin: 0px;
|
|
width: 100%;
|
|
}
|
|
/*** Resolve/Toughness/Agility Button formatting to make the line clickable ***/
|
|
.sheet-resistButton button[type=roll] {
|
|
background-color: transparent;
|
|
border: none;
|
|
font-weight: bold;
|
|
font-size: 2.0em;
|
|
font-family: Georgia, Verdana, sans-serif;
|
|
line-height: 18px;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
margin: 0px;
|
|
width: 100%;
|
|
}
|
|
/*** Inventory Button formatting to make the line clickable ***/
|
|
.sheet-inventoryButton button[type=roll] {
|
|
background-color: transparent;
|
|
color: black;
|
|
border: none;
|
|
line-height: 12px;
|
|
font-weight: bold;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
margin: 0px;
|
|
width: 100%;
|
|
}
|
|
/*** Resolve/Toughness/Agility Button formatting to make the line clickable ***/
|
|
.sheet-speedButton button[type=roll] {
|
|
background-color: #111111;
|
|
color: #cccccc;
|
|
border: none;
|
|
font-weight: bold;
|
|
font-size: 1.0em;
|
|
font-family: Georgia, Verdana, sans-serif;
|
|
line-height: 15px;
|
|
background-image: none;
|
|
border-radius: 10px;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
margin: 0px;
|
|
width: 100%;
|
|
}
|
|
button[type=roll]::before,
|
|
* button[type=roll]::before {
|
|
content: "" !important;
|
|
}
|
|
button[type=roll]:hover,
|
|
button[type=roll]:hover * {
|
|
font-weight: normal;
|
|
color: #AAAAAA;
|
|
}
|
|
button[type=roll] * {
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* Checkbox & Radio formatting */
|
|
/*** make regular checkboxes closer to surrounding items ***/
|
|
input.sheet-checks {
|
|
width: 12px;
|
|
height: 12px;
|
|
display: inline;
|
|
margin-left: -2px;
|
|
margin-right: -2px;
|
|
}
|
|
/*** same as above but 2x the size ***/
|
|
input.sheet-checks25 {
|
|
width: 25px;
|
|
height: 25px;
|
|
display: inline;
|
|
margin-left: -2px;
|
|
margin-right: -2px;
|
|
}
|
|
/*** Slider Checkbox ***/
|
|
input.sheet-checkboxSliderInvis {
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
z-index: 2;
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
opacity: 0;
|
|
cursor: pointer;
|
|
}
|
|
.sheet-checkboxSlider {
|
|
width: 60px;
|
|
height: 20px;
|
|
background: #333;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
border-radius: 25px;
|
|
position: relative;
|
|
}
|
|
/*** On position ***/
|
|
.sheet-checkboxSlider:before {
|
|
content: 'On';
|
|
position: absolute;
|
|
top: 1px;
|
|
left: 6px;
|
|
height: 2px;
|
|
color: #26ca28;
|
|
font-size: 14px;
|
|
}
|
|
/*** Off position ***/
|
|
.sheet-checkboxSlider:after {
|
|
content: 'Off';
|
|
position: absolute;
|
|
top: 1px;
|
|
left: 32px;
|
|
height: 1px;
|
|
color: #ddd;
|
|
font-size: 14px;
|
|
}
|
|
/*** Clickable 'Pill' ***/
|
|
.sheet-checkboxSlider label {
|
|
display: block;
|
|
width: 15px;
|
|
height: 10px;
|
|
border-radius: 25px;
|
|
transition: all .5s ease;
|
|
cursor: pointer;
|
|
position: absolute;
|
|
z-index: 1;
|
|
top: 5px;
|
|
left: 6px;
|
|
background: #ddd;
|
|
}
|
|
/*** Checkbox Checked ***/
|
|
.sheet-checkboxSlider input[type=checkbox]:checked + label {
|
|
left: 30px;
|
|
background: #26ca28;
|
|
}
|
|
/* Settings button as gear (uses letter 'y' in pictos font) as a checkbox to be used with javascript */
|
|
.sheet-settings {
|
|
display: inline-block;
|
|
width: 14px;
|
|
opacity: 0;
|
|
z-index: 2;
|
|
}
|
|
|
|
.sheet-settings + span {
|
|
margin-left: -17px;
|
|
font-size: 20px;
|
|
font-family: pictos;
|
|
color: #A0A0A0;
|
|
cursor: pointer;
|
|
display: inline-Block;
|
|
}
|
|
|
|
.sheet-settings:checked + span {
|
|
color: black;
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-settings:hover + span,
|
|
.sheet-settings:hover * {
|
|
color: blue;
|
|
display: inline-block;
|
|
}
|
|
|
|
/* Making the columns fit snug to each other inside the rows */
|
|
.sheet-row, .sheet-rolltemplate-openLegend .sheet-row {
|
|
letter-spacing: -0.31em;
|
|
*letter-spacing: normal;
|
|
*word-spacing: -0.43em;
|
|
}
|
|
/* Making what's in the columns be normal again */
|
|
.sheet-column, .sheet-rolltemplate-openLegend .sheet-column {
|
|
letter-spacing: normal;
|
|
word-spacing: normal;
|
|
}
|
|
/* Hide and Show different sections */
|
|
.sheet-agility_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-fortitude_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-might_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-learning_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-logic_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-perception_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-will_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-deception_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-persuasion_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-presence_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-alteration_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-creation_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-energy_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-entropy_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-influence_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-movement_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-prescience_display_sub_flag[value="show"] ~ .sheet-sub,
|
|
.sheet-protection_display_sub_flag[value="show"] ~ .sheet-sub {
|
|
background-color: #7FDBFF;
|
|
}
|
|
|
|
.sheet-displaySettings {
|
|
display: block;
|
|
}
|
|
|
|
.sheet-displayCharacter,
|
|
.sheet-displayAttributes,
|
|
.sheet-displayDefenses,
|
|
.sheet-displayHealthSpeed,
|
|
.sheet-displayFavoredActions,
|
|
.sheet-displayOtherActions,
|
|
.sheet-displayLegendaryItems,
|
|
.sheet-displayFeats,
|
|
.sheet-displayPerksFlaws,
|
|
.sheet-displayInventory,
|
|
.sheet-displayOtherInventory,
|
|
.sheet-displayGoalsBeliefs,
|
|
.sheet-displaySanity {
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-display_character_flag[value="hide"] ~ .sheet-displayCharacter,
|
|
.sheet-display_attributes_flag[value="hide"] ~ .sheet-displayAttributes,
|
|
.sheet-display_defenses_flag[value="hide"] ~ .sheet-displayDefenses,
|
|
.sheet-display_healthspeed_flag[value="hide"] ~ .sheet-displayHealthSpeed,
|
|
.sheet-display_favoredactions_flag[value="hide"] ~ .sheet-displayFavoredActions,
|
|
.sheet-display_otheractions_flag[value="hide"] ~ .sheet-displayOtherActions,
|
|
.sheet-display_legendaryitems_flag[value="hide"] ~ .sheet-displayLegendaryItems,
|
|
.sheet-display_feats_flag[value="hide"] ~ .sheet-displayFeats,
|
|
.sheet-display_perksflaws_flag[value="hide"] ~ .sheet-displayPerksFlaws,
|
|
.sheet-display_inventory_flag[value="hide"] ~ .sheet-displayInventory,
|
|
.sheet-display_otherinventory_flag[value="hide"] ~ .sheet-displayOtherInventory,
|
|
.sheet-display_goalsbeliefs_flag[value="hide"] ~ .sheet-displayGoalsBeliefs,
|
|
.sheet-display_sanity_flag[value="hide"] ~ .sheet-displaySanity,
|
|
.sheet-displaySettingsFlag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-agility_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-fortitude_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-might_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-learning_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-logic_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-perception_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-will_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-deception_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-persuasion_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-presence_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-alteration_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-creation_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-energy_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-entropy_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-influence_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-movement_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-prescience_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-protection_display_settings_flag[value="hide"] ~ .sheet-displaySettings,
|
|
.sheet-displaySettingsFlagInitiative[value="hide"] ~ .sheet-displaySettingsInitiative {
|
|
display: none;
|
|
}
|
|
/* Boring Pre-defined width & height options */
|
|
.sheet-width5, .sheet-rolltemplate-openLegend .sheet-width5 { width: 5%; }
|
|
.sheet-width6, .sheet-rolltemplate-openLegend .sheet-width6 { width: 6%; } /* for Attribute settings */
|
|
.sheet-width10, .sheet-rolltemplate-openLegend .sheet-width10 { width: 10%; }
|
|
.sheet-width15, .sheet-rolltemplate-openLegend .sheet-width15 { width: 15%; }
|
|
.sheet-width20, .sheet-rolltemplate-openLegend .sheet-width20 { width: 20%; }
|
|
.sheet-width25, .sheet-rolltemplate-openLegend .sheet-width25 { width: 25%; }
|
|
.sheet-width30, .sheet-rolltemplate-openLegend .sheet-width30 { width: 30%; }
|
|
.sheet-width35, .sheet-rolltemplate-openLegend .sheet-width35 { width: 35%; }
|
|
.sheet-width39, .sheet-rolltemplate-openLegend .sheet-width39 { width: 39%; } /* for Attribute settings */
|
|
.sheet-width40, .sheet-rolltemplate-openLegend .sheet-width40 { width: 40%; }
|
|
.sheet-width45, .sheet-rolltemplate-openLegend .sheet-width45 { width: 45%; }
|
|
.sheet-width50, .sheet-rolltemplate-openLegend .sheet-width50 { width: 50%; }
|
|
.sheet-width55, .sheet-rolltemplate-openLegend .sheet-width55 { width: 55%; }
|
|
.sheet-width60, .sheet-rolltemplate-openLegend .sheet-width60 { width: 60%; }
|
|
.sheet-width65, .sheet-rolltemplate-openLegend .sheet-width65 { width: 65%; }
|
|
.sheet-width70, .sheet-rolltemplate-openLegend .sheet-width70 { width: 70%; }
|
|
.sheet-width75, .sheet-rolltemplate-openLegend .sheet-width75 { width: 75%; }
|
|
.sheet-width80, .sheet-rolltemplate-openLegend .sheet-width80 { width: 80%; }
|
|
.sheet-width85, .sheet-rolltemplate-openLegend .sheet-width85 { width: 85%; }
|
|
.sheet-width90, .sheet-rolltemplate-openLegend .sheet-width90 { width: 90%; }
|
|
.sheet-width95, .sheet-rolltemplate-openLegend .sheet-width95 { width: 95%; }
|
|
.sheet-width100, .sheet-rolltemplate-openLegend .sheet-width100 { width: 100%; }
|
|
.sheet-width1of3, .sheet-width2of6, .sheet-rolltemplate-openLegend .sheet-width1of3, .sheet-rolltemplate-openLegend .sheet-width2of6 { width: 33.33333%; }
|
|
.sheet-width2of3, .sheet-width4of6, .sheet-rolltemplate-openLegend .sheet-width4of6, .sheet-rolltemplate-openLegend .sheet-width4of6 { width: 66.66667%; }
|
|
.sheet-width1of6, .sheet-rolltemplate-openLegend .sheet-width1of6 { width: 16.66667%; }
|
|
.sheet-width5of6, .sheet-rolltemplate-openLegend .sheet-width5of6 { width: 83.33333%; }
|
|
.sheet-width1of8, .sheet-rolltemplate-openLegend .sheet-width1of8 { width: 12.5%; }
|
|
.sheet-width3of8, .sheet-rolltemplate-openLegend .sheet-width3of8 { width: 37.5%; }
|
|
.sheet-width5of8, .sheet-rolltemplate-openLegend .sheet-width5of8 { width: 62.5%; }
|
|
.sheet-width7of8, .sheet-rolltemplate-openLegend .sheet-width7of8 { width: 87.5%; }
|
|
.sheet-width165 { width: 165px; }
|
|
.sheet-width275 { width: 275px; }
|
|
.sheet-width825 { width: 825px; }
|
|
|
|
.sheet-height5, .sheet-rolltemplate-openLegend .sheet-height5 { height: 5px; }
|
|
.sheet-height10, .sheet-rolltemplate-openLegend .sheet-height10 { height: 10px; }
|
|
.sheet-height15, .sheet-rolltemplate-openLegend .sheet-height15 { height: 15px; }
|
|
.sheet-height25, .sheet-rolltemplate-openLegend .sheet-height25 { height: 25px; }
|
|
.sheet-height40, .sheet-rolltemplate-openLegend .sheet-height40 { height: 40px; }
|
|
.sheet-height50, .sheet-rolltemplate-openLegend .sheet-height50 { height: 50px; }
|
|
.sheet-height75, .sheet-rolltemplate-openLegend .sheet-height75 { height: 75px; }
|
|
.sheet-height80, .sheet-rolltemplate-openLegend .sheet-height80 { height: 80px; }
|
|
.sheet-height100, .sheet-rolltemplate-openLegend .sheet-height100 { height: 100px; }
|
|
.sheet-height150, .sheet-rolltemplate-openLegend .sheet-height150 { height: 150px; }
|
|
|
|
/* All the color options for background & text
|
|
* Colors: black, silver, gray/grey, white, red, navy, aqua,
|
|
* purple, blue, teal, olive, green, lime, yellow, orange, maroon, fuchsia
|
|
* text[Colorname] for text version
|
|
*/
|
|
.sheet-black, .sheet-rolltemplate-openLegend .sheet-black {
|
|
background-color: #111111;
|
|
color: #FFFFFF;
|
|
}
|
|
.sheet-textBlack, .sheet-rolltemplate-openLegend .sheet-textBlack {
|
|
color: #111111;;
|
|
}
|
|
|
|
.sheet-silver, .sheet-rolltemplate-openLegend .sheet-silver {
|
|
background-color: #DDDDDD;
|
|
color: #111111;
|
|
}
|
|
.sheet-textSilver, .sheet-rolltemplate-openLegend .sheet-textSilver {
|
|
color: #DDDDDD;
|
|
}
|
|
|
|
.sheet-gray, .sheet-grey, .sheet-rolltemplate-openLegend .sheet-gray, .sheet-rolltemplate-openLegend .sheet-grey {
|
|
background-color: #AAAAAA;
|
|
color: #111111;
|
|
}
|
|
.sheet-textGray, .sheet-textGrey, .sheet-rolltemplate-openLegend .sheet-textGray, .sheet-rolltemplate-openLegend .sheet-textGrey {
|
|
color: #AAAAAA;
|
|
}
|
|
|
|
.sheet-white, .sheet-rolltemplate-openLegend .sheet-white {
|
|
background-color: #FFFFFF;
|
|
color: #111111;
|
|
}
|
|
.sheet-textWhite, .sheet-rolltemplate-openLegend .sheet-textWhite {
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.sheet-red, .sheet-rolltemplate-openLegend .sheet-red {
|
|
background-color: #FF4136;
|
|
color: #FFFFFF;
|
|
}
|
|
.sheet-textRed, .sheet-rolltemplate-openLegend .sheet-textRed {
|
|
color: #FF4136;
|
|
}
|
|
|
|
.sheet-navy, .sheet-rolltemplate-openLegend .sheet-navy {
|
|
background-color: #001F3F;
|
|
color: #FFFFFF;
|
|
}
|
|
.sheet-textNavy, .sheet-rolltemplate-openLegend .sheet-textNavy {
|
|
color: #001F3F;
|
|
}
|
|
|
|
.sheet-aqua, .sheet-rolltemplate-openLegend .sheet-aqua {
|
|
background-color: #7FDBFF;
|
|
color: #111111;
|
|
}
|
|
.sheet-textAqua, .sheet-rolltemplate-openLegend .sheet-textAqua {
|
|
color: #7FDBFF;;
|
|
}
|
|
|
|
.sheet-purple, .sheet-rolltemplate-openLegend .sheet-purple {
|
|
background-color: #B10DC9;
|
|
color: #FFFFFF;
|
|
}
|
|
.sheet-textPurple, .sheet-rolltemplate-openLegend .sheet-textPurple {
|
|
color: #B10DC9;
|
|
}
|
|
|
|
.sheet-blue, .sheet-rolltemplate-openLegend .sheet-blue {
|
|
background-color: #0074D9;
|
|
color: #FFFFFF;
|
|
}
|
|
.sheet-textBlue, .sheet-rolltemplate-openLegend .sheet-textBlue {
|
|
color: #0074D9;
|
|
}
|
|
|
|
.sheet-teal, .sheet-rolltemplate-openLegend .sheet-teal {
|
|
background-color: #39CCCC;
|
|
color: #111111;
|
|
}
|
|
.sheet-textTeal, .sheet-rolltemplate-openLegend .sheet-textTeal {
|
|
color: #39CCCC;
|
|
}
|
|
|
|
.sheet-olive, .sheet-rolltemplate-openLegend .sheet-olive {
|
|
background-color: #3D9970;
|
|
color: #111111;
|
|
}
|
|
.sheet-textOlive, .sheet-rolltemplate-openLegend .sheet-textOlive {
|
|
color: #3D9970;
|
|
}
|
|
|
|
.sheet-green, .sheet-rolltemplate-openLegend .sheet-green {
|
|
background-color: #2ECC40;
|
|
color: #111111;
|
|
}
|
|
.sheet-textGreen, .sheet-rolltemplate-openLegend .sheet-textGreen {
|
|
color: #2ECC40;
|
|
}
|
|
|
|
.sheet-lime, .sheet-rolltemplate-openLegend .sheet-lime {
|
|
background-color: #01FF70;
|
|
color: #111111;
|
|
}
|
|
.sheet-textLime, .sheet-rolltemplate-openLegend .sheet-textLime {
|
|
color: #01FF70;
|
|
}
|
|
|
|
.sheet-yellow, .sheet-rolltemplate-openLegend .sheet-yellow {
|
|
background-color: #FFDC00;
|
|
color: #111111;
|
|
}
|
|
.sheet-textYellow, .sheet-rolltemplate-openLegend .sheet-textYellow {
|
|
color: #FFDC00;
|
|
}
|
|
|
|
.sheet-orange, .sheet-rolltemplate-openLegend .sheet-orange {
|
|
background-color: #FF851B;
|
|
color: #111111;
|
|
}
|
|
.sheet-textOrange, .sheet-rolltemplate-openLegend .sheet-textOrange {
|
|
color: #FF851B;
|
|
}
|
|
|
|
.sheet-maroon, .sheet-rolltemplate-openLegend .sheet-maroon {
|
|
background-color: #85144b;
|
|
color: #FFFFFF;
|
|
}
|
|
.sheet-textMaroon, .sheet-rolltemplate-openLegend .sheet-textMaroon {
|
|
color: #85144b;
|
|
}
|
|
|
|
.sheet-fuchsia, .sheet-rolltemplate-openLegend .sheet-fuchsia {
|
|
background-color: #F012BE;
|
|
color: #FFFFFF;
|
|
}
|
|
.sheet-textFuchsia, .sheet-rolltemplate-openLegend .sheet-textFuchsia {
|
|
color: #F012BE;
|
|
}
|
|
|
|
/* Roll Template Specific formatting */
|
|
.sheet-rolltemplate-openLegend .sheet-rollContainer {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-openLegend .sheet-row:nth-child(even) {
|
|
background-color: rgba(61,153,112,0.1); /* Olive color at 10% transparent */
|
|
}
|
|
|
|
.sheet-rolltemplate-openLegend .sheet-powerLevel {
|
|
font-size: 3.5em;
|
|
}
|
|
|
|
/* Override default dice roll display */
|
|
.sheet-rolltemplate-openLegend .sheet-roll {
|
|
font-size: 5em;
|
|
line-height: 1em;
|
|
}
|
|
|
|
.sheet-rolltemplate-openLegend .inlinerollresult {
|
|
color: #111111;
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-openLegend .inlinerollresult.fullcrit {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-openLegend .inlinerollresult.fullfail {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-openLegend .inlinerollresult.importantroll {
|
|
background-color: transparent;
|
|
border: none;
|
|
} |