mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
3225 lines
94 KiB
CSS
3225 lines
94 KiB
CSS
@import url('https://fonts.googleapis.com/css?family=Montserrat|Graduate|Courier+Prime|Roboto|Share+Tech+Mono|Material+Icons|Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0&display=swap');
|
|
/* @import url('https://fonts.googleapis.com/css?family=Material+Icons&display=swap'); */
|
|
|
|
/* CSE FIXES */
|
|
html {
|
|
font-size: 13px;
|
|
}
|
|
.ui-dialog .charsheet .background-wrap button[type="roll"] {
|
|
font-size: 0.8em;
|
|
}
|
|
.ui-dialog .charsheet .background-wrap label {
|
|
font-size: 0.8rem;
|
|
}
|
|
@supports (-moz-appearance:none) {
|
|
div.charactersheet.tab-pane.charsheet div.background-wrap {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
|
|
/* ORIGINAL */
|
|
|
|
.background-wrap{
|
|
background-color: black;
|
|
-background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/bg.png?raw=true");
|
|
background-repeat: repeat;
|
|
padding: 5px;
|
|
margin: -10px !important;
|
|
min-width: 1140px;
|
|
}
|
|
input.tab-sheet[value="Xeno"] ~ .background-wrap {
|
|
min-width: 800px;
|
|
}
|
|
.spacebackground:checked ~ .background-wrap {
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/bg.png?raw=true");
|
|
background-repeat: repeat;
|
|
}
|
|
.header-image{
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/Weyland-Yutani.png?raw=true");
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
padding-top: 25px;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.header-tabs {
|
|
display: flex;
|
|
flex-direction: column;
|
|
-align-items: flex-end;
|
|
justify-items: right;
|
|
justify-content: flex-end;
|
|
align-self: end;
|
|
align-items: flex-start;
|
|
justify-self: flex-end;
|
|
margin-right: 0 !important;
|
|
}
|
|
|
|
.footer-text{
|
|
display: block;
|
|
text-align: center;
|
|
font-family: 'Graduate';
|
|
text-transform: uppercase;
|
|
color: rgba(211, 211, 211, 1);
|
|
}
|
|
|
|
.grid-container {
|
|
display: grid;
|
|
background-color: transparent;
|
|
border: 2px solid rgba(211, 211, 211, 1); /* LightGrey */
|
|
border-radius: 0px;
|
|
grid-gap: 10px;
|
|
padding: 10px;
|
|
text-align: center;
|
|
}
|
|
|
|
.contains-thirteen-columns {
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
}
|
|
|
|
.contains-four-columns {
|
|
grid-template-columns: 20% 20% auto 25%;
|
|
grid-gap: 0px;
|
|
padding: 0px;
|
|
text-align: left;
|
|
border-color: transparent;
|
|
}
|
|
.contains-five-columns {
|
|
grid-template-columns: 15% 15% auto 20% 15%;
|
|
grid-gap: 0px;
|
|
padding: 0px;
|
|
text-align: left;
|
|
border-color: transparent;
|
|
}
|
|
.contains-seven-columns {
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
grid-gap: 2px;
|
|
}
|
|
|
|
.contains-eight-columns {
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
grid-gap: 8px;
|
|
padding: 10px;
|
|
text-align: left;
|
|
}
|
|
.contains-fourteen-columns {
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
z-index: 5;
|
|
}
|
|
|
|
.roll-buttons {
|
|
display: grid;
|
|
text-align: center;
|
|
grid-gap: 4px;
|
|
}
|
|
div.roll-buttons + hr.dotted-line {
|
|
margin: 3px;
|
|
}
|
|
.ui-dialog .charsheet div.span-rollbuttons .alpha-buttons button[type="roll"],
|
|
.ui-dialog .charsheet div.span-rollbuttons .beta-buttons button[type="roll"] {
|
|
margin: 0;
|
|
}
|
|
.alpha-buttons {
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
|
|
}
|
|
.beta-buttons {
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
margin: 5px 0px;
|
|
|
|
}
|
|
.gamma-buttons {
|
|
grid-template-columns: 50px 2fr 1.5fr 1.5fr 50px;
|
|
grid-gap: 5px;
|
|
margin-top: 5px;
|
|
}
|
|
.gamma-buttons input.text-input {
|
|
padding: 0 2px;
|
|
font-size: 12px;
|
|
line-height: 12px;
|
|
height: 21px;
|
|
color: #008b8b;
|
|
text-align: center;
|
|
border: 1px solid #008b8b;
|
|
border-radius: 5px;
|
|
}
|
|
.gamma-buttons button[type="action"] {
|
|
border: 1px solid #008b8b;
|
|
}
|
|
.gamma-buttons span.roll-option-frame,
|
|
.radiation span.roll-option-frame {
|
|
display: inline-block;
|
|
padding: 0 2px;
|
|
font-size: 12px;
|
|
line-height: 19px;
|
|
height: 19px;
|
|
border: 1px solid #008b8b;
|
|
border-radius: 5px;
|
|
color: #008b8b;
|
|
font-family: 'Montserrat';
|
|
text-transform: uppercase;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
}
|
|
.gamma-buttons span.roll-option-frame select,
|
|
.gamma-buttons span.roll-option-frame select option,
|
|
.radiation span.roll-option-frame select,
|
|
.radiation span.roll-option-frame select option {
|
|
padding: 0 2px;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
line-height: 12px;
|
|
height: 18px;
|
|
border: 0;
|
|
background-color: rgba(204, 217, 207, 1);
|
|
color: #008b8b;
|
|
font-family: 'Montserrat';
|
|
text-transform: uppercase;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
}
|
|
.gamma-buttons span.roll-option-frame select:focus-visible,
|
|
.radiation span.roll-option-frame select:focus-visible {
|
|
border: 0;
|
|
outline: 0;
|
|
}
|
|
.gamma-buttons button[type="action"].button-gamma {
|
|
padding: 2px 3px;
|
|
-margin: 0px 3px 0px 3px;
|
|
}
|
|
|
|
.span-one-two { grid-column: 1 / 3;}
|
|
.span-one-thru-three { grid-column: 1 / 4;}
|
|
.span-one-thru-four { grid-column: 1 / 5;}
|
|
.span-one-thru-five { grid-column: 1 / 6;}
|
|
.span-one-thru-six { grid-column: 1 / 7;}
|
|
.span-one-thru-seven { grid-column: 1 / 8;}
|
|
.span-two-three { grid-column: 2 / 4;}
|
|
.span-two-thru-four { grid-column: 2 / 5;}
|
|
.span-three-four { grid-column: 3 / 5;}
|
|
.span-three-thru-five { grid-column: 3 / 6;}
|
|
.span-three-thru-six { grid-column: 3 / 7;}
|
|
.span-four { grid-column: 4;}
|
|
.span-four-five { grid-column: 4 / 6;}
|
|
.span-four-thru-six { grid-column: 4 / 7;}
|
|
.span-five { grid-column: 5;}
|
|
.span-five-six { grid-column: 5 / 7;}
|
|
.span-five-thru-seven { grid-column: 5 / 8;}
|
|
.span-five-thru-eight { grid-column: 5 / 9;}
|
|
.span-five-thru-nine { grid-column: 5 / 10;}
|
|
.span-five-thru-ten { grid-column: 5 / 11;}
|
|
.span-six-seven { grid-column: 6 / 8;}
|
|
.span-six-thru-eight { grid-column: 6 / 9;}
|
|
.span-six-thru-nine { grid-column: 6 / 10;}
|
|
.span-six-thru-fourteen { grid-column: 6 / 15;}
|
|
.span-seven-eight { grid-column: 7 / 9;}
|
|
.span-seven-thru-nine { grid-column: 7 / 10;}
|
|
.span-seven-thru-thirteen { grid-column: 7 / 14;}
|
|
.span-seven-thru-fourteen { grid-column: 7 / 15;}
|
|
.span-eight { grid-column: 8 / 9;}
|
|
.span-eight-nine { grid-column: 8 / 10;}
|
|
.span-eight-thru-ten { grid-column: 8 / 11;}
|
|
.span-eight-thru-eleven { grid-column: 8 / 12;}
|
|
.span-eight-thru-twelve { grid-column: 8 / 13;}
|
|
.span-eight-thru-thirteen { grid-column: 8 / 14;}
|
|
.span-eight-thru-fourteen { grid-column: 8 / 15;}
|
|
.span-nine { grid-column: 9;}
|
|
.span-nine-ten { grid-column: 9 / 11;}
|
|
.span-nine-thru-eleven { grid-column: 9 / 12;}
|
|
.span-nine-thru-thirteen { grid-column: 9 / 14;}
|
|
.span-nine-thru-fourteen { grid-column: 9 / 15;}
|
|
.span-ten { grid-column: 10;}
|
|
.span-ten-eleven { grid-column: 10 / 12;}
|
|
.span-ten-thru-twelve { grid-column: 10 / 13;}
|
|
.span-ten-thru-thirteen { grid-column: 10 / 14;}
|
|
.span-ten-thru-fourteen { grid-column: 10 / 15;}
|
|
.span-eleven { grid-column: 11;}
|
|
.span-eleven-thru-thirteen { grid-column: 11 / 14;}
|
|
.span-eleven-thru-fourteen { grid-column: 11 / 15;}
|
|
.span-twelve { grid-column: 12;}
|
|
.span-twelve-thirteen { grid-column: 12 / 14;}
|
|
.span-twelve-thru-fourteen { grid-column: 12 / 15;}
|
|
.span-thirteen { grid-column: 13;}
|
|
.span-thirteen-fourteen { grid-column: 13 / 15;}
|
|
.span-fourteen { grid-column: 14;}
|
|
.span-personal-agenda { grid-row: 1 / 3;}
|
|
.span-talents { grid-row: 1 / 5;}
|
|
.span-modules { grid-row: 1 / 9;}
|
|
.span-log { grid-row: 1 / 9;}
|
|
.span-relationships { grid-row: 3 / 5;}
|
|
.span-rollbuttons { grid-row: 3 / 5;}
|
|
.span-radiation { grid-row: 7 / 9;}
|
|
.span-critical-injuries { grid-row: 9 / 11;}
|
|
.span-gear { grid-row: 10 / 16;}
|
|
.span-conditions { grid-row: 11 / 14;}
|
|
.span-weapons { grid-row: 13 / 16;}
|
|
.span-comp-dmg { grid-row: 9;}
|
|
.span-upg-arm { grid-row: 10;}
|
|
.span-row1 { grid-row: 1;}
|
|
.span-row1-2 { grid-row: 1/3;}
|
|
.span-row2 { grid-row: 2;}
|
|
.span-row2-3 { grid-row: 2/4;}
|
|
.span-row3 { grid-row: 3;}
|
|
.span-row3-4 { grid-row: 3/5;}
|
|
.span-row4 { grid-row: 4;}
|
|
.span-row4-5 { grid-row: 4/6;}
|
|
.span-row4-6 { grid-row: 4/7;}
|
|
.span-row5 { grid-row: 5;}
|
|
.span-row5-6 { grid-row: 5/7;}
|
|
.span-row5-8 { grid-row: 5/9;}
|
|
.span-row6 { grid-row: 6;}
|
|
.span-row6-7 { grid-row: 6/8;}
|
|
.span-row6-8 { grid-row: 6/9;}
|
|
.span-row7 { grid-row: 7;}
|
|
.span-row8 { grid-row: 8;}
|
|
.span-row9 { grid-row: 9;}
|
|
.span-row10 { grid-row: 10;}
|
|
.span-row11 { grid-row: 11;}
|
|
.span-row12 { grid-row: 12;}
|
|
.span-row13 { grid-row: 13;}
|
|
|
|
.xeno-column > div.grid-item {
|
|
margin-top: 20px;
|
|
}
|
|
.xeno-column > div.col-separator{
|
|
width: 5%;
|
|
}
|
|
|
|
.cover-100-flex { width: 100% !important; display: flex; }
|
|
.cover-100 { width: 100% !important; }
|
|
.cover-90 { width: 90% !important; }
|
|
.cover-80 { width: 80% !important; }
|
|
.cover-75 { width: 75% !important; }
|
|
.cover-70 { width: 70% !important; }
|
|
.cover-60 { width: 60% !important; }
|
|
.cover-45 { width: 45% !important; }
|
|
.cover-40 { width: 40% !important; }
|
|
.cover-25 { width: 25% !important; }
|
|
.cover-20 { width: 20% !important; }
|
|
.cover-15 { width: 15% !important; }
|
|
.cover-10 { width: 10% !important; }
|
|
|
|
.pad-left { padding-left: 8px !important; }
|
|
.pad-right { padding-right: 8px !important; }
|
|
.pad-right-30px { padding-right: 30px !important; }
|
|
.marg-right {margin-right: 3px;}
|
|
|
|
.grid-item {
|
|
background-color: rgba(204, 217, 207, 1);
|
|
border: 1px solid rgba(211, 211, 211, 1); /* LightGrey */
|
|
border-radius: 5px;
|
|
padding: 5px;
|
|
line-height: 24px;
|
|
vertical-align: bottom;
|
|
}
|
|
.grid-item-black {
|
|
background-color: transparent;
|
|
border: 0;
|
|
padding: 5px;
|
|
line-height: 24px;
|
|
vertical-align: bottom;
|
|
}
|
|
.no-border {
|
|
border: 0 !important;
|
|
border-radius: unset;
|
|
}
|
|
|
|
.clip-edges {
|
|
clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
|
|
margin-top: 10;
|
|
}
|
|
|
|
.flex { display: flex; }
|
|
.flex-column { display: flex; flex-direction: column; }
|
|
.flex-row { display: flex; flex-direction: row; }
|
|
.flex-wrap { flex-wrap: wrap; }
|
|
.flex-nowrap { flex-wrap: nowrap; }
|
|
.flex-break { flex-basis: 100%; height: 0; }
|
|
|
|
.float-left { float: left; }
|
|
.float-right { float: right; }
|
|
.flex-center { display: flex; align-self: center; justify-self: center; }
|
|
.flex-items-center { display: flex; justify-items: center; align-self: center; }
|
|
.flex-items-right { display: flex; justify-items: right; }
|
|
.flex-items-left { display: flex; justify-items: left; }
|
|
.flex-items-align-center { display: flex; align-items: center; }
|
|
.flex-items-justify-center { display: flex; justify-items: center; }
|
|
.flex-content-center { display: flex; justify-content: center; align-self: center; }
|
|
.flex-content-right { display: flex; justify-content: right; }
|
|
.flex-content-end { display: flex; justify-content: flex-end; }
|
|
.flex-content-left { display: flex; justify-content: left; }
|
|
.flex-content-align-center { display: flex; align-items: center; }
|
|
.flex-content-justify-center { display: flex; justify-items: center; }
|
|
.flex-content-spaceeven { display: flex; justify-content: space-evenly; }
|
|
.flex-content-spacebetween { display: flex; justify-content:space-between; }
|
|
.flex-content-spacearound { display: flex; justify-content:space-around; }
|
|
.flex-self-center { display: flex; justify-self: center; align-self: center; }
|
|
.flex-self-right { display: flex; justify-self: right; }
|
|
.flex-self-left { display: flex; justify-self: left; }
|
|
.flex-self-align-center { display: flex; align-items: center; }
|
|
.flex-self-justify-center { display: flex; justify-items: center; }
|
|
.flex-self-align-end { display: flex; align-items: flex-end; }
|
|
.flex-self-justify-end { display: flex; justify-items: flex-end; }
|
|
.flex-self-align-start { display: flex; align-items: flex-start; }
|
|
.flex-self-justify-start { display: flex; justify-items: flex-start; }
|
|
|
|
.black-item {
|
|
background-color: transparent;
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
.what-padding { padding: 0px; }
|
|
.some-padding { padding: 4px; }
|
|
|
|
.shift-up-5 { margin-top: -5px; }
|
|
.shift-up-8 { margin-top: -8px; }
|
|
.shift-up-10 { margin-top: -10px; }
|
|
.shift-up-16 { margin-top: -16px; }
|
|
.shift-up-20 { margin-top: -20px; }
|
|
.shift-up-24 { margin-top: -24px; }
|
|
.shift-down-5 { margin-top: 5px; }
|
|
.shift-down-8 { margin-top: 8px; }
|
|
.shift-down-10 { margin-top: 10px; }
|
|
.shift-down-15 { margin-top: 15px; }
|
|
.shift-down-17 { margin-top: 17px; }
|
|
|
|
.centered {
|
|
text-align: center;
|
|
align-self: center;
|
|
}
|
|
|
|
.w40 { max-width: 40px; min-width: 40px; }
|
|
.w50pc { max-width: 50%; min-width: 50%; }
|
|
.w60 { max-width: 60px; min-width: 60px; }
|
|
.w60pc { max-width: 60%; min-width: 60%; }
|
|
.w70pc { max-width: 70%; min-width: 70%; }
|
|
.w80 { max-width: 80px; min-width: 80px; }
|
|
.w90pc { max-width: 90%; min-width: 90%; }
|
|
.w120 { max-width: 120px; min-width: 120px; }
|
|
.w130 { max-width: 130px; min-width: 130px; }
|
|
.w140 { max-width: 140px; min-width: 140px; }
|
|
.w150 { max-width: 150px; min-width: 150px; }
|
|
.w160 { max-width: 160px; min-width: 160px; }
|
|
.w170 { max-width: 170px; min-width: 170px; }
|
|
.w180 { max-width: 180px; min-width: 180px; }
|
|
.w200 { max-width: 200px; min-width: 200px; }
|
|
.w220 { max-width: 220px; min-width: 220px; }
|
|
.w250 { max-width: 250px; min-width: 250px; }
|
|
.w300 { max-width: 300px; min-width: 300px; }
|
|
.w-fit { width: fit-content; }
|
|
.h-fit { height: fit-content; }
|
|
.h100pc { height: 100%; }
|
|
|
|
.text-underline { text-decoration: underline; }
|
|
|
|
/* WEAPON AND GEAR */
|
|
|
|
div.span-weapons .tab-weapons {
|
|
line-height: 16px;
|
|
margin-top: 3px;
|
|
gap: 3px;
|
|
row-gap: 3px;
|
|
height: fit-content;
|
|
justify-content: center;
|
|
}
|
|
.weapon-item {
|
|
padding: 0px;
|
|
text-align: center;
|
|
border: 1px solid rgba(204, 217, 207, 1);
|
|
width: auto;
|
|
border-radius: 0px;
|
|
border-right: 1px dashed rgb(0, 139, 139); /* Dark Cyan #008b8b */
|
|
}
|
|
|
|
.weapon-item.range {
|
|
padding: 0px 20px;
|
|
}
|
|
.span-gear .weight,
|
|
.weapon-item.weight {
|
|
padding: 0px 3px;
|
|
}
|
|
.span-gear select.weight,
|
|
.weapon-item.weight select,
|
|
.weapon-item.range select {
|
|
text-align: center;
|
|
}
|
|
.span-gear select.weight,
|
|
.weapon-item.weight select {
|
|
float: right;
|
|
width: 46px;
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
}
|
|
.weapon-item.weight {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
}
|
|
.weapon-item.weight select {
|
|
align-self: center;
|
|
}
|
|
.span-gear .weight:hover,
|
|
.span-gear .weight:active,
|
|
.span-gear .weight:focus,
|
|
.weapon-item.weight select:hover,
|
|
.weapon-item.weight select:active,
|
|
.weapon-item.weight select:focus {
|
|
appearance: auto;
|
|
-webkit-appearance: auto;
|
|
}
|
|
|
|
.weapon-item.type{
|
|
border-right-width: 0px;
|
|
}
|
|
|
|
.gearrepeatingonly:checked ~ input,
|
|
.gearrepeatingonly:checked ~ select,
|
|
.gearrepeatingonly:checked ~ hr {
|
|
display: none !important;
|
|
}
|
|
|
|
.signature-item .teal-header {
|
|
float:right;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
/* - - - - - - - - - - EXPAND AREAS - - - - - - - - - - */
|
|
|
|
/* .charsheet .expand {
|
|
-left: -8px;
|
|
opacity: 0;
|
|
-position: absolute;
|
|
-top: -4px;
|
|
-width: 18px;
|
|
z-index: 6;
|
|
margin-top: 5px;
|
|
} */
|
|
|
|
/* .charsheet .expand + span::before {
|
|
color: #c3996b;
|
|
content: "&";
|
|
cursor: pointer;
|
|
font-family: 'Pictos';
|
|
font-size: 10px;
|
|
z-index: 3;
|
|
-border: 1px solid #c3996b;
|
|
-border-radius: 50%;
|
|
height: 11px;
|
|
width: 11px;
|
|
padding: 1px 2px;
|
|
} */
|
|
.charsheet .expand + label.expand-label {
|
|
color: #c3996b;
|
|
cursor: pointer;
|
|
font-family: 'Pictos';
|
|
padding: 0;
|
|
margin: 0;
|
|
width: 14px;
|
|
height: 14px;
|
|
font-size: 14px;
|
|
line-height: 14px;
|
|
text-align: center;
|
|
align-self: center;
|
|
}
|
|
.charsheet .expand:checked + label {
|
|
transform: rotate(45deg);
|
|
width: 18px;
|
|
height: 18px;
|
|
font-size: 16px;
|
|
}
|
|
/* .charsheet input.expand + span {
|
|
padding: 0;
|
|
margin: 0;
|
|
-transform: rotate(90deg);
|
|
position: relative;
|
|
right: 8px;
|
|
bottom: 5px;
|
|
}
|
|
.charsheet input.expand:checked + span {
|
|
padding: 0;
|
|
margin: 0;
|
|
-transform: rotate(-90deg);position: relative;
|
|
-right: 8px;
|
|
top: 3px;
|
|
} */
|
|
|
|
/*.charsheet input.expand + span::before,
|
|
.charsheet input.expand:checked + span::before {
|
|
opacity: 0.25;
|
|
}
|
|
.charsheet input:hover + input.expand + span::before,
|
|
.charsheet span:hover + input.expand + span::before,
|
|
.charsheet div:hover + input.expand + span::before {
|
|
opacity: 0.85;
|
|
} */
|
|
.charsheet input.expand + span + span + div.expandable,
|
|
.charsheet input.expand + span + span + div + span + span + span + textarea.expandable,
|
|
.charsheet input.expand + label + span + span + div.expandable,
|
|
.charsheet input.expand + label + span + span + div + span + span + span + textarea.expandable {
|
|
display: none;
|
|
}
|
|
.charsheet input.expand:checked + span + span + div.expandable,
|
|
.charsheet input.expand:checked + span + span + div + span + span + span + textarea.expandable,
|
|
.charsheet input.expand:checked + label + span + span + div.expandable,
|
|
.charsheet input.expand:checked + label + span + span + div + span + span + span + textarea.expandable {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
div.expandable button[type="action"] {
|
|
font-family: 'Pictos';
|
|
border: 0;
|
|
font-size: 120%;
|
|
-padding: 5px 10px 5px 10px;
|
|
line-height: 12px;
|
|
}
|
|
|
|
|
|
/* - - - - - - - - - - AUTO EXPAND TEXTAREAS - - - - - - - - - - */
|
|
.auto-expand {
|
|
position: relative;
|
|
cursor: text;
|
|
word-wrap: break-word;
|
|
min-height: 1em;
|
|
border: 1px Dashed #bfbfbf;
|
|
font-family: 'Courier Prime';
|
|
font-family: 'Roboto';
|
|
text-align: left;
|
|
font-size: 0.9em;
|
|
line-height: 1em;
|
|
padding: 2px;
|
|
}
|
|
|
|
.auto-expand span {
|
|
visibility: hidden;
|
|
white-space: pre-wrap;
|
|
display: block;
|
|
-font-family: Serif;
|
|
}
|
|
|
|
.auto-expand textarea,
|
|
textarea.auto-expand {
|
|
font-family: 'Roboto';
|
|
text-align: left;
|
|
font-size: 0.9em;
|
|
line-height: 1em;
|
|
padding: 2px;
|
|
border: 1px Dashed #bfbfbf;
|
|
position: unset;
|
|
z-index: 1;
|
|
top: 0;
|
|
left: 0;
|
|
margin: 2px;
|
|
overflow: hidden;
|
|
-resize: unset;
|
|
height: 100%;
|
|
width: 100%;
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
display: block;
|
|
box-sizing: border-box;
|
|
background: transparent;
|
|
border-radius: 1px;
|
|
box-shadow: none;
|
|
}
|
|
.span-personal-agenda div.auto-expand {
|
|
height: fit-content;
|
|
min-height: 75px;
|
|
}
|
|
.span-personal-agenda textarea.auto-expand {
|
|
overflow-y: auto;
|
|
resize: none;
|
|
}
|
|
|
|
.tab-container textarea.auto-expand {
|
|
min-height: 75px;
|
|
}
|
|
div.armament-btns {
|
|
line-height: 15px;
|
|
}
|
|
.span-armaments textarea.auto-expand,
|
|
.span-weapons textarea.auto-expand {
|
|
max-height: 40px;
|
|
min-height: 20px;
|
|
height: 20px;
|
|
}
|
|
/* .xeno-textfield {
|
|
min-height: 135px;
|
|
margin-top: 10px;
|
|
} */
|
|
textarea.xeno-textfield {
|
|
margin-top: 10px;
|
|
margin-bottom: 4px;
|
|
min-height: 120px;
|
|
height: calc(100% - 15px);
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
resize: none;
|
|
}
|
|
|
|
.xeno-cont-term textarea.xeno-textfield {
|
|
height: calc(100% - 30px);
|
|
resize: none;
|
|
}
|
|
.xeno .xeno-attack .darker-rounded-box {
|
|
padding-left: 6px;
|
|
}
|
|
.xeno .xeno-attack .expandable button {
|
|
margin-top: 5px;
|
|
}
|
|
.xeno .xeno-attack textarea {
|
|
min-height: 60px;
|
|
font-size: 12px;
|
|
height: unset;
|
|
}
|
|
.xeno .xeno-attack input {
|
|
font-size: 12px;
|
|
}
|
|
.xeno-notes textarea {
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
}
|
|
div.xeno-notes {
|
|
max-height: 300px;
|
|
}
|
|
/* div.xeno-spec-abil,
|
|
div.xeno-cont-term {
|
|
max-height: 200px;
|
|
} */
|
|
|
|
|
|
.textarea-margin-correct {
|
|
margin: 6px 0px 0px 0px;
|
|
}
|
|
|
|
.dotted-line {
|
|
height: 0px;
|
|
border-top: 0;
|
|
border-right: 0;
|
|
border-left: 0;
|
|
border-bottom: 1px dashed rgba(0, 139, 139, 1); /* Dark Cyan #008b8b */
|
|
padding: 0px;
|
|
margin: 3px;
|
|
}
|
|
.dotted-separator {
|
|
line-height: inherit;
|
|
border-right: 1px dashed rgba(0, 139, 139, 1); /* Dark Cyan #008b8b */
|
|
padding: 0;
|
|
margin: 0 -1px 0 -5px;
|
|
}
|
|
|
|
.dotted-underline {
|
|
border-bottom: 1px dashed rgba(0, 139, 139, 1) !important; /* Dark Cyan #008b8b */
|
|
}
|
|
|
|
.span-relationships .dotted-line,
|
|
.span-critical-injuries .dotted-line{
|
|
margin: 8px;
|
|
}
|
|
|
|
.appearance-none {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
}
|
|
|
|
div.changelog button.button-link,
|
|
div.changelog button.button-link:hover,
|
|
div.changelog button.button-link:active,
|
|
div.changelog button.button-link:focus {
|
|
text-decoration: underline;
|
|
background-color: transparent;
|
|
border: 0;
|
|
font-family: 'Roboto';
|
|
color: #000;
|
|
font-size: 13px;
|
|
background: none;
|
|
color: inherit;
|
|
border: none;
|
|
padding: 0;
|
|
font: inherit;
|
|
cursor: pointer;
|
|
outline: inherit;
|
|
text-shadow: inherit;
|
|
box-shadow: inherit;
|
|
}
|
|
div.changelog button.button-link::before,
|
|
div.changelog button.button-link:hover::before,
|
|
div.changelog button.button-link:active::before,
|
|
div.changelog button.button-link:focus::before {
|
|
content: "";
|
|
}
|
|
|
|
/* --- HEADERS ---- */
|
|
|
|
.teal-header {
|
|
color: rgba(204, 217, 207, 1); /* Teal Varient */
|
|
font-family: 'Graduate', cursive;
|
|
text-transform: uppercase;
|
|
font-size: 10px;
|
|
letter-spacing: .1em;
|
|
padding-left: 3px;
|
|
}
|
|
|
|
.teal-header-gear-l {
|
|
float: left;
|
|
color: rgba(204, 217, 207, 1); /* Teal Varient */
|
|
font-family: 'Graduate', cursive;
|
|
text-transform: uppercase;
|
|
font-size: 10px;
|
|
letter-spacing: .1em;
|
|
}
|
|
|
|
.teal-header-gear-r {
|
|
float: right;
|
|
color: rgba(204, 217, 207, 1); /* Teal Varient */
|
|
font-family: 'Graduate', cursive;
|
|
text-transform: uppercase;
|
|
font-size: 10px;
|
|
letter-spacing: .1em;
|
|
}
|
|
|
|
.darkest-teal-header {
|
|
color: #354b44; /* Darkest Teal Varient */
|
|
font-family: 'Graduate', cursive;
|
|
text-transform: uppercase;
|
|
font-size: 9px;
|
|
letter-spacing: .1em;
|
|
}
|
|
|
|
.xeno-header,
|
|
.ship-header {
|
|
background-color: rgba(204, 217, 207, 1); /* Teal Varient */
|
|
-position: relative;
|
|
align-self: start;
|
|
-top: -9px;
|
|
position: relative;
|
|
z-index: 10;
|
|
padding-top: 2px;
|
|
clip-path: polygon(8px 0%, calc(100% - 8px) 0%, 100% 100%, 0% 100%);
|
|
width: auto;
|
|
padding-left: 15px;
|
|
padding-right: 15px;
|
|
}
|
|
.ship-header-black {
|
|
background-color: black;
|
|
color: rgba(204, 217, 207, 1); /* Teal Varient */
|
|
top: -8px;
|
|
position: relative;
|
|
z-index: 10;
|
|
clip-path: polygon(0 0%, 100% 0%, calc(100% - 8px) 100%, 8px 100%);
|
|
}
|
|
.black-floating-header.header-doublerow,
|
|
.black-floating-header-clipped.header-doublerow {
|
|
height: 2.2em;
|
|
line-height: 1.2em;
|
|
padding-top: 5px;
|
|
width: min-content;
|
|
}
|
|
.black-floating-header.header-doublerow ~ .xeno-textfield,
|
|
.black-floating-header-clipped.header-doublerow ~ .xeno-textfield {
|
|
min-height: 120px;
|
|
margin-top: 30px;
|
|
}
|
|
.ship-attribute {
|
|
margin-top: 10px;
|
|
}
|
|
.xeno-header-attribute,
|
|
.ship-attribute-name {
|
|
width: 80%;
|
|
justify-self: center;
|
|
}
|
|
|
|
.xeno-header-attribute div.weapon-item.range {
|
|
border: 0;
|
|
}
|
|
.ship-attribute-ai {
|
|
width: 80%;
|
|
justify-self: center;
|
|
}
|
|
|
|
button[type="roll"].button-skill, button[type="action"].button-skill, input[type="checkbox"].button-skill, .medium-teal-header, .dark-teal-header {
|
|
color: #008b8b; /* Dark Cyan #008b8b */
|
|
font-family: 'Montserrat';
|
|
text-transform: uppercase;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.panicdesc:checked ~ button.panicdesc,
|
|
.panicdesc:not(:checked) ~ button.nopanicdesc {
|
|
display: none;
|
|
}
|
|
.panicdesc:not(:checked) ~ button.panicdesc,
|
|
.panicdesc:checked ~ button.nopanicdesc {
|
|
display: block;
|
|
}
|
|
|
|
|
|
.medium-teal-header {
|
|
color: rgba(113, 142, 135, 1); /* Medium Teal #718e87 */
|
|
}
|
|
|
|
.dark-teal-header {
|
|
color: rgba(0, 139, 139, 1); /* Dark Cyan #008b8b */
|
|
font-weight: bold;
|
|
}
|
|
.vertical-adjust-half {
|
|
margin-top: 3px;
|
|
}
|
|
.vertical-adjust-one {
|
|
margin-top: 6px;
|
|
}
|
|
.vertical-adjust-one-more {
|
|
margin-top: 9px;
|
|
}
|
|
.vertical-adjust-two-more {
|
|
margin-top: 12px;
|
|
}
|
|
.vertical-shift-one {
|
|
margin-top: -5px;
|
|
}
|
|
.vertical-shift-one-more {
|
|
margin-top: -10px;
|
|
}
|
|
.vertical-balance {
|
|
margin-top: 12px;
|
|
}
|
|
|
|
.black-floating-header {
|
|
background-color: rgba(0, 0, 0, 1); /* Black #000000 */
|
|
border: 1px solid rgba(0, 0, 0, 1); /* Black #000000 */
|
|
border-radius: 0px 20px 20px 0px;
|
|
float: left;
|
|
height: 1em;
|
|
width: 80%;
|
|
line-height: 1em;
|
|
margin: -14px 15% 0px -7px;
|
|
text-align: left;
|
|
padding: 0px 0px 0px 5px;
|
|
|
|
}
|
|
|
|
.black-floating-header-clipped {
|
|
background-color: rgba(0, 0, 0, 1); /* Black #000000 */
|
|
border: 1px solid rgba(0, 0, 0, 1); /* Black #000000 */
|
|
float: left;
|
|
height: 1.4em;
|
|
width: fit-content;
|
|
-line-height: 1em;
|
|
margin: -12px 0 0px -7px;
|
|
text-align: left;
|
|
padding: 0px 15px 4px 8px;
|
|
border-radius: unset;
|
|
clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
|
|
}
|
|
.black-floating-header-clipped + .vertical-adjust-one-more {
|
|
margin-top: 12px;
|
|
}
|
|
|
|
.black-floating-header-gear {
|
|
background-color: rgba(0, 0, 0, 1); /* Black #000000 */
|
|
border: 1px solid rgba(0, 0, 0, 1); /* Black #000000 */
|
|
border-radius: 0px 20px 20px 0px;
|
|
float: left;
|
|
height: 1em;
|
|
width: 100%;
|
|
line-height: 1em;
|
|
margin: -14px 15% 0px -7px;
|
|
text-align: left;
|
|
padding: 0px 0px 0px 5px;
|
|
|
|
}
|
|
|
|
.floating-header {
|
|
/* background-color: rgba(0, 0, 0, 1); Black #000000 */
|
|
/* border: 1px solid rgba(0, 0, 0, 1); Black #000000 */
|
|
/* border-radius: 0px 20px 20px 0px; */
|
|
float: center;
|
|
height: 1em;
|
|
width: 100%;
|
|
line-height: 1em;
|
|
margin: -20px 0 0 0;
|
|
padding: 0px 0px 0px 0px;
|
|
}
|
|
/* Firefox specific modification */
|
|
@supports (-moz-appearance:none) {
|
|
.floating-header { padding: 0px 0px 1px 0px; }
|
|
}
|
|
|
|
|
|
.more-curves {
|
|
border-radius: 20px 20px 20px 0px;
|
|
}
|
|
|
|
.black-header {
|
|
background-color: rgba(0, 0, 0, 1); /* Black #000000 */
|
|
border: 1px solid rgba(0, 0, 0, 1); /* Black #000000 */
|
|
border-radius: 20px;
|
|
width: 90%;
|
|
height: 18px;
|
|
margin: -18px 0px 0px -7px;
|
|
padding: 0px 0px 0px 5px;
|
|
}
|
|
|
|
.mini-header {
|
|
display: block;
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
font-family: 'Montserrat';
|
|
font-size: .75em;
|
|
line-height: .75em;
|
|
}
|
|
|
|
.bold {
|
|
font-weight: bold;
|
|
font-size: 12px;
|
|
letter-spacing: 0px;
|
|
}
|
|
|
|
.align-left {
|
|
text-align: left;
|
|
}
|
|
.align-right {
|
|
text-align: right;
|
|
}
|
|
|
|
.float-left {
|
|
float: left;
|
|
margin-left: 0px;
|
|
}
|
|
|
|
.float-right {
|
|
float: right;
|
|
margin-right: 0px;
|
|
}
|
|
.condition-title {
|
|
float: left;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.text-input, .text-inv, .select-input, .ui-dialog .charsheet input[type="number"].number-input{
|
|
font-family: 'Courier Prime';
|
|
font-family: 'Roboto';
|
|
background: transparent;
|
|
}
|
|
|
|
.text-input {
|
|
color: #000000;
|
|
width: 99%;
|
|
border: 1px solid transparent;
|
|
padding: 3px 3px 0 3px;
|
|
}
|
|
|
|
.text-inv {
|
|
color: #000000;
|
|
width: 60%;
|
|
border: 1px solid transparent;
|
|
padding: 3px;
|
|
float: left;
|
|
}
|
|
|
|
.select-input{
|
|
color: #555;
|
|
width: 100%;
|
|
height: 1.95em;
|
|
padding: 3px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.seventy-seven-percent {
|
|
width: 77%;
|
|
}
|
|
|
|
.make-it-shorter {
|
|
width: 89%;
|
|
}
|
|
|
|
.small-teal-label {
|
|
font-size: 10px;
|
|
color: rgb(204, 217, 207);
|
|
font-family: 'Graduate', cursive;
|
|
}
|
|
|
|
.experience, .story-points {
|
|
user-select: none;
|
|
}
|
|
|
|
.dark-pink-header {
|
|
color:rgb(165, 52, 52);
|
|
}
|
|
.dark-red-header {
|
|
color:rgb(165, 52, 52);
|
|
}
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
.no-opactiy {
|
|
opacity: 0;
|
|
user-select: none;
|
|
cursor: default;
|
|
}
|
|
input.overencumbered-check:checked ~ span,
|
|
input.overloaded-check:checked ~ span {
|
|
display:none;
|
|
}
|
|
input.overencumbered-check:checked ~ span.dark-pink-header,
|
|
input.overloaded-check:checked ~ span.dark-red-header {
|
|
display: inline-block
|
|
}
|
|
input.overloaded-check:checked ~ span.dark-pink-header {
|
|
display:none;
|
|
}
|
|
|
|
/* - - - - - Remove Number Spinner - - - - - */
|
|
input[type="number"].no-spin-input::-webkit-outer-spin-button,
|
|
input[type="number"].no-spin-inv::-webkit-outer-spin-button,
|
|
input[type="number"].no-spin-inv-tot::-webkit-outer-spin-button,
|
|
input[type="number"].number-input::-webkit-outer-spin-button,
|
|
input[type="number"].no-spin-input::-webkit-inner-spin-button,
|
|
input[type="number"].no-spin-inv::-webkit-inner-spin-button,
|
|
input[type="number"].no-spin-inv-tot::-webkit-outer-spin-button,
|
|
input[type="number"].number-input::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
input[type="number"].no-spin-input,
|
|
input[type="number"].no-spin-inv,
|
|
input[type="number"].no-spin-inv-tot,
|
|
input[type="number"].number-input {
|
|
-moz-appearance: textfield;
|
|
}
|
|
|
|
input.optionalspinners:not(:checked) ~ div input[type="number"].optional-spinner-input,
|
|
input[type="number"].spinner-input,
|
|
input[type="number"].spinner-input-total {
|
|
-moz-appearance: textfield;
|
|
}
|
|
input.optionalspinners:checked ~ div input[type="number"].optional-spinner-input:hover,
|
|
input[type="number"].spinner-input:hover {
|
|
-moz-appearance: auto;
|
|
}
|
|
input.optionalspinners:checked ~ div input[type="number"].optional-spinner-input::-webkit-outer-spin-button,
|
|
input.optionalspinners:checked ~ div input[type="number"].optional-spinner-input::-webkit-inner-spin-button,
|
|
input[type="number"].spinner-input::-webkit-outer-spin-button,
|
|
input[type="number"].spinner-input::-webkit-inner-spin-button,
|
|
input[type="number"].spinner-input-total::-webkit-outer-spin-button,
|
|
input[type="number"].spinner-input-total::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
input.optionalspinners:checked ~ div input[type="number"].optional-spinner-input:hover::-webkit-outer-spin-button,
|
|
input.optionalspinners:checked ~ div input[type="number"].optional-spinner-input:hover::-webkit-inner-spin-button,
|
|
input[type="number"].spinner-input:hover::-webkit-outer-spin-button,
|
|
input[type="number"].spinner-input:hover::-webkit-inner-spin-button {
|
|
-webkit-appearance: auto;
|
|
-moz-appearance: auto;
|
|
max-width: 3px;
|
|
width: 3px;
|
|
margin: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
opacity: 0.5;
|
|
margin: 10;
|
|
}
|
|
.span-gear input.spinner-input-total {
|
|
background-color: Grey;
|
|
}
|
|
|
|
.span-gear .vertical-adjust-one {
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
max-height: 310px;
|
|
}
|
|
|
|
/* TEXT FIELDS */
|
|
.span-tinyitems textarea {
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
overflow-y: auto;
|
|
resize:none;
|
|
/* max-height: 65px;
|
|
min-height: 65px; */
|
|
}
|
|
textarea.xeno-textfield::-webkit-scrollbar,
|
|
.span-gear .vertical-adjust-one::-webkit-scrollbar,
|
|
.tab-container textarea::-webkit-scrollbar,
|
|
.span-tinyitems textarea::-webkit-scrollbar,
|
|
.span-personal-agenda textarea::-webkit-scrollbar {
|
|
width: 6px;
|
|
margin-left: 4px;
|
|
cursor: auto;
|
|
}
|
|
textarea.xeno-textfield::-webkit-scrollbar-track,
|
|
.span-gear .vertical-adjust-one::-webkit-scrollbar-track,
|
|
.tab-container textarea::-webkit-scrollbar-track,
|
|
.span-tinyitems textarea::-webkit-scrollbar-track,
|
|
.span-personal-agenda textarea::-webkit-scrollbar-track {
|
|
border-radius: 3px;
|
|
background: darkgrey;
|
|
}
|
|
textarea.xeno-textfield::-webkit-scrollbar-thumb,
|
|
.span-gear .vertical-adjust-one::-webkit-scrollbar-thumb,
|
|
.tab-container textarea::-webkit-scrollbar-thumb,
|
|
.span-tinyitems textarea::-webkit-scrollbar-thumb,
|
|
.span-personal-agenda textarea::-webkit-scrollbar-thumb {
|
|
border-radius: 3px;
|
|
background: gray;
|
|
}
|
|
textarea.xeno-textfield::-webkit-scrollbar-thumb:hover,
|
|
.span-gear .vertical-adjust-one::-webkit-scrollbar-thumb:hover,
|
|
.tab-container textarea::-webkit-scrollbar-thumb:hover,
|
|
.span-tinyitems textarea::-webkit-scrollbar-thumb:hover,
|
|
.span-personal-agenda textarea::-webkit-scrollbar-thumb:hover {
|
|
background: black;
|
|
}
|
|
span.gear-header {
|
|
float: right;
|
|
width: 40px !important;
|
|
min-width: 40px;
|
|
text-align: center;
|
|
}
|
|
.span-gear input.spinner-input,
|
|
.span-gear input.spinner-input-total,
|
|
.span-gear select.spinner-input-wt {
|
|
font-family: 'Courier Prime';
|
|
font-family: 'Roboto';
|
|
background: transparent;
|
|
display: block;
|
|
margin-right: 0;
|
|
text-align: center;
|
|
float: right;
|
|
width: 32px !important;
|
|
height: 2em !important;
|
|
}
|
|
|
|
|
|
.span-gear div.repcontainer div.repitem {
|
|
height: 30px;
|
|
}
|
|
.span-gear div.repitem.ui-sortable-helper {
|
|
left: unset !important;
|
|
}
|
|
.span-gear div.repcontainer div.itemcontrol {
|
|
float: right;
|
|
}
|
|
.span-gear div.repcontrol {
|
|
width: fit-content;
|
|
margin-left: 6px;
|
|
}
|
|
.span-gear .repcontrol_add, .span-gear .repcontrol_edit {
|
|
visibility: hidden;
|
|
width: 5px;
|
|
margin-left: -5px;
|
|
padding-left: 5px;
|
|
}
|
|
.span-gear .repcontrol_add::before, .span-gear .repcontrol_edit::before {
|
|
visibility:visible;
|
|
color: grey;
|
|
font-family: "Pictos";
|
|
}
|
|
.span-gear .repcontrol_add::before {
|
|
content: "&";
|
|
}
|
|
.span-gear .repcontrol_edit::before {
|
|
content: "(";
|
|
}
|
|
.span-gear .repcontrol_add, .span-gear .repcontrol_edit, .span-gear .repcontrol_move {
|
|
float: right;
|
|
}
|
|
.span-gear .repcontainer.editmode ~ .repcontrol button.repcontrol_edit::before {
|
|
font-family: "Pictos";
|
|
content: ")";
|
|
}
|
|
|
|
|
|
.ui-dialog .charsheet input[type="number"].no-spin-input {
|
|
font-family: 'Courier Prime';
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
height: 30px;
|
|
width: 30px;
|
|
background-color: White;
|
|
border: 1px solid White;
|
|
margin: -1px -2px;
|
|
padding: 3px 0px 0px 0px;
|
|
border-radius: 50%;
|
|
box-shadow: 1px 1px 7px rgba(0, 139, 139, 1), -1px -1px 7px rgba(0, 139, 139, 1), 1px 1px 10px white, -1px -1px 10px white;
|
|
}
|
|
.ui-dialog .charsheet div.no-spin-input {
|
|
display: flex;
|
|
font-size: 20px;
|
|
height: 30px;
|
|
width: 30px;
|
|
background-color: White;
|
|
border: 1px solid White;
|
|
align-self: center;
|
|
align-content: center;
|
|
justify-self: center;
|
|
justify-content: center;
|
|
border-radius: 50%;
|
|
box-shadow: 1px 1px 7px rgba(0, 139, 139, 1), -1px -1px 7px rgba(0, 139, 139, 1), 1px 1px 10px white, -1px -1px 10px white;
|
|
}
|
|
|
|
.no-spin-input.wide {
|
|
width: 42px !important;
|
|
}
|
|
|
|
.charsheet input.squareinput:checked ~ div .no-spin-input {
|
|
border-radius: 20%;
|
|
}
|
|
|
|
.ui-dialog .charsheet div.no-spin-input input[type="number"].no-spin-input {
|
|
background-color: transparent;
|
|
border: unset;
|
|
border-radius: unset;
|
|
box-shadow: unset;
|
|
width: 2em;
|
|
}
|
|
|
|
input[type="number"].number-input {
|
|
text-align: center;
|
|
border: 1px solid rgb(204, 204, 204);
|
|
padding: 3px;
|
|
}
|
|
|
|
.ui-dialog .charsheet input[type="number"].shorter-number {
|
|
width: 22px;
|
|
}
|
|
|
|
.ui-dialog .charsheet input[type="number"].pool-number {
|
|
font-size: 1.75em;
|
|
font-weight: bold;
|
|
height: 1.75em;
|
|
width: 1.75em;
|
|
background-color: white;
|
|
border: 1px solid transparent;
|
|
border-radius: 50%;
|
|
text-align: center;
|
|
margin-left: -3px;
|
|
box-shadow: 1px 1px 10px white, -1px -1px 10px white;
|
|
}
|
|
|
|
.ui-dialog .charsheet input[type="number"].low-visibility-number {
|
|
color: #afafaf;
|
|
font-size: 1.25em;
|
|
font-weight: bold;
|
|
height: 1.3em;
|
|
width: 1.3em;
|
|
background-color: transparent;
|
|
border: 1px solid #afafaf;
|
|
border-radius: 5px;
|
|
text-align: center;
|
|
margin-top: 1px;
|
|
margin-left: 1px;
|
|
box-shadow: none;
|
|
padding: 0px;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.ui-dialog .charsheet input[type="number"].small {
|
|
font-size: 13px;
|
|
}
|
|
|
|
.skinny-div {
|
|
height: 18px;
|
|
}
|
|
|
|
/* SKILLS */
|
|
|
|
.skill-heavymachinery,
|
|
.skill-rangedcombat,
|
|
.skill-mobility,
|
|
.skill-piloting,
|
|
.skill-command {
|
|
width: 110%;
|
|
display: flex;
|
|
justify-self: flex-start;
|
|
justify-content: space-around;
|
|
}
|
|
.skill-stamina,
|
|
.skill-observation,
|
|
.skill-survival,
|
|
.skill-comtech,
|
|
.skill-medicalaid {
|
|
width: 110%;
|
|
display: flex;
|
|
justify-self: flex-end;
|
|
justify-content: space-around;
|
|
}
|
|
|
|
/* PERMANENT MODIFIERS */
|
|
.popout-container {
|
|
position: relative;
|
|
z-index: 49;
|
|
right: 15px;
|
|
width: 0px;
|
|
}
|
|
.permanentmods:not(checked) ~ div div.skill div.popout-container {
|
|
display: none;
|
|
}
|
|
.permanentmods:checked ~ div div.skill div.popout-container,
|
|
.permanentmods[value="1"] ~ div div.skill div.popout-container {
|
|
display: flex;
|
|
}
|
|
/* .permanentmods:not(checked) ~ div.skill input[type="hidden"].skill-modifier:not([value="0"]) ~ div.popout-container {
|
|
display: flex;
|
|
} */
|
|
/* .charsheet div.popout-container div.skill-modifier, */
|
|
.charsheet div.popout-container div.skill-modifier {
|
|
display: flex;
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0;
|
|
z-index: 50;
|
|
width: 56px;
|
|
justify-content: center;
|
|
}
|
|
div.popout-container div.skill-modifier button {
|
|
display: none;
|
|
width: 15px;
|
|
height: 15px;
|
|
line-height: 7px;
|
|
font-size: 8px;
|
|
padding: 0;
|
|
margin-top: -1px;
|
|
border-radius: 50%;
|
|
}
|
|
div.popout-container div.skill-modifier span.no-spin-input {
|
|
display: none;
|
|
width: 15px;
|
|
height: 15px;
|
|
line-height: 17px;
|
|
font-size: 8px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
justify-content: center;
|
|
align-content: center;
|
|
background-color: White;
|
|
border: 1px solid White;
|
|
-margin: -1px -2px;
|
|
-padding: 3px 0px 0px 0px;
|
|
border-radius: 50%;
|
|
box-shadow: 1px 1px 2px rgb(0 139 139), -1px -1px 2px rgb(0 139 139), 1px 1px 3px white, -1px -1px 3px white;
|
|
}
|
|
/* div.skill div.float-left ~ div.popout-container div.skill-modifier,
|
|
div.popout-container div.skill-modifier, */
|
|
/* div.skill div.float-left:hover ~ div.popout-container div.skill-modifier, */
|
|
div.skill div.float-left:hover div.popout-container div.skill-modifier span.no-spin-input,
|
|
div.skill div.float-left:hover div.popout-container div.skill-modifier button.no-spin-input,
|
|
div.skill div.float-right:hover div.popout-container div.skill-modifier span.no-spin-input,
|
|
div.skill div.float-right:hover div.popout-container div.skill-modifier button.no-spin-input,
|
|
div.popout-container div.skill-modifier:hover span.no-spin-input,
|
|
div.popout-container div.skill-modifier:hover button.no-spin-input {
|
|
display: inline-block;
|
|
}
|
|
/*
|
|
input[type="checkbox"].skill-modifier-plus + span::before,
|
|
input[type="checkbox"].skill-modifier-plus + span::before {
|
|
content: " ";
|
|
}*/
|
|
input[type="checkbox"].skill-modifier-plus:checked + span::before {
|
|
content: "+";
|
|
}
|
|
input[type="checkbox"].skill-modifier-viz:checked ~ span.no-spin-input,
|
|
input[type="checkbox"].skill-modifier-viz:checked ~ span.no-spin-input span {
|
|
display: flex !important;
|
|
left: 15px;
|
|
}
|
|
|
|
/* ACTION BUTTONS FOR TABULAR SHEET */
|
|
button[type="action"].action-tab {
|
|
/* width: 20%; */
|
|
height: 9px;
|
|
background-color: transparent;
|
|
border: 1px solid rgba(105, 105, 105, 0.33);
|
|
border-radius: 5px;
|
|
font-size: 12px;
|
|
line-height: 12px;
|
|
/*color: rgba(105, 105, 105, 0.33);*/
|
|
color: #008b8b;
|
|
/* padding: 0px 0px 2px 0px; */
|
|
/* overflow: hidden; */
|
|
width: fit-content;
|
|
/* max-width: 24%; */
|
|
padding: 0 6px 3px 6px;
|
|
}
|
|
/* Firefox specific modification */
|
|
/* @supports (-moz-appearance:none) {
|
|
button[type="action"].action-tab { padding: 0px 0px 0px 0px; }
|
|
} */
|
|
.header-tabs button[type=action].action-tab {
|
|
/* width: 65px; */
|
|
color: rgb(204, 204, 204);
|
|
background-color: #696969;
|
|
/* border: 1px solid #696969; */
|
|
border: 0;
|
|
border-radius: 0;
|
|
margin-right: 0;
|
|
/* border-bottom: 2px solid #d3d3d3; */
|
|
width: fit-content;
|
|
min-width: fit-content;
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
font-size: 10px;
|
|
}
|
|
button[type="action"].action-tab.fit-five {
|
|
width: 14%;
|
|
}
|
|
|
|
button[type="action"].action-tab.fit-two {
|
|
width: 35%;
|
|
}
|
|
|
|
button[type="action"].action-tab:hover {
|
|
color: #ffffff;
|
|
background-color: #696969;
|
|
-border: 1px solid #696969;
|
|
}
|
|
|
|
button[type="action"].action-tab:active {
|
|
color: #ffffff;
|
|
background-color: #696969;
|
|
-border: 1px solid #696969;
|
|
}
|
|
|
|
button[type="action"].action-tab:focus {
|
|
color: #ffffff;
|
|
background-color: #696969;
|
|
-border: 1px solid #696969;
|
|
}
|
|
button[type="action"].action-tab span {
|
|
overflow: hidden;
|
|
}
|
|
|
|
button[type="action"].tab-weapon {
|
|
-width: 10%;
|
|
}
|
|
button[type="action"].tab-armament {
|
|
-width: 13%;
|
|
}
|
|
|
|
button[type="action"].tab-log {
|
|
width: 25% !important;
|
|
}
|
|
|
|
/* TABS */
|
|
div.tab-container {
|
|
display: none;
|
|
-height: 150px;
|
|
}
|
|
|
|
.span-talents div.talent-tabs {
|
|
line-height: 16px;
|
|
}
|
|
|
|
div.tab-container textarea {
|
|
min-height: 50px;
|
|
max-height: 100px;
|
|
overflow-y: auto;
|
|
resize: vertical;
|
|
}
|
|
div.box-under-the-bed {
|
|
display: none;
|
|
}
|
|
.span-talents .tab-container .talent-roll {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
font-size: 0.8rem;
|
|
}
|
|
|
|
/* .span-talents .tab-container .talent-roll select {
|
|
padding: 0 0px;
|
|
clip-path: polygon(4px 0, calc(100% - 4px) 0, 100% 4px, 100% calc(100% - 4px), calc(100% - 4px) 100%, 4px 100%, 0 calc(100% - 4px), 0 4px);
|
|
border-radius: unset;
|
|
-height: fit-content;
|
|
} */
|
|
/* .span-talents div.talent-roll label {
|
|
padding: 0 3px;
|
|
line-height: 16px;
|
|
-height: 16px;
|
|
-margin: 2px 0px 2px 3px;
|
|
} */
|
|
.span-talents div.talent-roll label.talent-type-btn span::before {
|
|
content: "0 ";
|
|
font-family: "Pictos";
|
|
}
|
|
.span-talents .talent-roll-box {
|
|
accent-color: #008b8b;
|
|
align-self: center;
|
|
}
|
|
.charsheet div.talent-roll label.talent-stress-incl,
|
|
.charsheet div.talent-roll label.talent-stress-excl {
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
}
|
|
.charsheet div.talent-roll label.talent-stress-excl {
|
|
text-decoration: line-through;
|
|
}
|
|
/* .span-talents div.talent-roll :is(span,label,button,select,option) {
|
|
font-size: 0.8rem;
|
|
} */
|
|
.talent-roll label.talent-type-skill,
|
|
.talent-roll label.talent-type-supply {
|
|
-display: block;
|
|
-text-align: center;
|
|
-padding: 0 3px;
|
|
width: 55px;
|
|
cursor: pointer;
|
|
}
|
|
/* .span-talents .tab-container div.talent-roll div.darker-rounded-box,
|
|
.span-talents .tab-container div.talent-roll label.darker-rounded-box {
|
|
line-height: 16px;
|
|
height: 16px;
|
|
} */
|
|
/* .span-talents div.talent-roll label span.icon {
|
|
font-family: Pictos;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.darker-rounded-box span.icon + span {
|
|
margin: 1px 3px 0px 2px;
|
|
height: 1.4em;
|
|
} */
|
|
/* input.talent-type:checked ~ div.talent-roll label.talent-type-skill,
|
|
input.talent-type:not(:checked) ~ div.talent-roll label.talent-type-supply {
|
|
display: block;
|
|
} */
|
|
/* input.talent-type:not(:checked) ~ div.talent-roll label.talent-type-skill,
|
|
input.talent-type:checked ~ div.talent-roll label.talent-type-supply {
|
|
display: none;
|
|
} */
|
|
/* div.talent-roll input.talent-stress-box:checked ~ label.talent-stress-incl,
|
|
div.talent-roll input.talent-stress-box:not(:checked) ~ label.talent-stress-excl {
|
|
display: block;
|
|
color: rgb(204, 217, 207);
|
|
} */
|
|
/* div.talent-roll input.talent-stress-box:not(:checked) ~ label.talent-stress-incl,
|
|
div.talent-roll input.talent-stress-box:checked ~ label.talent-stress-excl {
|
|
display: none;
|
|
} */
|
|
div.talent-roll .talent-supply,
|
|
div.talent-roll .talent-skill,
|
|
div.talent-roll .talent-other {
|
|
display: none;
|
|
}
|
|
|
|
/* input.talent-type:checked ~ div.talent-roll .talent-skill,
|
|
input.talent-type:not(:checked) ~ div.talent-roll .talent-supply, */
|
|
input.talent-radio-skill:checked ~ div.talent-roll .talent-skill,
|
|
input.talent-radio-supply:checked ~ div.talent-roll .talent-supply,
|
|
input.talent-radio-other:checked ~ div.talent-roll .talent-other {
|
|
display: flex;
|
|
}
|
|
/* input.talent-type:not(:checked) ~ div.talent-roll .talent-attribute,
|
|
input.talent-type:not(:checked) ~ div.talent-roll .talent-skill,
|
|
input.talent-type:not(:checked) ~ div.talent-roll .talent-stress,
|
|
input.talent-type:checked ~ div.talent-roll .talent-supply,
|
|
div.talent-roll input.talent-stress-box:not(:checked) ~ label.talent-stress-incl,
|
|
div.talent-roll input.talent-stress-box:checked ~ label.talent-stress-excl,
|
|
input.talent-type:not(:checked) ~ div.talent-roll label.talent-type-skill,
|
|
input.talent-type:checked ~ div.talent-roll label.talent-type-supply {
|
|
display: none;
|
|
} */
|
|
|
|
input.talent-roll-box:not(:checked) ~ div.talent-roll {
|
|
display: none;
|
|
}
|
|
input.talent-roll-box:not(:checked) ~ span.talent-roll-btn button,
|
|
input.talent-radio-other:checked input.talent-roll-box:checked ~ span.talent-roll-btn button {
|
|
pointer-events: none;
|
|
-background-color: #b6b6b6;
|
|
}
|
|
/* input.talent-roll-box:not(:checked) ~ div.talent-roll :is(select,label,input,div),
|
|
input.talent-roll-box:not(:checked) ~ div.talent-roll label span {
|
|
pointer-events: none;
|
|
background-color: #b6b6b6;
|
|
} */
|
|
|
|
div.span-talents div.tab-container input.talent-radio-skill:checked ~ span.talent-roll-btn button.talent-roll-skill,
|
|
div.span-talents div.tab-container input.talent-radio-other:checked ~ span.talent-roll-btn button.talent-roll-skill,
|
|
div.span-talents div.tab-container input.talent-radio-supply:checked ~ span.talent-roll-btn button.talent-roll-supply {
|
|
display: inline-block;
|
|
}
|
|
|
|
div.span-talents div.tab-container input.talent-radio-skill:not(checked) ~ span.talent-roll-btn button.talent-roll-skill,
|
|
div.span-talents div.tab-container input.talent-radio-other:not(checked) ~ span.talent-roll-btn button.talent-roll-skill,
|
|
div.span-talents div.tab-container input.talent-radio-supply:not(checked) ~ span.talent-roll-btn button.talent-roll-supply {
|
|
display: none;
|
|
}
|
|
div.span-talents span.talent-roll-btn button.button-skill {
|
|
width: fit-content;
|
|
margin: 0 2px;
|
|
align-content: center;
|
|
line-height: 15px;
|
|
}
|
|
div.span-talents div.tab-container input[type="text"].text-input {
|
|
text-align: center;
|
|
width: calc(100% - 65px);
|
|
}
|
|
/* ,
|
|
div.span-talents div.tab-container input.talent-roll-active:checked +
|
|
input.talent-type:checked ~ span.talent-roll-btn .talent-roll-supply,
|
|
div.span-talents div.tab-container input.talent-roll-active:checked +
|
|
input.talent-type:not(:checked) ~ span.talent-roll-btn .talent-roll-skill {
|
|
display: none;
|
|
} */
|
|
div.span-talents div.tab-container input.talent-roll-active:checked ~ span.talent-roll-btn button {
|
|
pointer-events: unset;
|
|
color: #008b8b;
|
|
border: 1px solid #008b8b;
|
|
}
|
|
div.span-talents div.tab-container input.talent-roll-active:checked ~ span.talent-roll-btn button:hover {
|
|
pointer-events: unset;
|
|
color: rgb(204, 217, 207);
|
|
background-color: #008b8b;
|
|
border: 1px solid #008b8b;
|
|
text-shadow: none;
|
|
}
|
|
div.span-talents div.tab-container input.talent-roll-active:not(checked) ~ span.talent-roll-btn button {
|
|
pointer-events: none;
|
|
color:#b6b6b6;
|
|
border-color: #b6b6b6;
|
|
|
|
}
|
|
|
|
|
|
input.advencumbrance:checked ~ div .encumbrance_calc,
|
|
input.advencumbrance:not(:checked) ~ div .encumbrance_manual {
|
|
display: inline-block;
|
|
}
|
|
input.advencumbrance:not(:checked) ~ div .encumbrance_calc,
|
|
input.advencumbrance:checked ~ div .encumbrance_manual {
|
|
display: none;
|
|
}
|
|
input.advencumbrance:checked ~ div .showencumbrance {
|
|
display: inline-block;
|
|
}
|
|
input.advencumbrance:checked ~ div .showencumbrance-flex {
|
|
display: flex;
|
|
}
|
|
input.advencumbrance:not(:checked) ~ div .showencumbrance,
|
|
input.advencumbrance:not(:checked) ~ div .showencumbrance-flex {
|
|
display: none;
|
|
}
|
|
|
|
input.advencumbrance:checked ~ div .weapon-item-details {
|
|
grid-template-columns: 15% 15% auto 20% 15%;
|
|
grid-gap: 0px;
|
|
padding: 0px;
|
|
text-align: left;
|
|
border-color: transparent;
|
|
|
|
}
|
|
input.advencumbrance:not(:checked) ~ div .weapon-item-details {
|
|
grid-template-columns: 20% 20% auto 25%;
|
|
grid-gap: 0px;
|
|
padding: 0px;
|
|
text-align: left;
|
|
border-color: transparent;
|
|
|
|
}
|
|
|
|
input.tab-sheet[value="Character"] ~ div .ship,
|
|
input.tab-sheet[value="Character"] ~ div .xeno,
|
|
input.tab-sheet[value="Character"] ~ div .config,
|
|
input.tab-sheet[value="Ship"] ~ div .character,
|
|
input.tab-sheet[value="Ship"] ~ div .xeno,
|
|
input.tab-sheet[value="Ship"] ~ div .config,
|
|
input.tab-sheet[value="Config"] ~ div .character,
|
|
input.tab-sheet[value="Config"] ~ div .xeno,
|
|
input.tab-sheet[value="Config"] ~ div .ship,
|
|
input.tab-sheet[value="Xeno"] ~ div .character,
|
|
input.tab-sheet[value="Xeno"] ~ div .ship,
|
|
input.tab-sheet[value="Xeno"] ~ div .config {
|
|
display: none;
|
|
}
|
|
|
|
input.tab-sheet[value="Character"] ~ div .character,
|
|
input.tab-sheet[value="Ship"] ~ div .ship,
|
|
input.tab-sheet[value="Config"] ~ div .config ,
|
|
input.tab-sheet[value="Xeno"] ~ div .xeno {
|
|
display: grid;
|
|
}
|
|
|
|
.header-tabs button[type=action].action-tab[value=Config] {
|
|
text-transform: lowercase;
|
|
font-family: "pictos";
|
|
}
|
|
|
|
input.tab-sheet[value="Character"] ~ div .header-tabs button[name="act_tab_character"],
|
|
input.tab-sheet[value="Ship"] ~ div .header-tabs button[name="act_tab_ship"],
|
|
input.tab-sheet[value="Xeno"] ~ div .header-tabs button[name="act_tab_xeno"],
|
|
input.tab-sheet[value="Config"] ~ div .header-tabs button[name="act_tab_config"] {
|
|
color: black;
|
|
background-color: #d3d3d3;
|
|
}
|
|
|
|
input.tab-one:checked ~ div.tab-one-contents,
|
|
input.tab-two:checked ~ div.tab-two-contents,
|
|
input.tab-three:checked ~ div.tab-three-contents,
|
|
input.tab-four:checked ~ div.tab-four-contents,
|
|
input.tab-five:checked ~ div.tab-five-contents,
|
|
input.tab-six:checked ~ div.tab-six-contents,
|
|
input.tab-seven:checked ~ div.tab-seven-contents,
|
|
input.tab-eight:checked ~ div.tab-eight-contents {
|
|
display: block;
|
|
}
|
|
input.tab-one:checked ~ div.skinny-div button.action-tab-one,
|
|
input.tab-two:checked ~ div.skinny-div button.action-tab-two,
|
|
input.tab-three:checked ~ div.skinny-div button.action-tab-three,
|
|
input.tab-four:checked ~ div.skinny-div button.action-tab-four,
|
|
input.tab-five:checked ~ div.skinny-div button.action-tab-five,
|
|
input.tab-six:checked ~ div.skinny-div button.action-tab-six,
|
|
input.tab-seven:checked ~ div.skinny-div button.action-tab-seven,
|
|
input.tab-eight:checked ~ div.skinny-div button.action-tab-eight {
|
|
background-color: #808080;
|
|
color: white;
|
|
}
|
|
|
|
input.tab-alpha:checked ~ div.tab-alpha-contents,
|
|
input.tab-beta:checked ~ div.tab-beta-contents,
|
|
input.tab-gamma:checked ~ div.tab-gamma-contents,
|
|
input.tab-delta:checked ~ div.tab-delta-contents,
|
|
input.tab-epsilon:checked ~ div.tab-epsilon-contents,
|
|
input.tab-zeta:checked ~ div.tab-zeta-contents {
|
|
display: block;
|
|
}
|
|
input.tab-alpha:checked ~ div.skinny-div button.tab-alpha-button,
|
|
input.tab-beta:checked ~ div.skinny-div button.tab-beta-button,
|
|
input.tab-gamma:checked ~ div.skinny-div button.tab-gamma-button,
|
|
input.tab-delta:checked ~ div.skinny-div button.tab-delta-button,
|
|
input.tab-epsilon:checked ~ div.skinny-div button.tab-epsilon-button,
|
|
input.tab-zeta:checked ~ div.skinny-div button.tab-zeta-button {
|
|
background-color: #808080;
|
|
color: white;
|
|
}
|
|
|
|
input.tab-modules1:checked ~ div.tab-modules1-contents,
|
|
input.tab-modules2:checked ~ div.tab-modules2-contents,
|
|
input.tab-modules3:checked ~ div.tab-modules3-contents,
|
|
input.tab-modules4:checked ~ div.tab-modules4-contents {
|
|
display: block;
|
|
}
|
|
input.tab-modules1:checked ~ div .tab-modules1-button,
|
|
input.tab-modules2:checked ~ div .tab-modules2-button,
|
|
input.tab-modules3:checked ~ div .tab-modules3-button,
|
|
input.tab-modules4:checked ~ div .tab-modules4-button {
|
|
background-color: #808080;
|
|
color: white;
|
|
}
|
|
|
|
input.tab-log1:checked ~ div.tab-log1-contents,
|
|
input.tab-log2:checked ~ div.tab-log2-contents,
|
|
input.tab-log3:checked ~ div.tab-log3-contents,
|
|
input.tab-log4:checked ~ div.tab-log4-contents {
|
|
display: block;
|
|
}
|
|
input.tab-log1:checked ~ div .tab-log1-button,
|
|
input.tab-log2:checked ~ div .tab-log2-button,
|
|
input.tab-log3:checked ~ div .tab-log3-button,
|
|
input.tab-log4:checked ~ div .tab-log4-button {
|
|
background-color: #808080;
|
|
color: white;
|
|
}
|
|
|
|
input.tab-armament1:checked ~ div.tab-armament1-contents,
|
|
input.tab-armament2:checked ~ div.tab-armament2-contents,
|
|
input.tab-armament3:checked ~ div.tab-armament3-contents,
|
|
input.tab-armament4:checked ~ div.tab-armament4-contents,
|
|
input.tab-armament5:checked ~ div.tab-armament5-contents,
|
|
input.tab-armament6:checked ~ div.tab-armament6-contents,
|
|
input.tab-armament7:checked ~ div.tab-armament7-contents,
|
|
input.tab-armament8:checked ~ div.tab-armament8-contents,
|
|
input.tab-armament9:checked ~ div.tab-armament9-contents,
|
|
input.tab-armament10:checked ~ div.tab-armament10-contents {
|
|
display: block;
|
|
}
|
|
input.tab-armament1:checked ~ div.armament-btns .tab-armament1-button,
|
|
input.tab-armament2:checked ~ div.armament-btns .tab-armament2-button,
|
|
input.tab-armament3:checked ~ div.armament-btns .tab-armament3-button,
|
|
input.tab-armament4:checked ~ div.armament-btns .tab-armament4-button,
|
|
input.tab-armament5:checked ~ div.armament-btns .tab-armament5-button,
|
|
input.tab-armament6:checked ~ div.armament-btns .tab-armament6-button,
|
|
input.tab-armament7:checked ~ div.armament-btns .tab-armament7-button,
|
|
input.tab-armament8:checked ~ div.armament-btns .tab-armament8-button,
|
|
input.tab-armament9:checked ~ div.armament-btns .tab-armament9-button,
|
|
input.tab-armament10:checked ~ div.armament-btns .tab-armament10-button {
|
|
background-color: #808080;
|
|
color: white;
|
|
}
|
|
|
|
input.tab {
|
|
opacity: 0;
|
|
display: none;
|
|
}
|
|
|
|
/* CONFIGURATION */
|
|
|
|
input.config-notice:checked ~ button[name="act_tab_config"] {
|
|
background-color:rgba(0, 139, 139, 1);
|
|
}
|
|
|
|
span.configitem {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
div.changelog {
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
max-height: 780px;
|
|
}
|
|
div.changelog::-webkit-scrollbar {
|
|
width: 12px;
|
|
}
|
|
div.changelog::-webkit-scrollbar-track {
|
|
border-radius: 5px;
|
|
background: darkgrey;
|
|
}
|
|
div.changelog::-webkit-scrollbar-thumb {
|
|
border-radius: 5px;
|
|
background: gray;
|
|
}
|
|
div.changelog::-webkit-scrollbar-thumb:hover {
|
|
background: gray;
|
|
}
|
|
|
|
.config select {
|
|
width: 62px;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
justify-self: center;
|
|
align-content: flex-start;
|
|
}
|
|
|
|
/* CUSTOM CHECKBOXES FOR ALIEN RPG */
|
|
|
|
.ui-dialog .charsheet input.numbered-box {
|
|
width: 16px;
|
|
height: 16px;
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
margin: 0px;
|
|
cursor: pointer;
|
|
z-index: 5;
|
|
opacity: 0;
|
|
}
|
|
|
|
/* input.numbered-box + span {
|
|
margin-left: -16px;
|
|
} */
|
|
|
|
input.numbered-box + span::before {
|
|
content: attr(title);
|
|
color: #dcdcdc;
|
|
border: solid 1px #f5f5f5;
|
|
text-align: center;
|
|
display: inline-block;
|
|
background: #f5f5f5;
|
|
width: 16px;
|
|
height: 16px;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
margin-left: -15px;
|
|
margin-right: 2px;
|
|
margin-bottom: 3px;
|
|
padding: 1px 0px 0px 0px;
|
|
line-height: 16px;
|
|
box-shadow: 0px 0px 5px #008b8b;
|
|
user-select: none;
|
|
}
|
|
|
|
input.numbered-box + label {
|
|
content: attr(title);
|
|
color: #dcdcdc;
|
|
border: solid 1px #f5f5f5;
|
|
text-align: center;
|
|
display: inline-block;
|
|
background: #f5f5f5;
|
|
width: 16px;
|
|
height: 16px;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
margin-right: 2px;
|
|
margin-bottom: 3px;
|
|
padding: 1px 0px 0px 0px;
|
|
line-height: 16px;
|
|
box-shadow: 0px 0px 5px #008b8b;
|
|
user-select: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
input.condition + label {
|
|
margin-right: 10px; /* Indent the conditions on the right-hand side */
|
|
}
|
|
|
|
input[type=radio].red-radio {
|
|
width: 20px;
|
|
height: 20px;
|
|
top: 3px;
|
|
left: 6px;
|
|
}
|
|
|
|
input[type=radio].clear-radio {
|
|
width: 20px;
|
|
height: 20px;
|
|
top: 3px;
|
|
left: 6px;
|
|
}
|
|
|
|
input.numbered-box:checked + span::before,
|
|
input.numbered-box:checked + label {
|
|
color: #ffffff;
|
|
background: #cc0000;
|
|
border: solid 1px #cc0000;
|
|
box-shadow: 0px 0px 10px #b30000;
|
|
}
|
|
|
|
input.red-radio:checked + span::before,
|
|
input.red-radio:checked + label {
|
|
color: #ffffff;
|
|
background: #cc0000;
|
|
border: solid 1px #cc0000;
|
|
box-shadow: 0px 0px 10px #b30000;
|
|
}
|
|
input.blue-box {
|
|
width: 40px;
|
|
}
|
|
input.blue-box + span::before,
|
|
input.blue-box + label {
|
|
width: 40px;
|
|
margin-left: -40px;
|
|
color: #696969;
|
|
background: #a0dfdf;
|
|
border: solid 1px #09c2c2;
|
|
box-shadow: 0px 0px 5px #008b8b;
|
|
}
|
|
input.blue-box:checked + span::before,
|
|
input.blue-box:checked + label {
|
|
color: #696969;
|
|
background: transparent;
|
|
border: solid 1px #bfbfbf;
|
|
box-shadow: unset;
|
|
}
|
|
|
|
input.grey-box:checked + span::before,
|
|
input.grey-box:checked + label {
|
|
color: #ffffff;
|
|
background: #808080;
|
|
border: solid 1px #808080;
|
|
box-shadow: 0px 0px 10px #008b8b;
|
|
}
|
|
|
|
input.green-box:checked + span::before,
|
|
input.green-box:checked + label {
|
|
color: #000000;
|
|
background: #7cfc00;
|
|
border: solid 1px #7cfc00;
|
|
box-shadow: 0px 0px 10px #008000;
|
|
}
|
|
|
|
input.gold-box:checked + span::before,
|
|
input.gold-box:checked + label {
|
|
color: #000000;
|
|
background: #ffd700;
|
|
border: solid 1px #ffd700;
|
|
box-shadow: 0px 0px 10px #ffd700;
|
|
}
|
|
|
|
input.letter-box {
|
|
width: 28px;
|
|
height: 14px;
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
margin: 0px;
|
|
cursor: pointer;
|
|
z-index: 5;
|
|
opacity: 0;
|
|
}
|
|
|
|
input.letter-box + span::before {
|
|
content: attr(title);
|
|
color: #dcdcdc;
|
|
border: solid 1px #f5f5f5;
|
|
text-align: center;
|
|
display: inline-block;
|
|
background: #f5f5f5;
|
|
width: 28px;
|
|
height: 14px;
|
|
font-size: 9px;
|
|
font-weight: bold;
|
|
margin-left: -28px;
|
|
margin-right: 2px;
|
|
padding: 0px 0px 0px 0px;
|
|
line-height: 14px;
|
|
box-shadow: 0px 0px 5px #008b8b;
|
|
}
|
|
|
|
input.letter-box:checked + span::before {
|
|
color: #ffffff;
|
|
background: #808080;
|
|
border: solid 1px #808080;
|
|
box-shadow: 0px 0px 10px #008b8b;
|
|
}
|
|
.darker-rounded-box,
|
|
label.darker-rounded-box {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
width: fit-content;
|
|
/* background-color: rgb(185, 218, 193); */
|
|
background-color: #008b8b;
|
|
color: rgb(204, 217, 207);
|
|
border-radius: 6px;
|
|
clip-path: polygon(4px 0, calc(100% - 4px) 0, 100% 4px, 100% calc(100% - 4px), calc(100% - 4px) 100%, 4px 100%, 0 calc(100% - 4px), 0 4px);
|
|
border: 0;
|
|
margin: 2px 0px 2px 3px;
|
|
align-items: baseline;
|
|
line-height: 16px;
|
|
height: 16px;
|
|
line-height: 1.2rem;
|
|
height: 1.2rem;
|
|
max-height: 1.2rem;
|
|
padding: 0;
|
|
height: auto;
|
|
padding: 2px 3px 1px 2px;
|
|
margin: 2px 0px 2px 3px;
|
|
}
|
|
.darker-rounded-box :is(span,select,label),
|
|
.darker-rounded-box label {
|
|
background-color: transparent;
|
|
margin-bottom: 1px;
|
|
margin: 0px 0px 0px 0px;
|
|
font-family: 'Roboto';
|
|
color: rgb(204, 217, 207);
|
|
/* background-color: #008b8b; */
|
|
border: 0;
|
|
border-radius: 6px;
|
|
margin-bottom: 1px;
|
|
padding: 0 0;
|
|
font-weight: normal;
|
|
-font-family: 'Roboto';
|
|
font-size: 0.9rem;
|
|
-height: 20px;
|
|
align-items: center;
|
|
align-content: center;
|
|
align-self: center;
|
|
text-align: center;
|
|
}
|
|
.darker-rounded-box select option {
|
|
color: rgb(204, 217, 207);
|
|
background-color: #008b8b;
|
|
|
|
}
|
|
.darker-rounded-box select:focus,
|
|
.darker-rounded-box select option:focus,
|
|
.darker-rounded-box select:active,
|
|
.darker-rounded-box select option:active {
|
|
outline: none;
|
|
-box-shadow: 0px 0px 10px #008b8b;
|
|
}
|
|
|
|
|
|
|
|
/* CHARACTER HEALTH & STRESS */
|
|
|
|
.health, .stress {
|
|
min-width: 315px;
|
|
padding-left: 2px;
|
|
user-select: none;
|
|
}
|
|
.health .vertical-adjust-one,
|
|
.stress .vertical-adjust-one {
|
|
margin-bottom: -5px;
|
|
}
|
|
.stress {
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.health input[type="checkbox"].numbered-box {
|
|
top: 0px;
|
|
left: 3px;
|
|
-margin-left: 4px;
|
|
}
|
|
/* .health .w60 input {
|
|
margin-left: 5px;
|
|
} */
|
|
/* .health-bar.health-calculated {
|
|
text-align: left;
|
|
padding-left: 5px;
|
|
} */
|
|
|
|
input.config-healthcalculation:checked ~.health-calculated,
|
|
input.config-healthcalculation:checked + .tough,
|
|
input.config-healthcalculation:not(:checked) ~.health-manual {
|
|
display: inline-block;
|
|
}
|
|
input.config-healthcalculation:not(:checked) ~.health-calculated,
|
|
input.config-healthcalculation:not(:checked) + .tough,
|
|
input.config-healthcalculation:checked ~ .health-manual {
|
|
display: none;
|
|
}
|
|
input.health-calculated[type="checkbox"]:checked + label,
|
|
input.health-manual[type="checkbox"]:checked + label {
|
|
color: #ffffff;
|
|
background: #cc0000;
|
|
border: solid 1px #cc0000;
|
|
box-shadow: 0px 0px 10px #b30000;
|
|
}
|
|
|
|
input.attr-health-calculated[value="1"] ~ input.health-calculated[name="attr_health_1"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="2"] ~ input.health-calculated[name="attr_health_2"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="3"] ~ input.health-calculated[name="attr_health_3"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="4"] ~ input.health-calculated[name="attr_health_4"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="5"] ~ input.health-calculated[name="attr_health_5"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="6"] ~ input.health-calculated[name="attr_health_6"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="7"] ~ input.health-calculated[name="attr_health_7"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="8"] ~ input.health-calculated[name="attr_health_8"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="9"] ~ input.health-calculated[name="attr_health_9"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="10"] ~ input.health-calculated[name="attr_health_10"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-calculated[value="1"] ~ input.health-calculated[name="attr_health_1"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="2"] ~ input.health-calculated[name="attr_health_2"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="3"] ~ input.health-calculated[name="attr_health_3"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="4"] ~ input.health-calculated[name="attr_health_4"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="5"] ~ input.health-calculated[name="attr_health_5"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="6"] ~ input.health-calculated[name="attr_health_6"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="7"] ~ input.health-calculated[name="attr_health_7"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="8"] ~ input.health-calculated[name="attr_health_8"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="9"] ~ input.health-calculated[name="attr_health_9"] + label.health-calculated ~ label.health-calculated,
|
|
input.attr-health-calculated[value="10"] ~ input.health-calculated[name="attr_health_10"] + label.health-calculated ~ label.health-calculated {
|
|
-display: none;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
cursor: pointer;
|
|
}
|
|
input.attr-health-manual[value="1"] ~ input.health-manual[name="attr_health_1"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="2"] ~ input.health-manual[name="attr_health_2"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="3"] ~ input.health-manual[name="attr_health_3"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="4"] ~ input.health-manual[name="attr_health_4"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="5"] ~ input.health-manual[name="attr_health_5"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="6"] ~ input.health-manual[name="attr_health_6"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="7"] ~ input.health-manual[name="attr_health_7"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="8"] ~ input.health-manual[name="attr_health_8"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="9"] ~ input.health-manual[name="attr_health_9"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="10"] ~ input.health-manual[name="attr_health_10"] ~ input[type="checkbox"].numbered-box,
|
|
input.attr-health-manual[value="1"] ~ input.health-manual[name="attr_health_1"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="2"] ~ input.health-manual[name="attr_health_2"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="3"] ~ input.health-manual[name="attr_health_3"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="4"] ~ input.health-manual[name="attr_health_4"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="5"] ~ input.health-manual[name="attr_health_5"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="6"] ~ input.health-manual[name="attr_health_6"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="7"] ~ input.health-manual[name="attr_health_7"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="8"] ~ input.health-manual[name="attr_health_8"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="9"] ~ input.health-manual[name="attr_health_9"] + label.health-manual ~ label.health-manual,
|
|
input.attr-health-manual[value="10"] ~ input.health-manual[name="attr_health_10"] + label.health-manual ~ label.health-manual {
|
|
-display: none;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
cursor: pointer;
|
|
}
|
|
/* input.attr-health-calculated[value="1"] ~ input.health-calculated[name="attr_health_1"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="2"] ~ input.health-calculated[name="attr_health_2"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="3"] ~ input.health-calculated[name="attr_health_3"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="4"] ~ input.health-calculated[name="attr_health_4"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="5"] ~ input.health-calculated[name="attr_health_5"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="6"] ~ input.health-calculated[name="attr_health_6"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="7"] ~ input.health-calculated[name="attr_health_7"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="8"] ~ input.health-calculated[name="attr_health_8"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="9"] ~ input.health-calculated[name="attr_health_9"] ~ input[type="checkbox"] + span:before,
|
|
input.attr-health-calculated[value="10"] ~ input.health-calculated[name="attr_health_10"] ~ input[type="checkbox"] + span:before {
|
|
-display: none;
|
|
-display: inline-block;
|
|
-content: "";
|
|
opacity: 0;
|
|
-width: auto;
|
|
border: unset;
|
|
box-shadow: unset;
|
|
background-color: unset;
|
|
} */
|
|
|
|
/* CHARACTER OPTIONS */
|
|
.small-box {
|
|
padding: 0;
|
|
}
|
|
.small-box div.smallbox-option-input,
|
|
.small-option-box div.smallbox-option-input {
|
|
margin-top: -4px;
|
|
}
|
|
div.small-option-box {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
justify-items: center;
|
|
justify-self: center;
|
|
align-items: center;
|
|
align-content: center;
|
|
align-self: center;
|
|
}
|
|
div.small-box div.more-curves {
|
|
line-height: 20px;
|
|
}
|
|
div.small-option-box div.more-curves {
|
|
line-height: 10px;
|
|
margin-bottom: 5px;
|
|
}
|
|
div.small-option-box label,
|
|
div.small-option-box div.smallbox-option-input span:before {
|
|
-display: flex;
|
|
height: 14px;
|
|
width: 14px;
|
|
font-size: 10px;
|
|
align-content: center;
|
|
justify-content: center;
|
|
}
|
|
div.small-box-option.steelnerves .smallbox-option-input {
|
|
margin-top: -8px;
|
|
}
|
|
|
|
/* CHARACTER RADIATION */
|
|
div.span-radiation {
|
|
user-select: none;
|
|
}
|
|
div.span-radiation span.permanent,
|
|
div.span-radiation label.permanent {
|
|
font-size: 13px;
|
|
font-weight: normal;
|
|
font-family: 'Pictos three';
|
|
width: 16px;
|
|
height: 16px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin: 0px 2px 1px 5px;
|
|
padding: 0 0 1px 0;
|
|
z-index: 5;
|
|
line-height: normal;
|
|
box-sizing: content-box;
|
|
vertical-align: middle;
|
|
border-radius: 0;
|
|
color: #000000;
|
|
background: #7cfc00;
|
|
border: solid 1px #7cfc00;
|
|
box-shadow: 0px 0px 10px #008000;
|
|
cursor: default;
|
|
}
|
|
div.span-radiation label.transient {
|
|
margin-left: 5px;
|
|
margin-bottom: 2px;
|
|
cursor: pointer;
|
|
user-select: none;
|
|
}
|
|
div.span-radiation button.button-radiation {
|
|
display: inline-block;
|
|
width: 14px;
|
|
height: 14px;
|
|
line-height: 14px;
|
|
text-align: center;
|
|
font-family: 'Pictos';
|
|
text-transform: none;
|
|
}
|
|
div.span-radiation button.button-radiation.radiation-damage {
|
|
font-family: 'Pictos three';
|
|
margin: 0 0 0 3px;
|
|
}
|
|
div.radiation .permanent {
|
|
display: inline-block;
|
|
}
|
|
div.radiation .transient {
|
|
display: none;
|
|
}
|
|
input[name="attr_radiation_perm"] ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="0"] ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="1"] ~ span.p1 ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="2"] ~ span.p2 ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="3"] ~ span.p3 ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="4"] ~ span.p4 ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="5"] ~ span.p5 ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="6"] ~ span.p6 ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="7"] ~ span.p7 ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="8"] ~ span.p8 ~ .permanent,
|
|
input[name="attr_radiation_perm"][value="9"] ~ span.p9 ~ .permanent {
|
|
display: none;
|
|
}
|
|
input[name="attr_radiation_perm"][value="10"] ~ .permanent { display: inline-block; }
|
|
|
|
input[name="attr_radiation_perm"][value="0"] ~ .transient {display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="1"] ~ label.r1 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="2"] ~ label.r2 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="3"] ~ label.r3 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="4"] ~ label.r4 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="5"] ~ label.r5 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="6"] ~ label.r6 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="7"] ~ label.r7 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="8"] ~ label.r8 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="9"] ~ label.r9 ~ .transient { display: inline-block; }
|
|
input[name="attr_radiation_perm"][value="10"] ~ .transient { display: none; }
|
|
|
|
/* RELATIONSHIPS */
|
|
|
|
div.relation-rows {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: inline-flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
align-items: center;
|
|
align-content: center;
|
|
}
|
|
div.relation-rows span.relationship-title {
|
|
margin-right: 5px;
|
|
width: calc(100% - 85% - 12px);
|
|
float: left;
|
|
margin-left: 5px;
|
|
}
|
|
div.relation-rows input.relationship-input{
|
|
width: 85%;
|
|
}
|
|
div.relation-rows hr {
|
|
width: 100%;
|
|
}
|
|
|
|
/* CONDITIONS */
|
|
div.condition-rows {
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
width: 100%;
|
|
height: 100%;
|
|
justify-content: space-evenly;
|
|
}
|
|
div.condition-rows div { width: 100%; }
|
|
|
|
/* SHIPDAMAGE */
|
|
|
|
div.ship-damage-row label.numbered-box {
|
|
margin-left: 2px;
|
|
cursor: pointer;
|
|
}
|
|
div.ship-damage-row label.clear-button {
|
|
/* width: 40px;
|
|
margin-left: -40px;
|
|
color: #696969;
|
|
background: #a0dfdf;
|
|
border: solid 1px #09c2c2;
|
|
box-shadow: 0px 0px 5px #008b8b; */
|
|
}
|
|
|
|
input.shipdamage + label {
|
|
color: #ffffff;
|
|
background: #cc0000;
|
|
border: solid 1px #cc0000;
|
|
box-shadow: 0px 0px 5px #b30000;
|
|
margin-right: calc((100% - 210px) / 10);
|
|
}
|
|
.hullpoints-missing {
|
|
display: none;
|
|
}
|
|
input[name="attr_shipdamage_max"][value="0"] ~ .hullpoints-missing {
|
|
display: inline-flex !important;
|
|
justify-self: center;
|
|
font-style: italic;
|
|
}
|
|
.ship-damage-row {
|
|
padding-top: 0;
|
|
}
|
|
|
|
/* Only show radios up to the max value */
|
|
input[name="attr_shipdamage_max"][value="0"] ~ label.shipdamage0 ~ label,
|
|
input[name="attr_shipdamage_max"][value="1"] ~ label.shipdamage1 ~ label,
|
|
input[name="attr_shipdamage_max"][value="2"] ~ label.shipdamage2 ~ label,
|
|
input[name="attr_shipdamage_max"][value="3"] ~ label.shipdamage3 ~ label,
|
|
input[name="attr_shipdamage_max"][value="4"] ~ label.shipdamage4 ~ label,
|
|
input[name="attr_shipdamage_max"][value="5"] ~ label.shipdamage5 ~ label,
|
|
input[name="attr_shipdamage_max"][value="6"] ~ label.shipdamage6 ~ label,
|
|
input[name="attr_shipdamage_max"][value="7"] ~ label.shipdamage7 ~ label,
|
|
input[name="attr_shipdamage_max"][value="8"] ~ label.shipdamage8 ~ label,
|
|
input[name="attr_shipdamage_max"][value="9"] ~ label.shipdamage9 ~ label,
|
|
input[name="attr_shipdamage_max"][value="10"] ~ label.shipdamage10 ~ label,
|
|
input[name="attr_shipdamage_max"][value="11"] ~ label.shipdamage11 ~ label,
|
|
input[name="attr_shipdamage_max"][value="12"] ~ label.shipdamage12 ~ label,
|
|
input[name="attr_shipdamage_max"][value="13"] ~ label.shipdamage13 ~ label,
|
|
input[name="attr_shipdamage_max"][value="14"] ~ label.shipdamage14 ~ label,
|
|
input[name="attr_shipdamage_max"][value="15"] ~ label.shipdamage15 ~ label,
|
|
input[name="attr_shipdamage_max"][value="16"] ~ label.shipdamage16 ~ label,
|
|
input[name="attr_shipdamage_max"][value="17"] ~ label.shipdamage17 ~ label,
|
|
input[name="attr_shipdamage_max"][value="18"] ~ label.shipdamage18 ~ label,
|
|
input[name="attr_shipdamage_max"][value="19"] ~ label.shipdamage19 ~ label,
|
|
input[name="attr_shipdamage_max"][value="20"] ~ label.shipdamage20 ~ label {
|
|
display: none;
|
|
}
|
|
|
|
/**/ input[name="attr_shipdamage"][value="0"] ~ label.shipdamage,
|
|
input.shipdamage0:checked ~ label.shipdamage ,
|
|
input.shipdamage1:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage2:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage3:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage4:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage5:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage6:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage7:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage8:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage9:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage10:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage11:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage12:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage13:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage14:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage15:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage16:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage17:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage18:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage19:checked + label.shipdamage ~ label.shipdamage ,
|
|
input.shipdamage20:checked + label.shipdamage ~ label.shipdamage {
|
|
color: #ffffff;
|
|
background: #808080;
|
|
border: solid 1px #808080;
|
|
box-shadow: 0px 0px 5px #008b8b;
|
|
}
|
|
|
|
|
|
/* XENO DAMAGE */
|
|
|
|
.xenohealth label.dark-teal-header {
|
|
padding-right: 0;
|
|
margin-bottom: 0;
|
|
margin-top: 2px;
|
|
}
|
|
.xeno-health-row {
|
|
margin-top: -10px;
|
|
display: flex;
|
|
align-self: center;
|
|
}
|
|
.xeno-health-boxes {
|
|
margin-left: 17px;
|
|
margin-right: 0;
|
|
}
|
|
.ui-dialog .charsheet .xeno .xenohealth input.low-visibility-number {
|
|
color: #555;
|
|
margin-left: 3px;
|
|
}
|
|
|
|
div.xeno div.xeno-health-boxes label.xenohealth {
|
|
color: #000000;
|
|
background: #b4f870;
|
|
border: solid 1px #a5e664;
|
|
box-shadow: 0px 0px 10px #1db51d;
|
|
text-align: center;
|
|
display: inline-block;
|
|
width: 16px;
|
|
height: 16px;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
margin-right: 5px;
|
|
margin-left: 5px;
|
|
padding: 0px 0px 0px 0px;
|
|
line-height: 16px;
|
|
margin-top: 5px;
|
|
margin-bottom: 1px;
|
|
cursor: pointer;
|
|
}
|
|
div.xeno div.xeno-health-boxes span.xenohealth-separator {
|
|
opacity: 0;
|
|
user-select: none;
|
|
cursor: default;
|
|
width: 18px; /* Added 2px to cover for missing border */
|
|
height: 16px;
|
|
margin-right: 5px;
|
|
margin-left: 5px;
|
|
padding: 0px 0px 0px 0px;
|
|
line-height: 16px;
|
|
margin-top: 5px;
|
|
margin-bottom: 1px;
|
|
}
|
|
|
|
input.xenohealth-box:checked + label.xenohealth {
|
|
color: #000000;
|
|
background: #78e60a;
|
|
border: solid 1px #7eeb11;
|
|
box-shadow: 0px 0px 10px #109b10;
|
|
}
|
|
|
|
/* Only show radios up to the max value */
|
|
input[name="attr_health_max"][value="0"] ~ label.xenohealth0 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="1"] ~ label.xenohealth1 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="2"] ~ label.xenohealth2 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="3"] ~ label.xenohealth3 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="4"] ~ label.xenohealth4 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="5"] ~ label.xenohealth5 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="6"] ~ label.xenohealth6 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="7"] ~ label.xenohealth7 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="8"] ~ label.xenohealth8 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="9"] ~ label.xenohealth9 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="10"] ~ label.xenohealth10 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="11"] ~ label.xenohealth11 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="12"] ~ label.xenohealth12 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="13"] ~ label.xenohealth13 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="14"] ~ label.xenohealth14 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="15"] ~ label.xenohealth15 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="16"] ~ label.xenohealth16 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="17"] ~ label.xenohealth17 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="18"] ~ label.xenohealth18 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="19"] ~ label.xenohealth19 ~ .xenohealth,
|
|
input[name="attr_health_max"][value="20"] ~ label.xenohealth20 ~ .xenohealth {
|
|
display: none;
|
|
}
|
|
|
|
input.xenohealth0:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth1:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth2:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth3:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth4:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth5:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth6:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth7:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth8:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth9:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth10:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth11:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth12:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth13:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth14:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth15:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth16:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth17:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth18:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth19:checked + label.xenohealth ~ .xenohealth,
|
|
input.xenohealth20:checked + label.xenohealth ~ .xenohealth {
|
|
color: #ffffff;
|
|
background: #808080;
|
|
border: solid 1px #808080;
|
|
box-shadow: 0px 0px 10px #008b8b;
|
|
}
|
|
|
|
.xeno .box-flexlist {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.xeno .no-spin-input {
|
|
-clip-path: polygon(33% 0, 67% 0, 100% 33%, 100% 67%, 67% 100%, 33% 100%, 0 67%, 0 33%);
|
|
}
|
|
.xeno-speed .flexlist,
|
|
.xeno-skills .flexlist {
|
|
text-align: unset;
|
|
}
|
|
.xeno-speed .flexlist input[type="number"],
|
|
.xeno-skills .flexlist input[type="number"] {
|
|
float: right;
|
|
}
|
|
|
|
.xeno .roll-buttons {
|
|
display: flex;
|
|
text-align: center;
|
|
line-height: 1em;
|
|
grid-gap: 5px;
|
|
margin-top: 4px;
|
|
position: relative;
|
|
left: -75px;
|
|
}
|
|
.xeno .roll-buttons label.xenowhisper {
|
|
color: #008b8b;
|
|
font-family: 'Montserrat';
|
|
text-transform: uppercase;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
height: 16px;
|
|
line-height: 18px;
|
|
width: fit-content;
|
|
margin: 4px -1px 0 0;
|
|
padding: 2px 3px;
|
|
background-color: transparent;
|
|
border: 1px solid #008b8b;
|
|
border-radius: 5px;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
cursor: pointer;
|
|
display: flex;
|
|
align-self: flex-end;
|
|
}
|
|
.charsheet div.xeno div.roll-buttons label.button-narrow {
|
|
height: 10px;
|
|
line-height: 10px;
|
|
align-self: flex-end;
|
|
}
|
|
.xeno .roll-buttons input[type="checkbox"].xenowhisper:checked + label.xenowhisper,
|
|
.xeno .roll-buttons input[type="checkbox"].xenomodifierquery:checked + label.xenomodifierquery {
|
|
background-color: #008b8b;
|
|
color: rgb(204, 217, 207);
|
|
}
|
|
.charsheet div.xeno div.roll-buttons button[type="roll"].button-alpha,
|
|
.charsheet div.xeno div.roll-buttons button[type="roll"].button-beta {
|
|
width: fit-content;
|
|
margin: 0;
|
|
align-self: flex-end;
|
|
}
|
|
.xeno .armor {
|
|
display: grid;
|
|
grid-template-columns: 50% 50%;
|
|
margin-top: 15px;
|
|
}
|
|
.xeno .armor button[type="roll"].button-skill {
|
|
margin-right: 15px;
|
|
margin-top: 3px;
|
|
width: 65%;
|
|
}
|
|
.xeno .armor button[type="roll"].button-skill.button-armorvs {
|
|
width: calc(100% - 30px - 45%);;
|
|
margin-right: 0;
|
|
}
|
|
.xeno .armor button[type="roll"].button-skill.button-armorvs + input {
|
|
width: calc(100% - 30px - 50%);
|
|
}
|
|
|
|
.xeno .armor input[type="text"] {
|
|
background-color: transparent;
|
|
width: 70px;
|
|
color:rgb(0, 139, 139);
|
|
vertical-align: unset;
|
|
}
|
|
.xeno-attack-control {
|
|
width: 50%;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-content: flex-end;
|
|
justify-self: flex-end;
|
|
align-self: flex-end;
|
|
margin-top: -10px;
|
|
margin-bottom: -5px;
|
|
}
|
|
.xeno-attack-control button.attack-control-label {
|
|
border: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: transparent;
|
|
width: fit-content;
|
|
}
|
|
.xeno-attack-control button.attack-control-label label {
|
|
margin: 0;
|
|
padding: 0 3px;
|
|
cursor: pointer;
|
|
}
|
|
.xeno-attack-control button.attack-control-label:nth-of-type(2) {
|
|
margin-right: 10px;
|
|
}
|
|
.xeno-attack {
|
|
display: grid;
|
|
grid-template-columns: 25px auto 7px 5px;
|
|
column-gap: 5px;
|
|
}
|
|
|
|
.xeno-attack-number {
|
|
float: left;
|
|
padding: 0 10px;
|
|
}
|
|
.xeno-attack-desc {
|
|
background: transparent;
|
|
float: left;
|
|
width: 100%;
|
|
height: 5em;
|
|
max-width: calc(100% - 12px);
|
|
min-width: calc(100% - 12px);
|
|
margin-right: 5px;
|
|
margin-top: 3px;
|
|
}
|
|
.xeno-attack-name {
|
|
background: transparent;
|
|
float: left;
|
|
width: 100%;
|
|
height: 1.5em;
|
|
max-width: calc(100% - 72px);
|
|
min-width: calc(100% - 72px);
|
|
padding: 1px;
|
|
}
|
|
.button-copy {
|
|
float: left;
|
|
}
|
|
|
|
|
|
/* WOOHOO BUTTONS */
|
|
|
|
.config-apirolls:checked ~ div .roll-rolltemplate,
|
|
.config-apirolls:not(checked) ~ div .roll-api {
|
|
display: none;
|
|
}
|
|
.config-apirolls:not(checked) ~ div .roll-rolltemplate,
|
|
.config-apirolls:checked ~ div .roll-api {
|
|
display: inline-flex;
|
|
}
|
|
|
|
|
|
|
|
button[type="roll"].button-alpha:before, button[type="roll"].button-skill:before, button[type="roll"].button-attribute:before, button[type="action"].action-modifier:before {
|
|
content: "" !important;
|
|
display: none;
|
|
border: none;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
}
|
|
|
|
|
|
.ui-dialog .charsheet .background-wrap button.vertical-adjust-half {
|
|
margin-top: 4px;
|
|
}
|
|
|
|
label.button-skill,
|
|
button.button-skill,
|
|
button[type="action"].button-skill,
|
|
button[type="roll"].button-skill {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 15px;
|
|
line-height: 18px;
|
|
width: 70%;
|
|
margin: 4px 1px;
|
|
background-color: transparent;
|
|
border: 1px solid rgb(204, 217, 207); /* Teal Varient */
|
|
border-radius: 5px;
|
|
background-image: none;
|
|
text-shadow: none;
|
|
}
|
|
|
|
label.button-skill:hover,
|
|
button.button-skill:hover,
|
|
button[type="action"].button-skill:hover,
|
|
button[type="roll"].button-skill:hover {
|
|
color: rgb(204, 217, 207); /* Teal Varient */
|
|
background-color: rgba(0, 139, 139, 1); /* Dark Cyan #008b8b */
|
|
border: 1px solid #008b8b;
|
|
text-shadow: none;
|
|
}
|
|
label.button-skill:active,
|
|
button.button-skill:active,
|
|
button[type="raction"].button-skill:active,
|
|
button[type="roll"].button-skill:active {
|
|
color: rgb(204, 217, 207); /* Teal Varient */
|
|
background-color: #008b8b; /* Dark Cyan #008b8b */
|
|
border: 1px solid #008b8b; /* Dark Cyan #008b8b */
|
|
box-shadow: 0px 0px 10px #008b8b;
|
|
}
|
|
|
|
.ui-dialog .charsheet .background-wrap div.consumable button.vertical-adjust-one {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.ui-dialog .charsheet .background-wrap .character button[type="roll"][name="armor"] {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
button[type="roll"].bigger-skill {
|
|
width: 70%;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
.ui-dialog .charsheet .background-wrap .xeno button.signatureattack {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
/* Attack button in weapon box */
|
|
button[type="roll"].smaller-skill {
|
|
width: 16%;
|
|
border: 1px solid #008b8b; /* Gave it an outline as players were not realising it was a button */
|
|
}
|
|
|
|
label.button-alpha, label.button-beta, label.button-gamma,
|
|
button[type="roll"].button-alpha,
|
|
button[type="roll"].button-beta,
|
|
button[type="action"].button-gamma,
|
|
button[type="roll"].button-gamma {
|
|
margin-top: 0px;
|
|
margin-bottom: 0px;
|
|
border: 1px solid #008b8b;
|
|
width: inherit;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
label.button-alpha,
|
|
button[type="roll"].button-alpha {
|
|
text-transform: lowercase; /* Exception because common usage of 1d6 is more important than consistency with theme. */
|
|
}
|
|
label.button-skill:focus,
|
|
button.button-skill:focus,
|
|
button[type="roll"].button-skill:focus {
|
|
outline:0;
|
|
}
|
|
input[type="checkbox"].button-skill:checked label {
|
|
color: rgb(204, 217, 207); /* Teal Varient */
|
|
background-color: #008b8b; /* Dark Cyan #008b8b */
|
|
border: 1px solid #008b8b; /* Dark Cyan #008b8b */
|
|
box-shadow: 0px 0px 10px #008b8b;
|
|
}
|
|
|
|
.attribute-box {
|
|
display: flex;
|
|
align-content: center;
|
|
align-items: center;
|
|
justify-content: center;
|
|
justify-items: center;
|
|
height: -webkit-fill-available;
|
|
}
|
|
.attribute-strength-box {
|
|
position: relative;
|
|
top: 5px;
|
|
padding-top: 0;
|
|
margin-top: -10px;
|
|
margin-bottom: -15px;
|
|
}
|
|
.ui-dialog .charsheet div.attribute-strength-box button {
|
|
margin-bottom: 5px;
|
|
}
|
|
.attribute-empathy-box {
|
|
position: relative;
|
|
top: -5px;
|
|
padding-bottom: 0;
|
|
margin-bottom: -15px;
|
|
margin-top: -15px;
|
|
}
|
|
.ui-dialog .charsheet div.attribute-empathy-box button {
|
|
margin-top: 5px;
|
|
}
|
|
.attribute-agility-box {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
gap: 10px;
|
|
}
|
|
.attribute-wits-box {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
gap: 10px;
|
|
}
|
|
.ui-dialog .charsheet button[type="roll"].attribute-button {
|
|
background-color: transparent;
|
|
background-image: none;
|
|
border: 0;
|
|
box-shadow: unset;
|
|
color: rgb(204, 217, 207); /* Teal Varient */
|
|
cursor: pointer;
|
|
font-family: Graduate, cursive;
|
|
font-size:16px;
|
|
font-weight:700;
|
|
height:fit-content;
|
|
letter-spacing:normal;
|
|
line-height:24px;
|
|
text-align:center;
|
|
text-size-adjust:100%;
|
|
text-transform:uppercase;
|
|
line-height: 18px;
|
|
padding: 3px 3px 3px 3px;
|
|
}
|
|
|
|
.ui-dialog .charsheet button[type="roll"].attribute-button:before {
|
|
content: "";
|
|
}
|
|
|
|
.ui-dialog .charsheet button[type="roll"].attribute-button:hover,
|
|
.ui-dialog .charsheet button[type="roll"].attribute-button:focus,
|
|
.ui-dialog .charsheet button[type="roll"].attribute-button:active {
|
|
border: rgb(204, 217, 207);
|
|
background-color:rgba(113, 142, 135, 1);
|
|
cursor: pointer;
|
|
}
|
|
|
|
|
|
/* ROLL TEMPLATE STYLING */
|
|
.sheet-rolltemplate-alien .sheet-template-wrap {
|
|
background-color: hsl(0, 0%, 22%);
|
|
border: 1px solid #404040;
|
|
border-radius: 5px;
|
|
width: 100%;
|
|
margin-left: -10px;
|
|
padding: 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-wrap {
|
|
counter-reset: hit stress damage;
|
|
}
|
|
/* .sheet-rolltemplate-alien .sheet-template-wrap ::after {
|
|
content: "Results hits: " counter(hit) " stress: " counter(stress);
|
|
} */
|
|
.sheet-rolltemplate-alien .sheet-template-success::after {
|
|
content: counter(hit);
|
|
}
|
|
.sheet-rolltemplate-alien .sheet-template-stress::after {
|
|
content: counter(stress);
|
|
}
|
|
.sheet-rolltemplate-alien .sheet-template-damage::after {
|
|
content: counter(damage);
|
|
}
|
|
.sheet-rolltemplate-alien .sheet-hit,
|
|
.sheet-rolltemplate-aliens .sheet-base-dice span.inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-aliens .sheet-stress-dice span.inlinerollresult.fullcrit {
|
|
counter-increment: hit damage;
|
|
}
|
|
/* .sheet-rolltemplate-alien .sheet-hit,
|
|
.sheet-rolltemplate-aliens .sheet-base-dice span.inlinerollresult.fullcrit {
|
|
counter-increment: damage;
|
|
} */
|
|
.sheet-rolltemplate-alien .sheet-stress,
|
|
.sheet-rolltemplate-aliens .sheet-stress-dice span.inlinerollresult.fullfail {
|
|
counter-increment: stress;
|
|
}
|
|
|
|
.sheet-rolltemplate-aliens .sheet-base-dice,
|
|
.sheet-rolltemplate-aliens .sheet-stress-dice,
|
|
.sheet-rolltemplate-aliens .sheet-supply-dice {
|
|
text-align: justify !important;
|
|
}
|
|
|
|
.sheet-rolltemplate-aliens .sheet-base-dice span.inlinerollresult,
|
|
.sheet-rolltemplate-aliens .sheet-stress-dice span.inlinerollresult,
|
|
.sheet-rolltemplate-aliens .sheet-supply-dice span.inlinerollresult {
|
|
color: transparent;
|
|
display: inline-block;
|
|
margin-bottom: 2px;
|
|
margin-left: -2px;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-background,
|
|
.sheet-rolltemplate-alien .sheet-template-background {
|
|
background: url(https://s3.amazonaws.com/files.d20.io/images/83147486/YCuEWUzaudOcg2mNHbiFCw/max.png?1559667169);
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-position: center center;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-grid,
|
|
.sheet-rolltemplate-alien .sheet-template-grid {
|
|
display: grid;
|
|
grid-gap: 3px;
|
|
background-color: transparent;
|
|
padding: 3px;
|
|
grid-template-columns: 15.75% 15.75% 15.75% 15.75% 15.75% 15.75%;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-flex,
|
|
.sheet-rolltemplate-alien .sheet-template-background .sheet-template-grid .sheet-template-flex {
|
|
width: 100%;
|
|
display: flex;
|
|
grid-gap: 3px;
|
|
background-color: transparent;
|
|
justify-content: center;
|
|
-justify-items: stretch;
|
|
-justify-self: stretch;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-grid-item,
|
|
.sheet-rolltemplate-alien .sheet-template-grid-item {
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
display: inline-block;
|
|
color: #ffffff;
|
|
border: none;
|
|
border-radius: 5px;
|
|
padding: 3px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-flex-item,
|
|
.sheet-rolltemplate-alien .sheet-template-flex-item {
|
|
-display: flex;
|
|
width: 100%;
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
color: #ffffff;
|
|
border: none;
|
|
border-radius: 5px;
|
|
padding: 3px;
|
|
text-align: center;
|
|
justify-content: center;
|
|
-justify-items: stretch;
|
|
-justify-self: stretch;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-flex-column {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-die,
|
|
.sheet-rolltemplate-alien .sheet-template-die {
|
|
display: inline-block;
|
|
border: none;
|
|
-padding: 1px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-span-six,
|
|
.sheet-rolltemplate-alien .sheet-template-span-six {
|
|
grid-column: 1 / 7;
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-half1 {
|
|
grid-column: 1 / 4;
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-half2 {
|
|
grid-column: 4 / 7;
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-left {
|
|
grid-column: 1 / 3;
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-center {
|
|
grid-column: 3 / 5;
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-right {
|
|
grid-column: 5 / 7;
|
|
background-color: rgba(259, 259, 259, 0.05);
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-one {
|
|
grid-column: 1 / 2;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-two {
|
|
grid-column: 2 / 3;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-three {
|
|
grid-column: 3 / 4;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-four {
|
|
grid-column: 4 / 5;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-five {
|
|
grid-column: 5 / 6;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-span-shix {
|
|
grid-column: 6 / 7;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-to-the-left {
|
|
text-align: left;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-to-the-center,
|
|
.sheet-rolltemplate-alien .sheet-template-to-the-center {
|
|
padding-left: 43%;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-transparent-bg {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.sheet-template-xeno .sheet-template-grid .inlinerollresult,
|
|
.sheet-rolltemplate-alien .sheet-template-grid .inlinerollresult {
|
|
color: #000000;
|
|
font-size: 1.9em;
|
|
line-height: 35px;
|
|
background-color: transparent;
|
|
border: none;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .inlinerollresult.fullcrit {
|
|
color: #000000;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .inlinerollresult.fullfail {
|
|
color: #000000;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .inlinerollresult.importantroll {
|
|
color: #000000;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-yellow,
|
|
.sheet-rolltemplate-aliens .sheet-stress-dice span.inlinerollresult,
|
|
.sheet-template-xeno .sheet-template-yellow span.inlinerollresult {
|
|
height: 35px;
|
|
width: 35px;
|
|
background-color: #ffe600;
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/Stress-Between.png?raw=true");
|
|
background-size: 100% 100%;
|
|
border: none;
|
|
border-radius: 5px;
|
|
background-position: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-base-between,
|
|
.sheet-rolltemplate-aliens .sheet-base-dice span.inlinerollresult,
|
|
.sheet-template-xeno .sheet-base-dice span.inlinerollresult {
|
|
height: 35px;
|
|
width: 35px;
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/Base-Between.png?raw=true");
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-base-success,
|
|
.sheet-rolltemplate-aliens .sheet-base-dice span.inlinerollresult.fullcrit {
|
|
height: 35px;
|
|
width: 35px;
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/Base-Success.png?raw=true");
|
|
background-size: 100% 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-stress-between,
|
|
.sheet-rolltemplate-aliens .sheet-stress-dice span.inlinerollresult {
|
|
height: 35px;
|
|
width: 35px;
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/Stress-Between.png?raw=true");
|
|
background-size: 100% 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-stress-fail,
|
|
.sheet-rolltemplate-aliens .sheet-stress-dice span.inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-aliens .sheet-supply-dice span.inlinerollresult.fullfail {
|
|
height: 35px;
|
|
width: 35px;
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/Stress-Fail.png?raw=true");
|
|
background-size: 100% 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-template-stress-success,
|
|
.sheet-rolltemplate-aliens .sheet-stress-dice span.inlinerollresult.fullcrit {
|
|
height: 35px;
|
|
width: 35px;
|
|
background-image: url("https://github.com/Roll20/roll20-character-sheets/blob/master/Alien%20Roleplaying%20Game/Images/Stress-Success.png?raw=true");
|
|
background-size: 100% 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-panic-effect {
|
|
font-size: 11px;
|
|
color: lightgrey;
|
|
}
|
|
|
|
.sheet-rolltemplate-alien .sheet-rolltemplate-button a {
|
|
width: 100%;
|
|
background-color: transparent;
|
|
border: unset;
|
|
}
|
|
|
|
|
|
.sheet-rolltemplate-xeno .sheet-attack-desc {
|
|
font-size: 12px;
|
|
color: lightgrey;
|
|
}
|