mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-31 12:12:30 +00:00
- improved readability scripts - fixed bug with attack 2 reading data of attack 1 - modified versioning to be consistent with official sheet (easier to mantain) - pow needs to be initialized the first time it is defined (like official sheet)
1368 lines
29 KiB
CSS
1368 lines
29 KiB
CSS
/* Fix for firefox */
|
|
input[type=number]::-webkit-outer-spin-button,
|
|
input[type=number]::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
input[type=number] {
|
|
-moz-appearance:textfield;
|
|
}
|
|
/* */
|
|
|
|
.sheet-clear {
|
|
clear:both;
|
|
}
|
|
|
|
/*General */
|
|
|
|
select {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
text-indent: 1px;
|
|
text-overflow: '';
|
|
}
|
|
.charsheet {
|
|
margin: 0px 0px 0px 0px;
|
|
padding: 0;
|
|
}
|
|
.sheet-center{
|
|
text-align:center;
|
|
}
|
|
.sheet-hidden {
|
|
display: none;
|
|
}
|
|
.sheet-2colrow{
|
|
margin-left: -5px;
|
|
margin-right: -5px;
|
|
padding: 0px;
|
|
}
|
|
textarea {
|
|
resize: none;
|
|
}
|
|
|
|
select {
|
|
background-color: transparent;
|
|
}
|
|
select { margin-bottom: 0; }
|
|
|
|
select option {
|
|
background-color: transparent;
|
|
}
|
|
.sheet-section{
|
|
padding: 1px;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-col{
|
|
margin-left: 0px;
|
|
margin-right: 0px;
|
|
padding: 0px;
|
|
}
|
|
.sheet-headertable{
|
|
|
|
font-weight:bold;
|
|
font-size: 1rem;
|
|
text-align:center;
|
|
}
|
|
|
|
p{
|
|
margin-left:5px;
|
|
font-weight:bold;
|
|
vertical-align:middle;
|
|
margin-top: 1px;
|
|
margin-bottom: 1px;
|
|
}
|
|
/* General Text Settings*/
|
|
.sheet-cinset {
|
|
display: flex;
|
|
flex-flow: column nowrap;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
height: 100%;
|
|
width: 100%;
|
|
border-radius: 10px;
|
|
box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
box-shadow: inset 0px 0px 55px 25px #d2cac3;
|
|
}
|
|
|
|
.charsheet .sheet-cdiv {
|
|
width:810px;
|
|
/*border: 1px dotted;*/
|
|
padding-right: 15px;
|
|
padding-left: 15px;
|
|
}
|
|
|
|
.sheet-imagespacer{
|
|
width: 830px;
|
|
padding-left: 5px;
|
|
padding-right: 15px;
|
|
}
|
|
|
|
.charsheet span.sheet-spacer {
|
|
display: block;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.charsheet span.sheet-spacer2 {
|
|
display: block;
|
|
margin-top: 20px;
|
|
}
|
|
.charsheet span.sheet-5pxshim {
|
|
display: block;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.charsheet span.sheet-10pxshim {
|
|
display: block;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
h1.sheet-sheetHeaderWC {
|
|
text-align: center;
|
|
color: white;
|
|
background-color: black;
|
|
font-family: 'Cinzel', serif;
|
|
}
|
|
|
|
h1.sheet-sheetHeaderM {
|
|
text-align: center;
|
|
color: white;
|
|
background-color: black;
|
|
font-family: "cinzelregular";
|
|
}
|
|
|
|
h2.sheet-sectionHeader {
|
|
text-align: center;
|
|
color: white;
|
|
background-color: black;
|
|
font-family: "cinzelregular";
|
|
}
|
|
h3.sheet-sectionHeader {
|
|
text-align: center;
|
|
color: white;
|
|
background-color: black;
|
|
font-family: "cinzelregular";
|
|
}
|
|
.sheet-subsectionHeader {
|
|
text-align:center;
|
|
background-color: black;
|
|
color: white;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.sheet-subsubsectionHeader {
|
|
text-align:center;
|
|
background-color: #c7c3b0;
|
|
color: black;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
|
|
/*General Input Settings*/
|
|
input[type=text],input[type=number]{
|
|
border: none;
|
|
background-color: transparent;
|
|
vertical-align:middle;
|
|
width:100%;
|
|
font-size: 1rem;
|
|
font-weight:bold;
|
|
}
|
|
input[type=number]{
|
|
width:4em;
|
|
}
|
|
input:hover {
|
|
background-color: yellow;
|
|
}
|
|
|
|
input.sheet-fixconst:hover {
|
|
background-color: none;
|
|
}
|
|
|
|
|
|
input[type=number]{
|
|
text-align:center;
|
|
}
|
|
|
|
input[type=number]::-webkit-outer-spin-button,
|
|
input[type=number]::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
|
|
|
|
/* General Table Settings*/
|
|
th,caption {
|
|
background-color: black;
|
|
color: white;
|
|
}
|
|
|
|
|
|
table, t,tr, p{
|
|
font-size: 1rem;
|
|
}
|
|
|
|
table, th{
|
|
font-size: 1rem;
|
|
}
|
|
|
|
table, td,th,tr {
|
|
border: 1px solid black;
|
|
}
|
|
|
|
table{
|
|
width: 100%;
|
|
table-layout: fixed;
|
|
}
|
|
td,tr{
|
|
height:18px;
|
|
overflow: hidden;
|
|
color: black;
|
|
}
|
|
tr.sheet-border_right td:last-child {
|
|
border-right:3px solid black;
|
|
}
|
|
/* Class of tables for side name*/
|
|
table.sheet-sidetitle{
|
|
border: 0px;
|
|
}
|
|
|
|
|
|
tr.sheet-sidetitle,
|
|
td.sheet-sidetitle{
|
|
border: none;
|
|
}
|
|
|
|
tr.sheet-sidetitle:first-child td.sheet-sidetitle{
|
|
border-top: 3px solid black;
|
|
}
|
|
td.sheet-sidetitle:first-child{
|
|
border-left: 3px solid black;
|
|
}
|
|
tr.sheet-sidetitle:last-child td.sheet-sidetitle{
|
|
border-bottom: 3px solid black;
|
|
}
|
|
|
|
|
|
td.sheet-sidetitle:last-child,
|
|
{
|
|
border-right: 3px solid black;
|
|
}
|
|
|
|
table.sheet-generaltable{
|
|
border:none;
|
|
border-style:hidden;
|
|
align:right;
|
|
padding:0;
|
|
margin:0;
|
|
}
|
|
table.sheet-generaltable tr:first-child{
|
|
border-top:none;
|
|
}
|
|
,
|
|
table.sheet-generaltable tr:last-child{
|
|
border-bottom:none;
|
|
}
|
|
table.sheet-generaltable tr td
|
|
{
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
|
|
td.sheet-separator{
|
|
border: 0px solid black;
|
|
width: 2%;
|
|
}
|
|
tr.sheet-separator{
|
|
border: 0px solid black;
|
|
padding-left:5px;
|
|
}
|
|
|
|
/* Aesthetic flares for characther sheet (manila folder and paper) */
|
|
table.sheet-skilltable tr td{
|
|
border-bottom: none;
|
|
border-top: none;
|
|
}
|
|
table.sheet-skilltable tr td:first-child,
|
|
table.sheet-skilltable tr td:nth-child(4),
|
|
table.sheet-skilltable tr td:nth-child(7){
|
|
text-align:left;
|
|
padding-left: 5px;
|
|
position:relative;
|
|
}
|
|
table.sheet-skilltable tr,
|
|
table.sheet-skilltable tr td:last-child {
|
|
border: none;
|
|
position:relative;
|
|
}
|
|
table.sheet-skilltable {
|
|
border:none;
|
|
position:relative;
|
|
}
|
|
|
|
|
|
/* Aesthetic flares for characther sheet (manila folder and paper) */
|
|
table.sheet-attacktable tr td{
|
|
border-bottom: 1px color black;
|
|
border-top: 1px color black;
|
|
}
|
|
|
|
table.sheet-attacktable tr:first-child td{
|
|
border-top: 0px color black;
|
|
}
|
|
table.sheet-attacktable tr:last-child td{
|
|
border-bottom: 0px color black;
|
|
}
|
|
table.sheet-attacktable tr td:first-child{
|
|
text-align:left;
|
|
padding: 5px;
|
|
position:relative;
|
|
}
|
|
table.sheet-attacktable tr {
|
|
border: none;
|
|
position:relative;
|
|
}
|
|
table.sheet-attacktable {
|
|
border:none;
|
|
position:relative;
|
|
}
|
|
|
|
|
|
.sheet-input-projection{
|
|
background: #00FFFF;
|
|
}
|
|
.sheet-manila {
|
|
height: 1380px;
|
|
width: 870px;
|
|
padding: 0px;
|
|
background-color: white;
|
|
|
|
background-image: url('https://github.com/Roll20/roll20-character-sheets/blob/master/DeltaGreenRPG/img/folder.jpg?raw=true');
|
|
background-repeat: no-repeat;
|
|
background-size: 860px 1370px;
|
|
position: relative;
|
|
/*transform:translate3d(0,0,0);
|
|
perspective: 2000px;*/
|
|
display:flex;
|
|
|
|
scrollbar-width: none;
|
|
|
|
}
|
|
.sheet-main{
|
|
height: 98%;
|
|
width: 88%;
|
|
padding: 0px;
|
|
background-color: transparent;
|
|
position: relative;
|
|
transform:translate3d(0,0,0);
|
|
perspective: 2000px;
|
|
display:flex;
|
|
|
|
scrollbar-width: none;
|
|
|
|
}
|
|
.sheet-side1{
|
|
display:inline-block;
|
|
text-align:right;
|
|
height:400px;
|
|
float:center;
|
|
position:relative;
|
|
width:80px;
|
|
overflow:hidden;
|
|
left:87%;
|
|
top:8%;
|
|
}
|
|
.sheet-paper {
|
|
background-color: transparent;
|
|
background-image: url('https://github.com/Roll20/roll20-character-sheets/blob/master/DeltaGreenRPG/img/paper.jpg?raw=true');
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
/*background-attachment: fixed;*/
|
|
background-position: left;
|
|
background-origin: content-box;
|
|
margin: 1px 1px 1px 1px;
|
|
padding: 1% 1% 1% 1%;
|
|
height:102%;
|
|
overflow-y: auto;
|
|
|
|
scrollbar-width: none;
|
|
}
|
|
.sheet-paper1 {
|
|
background-color: transparent;
|
|
background-image: url('https://github.com/Roll20/roll20-character-sheets/blob/master/DeltaGreenRPG/img/paper.jpg?raw=true');
|
|
/*debug background-color: blue;*/
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
/*background-attachment: fixed;*/
|
|
background-position: left;
|
|
background-origin: content-box;
|
|
margin: 1px 1px 1px 1px;
|
|
padding: 1% 1% 1% 1%;
|
|
height:97%;
|
|
overflow-y: auto;
|
|
|
|
scrollbar-width: none;
|
|
|
|
}
|
|
.sheet-divide{
|
|
content: "";
|
|
display: table;
|
|
clear: both;
|
|
}
|
|
}
|
|
.sheet-label1{
|
|
height:45px;width:200px;
|
|
position:absolute;
|
|
}
|
|
|
|
.sheet-wrapper-character{
|
|
height: 98%;
|
|
width: 97%;
|
|
float: center;
|
|
flex-shrink: 1;
|
|
padding: 0px;
|
|
border: none;
|
|
perspective: 2000px;
|
|
position: relative;
|
|
text-align: center;
|
|
top: 2%;
|
|
left: -10%;
|
|
|
|
|
|
scrollbar-width: none;
|
|
}
|
|
.sheet-container {
|
|
height: 100%;
|
|
|
|
width: 100%;
|
|
float: center;
|
|
flex-shrink: 1;
|
|
padding: 0px;
|
|
border: none;
|
|
perspective: 2000px;
|
|
position: relative;
|
|
display: inline-block;
|
|
|
|
|
|
scrollbar-width: none;
|
|
}
|
|
/* Switch between PC/NPC */
|
|
|
|
.sheet-player,
|
|
.sheet-npc {
|
|
/*visibility: hidden;
|
|
opacity: 0;
|
|
max-height:0;
|
|
overflow: hidden;*/
|
|
|
|
width: 98%;
|
|
display: none;
|
|
float: center;
|
|
margin: 5px 0px 5px 0px;
|
|
overflow: hidden;
|
|
|
|
scrollbar-width: none;
|
|
}
|
|
|
|
|
|
.sheet-npc{
|
|
|
|
height: 100%;
|
|
}
|
|
.sheet-player{
|
|
|
|
height: 98%;
|
|
}
|
|
/* new stuff */
|
|
|
|
.charsheet input.sheet-switch-sheet {
|
|
width: 95%;
|
|
height: 60%;
|
|
float: center;
|
|
cursor: pointer;
|
|
position: relative;
|
|
opacity: 0;
|
|
z-index: 9999;
|
|
top: -30%;
|
|
}
|
|
|
|
input.sheet-switch-page {
|
|
float: center;
|
|
cursor: pointer;
|
|
position: relative;
|
|
opacity: 0;
|
|
z-index: 9999;
|
|
top: -30%;
|
|
}
|
|
|
|
input.sheet-switch-page2 {
|
|
float: center;
|
|
cursor: pointer;
|
|
position: relative;
|
|
opacity: 0;
|
|
z-index: 9999;
|
|
top: -30%;
|
|
}
|
|
.sheet-switch-page:hover {
|
|
background-color: hsl(120, 100%, 25%,0.4);
|
|
}
|
|
.charsheet span.sheet-is-npc-tab {
|
|
text-align: left;
|
|
display: inline-block;
|
|
width: 100%;
|
|
height: 70%;
|
|
font-size: 9px;
|
|
color:white;
|
|
font-weight: bold;
|
|
margin-left: -90%;
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/DeltaGreenRPG/img/Agent.png?raw=true");
|
|
background-size: 100% 100%;
|
|
background-repeat: no-repeat;
|
|
/*background-attachment: fixed;*/
|
|
background-position: center;
|
|
background-origin: content-box;
|
|
}
|
|
|
|
|
|
.charsheet input.sheet-switch-sheet:checked ~ span.sheet-is-npc-tab{
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/DeltaGreenRPG/img/Threat.png?raw=true");
|
|
/*debug background-color: black;*/
|
|
background-size: 100% 100%;
|
|
background-repeat: no-repeat;
|
|
/*background-attachment: fixed;*/
|
|
background-position: center;
|
|
background-origin: content-box;
|
|
}
|
|
|
|
|
|
input.sheet-is-npc{
|
|
display:none;
|
|
}
|
|
input.sheet-is-npc:checked ~ .sheet-npc,
|
|
input.sheet-is-npc:not(:checked ) ~ .sheet-player
|
|
{
|
|
display: block;
|
|
overflow: auto;
|
|
}
|
|
|
|
|
|
/* Correction two columns */
|
|
.sheet-column {
|
|
border-style: solid;
|
|
border-color: black;
|
|
margin: 0 auto;
|
|
padding: 0;
|
|
display:flex;
|
|
}
|
|
.sheet-colspace {
|
|
border-style: none;
|
|
margin: 0 auto;
|
|
padding: 0;
|
|
width: 2%;
|
|
}
|
|
|
|
.sheet-left {
|
|
flex: 1 1;
|
|
/*padding-right:5px;*/
|
|
/*width:45%; */
|
|
|
|
}
|
|
|
|
.sheet-right {
|
|
flex: 1 1;
|
|
/*padding-left:5px;*/
|
|
/*margin-left:1%;*/
|
|
/*width:45%; */
|
|
}
|
|
|
|
.sheet-clateral{
|
|
width: 5%;
|
|
display:flex;
|
|
background-color:black;
|
|
justify-content: center;
|
|
/* align-self: center; */
|
|
align-items: center;
|
|
}
|
|
.sheet-clateral1{
|
|
width: 5%;
|
|
display:flex;
|
|
background-color:black;
|
|
justify-content: left;
|
|
/* align-self: center; */
|
|
align-items: flex-end;
|
|
}
|
|
.sheet-cmain{
|
|
height:100%;
|
|
flex:; 1;
|
|
}
|
|
|
|
/* Clear floats after the columns */
|
|
/*.sheet-row :after {*/
|
|
.sheet-row {
|
|
/*content: "";*/
|
|
/* clear: both;*/
|
|
}
|
|
.sheet-maindiv{
|
|
/*border-style: solid; debug*/
|
|
border-style: none; /*production*/
|
|
/*display: table;*/
|
|
margin-left:2%;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: stretch ;
|
|
}
|
|
/* Text rotation 90 degree simple css */
|
|
|
|
.sheet-rotation-wrapper-outer {
|
|
display: table;
|
|
}
|
|
.sheet-rotation-wrapper-inner {
|
|
|
|
height: 0;
|
|
}
|
|
.sheet-verticaltext{
|
|
display: inline-block;
|
|
|
|
/*transform-origin: center;*/
|
|
text-align:center;
|
|
width:100%;
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
display: inline-block;
|
|
transform: rotate(-90deg);
|
|
white-space: nowrap;
|
|
transform-origin: center center;
|
|
/* Not vital, but possibly a good idea if the element you're rotating contains
|
|
text and you want a single long vertical line of text and the pre-rotation
|
|
width of your element is small enough that the text wraps: */
|
|
|
|
margin-bottom: -50%;
|
|
}
|
|
.sheet-verticaltext2{
|
|
display: inline-block;
|
|
/*transform-origin: center;*/
|
|
text-align:center;
|
|
width:100%;
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
display: inline-block;
|
|
|
|
|
|
transform: rotate(-90deg);
|
|
white-space: nowrap;
|
|
transform-origin: center center;
|
|
/* Not vital, but possibly a good idea if the element you're rotating contains
|
|
text and you want a single long vertical line of text and the pre-rotation
|
|
width of your element is small enough that the text wraps: */
|
|
|
|
margin-bottom: -200%;
|
|
}
|
|
|
|
.sheet-verticaltext1{
|
|
display: inline-block;
|
|
/*transform-origin: center;*/
|
|
text-align:center;
|
|
width:100%;
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
display: inline-block;
|
|
transform: rotate(-90deg);
|
|
transform-origin: center center;
|
|
white-space: nowrap;
|
|
/* Not vital, but possibly a good idea if the element you're rotating contains
|
|
text and you want a single long vertical line of text and the pre-rotation
|
|
width of your element is small enough that the text wraps: */
|
|
|
|
margin-bottom: 50%;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Custom scroll bar For BondBox and possibly Weapons and skills, doesn't work on IE and Firefox*/
|
|
|
|
.sheet-fixedarea
|
|
{
|
|
height: 117.5px;
|
|
/*overflow-y: auto;*/
|
|
/*firefox*/
|
|
overflow-y: scroll;
|
|
scrollbar-width: none;
|
|
border:none;
|
|
}
|
|
.sheet-fixedarea_combat
|
|
{
|
|
height: 30%;
|
|
/*overflow-y: auto;*/
|
|
vertical-align:top;
|
|
/*firefox*/
|
|
overflow-y: scroll;
|
|
scrollbar-width: none;
|
|
}
|
|
|
|
.sheet-fixedarea_skill
|
|
{
|
|
/*height: 223px;*/
|
|
height:180px;
|
|
|
|
/*overflow-y: auto;*/
|
|
/*firefox*/
|
|
overflow-y: scroll;
|
|
scrollbar-width: none;
|
|
border:none;
|
|
float:top;
|
|
}
|
|
|
|
|
|
|
|
::-webkit-scrollbar {
|
|
display: none;
|
|
width: 0px; /* remove scrollbar space */
|
|
background: transparent;
|
|
}
|
|
/*
|
|
::-webkit-scrollbar {
|
|
width: 0px;
|
|
height: 15px;
|
|
}
|
|
::-webkit-scrollbar-track-piece {
|
|
background-color: #C2D2E4;
|
|
}
|
|
::-webkit-scrollbar-thumb:vertical {
|
|
height: 30px;
|
|
background-color: black;
|
|
}
|
|
*/
|
|
|
|
|
|
|
|
/* Difficulty */
|
|
input[type="number"].sheet-totalmod { /* totalmod is used to create a non interactive input between [] */
|
|
width:30px;
|
|
text-align:center;
|
|
display:inline-block;
|
|
color: white;
|
|
font-size: 2rem;
|
|
font-weight:bold;
|
|
}
|
|
input[type="number"].sheet-totalmod:hover{
|
|
background-color:transparent;
|
|
}
|
|
input[type="number"].sheet-totalmod:read-only{
|
|
width:30px;
|
|
text-align:center;
|
|
color: white;
|
|
font-size: 1rem;
|
|
font-weight:bold;
|
|
}
|
|
.sheet-difficultytab{
|
|
|
|
|
|
justify-content: top;
|
|
|
|
|
|
|
|
align-items: center;
|
|
}
|
|
.sheet-difficultytab input[type="radio"],
|
|
.sheet-difficultytab input[type="checkbox"],
|
|
.sheet-subadapt input[type="radio"],
|
|
.sheet-subadapt input[type="checkbox"],{
|
|
display:none;
|
|
}
|
|
.sheet-difficultytab td,
|
|
.sheet-difficultytab th{
|
|
|
|
border:none;
|
|
overflow:hidden;
|
|
margin: 0px 0px 0px 0px;
|
|
}
|
|
.sheet-difficultytab input[type="radio"] + span::before,
|
|
.sheet-difficultytab input[type="checkbox"] + span::before{
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
align-items: center;
|
|
text-align:center;
|
|
color: green;
|
|
height:30px;
|
|
content: "△";
|
|
font-size: 2.5rem;
|
|
display:inline-block;
|
|
|
|
}
|
|
.sheet-difficultytab input[type="radio"]:checked + span::before,
|
|
.sheet-difficultytab input[type="checkbox"]:checked + span::before{
|
|
content: "▲";
|
|
}
|
|
.sheet-difficultytab table{
|
|
position:relative;
|
|
border: 0px solid black;
|
|
|
|
}
|
|
.sheet-difficultytab td label{
|
|
float: left;
|
|
width: 100%;
|
|
margin: 0px 0px 0px 0px;
|
|
overflow:hidden;
|
|
}
|
|
.sheet-difficultytab label{
|
|
white-space: nowrap;
|
|
|
|
}
|
|
.sheet-adapt label,
|
|
.sheet-difficultytab label,
|
|
.sheet-maindiv label{
|
|
height: 20px;
|
|
vertical-align:middle;
|
|
padding:0px 0px 0px 0px;
|
|
}
|
|
.sheet-adapt,
|
|
.sheet-difficultytab{
|
|
}
|
|
|
|
table.sheet-subadapt,
|
|
.sheet-subadapt th,
|
|
.sheet-subadapt td,
|
|
.sheet-subadapt tr,{
|
|
border:none;
|
|
float:center;
|
|
}
|
|
.sheet-subadapt td{
|
|
padding:0px -5px 0px 25px;
|
|
}
|
|
.sheet-subadapt label,.sheet-subadapt span,{
|
|
vertical-align:middle;
|
|
align-items:center;
|
|
text-align:center;
|
|
height:20px;
|
|
width:20px;
|
|
float:center;
|
|
}
|
|
|
|
|
|
|
|
.sheet-adapt input[type="checkbox"]{
|
|
display: none;
|
|
}
|
|
.sheet-adapt{
|
|
display: flex;
|
|
height: 80%;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.sheet-adapt td label{
|
|
float: left;
|
|
vertical-align:middle;
|
|
width: 100%;
|
|
margin: 5px 0px 7px 0px;
|
|
}
|
|
.sheet-adapt label,{
|
|
width: 12px;
|
|
white-space: nowrap;
|
|
}
|
|
.sheet-adapt input[type="checkbox"] + span::before,
|
|
.sheet-adapt input[type="radio"] + span::before{
|
|
color: green;
|
|
height:30px;
|
|
content: "△";
|
|
font-size: 2.5rem;
|
|
vertical-align: middle;
|
|
align-items: center;
|
|
text-align:center;
|
|
|
|
}
|
|
.sheet-adapt input[type="checkbox"]:checked + span::before,
|
|
.sheet-adapt input[type="radio"]:checked + span::before{
|
|
content: "▲";
|
|
}
|
|
/* BUTTON RELATED PROPERTIES */
|
|
.sheet-button {
|
|
border: none;
|
|
width: 100%;
|
|
height:100%;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
vertical-align: middle;
|
|
display: inline-block;
|
|
font-size: 1rem;
|
|
font-weight:bold;
|
|
color:black;
|
|
cursor: pointer;
|
|
opacity:0.8;
|
|
font-size: 1.0 rem;
|
|
}
|
|
.sheet-button:hover {
|
|
opacity:1.0;
|
|
}
|
|
.sheet-button:active {
|
|
opacity: 1.0;;
|
|
transform: scale(0.9);
|
|
}
|
|
|
|
.sheet-buttonfull{
|
|
vertical-align:middle;
|
|
overflow: hidden;
|
|
}
|
|
.sheet-buttonstat {
|
|
display: inline-block;
|
|
width: 100%;
|
|
height:100%;
|
|
text-decoration: none;
|
|
outline: none;
|
|
border:none;
|
|
opacity: 0.6;
|
|
background-color: #C0C0C0;
|
|
clear:none;
|
|
float:center;
|
|
}
|
|
.sheet-buttonstat:hover {
|
|
opacity: 1.0;
|
|
|
|
}
|
|
.sheet-buttonstat:active {
|
|
opacity: 1.0;;
|
|
transform: scale(0.9);
|
|
}
|
|
|
|
/* Rolling Dice Button */
|
|
button[type=roll].sheet-blank-roll-button::before { content: '△'; } /* This remove the d20 symbol*/
|
|
|
|
button[type=roll].sheet-dg-roll {
|
|
color: black;
|
|
background-color: black;
|
|
color: green;
|
|
content: ;
|
|
opacity: 0.8;
|
|
font-weight: bold;
|
|
text-align:center;
|
|
width: 20px;
|
|
height: 20px;
|
|
margin: 0.0;
|
|
padding: 0.0em;
|
|
border: 1px solid black;
|
|
border-radius: 5px;
|
|
}
|
|
button[type=roll].sheet-gm-roll {
|
|
color: red;
|
|
background-color: red;
|
|
font-weight: bold;
|
|
text-align:center;
|
|
width: 20px;
|
|
height: 20px;
|
|
margin: 0.0;
|
|
padding: 0.0em;
|
|
border: 1px solid black;
|
|
border-radius: 5px;
|
|
content: "gm";
|
|
}
|
|
/* Roll Templates *//*---- RolltemplateDG -----*/
|
|
/* Roll Templates */
|
|
.sheet-rolltemplate-dg table,
|
|
.sheet-rolltemplate-dg-stat table,
|
|
.sheet-rolltemplate-dg-neet table,
|
|
.sheet-rolltemplate-gm table,
|
|
.sheet-rolltemplate-bond table{
|
|
|
|
max-width: 230px;
|
|
width: 100%;
|
|
|
|
border: 1px solid black;
|
|
color: black;
|
|
background: #FFFFFF;
|
|
}
|
|
.sheet-rolltemplate-dg caption,
|
|
.sheet-rolltemplate-dg-stat caption,
|
|
.sheet-rolltemplate-dg-neet caption,
|
|
.sheet-rolltemplate-gm caption,
|
|
.sheet-rolltemplate-bond caption, {
|
|
text-align: center;
|
|
background: black;
|
|
color: white;
|
|
font-weight: bold;
|
|
padding: 2px;
|
|
border: 1px solid black;
|
|
line-height: 1.6em;
|
|
}
|
|
.sheet-rolltemplate-dg td,
|
|
.sheet-rolltemplate-dg-stat td,
|
|
.sheet-rolltemplate-dg-neet td,
|
|
.sheet-rolltemplate-gm td,
|
|
.sheet-rolltemplate-bond td {
|
|
padding: 2px;
|
|
border-bottom: 1px solid black;
|
|
}
|
|
.sheet-rolltemplate-dg td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-stat td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-neet td.sheet-template_label,
|
|
.sheet-rolltemplate-gm td.sheet-template_label,
|
|
.sheet-rolltemplate-bond td.sheet-template_label {
|
|
font-weight: bold;
|
|
background: black;
|
|
color: white;
|
|
}
|
|
.sheet-rolltemplate-dg td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-stat td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-neet td.sheet-template_value,
|
|
.sheet-rolltemplate-gm td.sheet-template_value,
|
|
.sheet-rolltemplate-bond td.sheet-template_value {
|
|
text-align: center;
|
|
}
|
|
.sheet-rolltemplate-dg .inlinerollresult,
|
|
.sheet-rolltemplate-dg-stat .inlinerollresult,
|
|
.sheet-rolltemplate-gm .inlinerollresult,
|
|
.sheet-rolltemplate-bond .inlinerollresult {
|
|
display: inline-block;
|
|
min-width: 1.5em;
|
|
text-align: center;
|
|
border: none;
|
|
background: none;
|
|
}
|
|
.sheet-rolltemplate-dg .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-dg-stat .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-gm .inlinerollresult.fullcrit {
|
|
border: none;
|
|
background: none;
|
|
}
|
|
.sheet-rolltemplate-dg .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-dg-stat .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-gm .inlinerollresult.fullfail {
|
|
border: none;
|
|
background: none;
|
|
}
|
|
.sheet-rolltemplate-dg .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-dg-stat .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-gm .inlinerollresult.importantroll {
|
|
border: none;
|
|
background: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-dg-attack table,
|
|
.sheet-rolltemplate-dg-attackhand table,
|
|
.sheet-rolltemplate-dg-attackfire table,
|
|
.sheet-rolltemplate-dg-attackshotgun table,
|
|
.sheet-rolltemplate-dg-ritualdmg table,
|
|
.sheet-rolltemplate-dg-rituallethality table,
|
|
.sheet-rolltemplate-dg-attacklethal table,
|
|
.sheet-rolltemplate-dg-attack-monster table,
|
|
.sheet-rolltemplate-gm-attack table {
|
|
max-width: 230px;
|
|
width: 100%;
|
|
|
|
border: 1px solid black;
|
|
color: black;
|
|
background: #FFFFFF;
|
|
}
|
|
|
|
.sheet-rolltemplate-dg-attack caption,
|
|
.sheet-rolltemplate-dg-attackhand caption,
|
|
.sheet-rolltemplate-dg-attackfire caption,
|
|
.sheet-rolltemplate-dg-attackshotgun caption,
|
|
.sheet-rolltemplate-dg-ritualdmg caption,
|
|
.sheet-rolltemplate-dg-rituallethality caption,
|
|
.sheet-rolltemplate-dg-attacklethal caption,
|
|
.sheet-rolltemplate-dg-attack-monster caption,
|
|
.sheet-rolltemplate-gm-attack caption {
|
|
text-align: center;
|
|
background: black;
|
|
color: white;
|
|
font-weight: bold;
|
|
padding: 2px;
|
|
border: 1px solid black;
|
|
line-height: 1.6em;
|
|
}
|
|
.sheet-rolltemplate-dg-attack td,
|
|
.sheet-rolltemplate-dg-attackhand td,
|
|
.sheet-rolltemplate-dg-attackfire td,
|
|
.sheet-rolltemplate-dg-attackshotgun td,
|
|
.sheet-rolltemplate-dg-ritualdmg td,
|
|
.sheet-rolltemplate-dg-rituallethality td,
|
|
.sheet-rolltemplate-dg-attacklethal td,
|
|
.sheet-rolltemplate-dg-attack-monster td,
|
|
.sheet-rolltemplate-gm-attack td {
|
|
padding: 2px;
|
|
border-bottom: 1px solid black;
|
|
}
|
|
.sheet-rolltemplate-dg-attack th,
|
|
.sheet-rolltemplate-dg-attackhand th,
|
|
.sheet-rolltemplate-dg-attackfire th,
|
|
.sheet-rolltemplate-dg-attackshotgun th,
|
|
.sheet-rolltemplate-dg-ritualdmg th,
|
|
.sheet-rolltemplate-dg-rituallethality th,
|
|
.sheet-rolltemplate-dg-attacklethal th,
|
|
.sheet-rolltemplate-dg-attack-monster th,
|
|
.sheet-rolltemplate-gm-attack th {
|
|
padding: 2px;
|
|
border-bottom: 1px solid black;
|
|
background: black;
|
|
color: white;
|
|
}
|
|
|
|
.sheet-rolltemplate-dg-attack td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-attackhand td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-attackfire td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-attackshotgun td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-ritualdmg td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-rituallethality td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-attacklethal td.sheet-template_label,
|
|
.sheet-rolltemplate-dg-attack-monster td.sheet-template_label,
|
|
.sheet-rolltemplate-gm-attack td.sheet-template_label {
|
|
font-weight: bold;
|
|
background: black;
|
|
color: white;
|
|
}
|
|
.sheet-rolltemplate-dg-attack td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-attackhand td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-attackfire td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-attackshotgun td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-ritualdmg td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-rituallethality td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-attacklethal td.sheet-template_value,
|
|
.sheet-rolltemplate-dg-attack-monster td.sheet-template_value,
|
|
.sheet-rolltemplate-gm-attack td.sheet-template_value {
|
|
text-align: center;
|
|
}
|
|
.sheet-rolltemplate-dg-attack .inlinerollresult,
|
|
.sheet-rolltemplate-dg-attackhand .inlinerollresult,
|
|
.sheet-rolltemplate-dg-attackfire .inlinerollresult,
|
|
.sheet-rolltemplate-dg-attackshotgun .inlinerollresult,
|
|
.sheet-rolltemplate-dg-ritualdmg .inlinerollresult,
|
|
.sheet-rolltemplate-dg-rituallethality .inlinerollresult,
|
|
.sheet-rolltemplate-dg-attacklethal .inlinerollresult,
|
|
.sheet-rolltemplate-dg-attack-monster .inlinerollresult,
|
|
.sheet-rolltemplate-gm-attack .inlinerollresult {
|
|
display: inline-block;
|
|
min-width: 1.5em;
|
|
text-align: center;
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
.sheet-rolltemplate-dg-attack .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-dg-attackhand .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-dg-attackfire .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-dg-attackshotgun .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-dg-ritualdmg .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-dg-rituallethality .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-dg-attacklethal .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-dg-attack-monster .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-gm-attack .inlinerollresult.fullcrit {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
.sheet-rolltemplate-dg-attack .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-dg-attackhand .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-dg-attackfire .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-dg-attackshotgun .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-dg-ritualdmg .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-dg-rituallethality .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-dg-attacklethal .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-dg-attack-monster .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-gm-attack .inlinerollresult.fullfail {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
.sheet-rolltemplate-dg-attack .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-dg-attackhand .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-dg-attackfire .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-dg-attackshotgun .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-dg-ritualdmg .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-dg-rituallethality .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-dg-attacklethal .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-dg-attack-monster .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-gm-attack .inlinerollresult.importantroll {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
/* CARD FLIP MECHANICS ------------------------------------- CARD FLIP MECHANICS */
|
|
|
|
|
|
.sheet-front,.sheet-back {
|
|
backface-visibility: hidden;
|
|
position: absolute;
|
|
|
|
overflow: hidden;
|
|
|
|
scrollbar-width: none;
|
|
}
|
|
.sheet-flipper{
|
|
transition: 1.2s;
|
|
transform-style: preserve-3d;
|
|
|
|
position: relative;
|
|
height:100%;
|
|
|
|
|
|
scrollbar-width: none;
|
|
|
|
}
|
|
.sheet-front {
|
|
z-index: 2;
|
|
/* for firefox 31 */
|
|
transform: rotateY(0deg);
|
|
}
|
|
|
|
.sheet-back {
|
|
transform: rotateY(180deg);
|
|
}
|
|
/*
|
|
*/
|
|
.sheet-agentflip{
|
|
display:none;
|
|
}
|
|
.sheet-agentflip:checked ~ .sheet-flipper {
|
|
transform: rotateY( -180deg );
|
|
}
|
|
.sheet-card{
|
|
perspective: 1000px;
|
|
|
|
}
|
|
.sheet-card,.sheet-front,.sheet-back{
|
|
height:100%;
|
|
width:100%;
|
|
|
|
}
|
|
/* checkbox for attacks */
|
|
.sheet-block-b,
|
|
input.sheet-block-switch:checked ~ .sheet-block-a {
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-block-a,
|
|
input.sheet-block-switch:checked ~ .sheet-block-b {
|
|
display: none;
|
|
}
|
|
|
|
|
|
.sheet-switch-a,
|
|
.sheet-switch-b,
|
|
.sheet-switch-c,
|
|
.sheet-switch-d,{
|
|
display:none;
|
|
}
|
|
|
|
input.sheet-block-a:checked ~ .sheet-switch-a,
|
|
input.sheet-block-b:checked ~ .sheet-switch-b,
|
|
input.sheet-block-c:checked ~ .sheet-switch-c,
|
|
input.sheet-block-d:checked ~ .sheet-switch-d{
|
|
display:block;
|
|
}
|
|
|
|
.sheet-attack-button1,
|
|
.sheet-attack-button2,
|
|
.sheet-attack-button3,
|
|
.sheet-attack-button4,
|
|
.sheet-attack-button5,
|
|
.sheet-attack-button6{
|
|
display:none;
|
|
}
|
|
|
|
input.sheet-block-button1:checked ~ .sheet-attack-button1,
|
|
input.sheet-block-button2:checked ~ .sheet-attack-button2,
|
|
input.sheet-block-button3:checked ~ .sheet-attack-button3,
|
|
input.sheet-block-button4:checked ~ .sheet-attack-button4,
|
|
input.sheet-block-button5:checked ~ .sheet-attack-button5,
|
|
input.sheet-block-button6:checked ~ .sheet-attack-button6{
|
|
display:block;
|
|
|
|
}
|
|
|
|
input[type=text]{
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.fold{
|
|
|
|
height: 400px;
|
|
padding: 25px 25px;
|
|
position: relative;
|
|
font-size: 90%;
|
|
text-decoration: none;
|
|
color: #999;
|
|
background: #fff;
|
|
transition: all ease .5s;
|
|
}
|
|
|
|
/*
|
|
paper fold corner
|
|
*/
|
|
|
|
.fold:before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
border-style: solid;
|
|
border-width: 0 100px 100px 0;
|
|
border-color: #ddd #34495E;
|
|
transition: all ease .5s;
|
|
}
|
|
|
|
/*
|
|
on li hover make paper fold larger
|
|
*/
|
|
.fold:hover:before {
|
|
border-width: 0 150px 150px 0;
|
|
border-color: #eee #34495E;
|
|
|
|
}
|
|
|
|
|
|
|
|
input.sheet-nolight:hover{
|
|
background-color: transparent;
|
|
}
|
|
|
|
|
|
/* Internal table */
|
|
table.sheet-internal {
|
|
border-collapse: collapse;
|
|
border-style: hidden;
|
|
overflow:hidden;
|
|
}
|
|
table.sheet-internal td, table th {
|
|
border: 1px solid black;
|
|
}
|
|
table.sheet-internal tr:first-child th {
|
|
border-top: none;
|
|
}
|
|
table.sheet-internal tr:last-child td {
|
|
border-bottom: none;
|
|
text-align:center;
|
|
}
|
|
}
|
|
table.sheet-internal tr td:first-child,
|
|
table.sheet-internal tr th:first-child {
|
|
border-left: none;
|
|
}
|
|
table.sheet-internal tr td:last-child,
|
|
table.sheet-internal tr th:last-child {
|
|
border-right: none;
|
|
}
|
|
|
|
|
|
|
|
.sheet-div-table {
|
|
display: table;
|
|
width: auto;
|
|
border: 1px solid #666666;
|
|
border-spacing: 5px; /* cellspacing:poor IE support for this */
|
|
}
|
|
.sheet-div-table-row {
|
|
display: table-row;
|
|
clear: both;
|
|
}
|
|
.sheet-div-table-col {
|
|
float: left; /* fix for buggy browsers */
|
|
display: table-column;
|
|
}
|
|
.sheet-mytextarea{
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
border: 0;
|
|
} |