mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-31 04:02:29 +00:00
788 lines
14 KiB
CSS
788 lines
14 KiB
CSS
*, *:before, *:after {
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
font-family:sans-serif;}
|
|
|
|
.sheet-wrapper{
|
|
width:100%;
|
|
min-width:750px !important;
|
|
position:relative;
|
|
border:1px solid black;
|
|
}
|
|
|
|
div{
|
|
position:relative;
|
|
}
|
|
|
|
input[type=text], textarea {
|
|
width:calc(100% - 75px);
|
|
font-size:14px;
|
|
color:#000080;
|
|
border:1px solid gray;
|
|
font-family:cursive;
|
|
padding:0 5px;
|
|
margin:0;
|
|
}
|
|
|
|
textarea{
|
|
resize:vertical;
|
|
padding:5px;
|
|
}
|
|
|
|
select {
|
|
color:#000080;
|
|
font-family:cursive;
|
|
}
|
|
|
|
input[type=text]:focus, textarea:focus, select:focus {
|
|
background:#D1EEEE;
|
|
}
|
|
|
|
table {
|
|
width:calc(100% - 5px);
|
|
border-collapse:separate;
|
|
font-size:16px;
|
|
}
|
|
|
|
label{
|
|
font-weight:bold;
|
|
font-variant: small-caps;
|
|
font-size:1.2em;
|
|
display:block;
|
|
font-family:serif;
|
|
}
|
|
|
|
span.sheet-span_right{
|
|
display: inline-block;
|
|
float: right;
|
|
padding-top:5px;
|
|
text-align:right;
|
|
}
|
|
|
|
span.sheet-span_left{
|
|
display: inline-block;
|
|
float: left;
|
|
padding-top:5px;
|
|
text-align:left;
|
|
}
|
|
|
|
span.sheet-info{
|
|
float:right;
|
|
margin:0 20px 0 0;
|
|
font-size: 12px;
|
|
line-height: 22px;
|
|
}
|
|
|
|
/*Tabs*/
|
|
|
|
input.sheet-tab[type=radio] {
|
|
margin:0;
|
|
}
|
|
|
|
input.sheet-tab {
|
|
height: 30px;
|
|
z-index: 4;
|
|
opacity: 0;
|
|
}
|
|
|
|
input.sheet-tab,
|
|
input.sheet-tab + span {
|
|
position: absolute;
|
|
right: 5px;
|
|
height: 30px;
|
|
text-align:center;
|
|
font-weight:bold;
|
|
font-variant: small-caps;
|
|
}
|
|
|
|
input.sheet-tab + span {
|
|
display: inline-block;
|
|
padding: 5px;
|
|
border: 1px solid black;
|
|
border-top: none;
|
|
background: #ddd;
|
|
z-index: 1;
|
|
}
|
|
|
|
input.sheet-tab + span::before {
|
|
content: attr(title);
|
|
}
|
|
|
|
input.sheet-tab[value=dmc] {
|
|
top: 0;
|
|
right: -1px;
|
|
width:calc(45% - 145px);
|
|
}
|
|
input.sheet-tab[value=dmc] + span {
|
|
top: 0;
|
|
right: -1px;
|
|
width:calc(45% - 144px);
|
|
}
|
|
|
|
|
|
input.sheet-tab.sheet-dmc[value=dmc-minion] {
|
|
top: 29px;
|
|
right: -1px;
|
|
width:calc(22.5% - 72px);
|
|
}
|
|
input.sheet-tab.sheet-dmc[value=dmc-minion] + span {
|
|
top: 29px;
|
|
right: -1px;
|
|
width:calc(22.5% - 71px);
|
|
border-top:1px dashed gray;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
|
|
|
|
input.sheet-tab.sheet-dmc[value=dmc-dmc] {
|
|
top: 29px;
|
|
right:calc(22.5% - 74px);
|
|
width:calc(22.5% - 72px);
|
|
}
|
|
input.sheet-tab.sheet-dmc[value=dmc-dmc] + span {
|
|
top: 29px;
|
|
right:calc(22.5% - 74px);
|
|
width:calc(22.5% - 71px);
|
|
border-top:1px dashed gray;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
|
|
|
|
input.sheet-tab[value=character] {
|
|
top: 0;
|
|
right:calc(45% - 146px);
|
|
width:calc(55% - 144px);
|
|
}
|
|
input.sheet-tab[value=character] + span {
|
|
top: 0;
|
|
right:calc(45% - 146px);
|
|
width:calc(55% - 144px);
|
|
}
|
|
|
|
|
|
input.sheet-tab.sheet-char[value=character-sheet] {
|
|
top: 30px;
|
|
right: calc(50% - 146px);
|
|
width:calc(50% - 144px);
|
|
}
|
|
input.sheet-tab.sheet-char[value=character-sheet] + span {
|
|
top: 30px;
|
|
right: calc(50% - 146px);
|
|
width:calc(25% - 71px);
|
|
border-top:1px dashed gray;
|
|
}
|
|
|
|
|
|
input.sheet-tab:checked + span {
|
|
z-index: 3;
|
|
background: #E6DD93;
|
|
}
|
|
|
|
div.sheet-tab{
|
|
display:none;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
input.sheet-sub, input.sheet-sub + span{
|
|
display:none;
|
|
}
|
|
|
|
input.sheet-tab[value=dmc]:checked ~ div.sheet-dmc-wrapper,
|
|
input.sheet-tab[value=dmc]:checked ~ input.sheet-dmc,
|
|
input.sheet-tab[value=dmc]:checked ~ input.sheet-dmc + span,
|
|
input.sheet-tab[value=character]:checked ~ div.sheet-character-wrapper/*,
|
|
input.sheet-tab[value=character]:checked ~ input.sheet-char,
|
|
input.sheet-tab[value=character]:checked ~ input.sheet-char + span*/ {
|
|
display: block;
|
|
}
|
|
|
|
input.sheet-dmc[value=dmc-dmc]:checked ~ div.sheet-dmc-wrapper div.sheet-dmcs-wrapper,
|
|
input.sheet-dmc[value=dmc-minion]:checked ~ div.sheet-dmc-wrapper div.sheet-minions-wrapper,
|
|
input.sheet-char[value=character-sheet]:checked ~ div.sheet-character-wrapper div.sheet-pc-wrapper {
|
|
display:block;
|
|
}
|
|
|
|
/*Head*/
|
|
.sheet-head{
|
|
border-bottom:1px solid black;
|
|
margin:0 0 5px;
|
|
padding:5px;
|
|
position:relative;
|
|
height:116px;
|
|
}
|
|
|
|
.sheet-title{
|
|
position: absolute;
|
|
bottom: 5px;
|
|
right: 5px;
|
|
text-align: right;
|
|
margin: 0;
|
|
}
|
|
|
|
.sheet-title h2{
|
|
font-family:serif;
|
|
font-size:30px;
|
|
margin:0;
|
|
vertical-align:bottom;
|
|
font-variant: small-caps;
|
|
}
|
|
|
|
.sheet-logo{
|
|
float:left;
|
|
position:relative;
|
|
margin:-5px 0 -5px -5px;
|
|
padding:5px;
|
|
background:white;
|
|
height:115px;
|
|
}
|
|
|
|
.sheet-logo img
|
|
{
|
|
border: 0;
|
|
outline: 0;
|
|
color: #660000;
|
|
font-weight: bold;
|
|
font-family: fantasy;
|
|
font-variant: small-caps;
|
|
text-shadow: 1px 1px 1px #555;
|
|
font-size: 50px;
|
|
height: 105px;
|
|
line-height: 105px;
|
|
text-align: center;
|
|
}
|
|
|
|
/*Player*/
|
|
|
|
.sheet-pc-wrapper {
|
|
min-height: 500px !important;
|
|
padding: 5px;
|
|
}
|
|
|
|
.sheet-left_cont{
|
|
float:left;
|
|
width:49.5%;
|
|
clear:left;
|
|
}
|
|
|
|
.sheet-right_cont{
|
|
float:right;
|
|
width:49.5%;
|
|
}
|
|
|
|
.sheet-left_cont div,
|
|
.sheet-right_cont div
|
|
{
|
|
padding:10px 0;
|
|
}
|
|
|
|
.sheet-pc-wrapper .sheet-approaches label,
|
|
.sheet-pc-wrapper .sheet-disciplines label{
|
|
display:inline-block;
|
|
max-width:50%;
|
|
}
|
|
|
|
/*Left Side*/
|
|
|
|
.sheet-name label{
|
|
display:inline-block;
|
|
max-width:50px !important;
|
|
}
|
|
|
|
.sheet-name input[type=text]
|
|
{
|
|
height:35px;
|
|
font-size:15px;
|
|
width: calc(100% - 55px);
|
|
}
|
|
|
|
.sheet-description textarea{
|
|
height:150px;
|
|
width:98%;
|
|
}
|
|
|
|
.sheet-aspt_table td{
|
|
border:1px solid gray;
|
|
height:35px;
|
|
padding-right:3px;
|
|
color:#888;
|
|
font-size:10px;
|
|
text-transform:uppercase;
|
|
letter-spacing: -1px;
|
|
}
|
|
|
|
.sheet-aspt_table td span{
|
|
min-width:50px;
|
|
margin:0;
|
|
}
|
|
|
|
.sheet-aspt_table input[type=text]{
|
|
height:25px;
|
|
width:85%;
|
|
letter-spacing: 0;
|
|
display:inline-block;
|
|
margin:5px -3px 5px 5px;
|
|
border:1px solid #bbb;
|
|
}
|
|
|
|
/*Right Side*/
|
|
|
|
.sheet-top_label{
|
|
position:absolute;
|
|
top:0;
|
|
left:0;
|
|
padding:0 2px;
|
|
margin-top:0;
|
|
font-size:1em;
|
|
white-space:nowrap;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-faith{
|
|
margin:0 0 0 10%;
|
|
}
|
|
|
|
.sheet-faith,
|
|
.sheet-devo{
|
|
position:relative;
|
|
float:left;
|
|
display:inline-block;
|
|
}
|
|
|
|
.sheet-chapter, .sheet-demon{
|
|
position:relative;
|
|
float:left;
|
|
display:inline-block;
|
|
margin:0 10px;
|
|
}
|
|
|
|
.sheet-faith input[type=text], .sheet-demon button[type=roll]{
|
|
width: 50px;
|
|
height: 40px;
|
|
border: 3px solid black;
|
|
padding:5px;
|
|
margin:10px 0 -5px 0;
|
|
border-radius: 10px;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-demon button[type=roll]{
|
|
background-color:black;
|
|
background-image: url(images/infernal.jpg);
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-position:center;
|
|
width:40px;
|
|
}
|
|
|
|
.sheet-chapter input[type=text]
|
|
{
|
|
width: 80px;
|
|
height: 40px;
|
|
border: 3px solid black;
|
|
padding:5px;
|
|
margin:10px 5px -5px -4px;
|
|
border-radius: 10px;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-devo input[type=text]{
|
|
width: 50px;
|
|
height: 40px;
|
|
border: 2px solid black;
|
|
padding:5px;
|
|
margin:10px 10px -5px -5px;
|
|
border-radius: 10px;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-spacer
|
|
{
|
|
font-size:25px;
|
|
font-weight:bold;
|
|
padding:7px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.sheet-approaches{
|
|
clear:left;
|
|
}
|
|
|
|
.sheet-appr_table td,
|
|
.sheet-disc_table td{
|
|
height:40px;
|
|
padding-right:5px;
|
|
color:black;
|
|
font-size:12px;
|
|
text-transform:uppercase;
|
|
letter-spacing: -1px;
|
|
}
|
|
|
|
.sheet-appr_table button,
|
|
.sheet-disc_table button{
|
|
height: 24px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.sheet-appr_table select,
|
|
.sheet-disc_table select{
|
|
width: 58px;
|
|
height: 40px;
|
|
border: 2px solid black;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.sheet-appr_table td {
|
|
width:49%;
|
|
}
|
|
|
|
.sheet-appr_table td.attr_left_td select{
|
|
margin:0 0 0 -67px;
|
|
}
|
|
|
|
.sheet-appr_table td.attr_left_td button {
|
|
margin: 1px 0 0 -85px;
|
|
}
|
|
|
|
.sheet-appr_table td.attr_left_td select.sheet-d2{
|
|
margin:0 0 0 -120px;
|
|
}
|
|
|
|
.sheet-appr_table td.attr_right_td select,
|
|
.sheet-disc_table select{
|
|
margin:0 -71px 0 10px;
|
|
}
|
|
|
|
.sheet-appr_table td.attr_right_td button[type=roll],
|
|
.sheet-disc_table button[type=roll] {
|
|
margin: 1px -100px 0 72px;
|
|
}
|
|
|
|
.sheet-appr_table span,
|
|
.sheet-disc_table span{
|
|
width:100%;
|
|
border:1px solid gray;
|
|
padding:3px;
|
|
margin:8px 0 0;
|
|
}
|
|
|
|
.sheet-appr_table span.sheet-span_right,
|
|
.sheet-disc_table span.sheet-span_right {
|
|
text-align:left;
|
|
padding-left:100px;
|
|
}
|
|
|
|
.sheet-appr_table span.sheet-span_left{
|
|
text-align:right;
|
|
padding-right:100px;
|
|
}
|
|
|
|
.sheet-appr_table span.sheet-span_left.sheet-d2{
|
|
text-align:right;
|
|
padding-right:140px;
|
|
}
|
|
|
|
.sheet-disc_table span.sheet-fringe {
|
|
margin-top:5px;
|
|
}
|
|
|
|
.sheet-disc_table input[type=text] {
|
|
margin:0 0 0 10px;
|
|
border:1px solid #bbb;
|
|
}
|
|
|
|
/*Bottom*/
|
|
|
|
.sheet-bot {
|
|
clear:both;
|
|
}
|
|
|
|
.sheet-bot div
|
|
{
|
|
padding:5px 0 10px;
|
|
}
|
|
|
|
.sheet-conditions input[type=checkbox]{
|
|
border:1px solid black;
|
|
}
|
|
|
|
.sheet-cond_table td{
|
|
height:25px;
|
|
}
|
|
|
|
span.sheet-cond{
|
|
color:#888;
|
|
font-size: 10px;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.sheet-stunts textarea {
|
|
height:35px;
|
|
width:100%;
|
|
max-width:100% !important;
|
|
margin: 0;
|
|
}
|
|
|
|
/*DM*/
|
|
|
|
.sheet-dmcs-wrapper,
|
|
.sheet-minions-wrapper {
|
|
min-height:500px !important;
|
|
padding:5px;
|
|
}
|
|
|
|
.sheet-dmc_col1
|
|
{
|
|
width:33%;
|
|
float:left;
|
|
padding:10px 0;
|
|
}
|
|
|
|
.sheet-dmc_col2
|
|
{
|
|
width:66%;
|
|
float:right;
|
|
padding:10px 0;
|
|
}
|
|
|
|
.sheet-dmcs .sheet-bot div
|
|
{
|
|
padding:5px 0 10px;
|
|
}
|
|
|
|
.sheet-dmcs-wrapper .sheet-aspects input[type=text] {
|
|
height:35px;
|
|
width:100%;
|
|
max-width:100% !important;
|
|
}
|
|
|
|
.sheet-dmc-disc_table{
|
|
border-spacing:0 0 5px 0;
|
|
}
|
|
|
|
.sheet-dmc-disc_table td{
|
|
height: 40px;
|
|
padding: 0 5px 0 0;
|
|
}
|
|
|
|
.sheet-dmc-disc_table span.sheet-disc {
|
|
margin: 2px;
|
|
margin-left: calc(-100% + 10px);
|
|
width: 40px;
|
|
height: 40px;
|
|
line-height: 35px;
|
|
border: 2px solid black;
|
|
border-radius: 5px;
|
|
display: inline-block;
|
|
background: white;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.sheet-dmc-disc_table input[type=text] {
|
|
display:inline-block;
|
|
width: calc(100% - 5px);
|
|
border: 1px solid gray;
|
|
padding: 3px 3px 3px 55px;
|
|
margin: 0;
|
|
z-index:2;
|
|
}
|
|
|
|
.sheet-notes textarea {
|
|
height:35px;
|
|
width:100%;
|
|
max-width:100% !important;
|
|
}
|
|
|
|
/*Minions*/
|
|
|
|
.sheet-minions-wrapper .sheet-aspects label,
|
|
.sheet-minions-wrapper .sheet-stats label{
|
|
display:inline-block;
|
|
max-width:50%;
|
|
}
|
|
|
|
input.sheet-tab[value=mob] {
|
|
top: 10px;
|
|
right: 10px;
|
|
width:calc(50% - 40px);
|
|
}
|
|
input.sheet-tab[value=mob] + span {
|
|
top: 10px;
|
|
right: 10px;
|
|
width:calc(50% - 40px);
|
|
border: 1px solid black;
|
|
border-bottom: 1px dashed gray;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
|
|
|
|
input.sheet-tab[value=individual] {
|
|
top: 10px;
|
|
right:calc(50% - 30px);
|
|
width:calc(50% - 40px);
|
|
}
|
|
input.sheet-tab[value=individual] + span {
|
|
top: 10px;
|
|
right: calc(50% - 30px);
|
|
width:calc(50% - 40px);
|
|
border: 1px solid black;
|
|
border-bottom: 1px dashed gray;
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
|
|
div.sheet-mob-wrapper, div.sheet-individual-wrapper{
|
|
border:1px solid black;
|
|
background:#E6DD93;
|
|
margin-top:1px;
|
|
padding: 5px 10px 0;
|
|
border-radius: 4px 0;
|
|
}
|
|
|
|
input.sheet-tab[value=mob]:checked ~ div.sheet-mob-wrapper,
|
|
input.sheet-tab[value=individual]:checked ~ div.sheet-individual-wrapper {
|
|
display:block;
|
|
}
|
|
|
|
.sheet-min_dif ul {
|
|
padding-left:20px;
|
|
font-size:14px;
|
|
}
|
|
.sheet-min_dif ul li{
|
|
padding-bottom:5px;
|
|
}
|
|
|
|
/*Roll Templates, Edit Buttons & Other*/
|
|
|
|
div.repcontrol, div.repcontainer{
|
|
padding:0 0 3px;
|
|
}
|
|
|
|
div.repitem{
|
|
padding:3px;
|
|
}
|
|
|
|
.repcontainer.editmode[data-groupname=repeating_min_cond-mild] button,
|
|
.repcontainer.editmode[data-groupname=repeating_min_cond-mod] button,
|
|
.repcontainer.editmode[data-groupname=repeating_min_cond-sev] button,
|
|
.repcontainer.editmode[data-repeating_min_aspt] button {
|
|
padding: 1px 6px;
|
|
margin-top: -10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll > table {
|
|
background-color:white;
|
|
background-image: url(images/logo_light.png);
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-position: center;
|
|
min-height: 150px;
|
|
min-width:180px;
|
|
border-spacing: 0;
|
|
border:3px solid black;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll > table tr th,
|
|
.sheet-rolltemplate-Demon > table tr th{
|
|
height:25px;
|
|
padding:5px;
|
|
color: #990000;
|
|
text-align:left;
|
|
font-style: italic;
|
|
font-weight:bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll > table tr td {
|
|
height:20px;
|
|
padding:5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll > table tr td:nth-child(2){
|
|
font-weight:bold;
|
|
text-align:center;
|
|
font-size:1.1em;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll > table tr td:first-child{
|
|
font-variant:small-caps;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll > table tr:nth-child(1) td,
|
|
.sheet-rolltemplate-RollAll > table tr:nth-child(3) td,
|
|
.sheet-rolltemplate-RollAll > table tr:nth-child(5) td{
|
|
background-color:rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll .inlinerollresult {
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll .inlinerollresult.fullcrit {
|
|
color: #3FB315;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll .inlinerollresult.fullfail{
|
|
color: #B31515;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-RollAll .inlinerollresult.importantroll{
|
|
color: #4A57ED;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-Demon > table
|
|
{
|
|
height:125px;
|
|
width:150px;
|
|
}
|
|
|
|
.sheet-rolltemplate-Demon > table tr td{
|
|
height:100px;
|
|
width:150px;
|
|
border-spacing: 0;
|
|
border:1px solid black;
|
|
font-size:80px;
|
|
font-weight:700;
|
|
text-shadow: 0 0 5px #cc0000;
|
|
padding:0;
|
|
margin:0;
|
|
background:black;
|
|
}
|
|
|
|
.sheet-rolltemplate-Demon .inlinerollresult,
|
|
.sheet-rolltemplate-Demon .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-Demon .inlinerollresult.importantroll {
|
|
display:block;
|
|
width:100%;
|
|
height:100%;
|
|
padding:0 0 0 8px;
|
|
margin:0;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
line-height:100px;
|
|
background-color:white;
|
|
background-image: url(images/dont-panic.jpg);
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-position:right;
|
|
border:none;
|
|
color:black;
|
|
}
|
|
|
|
.sheet-rolltemplate-Demon .inlinerollresult.fullfail {
|
|
width:100%;
|
|
height:100%;
|
|
background-color:black;
|
|
background-image: url(images/blood-spatter.jpg);
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-position:center;
|
|
border:none;
|
|
color:black;
|
|
} |