mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 19:52:29 +00:00
696 lines
13 KiB
CSS
696 lines
13 KiB
CSS
|
|
/*Configure the tab buttons*/
|
|
.sheet-main,
|
|
.sheet-stats,
|
|
.sheet-abilities,
|
|
.sheet-equipment,
|
|
.sheet-mu,
|
|
.sheet-cleric,
|
|
.sheet-thief,
|
|
.sheet-ep,
|
|
.sheet-death,
|
|
.sheet-combat {
|
|
display: none;
|
|
}
|
|
|
|
|
|
/* show the selected tab */
|
|
|
|
.sheet-tabstoggle[value="main"]~div.sheet-main,
|
|
.sheet-tabstoggle[value="stats"]~div.sheet-stats,
|
|
.sheet-tabstoggle[value="abilities"]~div.sheet-abilities,
|
|
.sheet-tabstoggle[value="equipment"]~div.sheet-equipment,
|
|
.sheet-tabstoggle[value="mu"]~div.sheet-mu,
|
|
.sheet-tabstoggle[value="cleric"]~div.sheet-cleric,
|
|
.sheet-tabstoggle[value="thief"]~div.sheet-thief,
|
|
.sheet-tabstoggle[value="ep"]~div.sheet-ep,
|
|
.sheet-tabstoggle[value="death"]~div.sheet-death,
|
|
.sheet-tabstoggle[value="combat"]~div.sheet-combat {
|
|
display: block;
|
|
}
|
|
|
|
button[class*="tabbutton"] {
|
|
background: #F3D149;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
border-style: solid;
|
|
border-width: 1px 1px 1px;
|
|
border-radius: 10px 10px 0px 0px;
|
|
border-color: black ;
|
|
outline:none;
|
|
}
|
|
|
|
.sheet-tabstoggle[value="main"] ~div button[class*="main"] ,
|
|
.sheet-tabstoggle[value="stats"] ~div button[class*="stats"],
|
|
.sheet-tabstoggle[value="abilities"] ~div button[class*="abilities"],
|
|
.sheet-tabstoggle[value="equipment"] ~div button[class*="equipment"],
|
|
.sheet-tabstoggle[value="mu"] ~div button[class*="mu"],
|
|
.sheet-tabstoggle[value="cleric"] ~div button[class*="cleric"],
|
|
.sheet-tabstoggle[value="thief"] ~div button[class*="thief"],
|
|
.sheet-tabstoggle[value="ep"] ~div button[class*="ep"],
|
|
.sheet-tabstoggle[value="death"] ~div button[class*="death"],
|
|
.sheet-tabstoggle[value="combat"] ~div button[class*="combat"] {
|
|
border-color: black black #F3D149 black;
|
|
}
|
|
|
|
/*----------- End Tab Setup -----------*/
|
|
.sheet-background {
|
|
background-color: #F3D149;
|
|
}
|
|
|
|
.sheet-background-hf {
|
|
min-height: 25px;
|
|
background-image: url('https://ARGHive.net/wp-content/uploads/2020/05/HM4E_B.png?v=1');
|
|
background-repeat: repeat-x;
|
|
background-size: 0.645in;
|
|
margin-left: 0.3in;
|
|
margin-right: 0.3in;
|
|
}
|
|
|
|
.sheet-background-left {
|
|
background-image: url('https://ARGHive.net/wp-content/uploads/2020/05/HM4E_BLeft.png?v=1');
|
|
background-repeat: repeat-y;
|
|
background-size: 800px;
|
|
}
|
|
|
|
.sheet-basic {
|
|
margin-left: 0.3in;
|
|
}
|
|
|
|
.sheet-minor-label {
|
|
font-size: x-small;
|
|
line-height: 75%;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.sheet-three-column {
|
|
display: grid;
|
|
grid-column-gap: 1rem;
|
|
grid-row-gap: 0px;
|
|
grid-template-columns: auto auto auto;
|
|
grid-template-areas: "tcleft tccenter tcright";
|
|
grid-template-rows: repeat(auto-fill, auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.sheet-four-column {
|
|
display: grid;
|
|
grid-column-gap: 1rem;
|
|
grid-row-gap: 0px;
|
|
grid-template-columns: auto auto auto auto;
|
|
grid-template-areas: "tcleft tccleft tccright tcright";
|
|
grid-template-rows: repeat(auto-fill, auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.sheet-spellbooks {
|
|
display: grid;
|
|
grid-column-gap: 1rem;
|
|
grid-row-gap: 0px;
|
|
grid-template-columns: 10% 28% 28% 30%;
|
|
grid-template-areas: "tcleft tccleft tccright tcright";
|
|
grid-template-rows: repeat(auto-fill, auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.sheet-tccleft2 {
|
|
grid-column: 2 /span 2;
|
|
}
|
|
|
|
.sheet-tccright2 {
|
|
grid-column: 3 /span 2;
|
|
}
|
|
|
|
.sheet-tcleft {
|
|
grid-area: tcleft;
|
|
}
|
|
|
|
.sheet-tccenter {
|
|
grid-area: tccenter;
|
|
}
|
|
|
|
.sheet-tcright {
|
|
grid-area: tcright;
|
|
}
|
|
|
|
.sheet-tccleft {
|
|
grid-area: tccleft;
|
|
}
|
|
|
|
.sheet-tccright {
|
|
grid-area: tccright;
|
|
}
|
|
|
|
.sheet-row1 {
|
|
grid-row: 1;
|
|
}
|
|
|
|
.sheet-row2 {
|
|
grid-row: 2;
|
|
}
|
|
|
|
.sheet-row3 {
|
|
grid-row: 3;
|
|
}
|
|
|
|
.sheet-row4 {
|
|
grid-row: 4;
|
|
}
|
|
|
|
.sheet-row5 {
|
|
grid-row: 5;
|
|
}
|
|
|
|
.sheet-row6 {
|
|
grid-row: 6;
|
|
}
|
|
|
|
.sheet-row7 {
|
|
grid-row: 7;
|
|
}
|
|
|
|
.sheet-row8 {
|
|
grid-row: 8;
|
|
}
|
|
|
|
.sheet-row9 {
|
|
grid-row: 9;
|
|
}
|
|
|
|
.sheet-row10 {
|
|
grid-row: 10;
|
|
}
|
|
|
|
.sheet-row11 {
|
|
grid-row: 11;
|
|
}
|
|
|
|
.sheet-row12 {
|
|
grid-row: 12;
|
|
}
|
|
|
|
.sheet-titlesection {
|
|
grid-row: 1 / 4;
|
|
}
|
|
|
|
.sheet-titles {
|
|
font-family: 'Federant', cursive;
|
|
font-size: x-large;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-subtitles {
|
|
font-family: 'Volkhov', serif;
|
|
font-style: italic;
|
|
font-size: larger;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-indented {
|
|
margin-left: 4px;
|
|
margin-top: 7px;
|
|
}
|
|
|
|
.sheet-indented input {
|
|
background-color: #F3D149;
|
|
border: 0px;
|
|
padding: 0px;
|
|
width: 195px;
|
|
}
|
|
|
|
.sheet-inputsize {
|
|
width: 218px;
|
|
height: 30px;
|
|
}
|
|
|
|
.sheet-one-column {
|
|
display: grid;
|
|
grid-column-gap: 1rem;
|
|
grid-row-gap: 2px;
|
|
grid-template-columns: auto;
|
|
grid-template-areas: "tcleft";
|
|
grid-template-rows: repeat(auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.sheet-two-column {
|
|
display: grid;
|
|
grid-column-gap: 1rem;
|
|
grid-row-gap: 2px;
|
|
grid-template-columns: auto auto;
|
|
grid-template-areas: "tcleft tcright";
|
|
grid-template-rows: repeat(auto-fill, auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.sheet-indented textarea {
|
|
height: 18px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-fixedwidthlabel {
|
|
float: left;
|
|
width: 100px;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.sheet-fixedwidthlabelnarrow {
|
|
float: left;
|
|
width: 60px;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.sheet-fixedwidthlabelverynarrow {
|
|
float: left;
|
|
width: 30px;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.sheet-largeInput {
|
|
width: 298px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-regularInput {
|
|
width: 250px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-smallInput {
|
|
width: 100px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-mediumPlusInput {
|
|
width: 120px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-regularMinusInput {
|
|
width: 175px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-mediumInput {
|
|
width: 75px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-mediumInputRight {
|
|
width: 75px;
|
|
margin-bottom: 0px;
|
|
text-align: right;
|
|
}
|
|
|
|
.sheet-reallySmallInput {
|
|
width: 55px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-reallySmallInputRight {
|
|
width: 55px;
|
|
margin-bottom: 0px;
|
|
text-align: right;
|
|
}
|
|
|
|
.sheet-tinyInput {
|
|
width: 32px;
|
|
margin-bottom: 0px;
|
|
text-align: right;
|
|
}
|
|
|
|
.sheet-teenyInput {
|
|
width: 9px;
|
|
margin-bottom: 0px;
|
|
text-align: right;
|
|
border: 0px;
|
|
padding: 0px;
|
|
margin: 1px;
|
|
margin-left: 6px;
|
|
}
|
|
|
|
.sheet-spacer {
|
|
margin-right: 15px;
|
|
margin-left: 15px
|
|
}
|
|
|
|
.sheet-tinyText {
|
|
font-size: 8px;
|
|
}
|
|
|
|
.sheet-center {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-select-standard {
|
|
margin-bottom: 0px;
|
|
border-top: none;
|
|
border-left: none;
|
|
border-right: none;
|
|
width: 208px;
|
|
}
|
|
|
|
.sheet-checkbox-standard {
|
|
margin-top: 8px;
|
|
}
|
|
|
|
.sheet-sub-section {
|
|
margin-right: 30px;
|
|
margin-top: 20px;
|
|
margin-bottom: 4px;
|
|
border: 1px solid;
|
|
padding-bottom: 3px;
|
|
}
|
|
|
|
.sheet-readonly {
|
|
background-color: lightgray;
|
|
}
|
|
|
|
.sheet-moveicon {
|
|
width: 64px;
|
|
margin: 0 auto;
|
|
display: block;
|
|
}
|
|
|
|
.sheet-two-column13 {
|
|
display: grid;
|
|
grid-column-gap: 1rem;
|
|
grid-row-gap: 0px;
|
|
grid-template-columns: 210px *;
|
|
grid-template-areas: "tcleft tcright";
|
|
grid-template-rows: repeat(auto-fill, auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.sheet-biggroup {
|
|
grid-row: 1 / span 9;
|
|
}
|
|
|
|
.sheet-biggroup>div {
|
|
margin-bottom: 20px;
|
|
margin-left: 15px;
|
|
float: left;
|
|
}
|
|
|
|
.sheet-encumberancelevels {
|
|
grid-row: 11 / span 2;
|
|
}
|
|
|
|
.sheet-encumberancelevels>div {
|
|
margin-bottom: 5px;
|
|
margin-left: 10px;
|
|
float: left;
|
|
}
|
|
|
|
.sheet-boxed {
|
|
border: 1px solid;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
|
|
/* Stuff for the stats page */
|
|
|
|
.sheet-attributebox {
|
|
padding-top: 4px;
|
|
padding-bottom: 7px;
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
border-right: none;
|
|
}
|
|
|
|
.sheet-attributebox p {
|
|
font-size: 8px;
|
|
display: inline-block;
|
|
line-height: 10px;
|
|
margin: 0px;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
width: 30px;
|
|
line-break: loose;
|
|
}
|
|
|
|
.sheet-textareafix {
|
|
padding-top: 1px;
|
|
padding-bottom: 1px;
|
|
margin-bottom: -11px;
|
|
height: 24px;
|
|
width: 298px;
|
|
line-height: 0.9em;
|
|
font-size: 10px;
|
|
border: 1px solid;
|
|
border-radius: 2px;
|
|
resize: none;
|
|
background-color: lightgray;
|
|
}
|
|
|
|
.sheet-textareaenterable {
|
|
width: 90%;
|
|
background-color: white;
|
|
border: none;
|
|
}
|
|
|
|
input:read-only {
|
|
background-color: lightgray;
|
|
}
|
|
|
|
.sheet-three-columnX {
|
|
display: grid;
|
|
grid-column-gap: 1rem;
|
|
grid-row-gap: 0px;
|
|
grid-template-columns: 210px 100px auto;
|
|
grid-template-areas: "tcleft tccenter tcright";
|
|
grid-template-rows: repeat(auto-fill, auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-container {
|
|
background-color: linen;
|
|
color: #000;
|
|
padding: 2px;
|
|
border-radius: 10px;
|
|
border-color: black;
|
|
border: 2px solid #000;
|
|
}
|
|
|
|
.sheet-rolltemplate-header {
|
|
border-bottom: 1px solid black;
|
|
font-size: larger;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-rowhead {
|
|
width: 75px;
|
|
text-align: left;
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-rolltemplate-item {
|
|
text-align: right;
|
|
display: inline-block;
|
|
width: 75px;
|
|
}
|
|
|
|
.sheet-rolltemplate-result {
|
|
font-size: larger;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-fail {
|
|
background-color: pink;
|
|
}
|
|
|
|
.sheet-rolltemplate-succeed {
|
|
background-color: palegreen;
|
|
}
|
|
|
|
.sheet-melee-weapons {
|
|
display: inline-table;
|
|
grid-column-gap: 0;
|
|
grid-row-gap: 0px;
|
|
grid-template-columns: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto;
|
|
grid-template-areas: "mwitem mwsize mwtype mwspeed mwskill mwattrnd mwinitmod mwplushit mwplusdam mwdamt mwdams mwdamm mwdaml mwdamh mwdamg";
|
|
/* mwnotes"; */
|
|
grid-template-rows: repeat(auto-fill, auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-missile-weapons {
|
|
display: inline-table;
|
|
grid-column-gap: 0;
|
|
grid-row-gap: 0px;
|
|
grid-template-columns: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto;
|
|
grid-template-areas: "mwitem mwsize mwtype mwrof mwskill mwranges mwrangem mwrangel mwplushit mwplusdam mwdamt mwdams mwdamm mwdaml mwdamh mwdamg";
|
|
grid-template-rows: repeat(auto-fill, auto-fill);
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.sheet-melee-weapons div {
|
|
float: left;
|
|
}
|
|
|
|
.sheet-melee-weapons label {
|
|
font-size: smaller;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-sub-section select {
|
|
height: 27px;
|
|
}
|
|
|
|
.repcontrol {
|
|
width: fit-content;
|
|
}
|
|
|
|
.sheet-headingitem {
|
|
display: inline-block;
|
|
width: 100px;
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.sheet-heading {
|
|
font-weight: bold;
|
|
text-align: center;
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-entry2Line {
|
|
height: 50px;
|
|
}
|
|
|
|
.sheet-entrywDice {
|
|
height: 60px;
|
|
}
|
|
|
|
.charsheet hr {
|
|
margin: 5px;
|
|
border-color: black;
|
|
}
|
|
|
|
.charsheet label {
|
|
font-weight: unset;
|
|
font-size: 1em;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-spell-by-level {
|
|
display: inline-grid;
|
|
grid-column-gap: 1;
|
|
grid-row-gap: 1px;
|
|
grid-template-columns: 17% repeat(10, auto) 20% 7%;
|
|
grid-template-areas: "tcleft l0 l1 l2 l3 l4 l5 l6 l7 l8 l9 option optionValue";
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
margin: 0px;
|
|
border: black;
|
|
}
|
|
|
|
.sheet-spell-grid {
|
|
display: grid;
|
|
grid-column-gap: 1;
|
|
grid-row-gap: 1px;
|
|
grid-template-columns: 75% 25%;
|
|
grid-template-areas: "spellleft spellright";
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
margin: 0px;
|
|
border: black 1px;
|
|
}
|
|
|
|
.sheet-spellleft {
|
|
grid-area: spellleft;
|
|
}
|
|
|
|
.sheet-spellright {
|
|
grid-area: spellright;
|
|
}
|
|
|
|
.sheet-spell-fail-grid {
|
|
display: grid;
|
|
grid-column-gap: 1;
|
|
grid-row-gap: 1px;
|
|
grid-template-columns: auto 25%;
|
|
grid-template-areas: "tcleft tcright";
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
margin: 0px;
|
|
border: black 1px;
|
|
}
|
|
|
|
.sheet-totalrow {
|
|
border-top: 2px solid black;
|
|
}
|
|
|
|
.sheet-clericspell-by-level {
|
|
display: grid;
|
|
grid-column-gap: 1;
|
|
grid-row-gap: 1px;
|
|
grid-template-columns: 17% repeat(9, auto) 20% 7%;
|
|
grid-template-areas: "tcleft l1 l2 l3 l4 l5 l6 l7 option optionValue";
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
margin: 0px;
|
|
border: black;
|
|
}
|
|
|
|
.sheet-thief-grid {
|
|
display: grid;
|
|
grid-column-gap: 1;
|
|
grid-row-gap: 1px;
|
|
grid-template-columns: 20% repeat(8, 50px);
|
|
grid-template-areas: "thiefskill thieftotal base allocated racial dexadjust adjust other";
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
margin: 0px;
|
|
border: black 1px;
|
|
}
|
|
|
|
.sheet-backgroundlabel {
|
|
width: 80px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-backgroundinput {
|
|
width: 80px;
|
|
}
|
|
|
|
.sheet-level-grid {
|
|
display: grid;
|
|
grid-column-gap: 1;
|
|
grid-row-gap: 1px;
|
|
grid-template-columns: repeat(auto-fill, minmax(32px, 32px));
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
margin: 0px;
|
|
border: black 1px;
|
|
}
|
|
|
|
.sheet-level-gridcol {
|
|
display: grid;
|
|
grid-row-gap: 1px;
|
|
grid-template-columns: 32px;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
border: black 1px;
|
|
}
|
|
|
|
.sheet-level-gridcol div {
|
|
width: 32px;
|
|
}
|
|
|
|
.sheet-level-gridcol input {
|
|
width: 32px;
|
|
height: 24px;
|
|
}
|
|
|
|
|
|
/********************************************************************/ |