mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 11:42:29 +00:00
Jacek Janiszewski
961b7db31e
Selecting a specialization automatically marks that specializations skill groups
816 lines
24 KiB
CSS
816 lines
24 KiB
CSS
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed|Roboto+Mono|Special+Elite&display=swap');
|
|
|
|
/******************************************************************/
|
|
/************************** COMMON & NAV **************************/
|
|
.charsheet {
|
|
background-image: url("https://i.imgur.com/JabRfGu.png");
|
|
background-repeat: repeat-y;
|
|
}
|
|
|
|
.charsheet div.main {
|
|
width:100%;
|
|
max-width: 880px;
|
|
}
|
|
|
|
/*Configure the tab buttons*/
|
|
.charsheet .page-wspolczynniki,
|
|
.charsheet .page-umiejetnosci,
|
|
.charsheet .page-inwentarz {
|
|
display: none;
|
|
border:3px solid rgba(0,0,0,0.7);
|
|
background: rgba(0,0,0,0);
|
|
|
|
}
|
|
|
|
.charsheet div.umiejetnosci-holder {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
/* show the selected tab */
|
|
.charsheet .sheet-tabstoggle[value="wspolczynniki"] ~ div.page-wspolczynniki,
|
|
.charsheet .sheet-tabstoggle[value="umiejetnosci"] ~ div.page-umiejetnosci,
|
|
.charsheet .sheet-tabstoggle[value="inwentarz"] ~ div.page-inwentarz {
|
|
display: block;
|
|
}
|
|
|
|
|
|
|
|
.charsheet div.navigation-header {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
margin-bottom:-3px;
|
|
}
|
|
|
|
.charsheet div.navigation-header button {
|
|
font-family: 'Roboto Mono', monospace;
|
|
background-color: transparent;
|
|
border:3px solid rgba(0,0,0,0.7);
|
|
color: rgba(0,0,0,0.8);
|
|
padding: 15px 32px;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
font-size: 21px;
|
|
}
|
|
|
|
.charsheet .sheet-tabstoggle[value="wspolczynniki"] ~ div.navigation-header button.button-wspolczynniki,
|
|
.charsheet .sheet-tabstoggle[value="umiejetnosci"] ~ div.navigation-header button.button-umiejetnosci,
|
|
.charsheet .sheet-tabstoggle[value="inwentarz"] ~ div.navigation-header button.button-inwentarz {
|
|
background-color: rgba(0,0,0,0.7);
|
|
color: rgba(255,255,255,0.8);
|
|
}
|
|
/************************** COMMON & NAV **************************/
|
|
/******************************************************************/
|
|
|
|
/* Remove +/- buttons from number input - we want number type for validation only */
|
|
.charsheet input[type=number] {
|
|
-moz-appearance: textfield;
|
|
}
|
|
.charsheet input[type=number]::-webkit-outer-spin-button,
|
|
.charsheet input[type=number]::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
.charsheet textarea, input {
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
|
|
|
|
.character {
|
|
font-size: 12px;
|
|
font-weight: bolder;
|
|
font-family: "Times New Roman";
|
|
}
|
|
|
|
html,body {
|
|
height:100%;
|
|
|
|
}
|
|
|
|
|
|
.charsheet input.big-black-box,
|
|
.charsheet select.big-black-box,
|
|
.charsheet textarea.big-black-box {
|
|
background-color: transparent;
|
|
border:3px solid rgba(0,0,0,0.7);
|
|
color: rgba(0,0,0,0.8);
|
|
font-family: 'Special Elite', cursive;
|
|
font-weight: bold;
|
|
font-size:14px;
|
|
width:100%;
|
|
text-align:center;
|
|
height: 25px;
|
|
resize:none;
|
|
overflow:hidden;
|
|
}
|
|
|
|
.charsheet input.big-inactive-box {
|
|
background-color: rgba(0,0,0,0.3);
|
|
border:3px solid rgba(0,0,0,0.7);
|
|
color: rgba(0,0,0,0.8);
|
|
font-family: 'Special Elite', cursive;
|
|
font-weight: bold;
|
|
font-size:14px;
|
|
width:100%;
|
|
text-align:center;
|
|
height: 25px;
|
|
resize:none;
|
|
overflow:hidden;
|
|
}
|
|
|
|
|
|
.charsheet input.subtle-black-box {
|
|
background-color: rgba(0,0,0,1.0);
|
|
border:0px none transparent;
|
|
color: rgba(255,255,255,1);
|
|
font-family: 'Special Elite', cursive;
|
|
font-size:14px;
|
|
width:100%;
|
|
text-align:left;
|
|
height: 25px;
|
|
resize:none;
|
|
overflow:hidden;
|
|
}
|
|
|
|
.charsheet table.charinfo h5 {
|
|
font-family: 'Roboto Mono', monospace;
|
|
margin-bottom:-2px;
|
|
height:100%;
|
|
font-size:13px;
|
|
}
|
|
.charsheet table.charinfo {
|
|
width:400px;
|
|
height:0px;
|
|
}
|
|
|
|
.charsheet table.charinfo td {
|
|
padding-left:4px;
|
|
padding-right:4px;
|
|
}
|
|
|
|
/******************************************************************/
|
|
/******************* FANCY HEADINGS WITH LINES ********************/
|
|
.charsheet h1 {
|
|
overflow: hidden;
|
|
text-align: center;
|
|
margin-left:20px;
|
|
margin-right:20px;
|
|
}
|
|
|
|
.charsheet h1:before,
|
|
.charsheet h1:after {
|
|
background-color: rgba(0,0,0,0.7);
|
|
content: "";
|
|
display: inline-block;
|
|
height: 3px;
|
|
position: relative;
|
|
vertical-align: middle;
|
|
width: 50%;
|
|
}
|
|
.charsheet h1:before {
|
|
right: 0.5em;
|
|
margin-left: -50%;
|
|
}
|
|
.charsheet h1:after {
|
|
left: 0.5em;
|
|
margin-right: -50%;
|
|
}
|
|
|
|
|
|
|
|
.charsheet h3 {
|
|
overflow: hidden;
|
|
text-align: center;
|
|
}
|
|
.charsheet h3:before,
|
|
.charsheet h3:after {
|
|
background-color: #000;
|
|
content: "";
|
|
display: inline-block;
|
|
height: 1px;
|
|
position: relative;
|
|
vertical-align: middle;
|
|
width: 50%;
|
|
}
|
|
.charsheet h3:before {
|
|
right: 0.5em;
|
|
margin-left: -50%;
|
|
}
|
|
.charsheet h3:after {
|
|
left: 0.5em;
|
|
margin-right: -50%;
|
|
}
|
|
|
|
.charsheet div.perk {
|
|
width:100%;
|
|
}
|
|
/******************* FANCY HEADINGS WITH LINES ********************/
|
|
/******************************************************************/
|
|
|
|
/******************************************************************/
|
|
/******************* BASE STATS / WSPOŁCZYNNIKI *******************/
|
|
table.wspolczynniki {
|
|
text-align: center;
|
|
margin-left: auto;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
table.wspolczynniki td {
|
|
padding:0px;
|
|
}
|
|
|
|
table.wspolczynniki td.label {
|
|
text-align: right;
|
|
}
|
|
|
|
table.wspolczynniki h2 {
|
|
font-family: 'Roboto Mono', monospace;
|
|
font-size: 35px;
|
|
}
|
|
|
|
table.wspolczynniki h5 {
|
|
font-family: 'Roboto Mono', monospace;
|
|
font-size: 14px;
|
|
}
|
|
|
|
table.wspolczynniki h6 {
|
|
font-family: 'Roboto Mono', monospace;
|
|
font-size: 11px;
|
|
}
|
|
|
|
table.wspolczynniki input[type=number] {
|
|
background-color: transparent;
|
|
text-align:center;
|
|
border-color: transparent;
|
|
background-position:center;
|
|
background-repeat:no-repeat;
|
|
text-align:center;
|
|
width:54px !important;
|
|
height:54px !important;
|
|
color: rgba(0,0,0,0.8);
|
|
font-family: 'Special Elite', cursive;
|
|
font-size:16px;
|
|
}
|
|
|
|
|
|
|
|
table.wspolczynniki hr {
|
|
border: 2px solid rgba(0,0,0,0.7);
|
|
border-radius: 3px;
|
|
margin:0;
|
|
}
|
|
|
|
table.wspolczynniki input[type=number].wsp_statbase {
|
|
background-image: url("https://i.imgur.com/0cJT0tA.png");
|
|
font-family: 'Candal', sans-serif;
|
|
font-size:16px;
|
|
}
|
|
|
|
table.wspolczynniki tr.wsp_modifier input[type=number] {
|
|
background-image: url("https://i.imgur.com/BpOcSEN.png");
|
|
font-family: 'Candal', sans-serif;
|
|
color: rgba(0,0,0,0.8);
|
|
font-size:16px;
|
|
}
|
|
|
|
table.wspolczynniki input[type=number].wsp-square-display {
|
|
background-image: url("https://i.imgur.com/cckAswO.png");
|
|
}
|
|
|
|
table.wspolczynniki input[type=number].wsp-circle-display {
|
|
background-image: url("https://i.imgur.com/E0rRVzN.png");
|
|
}
|
|
|
|
table.wspolczynniki input[type=number].wsp-star-display {
|
|
background-image: url("https://i.imgur.com/LlIa5Um.png");
|
|
}
|
|
|
|
.wsp-square-control[value*="-"] + .wsp-square-display,
|
|
.wsp-square-control[value="0"] + .wsp-square-display {
|
|
background-image: url("https://i.imgur.com/ZASLaaC.png") !important;
|
|
color: rgba(0,0,0,0);
|
|
}
|
|
|
|
.wsp-circle-control[value*="-"] + .wsp-circle-display,
|
|
.wsp-circle-control[value="0"] + .wsp-circle-display {
|
|
background-image: url("https://i.imgur.com/YJ7jrGu.png") !important;
|
|
color: rgba(0,0,0,0);
|
|
}
|
|
|
|
.wsp-star-control[value*="-"] + .wsp-star-display,
|
|
.wsp-star-control[value="0"] + .wsp-star-display {
|
|
background-image: url("https://i.imgur.com/ra0N7ru.png") !important;
|
|
color: rgba(0,0,0,0);
|
|
}
|
|
/******************* BASE STATS / WSPOŁCZYNNIKI *******************/
|
|
/******************************************************************/
|
|
|
|
|
|
|
|
.charsheet table.health {
|
|
outline:3px solid rgba(0,0,0,0.8);
|
|
margin-top:10px;
|
|
}
|
|
|
|
/* Suma Kar */
|
|
.charsheet p.health_effects {
|
|
font-family: 'Roboto Mono', monospace;
|
|
color: rgba(0,0,0,0.8);
|
|
font-size: 16px;
|
|
margin:5px;
|
|
}
|
|
|
|
.charsheet span.percent {
|
|
font-family: 'Roboto Mono', monospace;
|
|
color: rgba(0,0,0,0.8);
|
|
font-size: 18px;
|
|
}
|
|
|
|
.charsheet span.bodypart_title {
|
|
font-family: 'Roboto Mono', monospace;
|
|
color: rgba(0,0,0,0.8);
|
|
font-size: 14px;
|
|
}
|
|
|
|
.charsheet hr.bodypart_hr {
|
|
margin-left:2px;
|
|
margin-right:2px;
|
|
margin-top:-2px;
|
|
margin-bottom:0px;
|
|
border:1px solid rgba(0,0,0,0.8);
|
|
}
|
|
|
|
/******************************************************************/
|
|
/**************************** FIELDSETS ***************************/
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-general],
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-head],
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-torso],
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-left-hand],
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-left-foot],
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-right-hand],
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-right-foot],
|
|
.charsheet .repcontrol[data-groupname=repeating_perks]
|
|
{
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
display:flex;
|
|
margin:3px;
|
|
}
|
|
|
|
.charsheet [data-groupname=repeating_injuries-general] .repitem,
|
|
.charsheet [data-groupname=repeating_injuries-head] .repitem,
|
|
.charsheet [data-groupname=repeating_injuries-torso] .repitem,
|
|
.charsheet [data-groupname=repeating_injuries-left-hand] .repitem,
|
|
.charsheet [data-groupname=repeating_injuries-left-foot] .repitem,
|
|
.charsheet [data-groupname=repeating_injuries-right-hand] .repitem,
|
|
.charsheet [data-groupname=repeating_injuries-right-foot] .repitem,
|
|
.charsheet [data-groupname=repeating_perks] .repitem
|
|
{
|
|
justify-content: space-around;
|
|
display:flex;
|
|
margin-top:4px;
|
|
}
|
|
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-general] button.repcontrol_edit,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-general] button.repcontrol_add,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-head] button.repcontrol_edit,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-head] button.repcontrol_add,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-torso] button.repcontrol_edit,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-torso] button.repcontrol_add,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-left-hand] button.repcontrol_edit,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-left-hand] button.repcontrol_add,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-left-foot] button.repcontrol_edit,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-left-foot] button.repcontrol_add,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-right-hand] button.repcontrol_edit,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-right-hand] button.repcontrol_add,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-right-foot] button.repcontrol_edit,
|
|
.charsheet .repcontrol[data-groupname=repeating_injuries-right-foot] button.repcontrol_add,
|
|
.charsheet .repcontrol[data-groupname=repeating_perks] button.repcontrol_add,
|
|
.charsheet .repcontrol[data-groupname=repeating_perks] button.repcontrol_edit
|
|
{
|
|
font-family: 'Roboto Mono', monospace;
|
|
background: rgba(0,0,0,0.15);
|
|
border: 1px solid rgba(0,0,0,0.8);
|
|
color: rgba(0,0,0,0.8);
|
|
font-size: 11px;
|
|
box-shadow:none;
|
|
padding: 1px 10px 1px 10px;
|
|
margin: 0px 5px 0px 0px;
|
|
border-radius: 15px;
|
|
}
|
|
/**************************** FIELDSETS ***************************/
|
|
/******************************************************************/
|
|
|
|
/******************************************************************/
|
|
/****************************** HEALTH ****************************/
|
|
.charsheet table.health select {
|
|
font-family: 'Special Elite', cursive;
|
|
font-weight: bold;
|
|
background-color: rgba(0,0,0,0);
|
|
outline:2px solid rgba(0,0,0,0.8);
|
|
width:32px;
|
|
height:21px;
|
|
font-size:11px;
|
|
margin:0px;
|
|
padding:0px;
|
|
box-shadow:none;
|
|
}
|
|
|
|
.charsheet table.health input[type=number] {
|
|
font-size:9px;
|
|
height:25px;
|
|
|
|
background-color: transparent;
|
|
border:2px solid rgba(0,0,0,0.7);
|
|
color: rgba(0,0,0,0.8);
|
|
font-family: 'Special Elite', cursive;
|
|
font-size:15px;
|
|
width:36px;
|
|
text-align:center;
|
|
resize:none;
|
|
overflow:hidden;
|
|
margin-top: -2px;
|
|
}
|
|
|
|
.charsheet table.health .health_section_right {
|
|
height:135px;
|
|
width:125px;
|
|
vertical-align:top;
|
|
text-align:left;
|
|
}
|
|
|
|
.charsheet table.health .health_section_left {
|
|
height:135px;
|
|
width:125px;
|
|
vertical-align:top;
|
|
text-align:right;
|
|
}
|
|
|
|
.charsheet textarea.effect {
|
|
background-color: transparent;
|
|
border:0px none transparent;
|
|
color: rgba(0,0,0,1.0);
|
|
font-family: 'Roboto Condensed';
|
|
font-size:14px;
|
|
width:100%;
|
|
text-align:left;
|
|
height: 100px;
|
|
resize:none;
|
|
overflow:hidden;
|
|
-moz-appearance:none;
|
|
margin-top:5px;
|
|
padding:0px;
|
|
}
|
|
|
|
.charsheet div.effectconfig {
|
|
width:135px;
|
|
justify-content: space-around;
|
|
display:flex;
|
|
margin-top:5px;
|
|
}
|
|
/****************************** HEALTH ****************************/
|
|
/******************************************************************/
|
|
|
|
/******************************************************************/
|
|
/**************************** ABILITIES ***************************/
|
|
.charsheet table.umj-table {
|
|
font-family: 'Roboto Mono', monospace;
|
|
color: black;
|
|
border-spacing: 3px;
|
|
border-collapse: separate;
|
|
width:100%;
|
|
}
|
|
.charsheet td.umj-stat-cell {
|
|
border-right:3px solid rgba(0,0,0,0.7);
|
|
width:30px;
|
|
}
|
|
.charsheet td.umj-group-cell {
|
|
width:165px;
|
|
}
|
|
.charsheet td.umj-skill-cell {
|
|
background-color: rgba(0,0,0,0.8);
|
|
color: white;
|
|
vertical-align:top;
|
|
}
|
|
.charsheet td.umj-skill-cell input[type=number] {
|
|
height: 100% !important;
|
|
width:26px !important;
|
|
background-color: transparent;
|
|
border: 0px none transparent;
|
|
color: rgba(255,255,255,1);
|
|
font-family: 'Special Elite', cursive;
|
|
font-size:14px;
|
|
font-weight: bolder;
|
|
}
|
|
|
|
.charsheet span.umj-stat-span {
|
|
color: rgba(0,0,0,0.8);
|
|
font-family: 'Special Elite', cursive;
|
|
font-size: 26px;
|
|
}
|
|
|
|
/* Configure a container for the toggle */
|
|
|
|
.charsheet .group-check-container {
|
|
display: inline-flex;
|
|
align-items:flex-start;
|
|
}
|
|
|
|
|
|
/* Configure the button styling. This example makes it look like a checkbox. */
|
|
.charsheet button.group-check-box {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
border: none;
|
|
height: 30px;
|
|
width:165px;
|
|
text-align: left;
|
|
}
|
|
|
|
|
|
.charsheet span.group-check-box-text {
|
|
font-family: "Roboto Mono", monospace;
|
|
font-size: 13px;
|
|
padding: 0px 0px 0px 5px;
|
|
margin: 0px;
|
|
}
|
|
|
|
|
|
|
|
.charsheet input.group-check-box-walka-wrecz:not([value="1"]) ~ button.group-check-box-walka-wrecz,
|
|
.charsheet input.group-check-box-bron-strzelecka:not([value="1"]) ~ button.group-check-box-bron-strzelecka,
|
|
.charsheet input.group-check-box-bron-dystansowa:not([value="1"]) ~ button.group-check-box-bron-dystansowa,
|
|
.charsheet input.group-check-box-prowadzenie-pojazdow:not([value="1"]) ~ button.group-check-box-prowadzenie-pojazdow,
|
|
.charsheet input.group-check-box-zdolnosci-manualne:not([value="1"]) ~ button.group-check-box-zdolnosci-manualne,
|
|
.charsheet input.group-check-box-orientacja-w-terenie:not([value="1"]) ~ button.group-check-box-orientacja-w-terenie,
|
|
.charsheet input.group-check-box-spostrzegawczosc:not([value="1"]) ~ button.group-check-box-spostrzegawczosc,
|
|
.charsheet input.group-check-box-kamuflaz:not([value="1"]) ~ button.group-check-box-kamuflaz,
|
|
.charsheet input.group-check-box-przetrwanie:not([value="1"]) ~ button.group-check-box-przetrwanie,
|
|
.charsheet input.group-check-box-negocjacje:not([value="1"]) ~ button.group-check-box-negocjacje,
|
|
.charsheet input.group-check-box-empatia:not([value="1"]) ~ button.group-check-box-empatia,
|
|
.charsheet input.group-check-box-sila-woli:not([value="1"]) ~ button.group-check-box-sila-woli,
|
|
.charsheet input.group-check-box-medycyna:not([value="1"]) ~ button.group-check-box-medycyna,
|
|
.charsheet input.group-check-box-technika:not([value="1"]) ~ button.group-check-box-technika,
|
|
.charsheet input.group-check-box-sprzet:not([value="1"]) ~ button.group-check-box-sprzet,
|
|
.charsheet input.group-check-box-pirotechnika:not([value="1"]) ~ button.group-check-box-pirotechnika,
|
|
.charsheet input.group-check-box-wiedza-ogolna-1:not([value="1"]) ~ button.group-check-box-wiedza-ogolna-1,
|
|
.charsheet input.group-check-box-wiedza-ogolna-2:not([value="1"]) ~ button.group-check-box-wiedza-ogolna-2,
|
|
.charsheet input.group-check-box-sprawnosc:not([value="1"]) ~ button.group-check-box-sprawnosc,
|
|
.charsheet input.group-check-box-jezdziectwo:not([value="1"]) ~ button.group-check-box-jezdziectwo {
|
|
text-decoration: none;
|
|
background: rgba(255,0,0,0);
|
|
color:black;
|
|
}
|
|
|
|
.charsheet input.group-check-box-walka-wrecz:not([value="0"]) ~ button.group-check-box-walka-wrecz,
|
|
.charsheet input.group-check-box-bron-strzelecka:not([value="0"]) ~ button.group-check-box-bron-strzelecka,
|
|
.charsheet input.group-check-box-bron-dystansowa:not([value="0"]) ~ button.group-check-box-bron-dystansowa,
|
|
.charsheet input.group-check-box-prowadzenie-pojazdow:not([value="0"]) ~ button.group-check-box-prowadzenie-pojazdow,
|
|
.charsheet input.group-check-box-zdolnosci-manualne:not([value="0"]) ~ button.group-check-box-zdolnosci-manualne,
|
|
.charsheet input.group-check-box-orientacja-w-terenie:not([value="0"]) ~ button.group-check-box-orientacja-w-terenie,
|
|
.charsheet input.group-check-box-spostrzegawczosc:not([value="0"]) ~ button.group-check-box-spostrzegawczosc,
|
|
.charsheet input.group-check-box-kamuflaz:not([value="0"]) ~ button.group-check-box-kamuflaz,
|
|
.charsheet input.group-check-box-przetrwanie:not([value="0"]) ~ button.group-check-box-przetrwanie,
|
|
.charsheet input.group-check-box-negocjacje:not([value="0"]) ~ button.group-check-box-negocjacje,
|
|
.charsheet input.group-check-box-empatia:not([value="0"]) ~ button.group-check-box-empatia,
|
|
.charsheet input.group-check-box-sila-woli:not([value="0"]) ~ button.group-check-box-sila-woli,
|
|
.charsheet input.group-check-box-medycyna:not([value="0"]) ~ button.group-check-box-medycyna,
|
|
.charsheet input.group-check-box-technika:not([value="0"]) ~ button.group-check-box-technika,
|
|
.charsheet input.group-check-box-sprzet:not([value="0"]) ~ button.group-check-box-sprzet,
|
|
.charsheet input.group-check-box-pirotechnika:not([value="0"]) ~ button.group-check-box-pirotechnika,
|
|
.charsheet input.group-check-box-wiedza-ogolna-1:not([value="0"]) ~ button.group-check-box-wiedza-ogolna-1,
|
|
.charsheet input.group-check-box-wiedza-ogolna-2:not([value="0"]) ~ button.group-check-box-wiedza-ogolna-2,
|
|
.charsheet input.group-check-box-sprawnosc:not([value="0"]) ~ button.group-check-box-sprawnosc,
|
|
.charsheet input.group-check-box-jezdziectwo:not([value="0"]) ~ button.group-check-box-jezdziectwo{
|
|
text-decoration: underline 1px rgb(155, 0, 0);;
|
|
background: rgba(0,0,0,0.1);
|
|
color: rgb(155, 0, 0);
|
|
}
|
|
/**************************** ABILITIES ***************************/
|
|
/******************************************************************/
|
|
|
|
/******************************************************************/
|
|
/***************************** XP TABLE ***************************/
|
|
.charsheet table.GeneratedTable {
|
|
background-color: rgba(0,0,0,0.1);
|
|
border-collapse: collapse;
|
|
border-width: 2px;
|
|
border-color: rgba(0,0,0,0.5);
|
|
border-style: solid;
|
|
color: #000000;
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
margin-top: 15px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.charsheet table.GeneratedTable td, table.GeneratedTable th {
|
|
border-width: 2px;
|
|
border-color: rgba(0,0,0,0.5);
|
|
border-style: solid;
|
|
padding: 2px;
|
|
}
|
|
|
|
.charsheet table.GeneratedTable th {
|
|
background-color: rgba(0,0,0,0.5);
|
|
color:white;
|
|
text-align: center;
|
|
}
|
|
|
|
.charsheet table.GeneratedTable thead {
|
|
background-color: rgba(0,0,0,0.5);
|
|
color:white;
|
|
}
|
|
/***************************** XP TABLE ***************************/
|
|
/******************************************************************/
|
|
|
|
/******************************************************************/
|
|
/************************** ROLL PARAMETERS ***********************/
|
|
/* Configure a container for the radio buttons. */
|
|
.charsheet .sheet-radios {
|
|
width:250px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
/* Configure the button styling. This example makes it look like a radio. */
|
|
.charsheet button.sheet-radio {
|
|
padding: 5px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: transparent;
|
|
border: 0px none transparent;
|
|
font-family: 'Roboto Mono', monospace;
|
|
color: rgba(0,0,0,0.8);
|
|
font-size: 22px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
|
|
|
|
.charsheet button.sheet-radio > span.sheet-checked {
|
|
color:red;
|
|
text-decoration:underline;
|
|
}
|
|
/* Hide the "checked" section of the radio if the attribute value does not match the radio */
|
|
.charsheet input.sheet-radio:not([value="0"]) ~ button.sheet-radio-0 > span.sheet-checked,
|
|
.charsheet input.sheet-radio:not([value="1"]) ~ button.sheet-radio-1 > span.sheet-checked,
|
|
.charsheet input.sheet-radio:not([value="2"]) ~ button.sheet-radio-2 > span.sheet-checked,
|
|
.charsheet input.sheet-radio:not([value="3"]) ~ button.sheet-radio-3 > span.sheet-checked,
|
|
.charsheet input.sheet-radio:not([value="4"]) ~ button.sheet-radio-4 > span.sheet-checked,
|
|
.charsheet input.sheet-radio:not([value="5"]) ~ button.sheet-radio-5 > span.sheet-checked,
|
|
.charsheet input.sheet-radio:not([value="6"]) ~ button.sheet-radio-6 > span.sheet-checked,
|
|
.charsheet input.sheet-radio:not([value="7"]) ~ button.sheet-radio-7 > span.sheet-checked,
|
|
.charsheet input.sheet-radio:not([value="8"]) ~ button.sheet-radio-8 > span.sheet-checked
|
|
{
|
|
color:black;
|
|
text-decoration:unset;
|
|
}
|
|
|
|
.charsheet button.sheet-radio-selected > span.sheet-checked {
|
|
background-color: rgba(0,0,0,0.3);
|
|
font-weight: bold;
|
|
padding: 5px;
|
|
margin:-5px;
|
|
}
|
|
.charsheet input.sheet-radio-selected:not([value="0"]) ~ button.sheet-radio-0 > span.sheet-checked,
|
|
.charsheet input.sheet-radio-selected:not([value="1"]) ~ button.sheet-radio-1 > span.sheet-checked,
|
|
.charsheet input.sheet-radio-selected:not([value="2"]) ~ button.sheet-radio-2 > span.sheet-checked,
|
|
.charsheet input.sheet-radio-selected:not([value="3"]) ~ button.sheet-radio-3 > span.sheet-checked,
|
|
.charsheet input.sheet-radio-selected:not([value="4"]) ~ button.sheet-radio-4 > span.sheet-checked,
|
|
.charsheet input.sheet-radio-selected:not([value="5"]) ~ button.sheet-radio-5 > span.sheet-checked,
|
|
.charsheet input.sheet-radio-selected:not([value="6"]) ~ button.sheet-radio-6 > span.sheet-checked,
|
|
.charsheet input.sheet-radio-selected:not([value="7"]) ~ button.sheet-radio-7 > span.sheet-checked,
|
|
.charsheet input.sheet-radio-selected:not([value="8"]) ~ button.sheet-radio-8 > span.sheet-checked
|
|
{
|
|
background-color: transparent;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.charsheet div.param-page {
|
|
width:200px;
|
|
}
|
|
|
|
.charsheet div.params-holder {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.charsheet div.param-row {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.charsheet div.param-row label {
|
|
color:black;
|
|
}
|
|
|
|
.charsheet span.postfix {
|
|
font-family: 'Candal', sans-serif;
|
|
font-size: 40;
|
|
}
|
|
|
|
.charsheet .layout-element {
|
|
visibility: hidden;
|
|
}
|
|
|
|
.charsheet button.skill_test_button {
|
|
background: url("https://i.imgur.com/du7NH2W.png") no-repeat;
|
|
cursor: pointer;
|
|
height: 26px;
|
|
margin-left: 2px;
|
|
margin-top:2px;
|
|
padding-left: 30px;
|
|
border: none;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.charsheet button.wsp_test_button {
|
|
background: url("https://i.imgur.com/EiubfwU.png") no-repeat;
|
|
cursor: pointer;
|
|
height: 32px;
|
|
margin-left: 2px;
|
|
margin-top:2px;
|
|
padding-left: 30px;
|
|
border: none;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.charsheet input.skill_wogl_label {
|
|
border:3px solid rgba(0,0,0,0.8);
|
|
background-color: rgba(255, 255, 255, 0.9);
|
|
font-family: 'Special Elite', cursive;
|
|
font-weight: bold;
|
|
font-size:14px;
|
|
height:min-content;
|
|
width:100%;
|
|
text-align:center;
|
|
resize:none;
|
|
overflow:hidden;
|
|
padding:0px;
|
|
margin:0px;
|
|
}
|
|
|
|
|
|
/************************** ROLL PARAMETERS ***********************/
|
|
/******************************************************************/
|
|
|
|
/******************************************************************/
|
|
/*************************** ROLL TEMPLATES ***********************/
|
|
|
|
.sheet-rolltemplate-test div.sheet-template-container {
|
|
border: 2px solid #000 !important;
|
|
border-radius: 3px 3px 3px 3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-test .sheet-template-header {
|
|
background-color: rgba(112, 32, 130,1);
|
|
color: #000;
|
|
padding: 2px;
|
|
border-bottom: 1px solid black;
|
|
line-height: 1.6em;
|
|
font-size: 1.2em;
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
.sheet-rolltemplate-test div {
|
|
padding: 5px;
|
|
border-bottom: 1px solid black;
|
|
}
|
|
|
|
.sheet-rolltemplate-test div:nth-child(odd) {
|
|
background-color: rgba(217, 217, 214,1);
|
|
}
|
|
|
|
.sheet-rolltemplate-test div:nth-child(even) {
|
|
background-color: rgba(233, 233, 233,1);
|
|
}
|
|
**/
|
|
|
|
/** Reverse 1 - 20 highlight from default (20 good) to 1 good **/
|
|
.sheet-rolltemplate-test .inlinerollresult.fullfail,
|
|
.span.inlinerollresult.showtip.tipsy-n-right.fullfail,
|
|
.sheet-rolltemplate-test .showtip.tipsy-n-right.fullfail {
|
|
border: 2px solid #3FB315 !important;
|
|
|
|
}
|
|
|
|
.sheet-rolltemplate-test .inlinerollresult.fullcrit {
|
|
border: 2px solid #B31515 !important;
|
|
}
|
|
|
|
|
|
/*************************** ROLL TEMPLATES ***********************/
|
|
/******************************************************************/
|
|
|