mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 11:42:29 +00:00
936 lines
21 KiB
CSS
936 lines
21 KiB
CSS
* {
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
.sheet-noclick{
|
|
pointer-events: none;
|
|
}
|
|
.ui-dialog .charsheet button[type=roll]:before {
|
|
content: "";
|
|
}
|
|
.ui-dialog .button[type=roll].sheet-blank-button::before {
|
|
content: '';
|
|
content: "";
|
|
}
|
|
|
|
input.button[type=roll].sheet-blank-button{
|
|
background:transparent; z-index:5; border:none;
|
|
visibility:hidden;
|
|
}
|
|
/* === === === === === === */
|
|
.charsheet h1, .charsheet h2, .charsheet h4{
|
|
color: silver;
|
|
text-shadow:0px 0px 0.5em black;
|
|
}
|
|
.charsheet h3 {
|
|
color: white;
|
|
text-shadow:0px 0px 0.5em black;
|
|
cursor: pointer;
|
|
}
|
|
.charsheet h3:hover {
|
|
color:orange;
|
|
}
|
|
.sheet-slant .tooltiptext {
|
|
visibility: hidden;
|
|
width: 120px;
|
|
background-color: blue;
|
|
border: 2px dashed red;
|
|
border-radius: 5px;
|
|
color: yellow;
|
|
text-align: center;
|
|
border-radius: 6px;
|
|
padding: 5px 0;
|
|
|
|
/* Position the tooltip */
|
|
position: absolute;
|
|
z-index: 1;
|
|
bottom: 100%;
|
|
left: 50%;
|
|
margin-left: -60px;
|
|
-webkit-transform: skew(45deg);
|
|
-ms-transform: skew(45deg);
|
|
transform: skew(45deg);
|
|
}
|
|
|
|
.sheet-slant:hover .tooltiptext {
|
|
visibility: visible;
|
|
}
|
|
.charsheet .sheet-headertitle{
|
|
font-family: "contail One", monospace;
|
|
font-size:24px;
|
|
color:silver;
|
|
text-align: center;
|
|
width: 840px;
|
|
}
|
|
.charsheet {
|
|
background-color: #2c5054; /*#bdd2f7;
|
|
background: linear-gradient(75deg, rgba(254,252,234,.5) 25%,rgba(44, 80, 84, 0.95) 90%);*/
|
|
font-size: 10px; /*mostly labels. Does not handle inputs.*/
|
|
}
|
|
.charsheet .sheet-headertitle:hover{
|
|
font-family: "contail One", monospace;
|
|
text-shadow: 0px 0px 10px #ffd700;
|
|
color:gold;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
.sheet-header-ribbon {
|
|
margin-bottom:5px; text-indent:000px; text-align: center; /*background:rgba(186,31,25,.95); border-radius:14px;*/
|
|
min-width: 840px;
|
|
|
|
}
|
|
.sheet-flexed {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
justify-content: start;
|
|
margin-left: 20px;
|
|
}
|
|
input.sheet-tab::before {
|
|
content: attr(title);
|
|
|
|
color:white;
|
|
text-shadow:0px 0px 0.5em black;
|
|
|
|
text-align: center;
|
|
display: inline-block;
|
|
|
|
background: #fff;
|
|
background: -moz-linear-gradient(to top, #fff, #000, #fff);
|
|
background: -webkit-linear-gradient(to top, #fff, #000, #fff);
|
|
background: -ms-linear-gradient(to top, #fff, #000, #fff);
|
|
background: -o-linear-gradient(to top, #fff, #000, #fff);
|
|
background: linear-gradient(to top, #fff, #000, #fff);
|
|
|
|
width: 110px;
|
|
height: 20px;
|
|
font-size: 14px;
|
|
font-weight:700;
|
|
border-radius: 15px 15px 15px 15px;
|
|
border:1px solid black;
|
|
}
|
|
|
|
input.sheet-tab:checked::before {
|
|
background: #dcdcdc;
|
|
background: -moz-linear-gradient(to top, #b30000, #000, #b30000);
|
|
background: -webkit-linear-gradient(to top, #b30000, #000, #b30000);
|
|
background: -ms-linear-gradient(to top, #b30000, #000, #b30000);
|
|
background: -o-linear-gradient(to top, #b30000, #000, #b30000);
|
|
background: linear-gradient(to top, #b30000, #000, #b30000);
|
|
/* border-bottom-color: #fff; */
|
|
text-shadow:0px 0px 0.5em black,0px 0px 0.5em black;
|
|
}
|
|
|
|
input.sheet-tab {
|
|
width: 100px;
|
|
height: 20px;
|
|
position: relative;
|
|
left: 6px;
|
|
margin: 2px 2px 15px 2px;
|
|
cursor: pointer;
|
|
z-index: 4;
|
|
border-radius: 5px 5px 5px 5px;
|
|
}
|
|
input.sheet-tab:not(:first-child)::before {
|
|
border-left: none;
|
|
}
|
|
.none {
|
|
display: none;
|
|
}
|
|
|
|
div.sheet-attributes {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
justify-content: space-evenly;
|
|
margin-left: 20px;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
div.sheet-slant {
|
|
background: #4682b4;
|
|
-webkit-transform: skew(-45deg);
|
|
-ms-transform: skew(-45deg);
|
|
transform: skew(-45deg);
|
|
/*z-index: -1; */
|
|
color: white;
|
|
height:15px;
|
|
margin-bottom: 5px;
|
|
}
|
|
label.sheet-slant {
|
|
/* background: transparent; */
|
|
-webkit-transform: skew(45deg);
|
|
-ms-transform: skew(45deg);
|
|
transform: skew(45deg);
|
|
z-index: -1;
|
|
font-family: "Contrail One", cursive;
|
|
color: white;
|
|
padding-left:6px;
|
|
}
|
|
|
|
.sheet-roll-notice:hover {
|
|
color:red;
|
|
}
|
|
div.sheet-slant2 {
|
|
background: black;
|
|
-webkit-transform: skew(-45deg);
|
|
-ms-transform: skew(-45deg);
|
|
transform: skew(-45deg);
|
|
z-index: -1;
|
|
}
|
|
.sheet-border {
|
|
margin-bottom:5px; border-radius:5px; box-shadow: inset 0px 0px 10px silver, inset 0px 0px 8px silver,inset 0px 0px 4px black;
|
|
}
|
|
.sheet-circle {
|
|
background:grey;
|
|
border-radius: 100%;
|
|
width: 40px;
|
|
height: 40px;
|
|
padding: 0px;
|
|
/* background:#4682b4; */
|
|
border: 1px solid white;
|
|
color:white;
|
|
text-align: right;
|
|
font: 12px Arial, sans-serif;
|
|
margin:0px;
|
|
cursor:pointer;
|
|
}
|
|
|
|
input[type="number"].sheet-circle{
|
|
font-size: 16px;
|
|
text-align:center;
|
|
cursor:pointer;
|
|
}
|
|
|
|
input[type="number"].sheet-circle:out-of-range{
|
|
background:red;
|
|
}
|
|
|
|
|
|
/* For the AC emblem */
|
|
|
|
|
|
div.shield {
|
|
height: 50px;
|
|
width: 50px;
|
|
margin-left: -10px;
|
|
margin-top:10px;
|
|
margin-bottom:10px;
|
|
/*border: 10px solid; */
|
|
border-radius: 50% 50% 50% 50% / 12% 12% 88% 88%;
|
|
background-color: silver;
|
|
opacity:50%
|
|
}
|
|
|
|
|
|
/* === === === === === === */
|
|
div.sheet-tab1, div.sheet-tab-content {
|
|
display: none;
|
|
}
|
|
|
|
|
|
div.foci {
|
|
display:grid; grid-template-columns: 40px 150px 40px 150px; grid-template-rows: auto;
|
|
}
|
|
|
|
|
|
.sheet-tab1:checked ~ div.sheet-tab1,
|
|
.sheet-tab2:checked ~ div.sheet-tab2,
|
|
input.sheet-tab3:checked ~ div.sheet-tab3,
|
|
input.sheet-tab4:checked ~ div.sheet-tab4,
|
|
input.sheet-tab5:checked ~ div.sheet-tab5,
|
|
input.sheet-tab6:checked ~ div.sheet-tab6,
|
|
input.sheet-tab7:checked ~ div.sheet-tab7 {
|
|
display: block;
|
|
width: 840px;
|
|
margin-left:auto;
|
|
margin-right:auto;
|
|
}
|
|
.sheet-show2:checked ~ .sheet-flexed,
|
|
.sheet-show1:checked ~ .sheet-flexed {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
justify-content: start;
|
|
margin-left: 20px;
|
|
}
|
|
div.Yellow-Ribbon{
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowarp;
|
|
width: 840px;
|
|
background-color: 4d4d00;
|
|
z-index: -1;
|
|
border-radius:5px;
|
|
box-shadow: inset 0px 0px 10px silver, inset 0px 0px 8px silver,inset 0px 0px 4px black;
|
|
margin-right:auto;
|
|
margin-left:auto;
|
|
}
|
|
div.top-ribbon{
|
|
display: block;
|
|
width: 840px;
|
|
background-color: 4d4d00;
|
|
z-index: -1;
|
|
border-radius:5px;
|
|
box-shadow: inset 0px 0px 10px silver, inset 0px 0px 8px silver,inset 0px 0px 4px black;
|
|
margin-right:auto;
|
|
margin-left:auto;
|
|
}
|
|
|
|
div.sheet-tab-content {
|
|
width: 840px;
|
|
padding: 5px;
|
|
|
|
background-color: black;
|
|
background: linear-gradient(75deg, rgba(0,0,0,.3) 25%,rgba(44, 80, 84, 0.95) 90%);
|
|
font-size: 10px;
|
|
/* rgba(179,0,0,.7) */
|
|
border-radius:15px;
|
|
box-shadow: inset 0px 0px 10px white, inset 0px 0px 8px white,inset 0px 0px 4px white;
|
|
margin-right:auto;
|
|
margin-left:auto;
|
|
}
|
|
/* === === === */
|
|
|
|
.charsheet label,
|
|
.charsheet h5 {
|
|
color:white;
|
|
text-shadow:0px 0px 2px black,0px 0px 2px black,0px 0px 2px black;
|
|
}
|
|
|
|
div.sheet-center {
|
|
padding-right:5%;
|
|
background:black;
|
|
padding-left:5%;
|
|
border-radius:15px;
|
|
}
|
|
|
|
input[type="text"].sheet-attribword {
|
|
background:transparent;
|
|
width:120px;
|
|
margin:0px;
|
|
font-size:20px;
|
|
font-weight:bold;
|
|
color:white;
|
|
border-top:none;
|
|
border-left:none;
|
|
border-right:none;
|
|
box-shadow:none;
|
|
text-shadow: 0px 0px 5px black;
|
|
cursor:pointer;
|
|
|
|
}
|
|
input[type="text"].sheet-attribword2 {
|
|
background:transparent;
|
|
width:120px;
|
|
margin:0px;
|
|
font-size:18px;
|
|
font-weight:normal;
|
|
color:white;
|
|
border-top:none;
|
|
border-left:none;
|
|
border-right:none;
|
|
box-shadow:none;
|
|
text-shadow: 0px 0px 5px gray;
|
|
cursor:pointer;
|
|
|
|
}
|
|
input[type="text"].sheet-attribword2::placeholder,
|
|
input[type="text"].sheet-attribword::placeholder {
|
|
color:#c8c8c8;
|
|
font-weight:normal;
|
|
}
|
|
input[type="text"].sheet-attribword2:focus,
|
|
input[type="text"].sheet-attribword:focus {
|
|
font-weight:normal;
|
|
}
|
|
input[type="text"].sheet-equipment {
|
|
background:gray;
|
|
width:150px;
|
|
margin:0px;
|
|
font-size:10px;
|
|
font-weight:bold;
|
|
color:white;
|
|
cursor:pointer;
|
|
}
|
|
input[type="text"].sheet-skillword {
|
|
background:gray;
|
|
width:180px;
|
|
margin:0px;
|
|
font-size:14px;
|
|
font-weight:bold;
|
|
color:white;
|
|
cursor:pointer;
|
|
}
|
|
input[type="text"].sheet-skillword2 {
|
|
background:gray;
|
|
width:150px;
|
|
margin:0px;
|
|
font-size:14px;
|
|
font-weight:bold;
|
|
color:white;
|
|
cursor:pointer;
|
|
}
|
|
|
|
input[type="text"].sheet-skillword3 {
|
|
background:gray;
|
|
width:200px;
|
|
margin:0px;
|
|
font-size:14px;
|
|
font-weight:bold;
|
|
color:white;
|
|
cursor:pointer;
|
|
}
|
|
input[type="text"].sheet-equipment::placeholder,
|
|
input[type="text"].sheet-skillword3::placeholder,
|
|
input[type="text"].sheet-skillword2::placeholder,
|
|
input[type="text"].sheet-skillword::placeholder {
|
|
color:#c8c8c8;
|
|
font-weight:normal;
|
|
}
|
|
|
|
input[type="number"].sheet-skillnumber {
|
|
background:gray;
|
|
width:30px;
|
|
margin:0px;
|
|
font-size:14px;
|
|
font-weight:bold;
|
|
color:white;
|
|
text-shadow: 0px 0px 5px black;
|
|
cursor:pointer;
|
|
}
|
|
input[type="number"] {
|
|
-moz-appearance: textfield;
|
|
/* Firefox */
|
|
}
|
|
input[type="number"].sheet-skillnumber2::-webkit-inner-spin-button,
|
|
input[type="number"].sheet-skillnumber2::-webkit-outer-spin-button,
|
|
input[type="number"].sheet-skillnumber::-webkit-inner-spin-button,
|
|
input[type="number"].sheet-skillnumber::-webkit-outer-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
-moz-appearance: textfield;
|
|
/* Firefox */
|
|
}
|
|
input[type="number"].sheet-skillnumber2,
|
|
input[type="number"].sheet-skillnumber {
|
|
-moz-appearance: textfield;
|
|
}
|
|
input[type="number"].sheet-skillnumber2 {
|
|
background:black;
|
|
width:30px;
|
|
margin:0px;
|
|
font-size:14px;
|
|
font-weight:bold;
|
|
color:white;
|
|
text-shadow: 0px 0px 5px black;
|
|
cursor:pointer;
|
|
}
|
|
|
|
input[type="number"].sheet-skillnumber3 {
|
|
width:80px;
|
|
background:transparent;
|
|
margin:0px;
|
|
font-size:14px;
|
|
font-weight:bold;
|
|
color:white;
|
|
text-shadow: 0px 0px 5px black, 0px 0px 5px black;
|
|
border-left:none;
|
|
border-right:none;
|
|
border-top:none;
|
|
border-bottom:1px solid white;
|
|
cursor:pointer;
|
|
}
|
|
input[type="number"].sheet-skillnumber2:hover,
|
|
input[type="number"].sheet-skillnumber2:focus,
|
|
input[type="number"].sheet-skillnumber:hover,
|
|
input[type="number"].sheet-skillnumber:focus {
|
|
-moz-appearance: number-input;
|
|
}
|
|
input[type="number"].sheet-attribnumber {
|
|
background:transparent;
|
|
width:30px;
|
|
margin:0px;
|
|
font-size:18px;
|
|
font-weight:bold;
|
|
color:white;
|
|
text-shadow: 0px 0px 5px black;
|
|
border:none;
|
|
cursor:pointer;
|
|
}
|
|
input[type="number"].sheet-circle::-webkit-inner-spin-button,
|
|
input[type="number"].sheet-attribnumber::-webkit-inner-spin-button,
|
|
input[type="number"].sheet-attribnumber::-webkit-outer-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
} -moz-appearance:textfield;
|
|
}
|
|
input[type="number"].sheet-attribnumber {
|
|
-moz-appearance:textfield;
|
|
}
|
|
input[type="number"].sheet-attribnumber:focus {
|
|
background:red;
|
|
}
|
|
h4.sheet-header {
|
|
color:white;
|
|
text-shadow: 0px 0px 5px black,0px 0px 5px black;
|
|
}
|
|
div.sheet-hidden {
|
|
display:none;
|
|
}
|
|
.sheet-border1 {
|
|
border-radius:15px;
|
|
border:1px solid green;
|
|
box-shadow: inset 0px 0px 10px green;
|
|
}
|
|
.sheet-border2 {
|
|
border-radius:15px;
|
|
border:1px solid red;
|
|
box-shadow: inset 0px 0px 10px red;
|
|
}
|
|
.sheet-border3 {
|
|
border-radius:15px;
|
|
border:1px solid blue;
|
|
box-shadow: inset 0px 0px 10px blue;
|
|
}
|
|
.sheet-center {
|
|
margin-left:auto;
|
|
margin-right:auto;
|
|
text-align:center;
|
|
}
|
|
/* === === === */
|
|
textarea.sheet-textarea {
|
|
color: white;
|
|
text-shadow:0px 0px 5px black;
|
|
padding-top:2px;
|
|
padding-bottom:2px;
|
|
height:45px;
|
|
width:260px;
|
|
background:gray;
|
|
cursor:pointer;
|
|
}
|
|
textarea.sheet-textarea2::placeholder,
|
|
textarea.sheet-textarea::placeholder {
|
|
color:white;
|
|
text-shadow:none;
|
|
font-style:italic;
|
|
}
|
|
textarea.sheet-textarea2 {
|
|
height:45px;
|
|
padding-top:2px;
|
|
padding-bottom:2px;
|
|
width:400px;
|
|
background:gray;
|
|
color: white;
|
|
text-shadow:0px 0px 5px black;
|
|
cursor:pointer;
|
|
}
|
|
select.sheet-select {
|
|
color:white;
|
|
background:gray;
|
|
width:120px;
|
|
padding-top:0px;
|
|
padding-bottom:0px;
|
|
margin-top:2px;
|
|
margin-bottom:0px;
|
|
}
|
|
select.sheet-select * {
|
|
color:white;
|
|
background: gray;
|
|
text-shadow:none;
|
|
}
|
|
select.sheet-select1 {
|
|
color:white;
|
|
background:transparent;
|
|
width:120px;
|
|
padding-top:0px;
|
|
padding-bottom:0px;
|
|
margin-top:2px;
|
|
margin-bottom:0px;
|
|
}
|
|
select.sheet-select1 * {
|
|
color:black;
|
|
background: gray;
|
|
}
|
|
/* === === === */
|
|
|
|
/* === My Buttons === */
|
|
/* ======== Sheet btn========*/
|
|
.sheet-btn button[type="roll"]:before,
|
|
.sheet-btn:before {
|
|
content: ""!important;
|
|
display: none;
|
|
border:none;
|
|
}
|
|
.sheet-btn button[type="roll"],
|
|
.sheet-btn {
|
|
display: block;
|
|
background: blue;
|
|
border-radius: 5px;
|
|
height: 20px;
|
|
width: 44px;
|
|
margin: 0;
|
|
background: radial-gradient(circle at 20px 20px, gray, #000);
|
|
border:none;
|
|
box-shadow: 0px 0px 5px gray;
|
|
}
|
|
.sheet-btn button[type="roll"]:hover,
|
|
.sheet-btn:hover {
|
|
background: radial-gradient(circle at 10px 10px, gray, #000);
|
|
}
|
|
|
|
.sheet-btn button[type="roll"]:active,
|
|
.sheet-btn:active {
|
|
background: radial-gradient(circle at 20px 20px, #000, gray);
|
|
}
|
|
/**/
|
|
/* ======== Sheet msgbtn========*/
|
|
.sheet-msgbtn button[type="roll"]:before,
|
|
.sheet-msgbtn:before {
|
|
content: ""!important;
|
|
display: none;
|
|
border:none;
|
|
}
|
|
.sheet-msgbtn button[type="roll"],
|
|
.sheet-msgbtn {
|
|
display: block;
|
|
background: blue;
|
|
border-radius: 5px;
|
|
height: 44px;
|
|
width: 44px;
|
|
margin: 0;
|
|
background: radial-gradient(circle at 30px 30px, yellow, #000);
|
|
border:none;
|
|
box-shadow: 0px 0px 5px gray;
|
|
}
|
|
.sheet-msgbtn button[type="roll"]:hover,
|
|
.sheet-msgbtn:hover {
|
|
background: radial-gradient(circle at 10px 10px, yellow, #000);
|
|
}
|
|
|
|
.sheet-msgbtn button[type="roll"]:active,
|
|
.sheet-msgbtn:active {
|
|
background: radial-gradient(circle at 20px 20px, #000, yellow);
|
|
}
|
|
/**/
|
|
|
|
.sheet-button button[type="roll"]:before,
|
|
.sheet-button:before {
|
|
content: ""!important;
|
|
display: none;
|
|
border:none;
|
|
}
|
|
.sheet-button button[type="roll"],
|
|
.sheet-button {
|
|
width:80px;
|
|
height:28px;
|
|
|
|
display: inline-block;
|
|
|
|
cursor: pointer;
|
|
|
|
background: transparent;
|
|
border: 4px outset gray;
|
|
border-radius: 4px;
|
|
|
|
padding-top: 2px;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
padding-bottom:4px;
|
|
margin: 0;
|
|
|
|
text-align: left;
|
|
vertical-align: middle;
|
|
font-weight: 700;
|
|
font-size: 1.3em!important;
|
|
|
|
color: white;
|
|
text-shadow: 0px 0px 5px black;
|
|
|
|
white-space: nowrap;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
}
|
|
.sheet-button button[type="roll"]:hover,
|
|
.sheet-button:hover {
|
|
color: white;
|
|
border: inset 4px gray;
|
|
background: transparent;
|
|
|
|
padding-top: 3px;
|
|
padding-left: 3px;
|
|
padding-right: 1px;
|
|
padding-bottom: 1px;
|
|
margin: 0;
|
|
|
|
text-shadow: 0px 0px 0.5em black;
|
|
}
|
|
|
|
.sheet-button button[type="roll"]:active,
|
|
.sheet-button:active {
|
|
background: radial-gradient(circle at 20px 20px, #000, gray);
|
|
}
|
|
/**/
|
|
.sheet-button2 button[type="roll"]:before,
|
|
.sheet-button2:before {
|
|
content: ""!important;
|
|
display: none;
|
|
border:none;
|
|
}
|
|
.sheet-button2 button[type="roll"],
|
|
.sheet-button2 {
|
|
width:28px;
|
|
height:28px;
|
|
|
|
display: inline-block;
|
|
|
|
cursor: pointer;
|
|
|
|
background: transparent;
|
|
border: 4px outset gray;
|
|
border-radius: 4px;
|
|
|
|
padding-top: 2px;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
padding-bottom:4px;
|
|
margin: 0;
|
|
|
|
text-align: left;
|
|
vertical-align: middle;
|
|
font-weight: 700;
|
|
font-size: 1.3em!important;
|
|
|
|
color: white;
|
|
text-shadow: 0px 0px 5px black;
|
|
|
|
white-space: nowrap;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
}
|
|
.sheet-button2 button[type="roll"]:hover,
|
|
.sheet-button2:hover {
|
|
color: white;
|
|
border: inset 4px gray;
|
|
background: transparent;
|
|
|
|
padding-top: 3px;
|
|
padding-left: 3px;
|
|
padding-right: 1px;
|
|
padding-bottom: 1px;
|
|
margin: 0;
|
|
|
|
text-shadow: 0px 0px 0.5em black;
|
|
}
|
|
.img1{
|
|
max-width:100px;
|
|
max-height:100px;
|
|
width: minmax(0px, 25px);
|
|
height: minmax(0px, 25px);
|
|
border:none;
|
|
}
|
|
.sheet-button2 button[type="roll"]:active,
|
|
.sheet-button2:active {
|
|
background: radial-gradient(circle at 20px 20px, #000, gray);
|
|
}
|
|
/**/
|
|
|
|
/*========== sheet hiding ==========*/
|
|
|
|
input.sheet-hider:checked ~ div.sheet-hold
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
input.sheet-hidden {
|
|
display: none;
|
|
}
|
|
/* === Text and Number === */
|
|
.charsheet input {
|
|
font-size:9px;
|
|
}
|
|
.charsheet input[type=text].sheet-smalltext{
|
|
width:60px;
|
|
height: 18px;
|
|
margin:0px;
|
|
}
|
|
.charsheet input[type=text].sheet-shorttext{
|
|
padding-top:2px;
|
|
padding-bottom:2px;
|
|
}
|
|
.charsheet input[type=text].sheet-skilltext{
|
|
width:200px;
|
|
padding:2px;
|
|
margin-left:3px;
|
|
}
|
|
.charsheet input[type=number].sheet-smallnumber{
|
|
width:40px;
|
|
}
|
|
.charsheet input[type=number].sheet-smallshortnumber{
|
|
font-size: 8pt;
|
|
width:10px;
|
|
padding-top:1px;
|
|
padding-bottom:1px;
|
|
display: inline-block;
|
|
float:right;
|
|
}
|
|
.charsheet input[type=number].sheet-shortnumber{
|
|
padding-top:2px;
|
|
padding-bottom:2px;
|
|
}
|
|
/* === Text area === */
|
|
.charsheet textarea{
|
|
resize:vertical;
|
|
height:450px;
|
|
}
|
|
/* === general === */
|
|
.charsheet .sheet-right {
|
|
float:right;
|
|
}
|
|
.charsheet .sheet-bold {
|
|
margin-bottom: 10px;
|
|
}
|
|
/* === label === */
|
|
.charsheet label.sheet-areaLabel{
|
|
margin:5px;
|
|
}
|
|
/* === background === */
|
|
.charsheet .sheet-border{
|
|
border: 2px solid white;
|
|
vertical-align:top;
|
|
width:100%;
|
|
padding: 2px;
|
|
margin: 2px;
|
|
}
|
|
|
|
input:invalid {
|
|
border: 2px solid red;
|
|
}
|
|
|
|
|
|
|
|
/* Roll Templates */
|
|
|
|
.sheet-rolltemplate-dscreen div.sheet-in {
|
|
position: relative;
|
|
padding: 7px;
|
|
color: rgba(255,255,255,.57);
|
|
color: bisque(.6);
|
|
border: 10px solid transparent;
|
|
border-image-source: url(http://i166.photobucket.com/albums/u108/Ninty_07/border2.png);
|
|
border-image-slice: 9;
|
|
background: url(https://media.tenor.com/tFsFXTP0wkIAAAAC/full-moon.gif);
|
|
background-size: 100% 100%; /*228px 143px; */
|
|
background-repeat: no-repeat;
|
|
box-shadow: 4px 10px silver;
|
|
overflow: hidden;
|
|
min-height: 200px;
|
|
height:100%;
|
|
width: 530px;
|
|
width: 250px;
|
|
}
|
|
.sheet-rolltemplate-dscreen h1{
|
|
font-size:16px;
|
|
color: Bisque;
|
|
}
|
|
/* WWN from Jakob's example https://wiki.roll20.net/Building_Character_Sheets/Roll_Templates#Jakob.27s_Better_Default_Rolltemplate */
|
|
/* Smaller margins - remove these if you want the huge default left margin */
|
|
.sheet-rolltemplate-WWN {
|
|
margin-left: -37px;
|
|
}
|
|
.withoutavatars .sheet-rolltemplate-WWN {
|
|
margin-left: -7px;
|
|
}
|
|
|
|
.sheet-rolltemplate-WWN .sheet-container {
|
|
border: 1px 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-WWN .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;
|
|
}
|
|
.sheet-rolltemplate-WWN .sheet-title {
|
|
font-size:1.2em;
|
|
font-weight:bold;
|
|
}
|
|
.sheet-rolltemplate-WWN .sheet-subtitle {
|
|
font-size:.9em;
|
|
}
|
|
|
|
/* example colors */
|
|
.sheet-rolltemplate-WWN .sheet-container {
|
|
/* this is the default color */
|
|
--header-bg-color: rgba(112,32,130,1);/*purple*/
|
|
--header-text-color: #FFF;/*white*/
|
|
}
|
|
.sheet-rolltemplate-WWN .sheet-container.sheet-color-red {
|
|
--header-bg-color: #F00; /*red*/
|
|
}
|
|
.sheet-rolltemplate-WWN .sheet-container.sheet-color-green {
|
|
--header-bg-color: #009933; /*green*/
|
|
--header-text-color: #000;/*black*/
|
|
}
|
|
.sheet-rolltemplate-WWN .sheet-container.sheet-color-blue {
|
|
--header-bg-color: #0066ff; /*blue*/
|
|
/*--header-text-color: #F00; red*/
|
|
}
|
|
.sheet-rolltemplate-WWN .sheet-container.sheet-color-bisque {
|
|
--header-bg-color: #ff981a; /*orangish bisque*/
|
|
--header-text-color: #000; /*black*/
|
|
}
|
|
/* Allprops part */
|
|
.sheet-rolltemplate-WWN .sheet-content {
|
|
display: grid;
|
|
background: #FFF;
|
|
/* 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-WWN .sheet-content > div {
|
|
padding: 5px;
|
|
}
|
|
|
|
/* Left column */
|
|
.sheet-rolltemplate-WWN .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-WWN .sheet-value {
|
|
}
|
|
*/
|
|
|
|
/* Make even-numbered rows grey */
|
|
.sheet-rolltemplate-WWN .sheet-content :nth-child(4n+3),
|
|
.sheet-rolltemplate-WWN .sheet-content :nth-child(4n) {
|
|
background:#9edee0; /*aquae light was eee*/
|
|
}
|
|
|
|
/* Description field */
|
|
.sheet-rolltemplate-WWN .sheet-desc {
|
|
grid-column: span 2;
|
|
padding: 5px;
|
|
text-align: left;
|
|
} |