mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 19:52:29 +00:00
Erik Goettel
aefb8231b4
## Inventory Modified - Contains better spacing - field descriptions added to header - Antiquated gold field hidden but not removed. ## Advanced Attacks New functions added to advanced tab for each weapon: - Twin Talon - Crack Shot - Deadly Assault
1530 lines
31 KiB
CSS
1530 lines
31 KiB
CSS
/* <editor-fold desc="Roll Template"> */
|
|
|
|
/* Smaller margins - remove these if you want the huge default left margin */
|
|
|
|
.sheet-rolltemplate-custom {
|
|
margin-left: -37px;
|
|
color:rgba(0,0,0,1);
|
|
}
|
|
|
|
.withoutavatars .sheet-rolltemplate-custom {
|
|
margin-left: -7px;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-container {
|
|
border: 0px solid;
|
|
/* by default, the border is the same color as the header. You can change this here, e.g. to black */
|
|
border-color: var(--header-bg-color);
|
|
}
|
|
|
|
/* Header formatting - title and subtitle */
|
|
.sheet-rolltemplate-custom .sheet-header {
|
|
background-color: var(--header-bg-color);
|
|
/* change text-align to center to center the header text */
|
|
text-align: left;
|
|
color: var(--header-text-color);
|
|
padding: 5px;
|
|
border-bottom: 6px black solid;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
.sheet-rolltemplate-custom .sheet-title {
|
|
font-size:1.6em;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
margin: auto;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-title a:link{
|
|
color: #DDDDDD;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-title a:visited{
|
|
color: #FFFFFF;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-title a:active{
|
|
color: #EE00EE;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-subtitle {
|
|
font-size:1.1em;
|
|
font-style: italic;
|
|
text-align: center;
|
|
margin: auto;
|
|
}
|
|
|
|
/* example colors */
|
|
.sheet-rolltemplate-custom .sheet-container {
|
|
/* this is the default color */
|
|
--header-bg-color: #800020;
|
|
--header-text-color: #FFF;
|
|
color: #000000;
|
|
border: solid 3px black;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-container.sheet-color-red {
|
|
--header-bg-color: #F00;
|
|
}
|
|
.sheet-rolltemplate-custom .sheet-container.sheet-color-green {
|
|
--header-bg-color: #0F0;
|
|
--header-text-color: #000;
|
|
}
|
|
|
|
/* Allprops part */
|
|
.sheet-rolltemplate-custom .sheet-content {
|
|
display: grid;
|
|
background: rgba(0,0,0,0);
|
|
/* Header formatting - modify the column layout below */
|
|
grid-template-columns: auto auto;
|
|
/* Line height to match default roll template */
|
|
line-height:1.4em;
|
|
}
|
|
.sheet-rolltemplate-custom .sheet-content > div {
|
|
padding: 5px;
|
|
background-color: #EAD2A8;
|
|
}
|
|
|
|
/* Left column */
|
|
.sheet-rolltemplate-custom .sheet-content .sheet-key {
|
|
font-weight: bold;
|
|
padding-right: 10px;
|
|
text-align: right;
|
|
}
|
|
|
|
/* Empty rule, use this if you want to change the right column
|
|
.sheet-rolltemplate-custom .sheet-value {
|
|
}
|
|
*/
|
|
|
|
/* Make even-numbered rows grey */
|
|
|
|
.sheet-rolltemplate-custom .sheet-content :nth-child(4n+3),
|
|
.sheet-rolltemplate-custom .sheet-content :nth-child(4n){
|
|
background: #f6efe4;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-content > div.sheet-key:nth-last-child(2) {
|
|
border-radius: 0 0 0 4px;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-content > div.sheet-value:last-child{
|
|
border-radius: 0 0 4px 0;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-content > div.sheet-desc:last-child{
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-content a:link{
|
|
background: rgba(0,0,0,0);
|
|
color: #0000EE;
|
|
font-style: italic;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-content a:visited{
|
|
background: rgba(0,0,0,0);
|
|
color: #551A8B;
|
|
font-style: italic;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-content a:active{
|
|
background: rgba(0,0,0,0);
|
|
color: #AA00DD;
|
|
font-style: italic;
|
|
}
|
|
|
|
/* Description field */
|
|
.sheet-rolltemplate-custom .sheet-desc {
|
|
grid-column: span 2;
|
|
padding: 5px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-key .inlinerollresult,
|
|
.sheet-rolltemplate-custom .sheet-desc .inlinerollresult,
|
|
.sheet-rolltemplate-custom .sheet-value .inlinerollresult{
|
|
background-color: #f6efe4;
|
|
border-radius: 4px;
|
|
}
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="Tab Buttons"*/
|
|
/*Configure the tab buttons*/
|
|
.charsheet .sheet-main,
|
|
.charsheet .sheet-skills,
|
|
.charsheet .sheet-gear,
|
|
.charsheet .sheet-definitions,
|
|
.charsheet .sheet-abilities,
|
|
.charsheet .sheet-spells,
|
|
.charsheet .sheet-accessories,
|
|
.charsheet .sheet-inventory,
|
|
.charsheet .sheet-profitloss{
|
|
display: none;
|
|
text-align: center;
|
|
}
|
|
|
|
/* show the selected tab */
|
|
.charsheet .sheet-tabstoggle[value="main"] ~ div.sheet-main,
|
|
.charsheet .sheet-tabstoggle[value="skills"] ~ div.sheet-skills,
|
|
.charsheet .sheet-tabstoggle[value="gear"] ~ div.sheet-gear,
|
|
.charsheet .sheet-tabstoggle[value="abilities"] ~ div.sheet-abilities,
|
|
.charsheet .sheet-tabstoggle[value="spells"] ~ div.sheet-spells,
|
|
.charsheet .sheet-tabstoggle[value="accessories"] ~ div.sheet-accessories,
|
|
.charsheet .sheet-tabstoggle[value="inventory"] ~ div.sheet-inventory,
|
|
.charsheet .sheet-tabstoggle[value="profitloss"] ~ div.sheet-profitloss{
|
|
display: grid;
|
|
width: 800px;
|
|
}
|
|
|
|
.charsheet .sheet-tabstoggle[value="definitions"] ~ div.sheet-definitions{
|
|
display: inline-block;
|
|
}
|
|
|
|
.SAbutton button{
|
|
background-color: #ffffff;
|
|
color: #000000;
|
|
font-weight: bold;
|
|
border: solid 2px black;
|
|
border-radius: 5px;
|
|
transition-duration: 0.4s;
|
|
box-shadow: 0 2px #909090;
|
|
margin: 4px;
|
|
}
|
|
|
|
.SAbutton button:hover{
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.SAbutton button:active{
|
|
background-color: #000000;
|
|
color: #db1c1c;
|
|
box-shadow: 0 0px;
|
|
transform: translateY(2px);
|
|
}
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="General Styles"*/
|
|
|
|
.color{
|
|
display: inline-block;
|
|
}
|
|
|
|
.titleinputhidden[value=""] ~ .color{
|
|
display: None;
|
|
}
|
|
|
|
.shadow{
|
|
display: None;
|
|
}
|
|
|
|
.titleinputhidden[value=""] ~ .shadow{
|
|
display: inline-block;
|
|
}
|
|
|
|
.titleblock {
|
|
font-weight: bold;
|
|
color: #FFFFFF;
|
|
background-color: #000000;
|
|
}
|
|
|
|
.wrapped-div{
|
|
border-radius: 15px 15px 0 0;
|
|
border: 1px solid black;
|
|
}
|
|
|
|
.midline-right-div{
|
|
border-radius: 15px 15px 0 0;
|
|
border-bottom: 1px solid black;
|
|
border-right: 1px solid black;
|
|
border-top: 1px solid black;
|
|
}
|
|
|
|
.bottom-border-div{
|
|
border-bottom: 1px solid black;
|
|
}
|
|
|
|
.column-header {
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
text-align: center;
|
|
border-radius: 12px 12px 0 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.column-header-dark {
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
text-align: center;
|
|
border-radius: 12px 12px 0 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.row-header{
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
text-align: center;
|
|
border-radius: 10px 10px 0 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.row-footer{
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
text-align: center;
|
|
border-radius: 0 0 10px 10px;
|
|
width: 100%;
|
|
}
|
|
|
|
.row-header-dark{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
text-align: center;
|
|
border-radius: 10px 10px 0 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.ui-dialog .charsheet .column-header button[type=roll],
|
|
.ui-dialog .charsheet .column-header button[type=compendium]{
|
|
height: 16px;
|
|
width: 16px;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.ui-dialog .charsheet .Small-Button{
|
|
width: 16px;
|
|
height: 12px;
|
|
padding: 0 0 1px 0;
|
|
margin: 0;
|
|
border: 1px black solid;
|
|
transition-duration: 0.4s;
|
|
box-shadow: 0 2px #505050;
|
|
background-color: #F0F0F0;
|
|
color: #000000;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.ui-dialog .charsheet .Small-Button:hover{
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.ui-dialog .charsheet .Small-Button:active{
|
|
background-color: #000000;
|
|
color: #db1c1c;
|
|
box-shadow: 0 0;
|
|
transform: translateY(2px);
|
|
}
|
|
|
|
.ui-dialog .charsheet button[type=roll],
|
|
.ui-dialog .charsheet button[type=compendium]{
|
|
padding: 0;
|
|
border: 0;
|
|
margin: 0;
|
|
width: 16px;
|
|
height: 16px;
|
|
text-align: center;
|
|
background-color: #F0F0F0;
|
|
color: #000000;
|
|
background-image: none;
|
|
content: "";
|
|
transition-duration: 0.4s;
|
|
box-shadow: 0 2px #909090;
|
|
}
|
|
|
|
.ui-dialog .charsheet button[type=roll]:hover,
|
|
.ui-dialog .charsheet button[type=compendium]:hover {
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.ui-dialog .charsheet button[type=roll]:active,
|
|
.ui-dialog .charsheet button[type=compendium]:active {
|
|
background-color: #000000;
|
|
color: #db1c1c;
|
|
box-shadow: 0 0;
|
|
transform: translateY(2px);
|
|
}
|
|
|
|
.ui-dialog .charsheet input::-webkit-outer-spin-button,
|
|
.ui-dialog .charsheet input::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
.ui-dialog .charsheet input[type=number]{
|
|
-moz-appearance: textfield;
|
|
height: 18px;
|
|
padding: 2px;
|
|
border: 1px solid #909090;
|
|
background-color: #FFFFFF;
|
|
color: #000000;
|
|
text-align: center;
|
|
}
|
|
|
|
.ui-dialog .charsheet input[readonly]{
|
|
background-color: #5A5A5A;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.ui-dialog .charsheet select{
|
|
width: 96%;
|
|
height: 18px;
|
|
text-align: center;
|
|
padding: 0;
|
|
font-size: 12px;
|
|
margin: 0;
|
|
}
|
|
|
|
.ui-dialog .charsheet .die-select{
|
|
width: 24px;
|
|
height: 21px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
padding: 0;
|
|
font-size: 12px;
|
|
margin: 0;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.ui-dialog .charsheet .fixed-select{
|
|
width: 60px;
|
|
height: 21px;
|
|
text-align: center;
|
|
padding: 0;
|
|
font-size: 12px;
|
|
margin: 0;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/*General Grid*/
|
|
|
|
.ggrid{
|
|
display: grid;
|
|
grid-auto-columns: auto;
|
|
}
|
|
|
|
.ggridc{
|
|
display: grid;
|
|
grid-auto-rows: auto;
|
|
}
|
|
|
|
/*End General Grid -- End*/
|
|
|
|
/*General Columns*/
|
|
|
|
.grcsa{grid-column: 1/-1;}
|
|
.grc1{grid-column: 1;}
|
|
.grc2{grid-column: 2;}
|
|
.grc3{grid-column: 3;}
|
|
.grc4{grid-column: 4;}
|
|
.grc5{grid-column: 5;}
|
|
.grc6{grid-column: 6;}
|
|
.grc7{grid-column: 7;}
|
|
.grc8{grid-column: 8;}
|
|
|
|
.grr1{grid-row: 1;}
|
|
.grr2{grid-row: 2;}
|
|
.grr3{grid-row: 3;}
|
|
.grr4{grid-row: 4;}
|
|
.grr5{grid-row: 5;}
|
|
.grr6{grid-row: 6;}
|
|
.grr7{grid-row: 7;}
|
|
|
|
/*End General columns -- End*/
|
|
.flex-input{
|
|
height: 18px;
|
|
width: 96%;
|
|
border: 0;
|
|
padding: 0;
|
|
text-align: center;
|
|
color: #000000;
|
|
}
|
|
|
|
.flex-bordered-input{
|
|
height: 18px;
|
|
width: 96%;
|
|
border: 1px solid black;
|
|
padding: 0;
|
|
margin: 2px;
|
|
text-align: center;
|
|
}
|
|
|
|
.ui-dialog .charsheet .flex-input[type=number]{
|
|
height: 18px;
|
|
width: 96%;
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.small-input{
|
|
height: 18px;
|
|
width: 24px;
|
|
padding: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.ui-dialog .charsheet .small-input[type=number]{
|
|
height: 18px;
|
|
width: 24px;
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.standard-input{
|
|
height: 18px;
|
|
width: 60px;
|
|
padding: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.standard-input [type=number]{
|
|
height: 18px;
|
|
width: 60px;
|
|
padding: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.standard-select {
|
|
width: 60px;
|
|
height: 18px;
|
|
text-align: center;
|
|
padding: 0;
|
|
font-size: 12px;
|
|
margin: 0;
|
|
}
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="Main Tab"*/
|
|
|
|
.sheet-main{
|
|
grid-template-columns: repeat(2,1fr);
|
|
background-color: #000000;
|
|
padding-bottom: 18px;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
.main-full{grid-column: 1/-1;}
|
|
.main-left{grid-column: 1;}
|
|
.main-right{grid-column: 2;}
|
|
|
|
/*Shared Main Selector Styles*/
|
|
.attribute-block > span,
|
|
.hp-armor-block > span,
|
|
.saving-throw-block > span{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
text-align: center;
|
|
height: 18px;
|
|
padding-bottom: 3px;
|
|
align-self: start;
|
|
}
|
|
/*End Shared Main Selector Styles -- End*/
|
|
|
|
/* Character Info Block Styles */
|
|
.character-info-block{
|
|
width: 800px;
|
|
display: grid;
|
|
grid-template-columns: repeat(7,1fr);
|
|
}
|
|
|
|
.character-info-block > span{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
text-align: center;
|
|
border-radius: 6px 6px 0 0;
|
|
}
|
|
|
|
#info-title {grid-column: 1/-1;}
|
|
#player-name {grid-column: 1;}
|
|
#age-and-height{grid-column: 2;}
|
|
#weight-and-gender{grid-column: 3;}
|
|
#species-name {grid-column: 4;}
|
|
#more-speed {grid-column: 5;}
|
|
#religion-name {grid-column: 6;}
|
|
#hd-and-size {grid-column: 7;}
|
|
|
|
#player-name > div,
|
|
#age-and-height > div,
|
|
#weight-and-gender > div,
|
|
#species-name > div,
|
|
#more-speed > div,
|
|
#religion-name > div,
|
|
#hd-and-size > div{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
padding-bottom: 2px;
|
|
}
|
|
/*End Character Info Block Styles -- End*/
|
|
|
|
/* Main Attribute Block Styles*/
|
|
|
|
.sheet-main textarea{
|
|
vertical-align: top;
|
|
text-align: left;
|
|
height: 232px;
|
|
width: 97%;
|
|
border: 0;
|
|
border-radius: 5px 5px 5px 5px;
|
|
resize: none;
|
|
margin: 3px 0 0;
|
|
padding: 3px;
|
|
}
|
|
|
|
.attribute-block {
|
|
width: 400px;
|
|
display: grid;
|
|
background-color: #000000;
|
|
grid-template-columns: repeat(8, 1fr);
|
|
align-self: start;
|
|
border: 1px #323232;
|
|
}
|
|
|
|
.attribute-block-title{
|
|
grid-column: 1/9;
|
|
background-color: #000000;
|
|
}
|
|
#name {grid-column: 1;}
|
|
#base {
|
|
grid-column:2;
|
|
background-color: #FFFFFF;
|
|
}
|
|
#enhancement {
|
|
grid-column: 3;
|
|
background-color: #FFFFFF;
|
|
}
|
|
#bonus {
|
|
grid-column: 4;
|
|
background-color: #FFFFFF;
|
|
}
|
|
#penalty {
|
|
grid-column: 5;
|
|
background-color: #FFFFFF;
|
|
}
|
|
#total { grid-column: 6;}
|
|
#modifier {grid-column: 7;}
|
|
#check {grid-column: 8;}
|
|
|
|
#name > div,
|
|
#base > div,
|
|
#enhancement > div,
|
|
#bonus > div,
|
|
#penalty > div,
|
|
#total > div,
|
|
#modifier > div,
|
|
#check > div{
|
|
padding-bottom: 3px;
|
|
padding-right: 1px;
|
|
height: 18px;
|
|
}
|
|
|
|
#check > div{
|
|
background-color: #000000;
|
|
}
|
|
|
|
.ui-dialog .charsheet .attribute-block button[type=roll],
|
|
.ui-dialog .charsheet .attribute-block button[type=compendium]{
|
|
height: 16px;
|
|
width: 16px;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
|
|
/* End Attribute Block Styles -- End*/
|
|
|
|
/*Saving Throw Block*/
|
|
.saving-throw-block{
|
|
width: 400px;
|
|
display: grid;
|
|
grid-template-columns: repeat(8,1fr);
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
align-self: start;
|
|
}
|
|
|
|
#save-name {grid-column: 1;}
|
|
#save-total {grid-column: 2;}
|
|
#save-base {grid-column: 3;}
|
|
#save-key {grid-column: 4;}
|
|
#save-magic {
|
|
grid-column: 5;
|
|
background-color: #FFFFFF;
|
|
color: #000000;
|
|
}
|
|
#save-misc {
|
|
grid-column: 6;
|
|
background-color: #FFFFFF;
|
|
color: #000000;
|
|
}
|
|
#save-temp {
|
|
grid-column: 7;
|
|
background-color: #FFFFFF;
|
|
color: #000000;
|
|
}
|
|
#save-check {grid-column: 8;}
|
|
|
|
#save-name > div,
|
|
#save-total > div,
|
|
#save-base > div,
|
|
#save-key > div,
|
|
#save-magic > div,
|
|
#save-misc > div,
|
|
#save-temp > div,
|
|
#save-check > div{
|
|
padding-bottom: 3px;
|
|
padding-right: 1px;
|
|
height: 18px;
|
|
}
|
|
|
|
.main-left .ggrid .grc1 > div,
|
|
.main-left .ggrid .grc2 > div,
|
|
.main-left .ggrid .grc3 > div,
|
|
.main-left .ggrid .grc4 > div,
|
|
.main-left .ggrid .grc5 > div,
|
|
.main-left .ggrid .grc6 > div{
|
|
padding-bottom: 3px;
|
|
padding-right: 1px;
|
|
height: 18px;
|
|
}
|
|
|
|
/*End Saving Throw Block -- End*/
|
|
|
|
/* HP and Armor Block Styles */
|
|
|
|
.hp-armor-block{
|
|
width: 400px;
|
|
display: grid;
|
|
grid-template-columns: repeat(2,1fr);
|
|
align-self: start;
|
|
}
|
|
|
|
.hp-column{
|
|
grid-column: 1;
|
|
display: grid;
|
|
grid-template-columns: repeat(2,1fr);
|
|
}
|
|
|
|
#hp-names{grid-column: 1;}
|
|
#hp-inputs{grid-column: 2;}
|
|
|
|
.ac-column{
|
|
grid-column: 2;
|
|
display: grid;
|
|
grid-template-columns: repeat(2,1fr);
|
|
}
|
|
|
|
#ac-names{grid-column: 1;}
|
|
#ac-inputs{grid-column: 2;}
|
|
|
|
#hp-names > div,
|
|
#hp-inputs > div,
|
|
#ac-names > div,
|
|
#ac-inputs > div{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
height: 18px;
|
|
padding-bottom: 3px;
|
|
align-self: start;
|
|
}
|
|
|
|
/* End HP and Armor Block Styles -- End*/
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="Definitions and Traits"*/
|
|
.sheet-definitions{
|
|
width: 800px;
|
|
border-radius: 12px;
|
|
border: 1px solid;
|
|
padding-bottom: 8px;
|
|
}
|
|
|
|
.ui-dialog .charsheet .sheet-definitions .DTA-name{
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
border: 0;
|
|
}
|
|
|
|
.ui-dialog .charsheet .sheet-definitions .DTA-name-dark{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
border: 0;
|
|
}
|
|
|
|
.ui-dialog .charsheet .sheet-definitions textarea{
|
|
vertical-align: top;
|
|
text-align: left;
|
|
height: 54px;
|
|
min-height: 54px;
|
|
width: 94%;
|
|
border: 1px solid black;
|
|
border-radius: 5px 5px 5px 5px;
|
|
resize: vertical;
|
|
padding: 0;
|
|
}
|
|
|
|
.sheet-definitions .ggrid .grr3.ggrid .dta-toggle[value="1"] ~ .dta-shrink{
|
|
display: none;
|
|
}
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="Abilities/Feats"*/
|
|
|
|
.sheet-abilities{
|
|
width: 800px;
|
|
border-radius: 12px;
|
|
border: 1px solid;
|
|
padding-bottom: 8px;
|
|
}
|
|
|
|
.charsheet .sheet-abilities .repcontainer[data-groupname="repeating_abilities"] .grc1,
|
|
.charsheet .sheet-abilities .repcontainer[data-groupname="repeating_abilities"] .grc2,
|
|
.charsheet .sheet-abilities .repcontainer[data-groupname="repeating_abilities"] .grc3,
|
|
.charsheet .sheet-abilities .repcontainer[data-groupname="repeating_abilities"] .grc4{
|
|
width: auto;
|
|
}
|
|
|
|
.sheet-abilities .grc1 > div,
|
|
.sheet-abilities .grc2 > div,
|
|
.sheet-abilities .grc3 > div,
|
|
.sheet-abilities .grc4 > div{
|
|
align-items: center;
|
|
min-height: 20px;
|
|
height: auto;
|
|
}
|
|
|
|
.ui-dialog .charsheet .sheet-abilities .Ability-name{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
border: 0;
|
|
font-size: medium;
|
|
}
|
|
|
|
.charsheet .sheet-abilities .ability_description{
|
|
background-color: #D0D0D0;
|
|
}
|
|
|
|
.ui-dialog .charsheet .sheet-abilities textarea{
|
|
vertical-align: top;
|
|
text-align: left;
|
|
height: 54px;
|
|
min-height: 54px;
|
|
width: 96%;
|
|
border: 1px solid black;
|
|
border-radius: 5px 5px 5px 5px;
|
|
resize: vertical;
|
|
padding: 2px;
|
|
color: #000000;
|
|
}
|
|
|
|
.sheet-abilities .ggrid .grr4.ggridc .ability-toggle[value="1"] ~ div.ability_description.ggrid{
|
|
display: none;
|
|
}
|
|
|
|
.sheet-abilities .ggrid .grr4.ggridc .feats-toggle[value="1"] ~ div.feats_description{
|
|
display: none;
|
|
}
|
|
|
|
.ui-dialog .charsheet .sheet-abilities .resourceName{
|
|
width: 96%;
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
border: 0;
|
|
font-size: medium;
|
|
}
|
|
|
|
.charsheet .repcontainer[data-groupname="repeating_resources"]{
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
text-align: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.charsheet .repcontainer[data-groupname="repeating_resources"] > *{
|
|
text-align: center;
|
|
width: 20%;
|
|
border-radius: 12px 12px 0 0;
|
|
overflow: clip;
|
|
background: #D0D0D0;
|
|
}
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="Spell Sheet Style">*/
|
|
|
|
.charsheet .sheet-spells{
|
|
text-align: center;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.charsheet .sheet-spells .gridarea{
|
|
text-align: center;
|
|
justify-content: space-evenly;
|
|
align-content: space-evenly;
|
|
grid-template-columns: auto auto;
|
|
padding: 0;
|
|
display: grid;
|
|
gap: 0 0;
|
|
grid-template-areas:
|
|
"HeaderS HeaderS"
|
|
"Column1 Column2";
|
|
}
|
|
|
|
.charsheet .sheet-spells .gridarea .titleblock{
|
|
grid-area: HeaderS;
|
|
border-radius: 10px 10px 0 0;
|
|
}
|
|
|
|
.charsheet .sheet-spells .Spell-Level{
|
|
width: 396px;
|
|
border: 1px solid black;
|
|
border-top: 1px white solid;
|
|
border-radius: 12px 12px 0 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.Spell-Level-Name {
|
|
width: 100%;
|
|
border-radius: 10px 10px 0 0;
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
padding: 0;
|
|
margin: 0;
|
|
border-bottom: 1px solid white;
|
|
}
|
|
|
|
.Spell-Level-Name span{
|
|
font-size: 18px;
|
|
}
|
|
|
|
.Spell-Level-Name input{
|
|
height: 16px;
|
|
width: 48px;
|
|
padding: 0;
|
|
margin: 0;
|
|
border: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.Spell-Level .sheet-repeating-fields{
|
|
display: none;
|
|
}
|
|
|
|
input.sptoggle[value="1"] ~ .sheet-repeating-fields{
|
|
display: inline-block;
|
|
}
|
|
|
|
/*<editor-fold desc="Spell Repeating Fields">*/
|
|
|
|
.minimizable-repeat-spells{
|
|
display: inline-block;
|
|
text-align: center;
|
|
width: 390px;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
|
|
.minimizable-repeat-spells span{
|
|
background-color: #383838;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
}
|
|
.minimizable-repeat-spells .spelltitle{
|
|
width: 388px;
|
|
background-color: #383838;
|
|
border: 1px solid black;
|
|
border-radius: 5px 5px 0 0;
|
|
display: inline-block;
|
|
text-align: center;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spelltitle input[type=text]{
|
|
width: 50%;
|
|
height: 18px;
|
|
font-size: 16px;
|
|
text-align: center;
|
|
background-color: #383838;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
border: 0;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description{
|
|
width: 388px;
|
|
overflow: clip;
|
|
background-color: #FFFFFF;
|
|
color: #000000;
|
|
border: 1px solid black;
|
|
border-radius: 0 0 5px 5px;
|
|
text-align: center;
|
|
justify-content: center;
|
|
display: none;
|
|
grid-template-columns: 50% 50%;
|
|
padding: 0;
|
|
grid-template-rows: auto auto auto;
|
|
gap: 1px 1px;
|
|
grid-template-areas:
|
|
"Details-1 Details-2"
|
|
"Description Description"
|
|
"Advanced Advanced";
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells-toggle[value="1"] ~ div.spells_description{
|
|
display: grid;
|
|
background: #D0D0D0;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description input[type=number]{
|
|
height: 18px;
|
|
text-align: center;
|
|
float: right;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-1 {
|
|
grid-area: Details-1;
|
|
padding: 3px;
|
|
text-align: left;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-1 .spellselect{
|
|
padding: 0;
|
|
border: 0;
|
|
text-align: center;
|
|
height: 18px;
|
|
width: 80px;
|
|
margin: 0;
|
|
justify-self: end;
|
|
}
|
|
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-1 input{
|
|
justify-self: end;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-1 select{
|
|
justify-self: end;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-1 input[type=checkbox]{
|
|
float: right;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-1 input[type=text]{
|
|
height: 18px;
|
|
width: 56px;
|
|
text-align: center;
|
|
float: right;
|
|
}
|
|
|
|
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-2 {
|
|
grid-area: Details-2;
|
|
padding: 3px;
|
|
text-align: left;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-2 .spellselect{
|
|
padding: 0;
|
|
border: 0;
|
|
text-align: center;
|
|
height: 18px;
|
|
width: 80px;
|
|
margin: 0;
|
|
justify-self: end;
|
|
}
|
|
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-2 input{
|
|
justify-self: end;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-2 select{
|
|
justify-self: end;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-2 input[type=checkbox]{
|
|
float: right;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Details-2 input[type=text]{
|
|
height: 18px;
|
|
width: 56px;
|
|
text-align: center;
|
|
float: right;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Description {
|
|
grid-area: Description;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Description textarea{
|
|
vertical-align: top;
|
|
text-align: left;
|
|
height: 54px;
|
|
min-height: 54px;
|
|
width: 94%;
|
|
border: 1px solid black;
|
|
border-radius: 5px 5px 5px 5px;
|
|
resize: vertical;
|
|
padding: 0;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .Advanced {
|
|
grid-area: Advanced;
|
|
}
|
|
|
|
.minimizable-repeat-spells .spells_description .spells-advanced-toggle[value="1"] ~ div.grr2.ggridc{
|
|
display: none;
|
|
}
|
|
|
|
/*</editor-fold*/
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="Accessories">*/
|
|
|
|
.sheet-accessories .accessories-grid{
|
|
width: 800px;
|
|
background-color: #FFFFFF;
|
|
color: #000000;
|
|
border: 1px solid black;
|
|
border-radius: 12px;
|
|
text-align: center;
|
|
justify-content: center;
|
|
display: grid;
|
|
grid-template-columns: 50% 50%;
|
|
padding: 0;
|
|
grid-template-rows: auto auto;
|
|
gap: 0 0;
|
|
grid-template-areas:
|
|
"HeaderM HeaderM"
|
|
"Column1 Column2";
|
|
}
|
|
|
|
.sheet-accessories .accessories-grid > div{
|
|
border-radius: 10px 10px 0 0;
|
|
}
|
|
.sheet-accessories .accessories-grid .crown-check{
|
|
height: 24px;
|
|
width: 24px;
|
|
}
|
|
|
|
.sheet-accessories .accessories-grid textarea{
|
|
vertical-align: top;
|
|
text-align: left;
|
|
height: 54px;
|
|
width: 94%;
|
|
border: 1px solid black;
|
|
border-radius: 5px 5px 5px 5px;
|
|
resize: vertical;
|
|
padding: 0;
|
|
}
|
|
|
|
.sheet-accessories .accessories-grid input[type=text]{
|
|
font-weight: bold;
|
|
text-align: center;
|
|
height: 24px;
|
|
width: 240px;
|
|
}
|
|
|
|
.sheet-accessories .accessories-grid h3{
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.sheet-accessories .accessories-grid .HeaderM {
|
|
grid-area: HeaderM;
|
|
background-color: #000000;
|
|
Color: #FFFFFF;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-accessories .accessories-grid .Column-1 {
|
|
grid-area: Column-1;
|
|
}
|
|
|
|
.sheet-accessories .accessories-grid .Column-2 {
|
|
grid-area: Column-2;
|
|
}
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="Inventory Tab"*/
|
|
|
|
.inventory-grid{
|
|
width: 800px;
|
|
background-color: #FFFFFF;
|
|
color: #000000;
|
|
border: 1px solid black;
|
|
border-radius: 12px;
|
|
text-align: center;
|
|
justify-content: center;
|
|
grid-template-columns: 1fr;
|
|
padding: 0 0 5px 0;
|
|
grid-template-rows: auto auto;
|
|
gap: 0 0;
|
|
grid-template-areas:
|
|
"Header-I"
|
|
"Column-I";
|
|
}
|
|
|
|
.inventory-grid .Header-I{
|
|
grid-area: Header-I;
|
|
background-color: #000000;
|
|
font-weight: bold;
|
|
border-radius: 10px 10px 0 0;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.charsheet .sheet-inventory input[type=number]{
|
|
height: 24px;
|
|
width: 64px;
|
|
text-align: center;
|
|
}
|
|
|
|
.inventory-grid .Header-I h3{
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.inventory-grid .Column-I{
|
|
grid-area: Column-I;
|
|
}
|
|
|
|
.charsheet .repcontainer[data-groupname="repeating_maininventory"] > div:nth-child(odd),
|
|
.charsheet .repcontainer[data-groupname="repeating_locationtotals"] > div:nth-child(odd),
|
|
.charsheet .repcontainer[data-groupname="repeating_profitloss"] > div:nth-child(odd){
|
|
background-color: #D0D0D0;
|
|
}
|
|
|
|
|
|
.bag-grid{
|
|
width: 100%;
|
|
margin: auto;
|
|
display: grid;
|
|
grid-template-columns: auto auto auto auto auto;
|
|
grid-template-rows: auto;
|
|
gap: 0 40px;
|
|
grid-template-areas: "name location quantity piece-weight total-weight";
|
|
justify-content: center;
|
|
align-items: end;
|
|
text-align: center;
|
|
border-bottom: 1px solid black;
|
|
}
|
|
|
|
.ui-dialog .charsheet .name textarea,
|
|
.ui-dialog .charsheet .location textarea{
|
|
min-height: 22px;
|
|
height: 22px;
|
|
width: 240px;
|
|
text-align: center;
|
|
resize: vertical;
|
|
margin: auto;
|
|
display: block;
|
|
padding: 0
|
|
}
|
|
|
|
.inventory-location[value="0"] ~ div.location{
|
|
background-color: #920a15;
|
|
}
|
|
|
|
.location input[type=text]{
|
|
height: 24px;
|
|
width: 64px;
|
|
text-align: center;
|
|
}
|
|
|
|
.quantity input[type=text]{
|
|
height: 24px;
|
|
width: 64px;
|
|
text-align: center;
|
|
}
|
|
|
|
.piece-weight input[type=text]{
|
|
height: 24px;
|
|
width: 64px;
|
|
text-align: center;
|
|
}
|
|
|
|
.total-weight input[type=text]{
|
|
height: 24px;
|
|
width: 64px;
|
|
text-align: center;
|
|
}
|
|
|
|
.inventory-weight input{
|
|
height: 24px;
|
|
width: 64px;
|
|
text-align: center;
|
|
margin: 3px;
|
|
}
|
|
|
|
.bag-grid .name{
|
|
grid-area: name;
|
|
display: block
|
|
}
|
|
|
|
.bag-grid .quantity{
|
|
grid-area: quantity;
|
|
display: inline-block;
|
|
vertical-align: bottom
|
|
}
|
|
|
|
.bag-grid .piece-weight{
|
|
grid-area: piece-weight;
|
|
display: inline-block;
|
|
vertical-align: bottom
|
|
}
|
|
|
|
.bag-grid .total-weight{
|
|
grid-area: total-weight;
|
|
display: inline-block;
|
|
vertical-align: bottom
|
|
}
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="skill page">*/
|
|
.SkillsPage{
|
|
width: 800px;
|
|
border: 1px solid black;
|
|
border-radius: 12px;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage button[type=roll],
|
|
.ui-dialog .charsheet .SkillsPage button[type=compendium]{
|
|
padding: 0;
|
|
border: #909090 solid 1px;
|
|
margin: 0;
|
|
width: 20px;
|
|
height: 20px;
|
|
text-align: center;
|
|
background-image: none;
|
|
content: "";
|
|
float: right;
|
|
transition-duration: 0.4s;
|
|
box-shadow: 0 2px #909090;
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage button[type=roll]:hover,
|
|
.ui-dialog .charsheet .SkillsPage button[type=compendium]:hover {
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage button[type=roll]:active,
|
|
.ui-dialog .charsheet .SkillsPage button[type=compendium]:active {
|
|
background-color: #000000;
|
|
color: #db1c1c;
|
|
box-shadow: 0 0;
|
|
transform: translateY(2px);
|
|
}
|
|
|
|
.SkillsPage .skill-desc{
|
|
background-color: #A2A2A2;
|
|
color: #000000;
|
|
font-weight: bold;
|
|
margin: 6px auto;
|
|
}
|
|
|
|
.SkillsPage input[type=text]{
|
|
text-align: left;
|
|
width: 100px;
|
|
height: 20px;
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage input[type=number]{
|
|
-moz-appearance: textfield;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage input::-webkit-outer-spin-button,
|
|
.ui-dialog .charsheet .SkillsPage input::-webkit-inner-spin-button {
|
|
display: none;
|
|
-webkit-appearance: none;
|
|
margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage input[readonly]{
|
|
background-color: #5A5A5A;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage th{
|
|
text-align: center;
|
|
width: 800px;
|
|
border-radius: 10px 10px 0 0;
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage table tr:nth-child(even){
|
|
background-color: #D0D0D0;
|
|
}
|
|
|
|
|
|
.ui-dialog .charsheet .SkillsPage td{
|
|
padding: 1px;
|
|
}
|
|
|
|
.ui-dialog .charsheet .hoverskill{
|
|
transition-duration: .05s;
|
|
}
|
|
|
|
.ui-dialog .charsheet .SkillsPage .hoverskill:hover{
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/* <editor-fold desc="Weapons/Armor Tab">*/
|
|
.sheet-gear{
|
|
width: 800px;
|
|
border-radius: 12px;
|
|
border: 1px solid;
|
|
padding-bottom: 8px;
|
|
}
|
|
|
|
.sheet-gear .weapon-shrink > div{
|
|
padding-bottom: 3px;
|
|
padding-right: 1px;
|
|
height: 18px;
|
|
}
|
|
|
|
|
|
.ui-dialog .charsheet .sheet-gear textarea{
|
|
padding: 0;
|
|
border: 1px solid black;
|
|
width: 177px;
|
|
resize: vertical;
|
|
height: 18px;
|
|
min-height: 18px;
|
|
}
|
|
|
|
.ui-dialog .charsheet .sheet-gear .weapon-name{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-size: medium;
|
|
border: 0;
|
|
padding: 3px;
|
|
}
|
|
|
|
.weapon-column-span{
|
|
grid-column: 1/5;
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
.weapon-repeat-box{
|
|
border: 1px solid black;
|
|
border-radius: 15px 15px 0 0;
|
|
padding-bottom: 3px;
|
|
}
|
|
|
|
.sheet-gear .ggrid .weapon-toggle[value="0"] ~ .weapon-shrink{
|
|
display: none;
|
|
}
|
|
|
|
.sheet-gear .ggridc .grr1.ggrid .critconfirm-toggle[value="0"] ~ .crit-shrink{
|
|
display: none;
|
|
}
|
|
|
|
.sheet-gear .ggridc .grr1.ggrid .advancedweapon-toggle[value="0"] ~ .advancedweapon-shrink,
|
|
.sheet-gear .ggridc .grr2.ggrid .advancedweapon-toggle[value="0"] ~ .advancedweapon-shrink{
|
|
display: none;
|
|
}
|
|
|
|
.ui-dialog .charsheet .advancedAttackButton button[type="roll"]::before{
|
|
content: none;
|
|
}
|
|
|
|
.ui-dialog .charsheet .advancedAttackButton button{
|
|
background-color: #ffffff;
|
|
color: #000000;
|
|
border: solid 1px black;
|
|
border-radius: 5px;
|
|
transition-duration: 0.4s;
|
|
box-shadow: 0 2px #909090;
|
|
margin: 1px 1px 6px 1px;
|
|
padding: 1px;
|
|
content: none;
|
|
width: fit-content;
|
|
}
|
|
|
|
.ui-dialog .charsheet .advancedAttackButton button:hover{
|
|
background-color: #323232;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.ui-dialog .charsheet .advancedAttackButton button:active{
|
|
background-color: #000000;
|
|
color: #db1c1c;
|
|
box-shadow: 0 0px;
|
|
transform: translateY(2px);
|
|
}
|
|
|
|
.sheet-gear .grr7{
|
|
grid-template-columns: repeat(2,1fr);
|
|
}
|
|
|
|
/*</editor-fold>*/
|
|
|
|
/*<editor-fold desc="P&L">*/
|
|
.sheet-profitloss{
|
|
width: 800px;
|
|
border-radius: 12px;
|
|
border: 1px solid;
|
|
overflow: clip;
|
|
}
|
|
/*</editor-fold>*/ |