mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
2152 lines
42 KiB
CSS
2152 lines
42 KiB
CSS
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro|Nunito|Source+Code+Pro&display=swap');
|
|
|
|
/* Chrome, Safari, Edge, Opera */
|
|
input::-webkit-outer-spin-button,
|
|
input::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
input:focus, textarea:focus, button:focus {
|
|
outline: none;
|
|
}
|
|
|
|
/* Firefox */
|
|
input[type=number] {
|
|
-moz-appearance: textfield;
|
|
}
|
|
|
|
.sheet-character,
|
|
.sheet-journal,
|
|
.sheet-lifepath,
|
|
.sheet-cyberware,
|
|
.sheet-netrunning,
|
|
.sheet-new-char,
|
|
.sheet-settings,
|
|
.sheet-mook {
|
|
display: none;
|
|
}
|
|
|
|
.sheet-tabstoggle[value="character"] ~ div.sheet-character,
|
|
.sheet-tabstoggle[value="lifepath"] ~ div.sheet-lifepath,
|
|
.sheet-tabstoggle[value="cyberware"] ~ div.sheet-cyberware,
|
|
.sheet-tabstoggle[value="netrunning"] ~ div.sheet-netrunning,
|
|
.sheet-tabstoggle[value="journal"] ~ div.sheet-journal,
|
|
.sheet-tabstoggle[value="settings"] ~ div.sheet-settings,
|
|
.sheet-tabstoggle[value="mook"] ~ div.sheet-mook,
|
|
.sheet-shownewcharacter[value="1"] ~ .sheet-profile div.sheet-new-char {
|
|
display: grid;
|
|
}
|
|
|
|
.sheet-nbiprogram,
|
|
.sheet-blackice,
|
|
.sheet-hardware {
|
|
display: none;
|
|
}
|
|
.sheet-nbiprogram button[type="roll"].sheet-txt-btn,
|
|
.sheet-blackice button[type="roll"].sheet-txt-btn {
|
|
background: none;
|
|
border: none;
|
|
margin-left: 0px;
|
|
padding: 0 !important;
|
|
font-size: 1.2rem;
|
|
color: #fae800;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.sheet-netruntoggle[value="nbi"] ~ div.sheet-nbiprogram,
|
|
.sheet-netruntoggle[value="blackice"] ~ div.sheet-blackice,
|
|
.sheet-netruntoggle[value="hardware"] ~ div.sheet-hardware {
|
|
display: block;
|
|
grid-area: 2 / 1 / 3 / 4;
|
|
position: relative;
|
|
}
|
|
|
|
*, *:before, *:after {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
select {
|
|
border: none;
|
|
background: none;
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
height: 2rem;
|
|
}
|
|
|
|
.sheet-main {
|
|
display: grid;
|
|
width: 1200px;
|
|
grid-template-rows: auto auto auto auto 80px;
|
|
grid-gap: 4px;
|
|
font-family: 'Source Sans Pro', sans-serif;
|
|
|
|
}
|
|
|
|
.sheet-character {
|
|
width: 1200px;
|
|
height: 1100px;
|
|
grid-gap: 4px;
|
|
grid-template-columns: 0.95fr 80px 1fr 1fr 1fr;
|
|
grid-template-rows: auto 300px;
|
|
grid-template-areas: "profile stats skillA skillB skillC "
|
|
"hp hp weaponarmor weaponarmor weaponarmor";
|
|
}
|
|
|
|
.sheet-lifepath {
|
|
width: 1200px;
|
|
height: 1100px;
|
|
grid-gap: 4px;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-template-rows: 1fr 2fr 2fr 2fr 2fr;
|
|
grid-template-areas: "progression inventory"
|
|
"lp inventory"
|
|
"lp inventory"
|
|
"lp personal"
|
|
"lp rolespecific";
|
|
}
|
|
|
|
.sheet-settings {
|
|
width: 1200px;
|
|
grid-gap: 4px;
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: auto auto;
|
|
}
|
|
|
|
.sheet-nav {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
}
|
|
.sheet-nav div {
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.sheet-main .sheet-nav div button {
|
|
background: #CD272C;
|
|
border: 1px solid white;
|
|
color: #fff;
|
|
font-size: 1.2rem;
|
|
margin: 0;
|
|
padding: 2px 8px;
|
|
height: 30px;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.sheet-main .sheet-nav div button {
|
|
background: #CD272C;
|
|
border: 1px solid white;
|
|
color: #fff;
|
|
font-size: 1.2rem;
|
|
margin: 0;
|
|
padding: 2px 8px;
|
|
height: 30px;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.sheet-main .sheet-nav div button.sheet-options {
|
|
background: #0f0f0f;
|
|
}
|
|
|
|
.sheet-nav div button:hover {
|
|
background: none;
|
|
border: 1px solid #CD272C;
|
|
color: #CD272C;
|
|
}
|
|
|
|
.sheet-main .sheet-nav div button.sheet-options:hover {
|
|
color: #0f0f0f;
|
|
background: none;
|
|
border: 1px solid #0f0f0f;
|
|
}
|
|
|
|
.sheet-nav div button:active {
|
|
box-shadow: none;
|
|
}
|
|
|
|
.sheet-main .sheet-nav button[type=roll]:before {
|
|
content: "";
|
|
}
|
|
|
|
.sheet-new-char {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
.sheet-new-char div {
|
|
border: solid 1px white;
|
|
text-align: center;
|
|
display:flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-small {
|
|
font-size: 1.3rem;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-big {
|
|
font-size: 4rem;
|
|
font-weight: bold;
|
|
}
|
|
|
|
/*----------------- MOOK SHEET ------------------*/
|
|
|
|
.sheet-mook {
|
|
width: 800px;
|
|
height: auto;
|
|
grid-gap: 4px;
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: 2fr 1fr auto auto auto auto;
|
|
grid-template-areas: "mookbasics"
|
|
"mookhealth"
|
|
"mookweapons"
|
|
"mookskillstitlesection"
|
|
"mookskills"
|
|
"mookinventory";
|
|
}
|
|
|
|
.sheet-mook .sheet-bg-black-2,
|
|
.sheet-mook .sheet-bg-yellow {
|
|
font-size: 1.2rem;
|
|
height: 23px;
|
|
}
|
|
|
|
.sheet-mookbasics {
|
|
grid-area: mookbasics;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
|
|
grid-template-rows: 1fr 1fr;
|
|
grid-gap: 8px;
|
|
}
|
|
|
|
.sheet-mookbasics .sheet-mookstat {
|
|
background:white;
|
|
overflow: hidden;
|
|
clip-path:
|
|
polygon(
|
|
0% 2rem, /* top left */
|
|
2rem 0%, /* top left */
|
|
100% 0%, /* top right */
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-mookbasics .sheet-mookstat .sheet-h2 {
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.sheet-mookbasics .sheet-mookstat input {
|
|
border: none;
|
|
text-align: center;
|
|
padding: 0;
|
|
margin: 0;
|
|
font-size: 2.2rem;
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
|
|
.sheet-mookhealth {
|
|
grid-area: mookhealth;
|
|
display: grid;
|
|
grid-template-columns: 2fr 2fr 1fr;
|
|
grid-template-rows: 1fr;
|
|
grid-gap: 8px;
|
|
}
|
|
|
|
.sheet-mookhealth .sheet-mookstat {
|
|
background:white;
|
|
overflow: hidden;
|
|
clip-path:
|
|
polygon(
|
|
0% 2rem, /* top left */
|
|
2rem 0%, /* top left */
|
|
100% 0%, /* top right */
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-mookhealth .sheet-mookstat .sheet-h2 {
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.sheet-mookhealth .sheet-mookstat input {
|
|
border: none;
|
|
text-align: center;
|
|
padding: 0;
|
|
margin: 0;
|
|
font-size: 2.2rem;
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
|
|
.sheet-mookweapons {
|
|
grid-area: mookweapons;
|
|
display: grid;
|
|
grid-template-columns: 3fr 1fr;
|
|
grid-template-rows: 1fr 0.8fr auto;
|
|
grid-gap: 4px;
|
|
grid-template-areas: "weapontitle armortitle"
|
|
"weaponheader armorheader"
|
|
"weapondetails armor";
|
|
}
|
|
|
|
.sheet-mookweapons .sheet-mookweapontitle {
|
|
grid-area: weapontitle;
|
|
background:white;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-mookweapons .sheet-mookweaponheader {
|
|
grid-area: weaponheader;
|
|
}
|
|
|
|
.sheet-mookweapons .sheet-weapondetails {
|
|
grid-area: weapondetails;
|
|
display: grid;
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: auto;
|
|
grid-gap: 4px;
|
|
}
|
|
|
|
.sheet-mookweapons .sheet-weapondetails .sheet-bg-white {
|
|
background: white;
|
|
color: #0f0f0f;
|
|
font-weight: bold;
|
|
margin-bottom: 4px;
|
|
padding: 2px 4px;
|
|
}
|
|
|
|
.sheet-mookweapons .sheet-h2 {
|
|
font-size: 2rem;
|
|
font-weight: bold;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.sheet-mookweapons .sheet-mookarmortitle {
|
|
grid-area: armortitle;
|
|
background:white;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-mookarmortitle {
|
|
width: 260px;
|
|
}
|
|
|
|
.sheet-mookweapons .sheet-mookarmorheader {
|
|
grid-area: armorheader;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-mookweaponheader .sheet-bg-black-2,
|
|
.sheet-mookarmorheader .sheet-bg-black-2 {
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-mookskills {
|
|
grid-area: mookskills;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
grid-template-rows: auto 1fr;
|
|
grid-gap: 4px;
|
|
background-color: #fff;
|
|
padding-bottom: 0px;
|
|
margin-bottom: -4px;
|
|
}
|
|
|
|
.sheet-mookskills .sheet-mookskillscolumn {
|
|
background: #CD272C;
|
|
padding: 4px 4px 0px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.sheet-mookskillstitlesection .sheet-mookskillstitle {
|
|
background:white;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
grid-area: 1 / span 4;
|
|
}
|
|
|
|
.sheet-mookskills .sheet-flex-table .sheet-skill-name{
|
|
width: 60%;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.sheet-mookskills .sheet-flex-table .sheet-skill-subcategory{
|
|
width: 100%;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.sheet-mookskills-base{
|
|
width: 10%;
|
|
}
|
|
|
|
.sheet-mookskills-mod{
|
|
width: 12%;
|
|
}
|
|
|
|
.sheet-mookskills-total{
|
|
width: 14%;
|
|
}
|
|
|
|
.sheet-mookinventory {
|
|
grid-area: mookinventory;
|
|
display: grid;
|
|
grid-template-rows: 1fr;
|
|
grid-gap: 8px;
|
|
}
|
|
|
|
.sheet-mookinventory .sheet-h2 {
|
|
background:white;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
/*----------------- JOURNAL SHEET ------------------*/
|
|
|
|
.sheet-journal {
|
|
width: 800px;
|
|
height: auto;
|
|
padding: 4px;
|
|
background: #CD272C;
|
|
grid-gap: 4px;
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: 1fr auto;
|
|
grid-template-areas: "journaltitle"
|
|
"journaltext";
|
|
}
|
|
|
|
.sheet-journaltitle {
|
|
grid-area: journaltitle;
|
|
}
|
|
|
|
.sheet-journaltext {
|
|
grid-area: journaltext;
|
|
width: 800px;
|
|
}
|
|
|
|
.sheet-journaltext textarea {
|
|
max-width: 790px;
|
|
}
|
|
|
|
.sheet-journal h2 {
|
|
color: white;
|
|
font-size: 2.2rem;
|
|
padding: 0px 4px;
|
|
}
|
|
|
|
/*----------------- NETRUNNING SHEET ------------------*/
|
|
|
|
.sheet-netrunning {
|
|
width: 1000px;
|
|
grid-gap: 4px;
|
|
grid-template-columns: 1fr 1fr 1.4fr 0.6fr;
|
|
grid-template-rows: auto auto auto auto;
|
|
font-family: 'Source Code Pro', monospace;
|
|
}
|
|
|
|
.sheet-largeinput input {
|
|
font-size: 2.7rem;
|
|
}
|
|
|
|
.sheet-biginput input {
|
|
font-size: 1.8rem;
|
|
}
|
|
|
|
.sheet-netrunning textarea {
|
|
width: 100%;
|
|
border: none;
|
|
|
|
resize: none;
|
|
background: none;
|
|
color: #fff;
|
|
}
|
|
|
|
.sheet-netrunning input {
|
|
background: none;
|
|
border: none;
|
|
color: #fff;
|
|
}
|
|
|
|
.sheet-netrunning h1 , .sheet-netrunning h3 , .sheet-netrunning h6 {
|
|
color: #fff;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface {
|
|
display: grid;
|
|
grid-column: 1 / 3;
|
|
grid-template-columns: repeat(6, 1fr);
|
|
grid-template-rows: auto auto;
|
|
grid-gap: 4px;
|
|
color: #fff;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface div {
|
|
background: #CD272C;
|
|
padding: 4px;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface button {
|
|
background: none;
|
|
border: none;
|
|
color: #fff;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-title {
|
|
grid-column: 1 / 6;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-rank {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface input {
|
|
text-align: center;
|
|
font-size: 2rem;
|
|
width: 2.5rem;
|
|
padding: 0;
|
|
margin: 0;
|
|
font-family: 'Source Code Pro', monospace;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-general input,
|
|
.sheet-netrunning .sheet-interface .sheet-hardslots input,
|
|
.sheet-netrunning .sheet-interface .sheet-program input {
|
|
text-align: center;
|
|
padding-bottom: 5px;
|
|
width: 6.5rem;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-netactions {
|
|
grid-column: 1 / 6;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-speed {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-general {
|
|
grid-column: 1 / 3;
|
|
text-align: center;
|
|
font-size: 2rem;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-hardslots{
|
|
grid-column: 3 / 5;
|
|
text-align: center;
|
|
font-size: 2rem;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-program {
|
|
grid-column: 5 / 7;
|
|
text-align: center;
|
|
font-size: 2rem;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-netnav {
|
|
grid-column: 1 / 7;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: #fff;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-interface .sheet-netnav div {
|
|
background: #fff;
|
|
}
|
|
|
|
|
|
.sheet-netrunning .sheet-abilities {
|
|
display: grid;
|
|
grid-column: 3 / 3;
|
|
/* grid-template-columns: repeat(6, 1fr); */
|
|
grid-template-rows: auto auto;
|
|
grid-gap: 4px;
|
|
color: #fff;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-abilities input {
|
|
color: #000;
|
|
}
|
|
|
|
.sheet-netrunning select {
|
|
background: #0f0f0f;
|
|
color: #fae800;
|
|
}
|
|
|
|
.sheet-bg-yellow {
|
|
background: #fae800;
|
|
color: #0f0f0f;
|
|
font-weight: bold;
|
|
margin-bottom: 4px;
|
|
padding: 2px 4px;
|
|
}
|
|
|
|
.sheet-bg-black {
|
|
background: #0f0f0f;
|
|
color: #fae800;
|
|
font-weight: bold;
|
|
margin-bottom: 4px;
|
|
padding: 4px;
|
|
}
|
|
|
|
.sheet-bg-black-2 {
|
|
background: #0f0f0f;
|
|
color: white;
|
|
font-weight: bold;
|
|
margin-bottom: 4px;
|
|
padding: 2px 4px;
|
|
}
|
|
|
|
.sheet-bg-red {
|
|
background: #CD272C;
|
|
color: white;
|
|
font-weight: bold;
|
|
margin-bottom: 4px;
|
|
padding: 4px;
|
|
}
|
|
|
|
.sheet-bg-white {
|
|
background: white;
|
|
color: #0f0f0f;
|
|
font-weight: bold;
|
|
margin-bottom: 4px;
|
|
padding: 2px 4px;
|
|
}
|
|
|
|
.sheet-bg-black-item {
|
|
background: #0f0f0f;
|
|
color: white;
|
|
margin-bottom: 4px;
|
|
padding: 4px;
|
|
}
|
|
|
|
.sheet-max-width{
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-anti-program-name{
|
|
width: 18%;
|
|
}
|
|
|
|
.sheet-anti-program-class{
|
|
width: 26%;
|
|
|
|
}
|
|
|
|
.sheet-anti-program-atk,
|
|
.sheet-anti-program-def,
|
|
.sheet-anti-program-rez,
|
|
.sheet-delete {
|
|
width: 4%;
|
|
}
|
|
|
|
.sheet-anti-program-run {
|
|
width: 6%;
|
|
}
|
|
|
|
.sheet-anti-program-effect{
|
|
width: 36%;
|
|
}
|
|
|
|
.sheet-program-name{
|
|
width: 18%;
|
|
}
|
|
|
|
.sheet-program-class{
|
|
width: 26%;
|
|
|
|
}
|
|
|
|
.sheet-program-atk,
|
|
.sheet-program-def,
|
|
.sheet-program-rez,
|
|
.sheet-delete {
|
|
width: 4%;
|
|
}
|
|
|
|
.sheet-program-effect{
|
|
width: 42%;
|
|
}
|
|
|
|
.sheet-bi-name{
|
|
width: 15%;
|
|
|
|
}
|
|
|
|
.sheet-bi-class{
|
|
width: 17%;
|
|
|
|
}
|
|
|
|
.sheet-bi-per,
|
|
.sheet-bi-spd,
|
|
.sheet-bi-atk,
|
|
.sheet-bi-def,
|
|
.sheet-bi-rez {
|
|
width: 4%;
|
|
|
|
}
|
|
|
|
.sheet-bi-run{
|
|
width: 6%
|
|
}
|
|
|
|
.sheet-bi-effect{
|
|
width: 39%;
|
|
|
|
}
|
|
|
|
.sheet-hardware-name{
|
|
width: 20%;
|
|
|
|
}
|
|
|
|
.sheet-hardware-data{
|
|
width: 79.5%;
|
|
|
|
}
|
|
|
|
/** flex table for skills **/
|
|
|
|
.sheet-skills .sheet-flex-table{
|
|
font-size: 1.2rem;
|
|
}
|
|
|
|
.sheet-skills .sheet-flex-table div{
|
|
height: 24px;
|
|
}
|
|
|
|
.sheet-skills .sheet-flex-table .sheet-skill-name{
|
|
width: 60%;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.sheet-skills .sheet-flex-table .sheet-skill-subcategory{
|
|
width: 100%;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.sheet-skill-base{
|
|
width: 10%;
|
|
}
|
|
|
|
.sheet-skill-mod{
|
|
width: 12%;
|
|
}
|
|
|
|
.sheet-skill-total{
|
|
width: 14%;
|
|
}
|
|
|
|
/** flex table for armor **/
|
|
|
|
.sheet-armor-piece {
|
|
width: 60%;
|
|
}
|
|
|
|
.sheet-armor-sp {
|
|
width: 20%;
|
|
}
|
|
|
|
|
|
.sheet-armor-penalty {
|
|
width: 18%;
|
|
}
|
|
|
|
.sheet-armor .sheet-bg-white {
|
|
height: 24px;
|
|
}
|
|
|
|
/* Customizing the repeating section for netrunning */
|
|
|
|
.sheet-netrunning .repcontrol_del {
|
|
position: relative;
|
|
left: 4%;
|
|
|
|
}
|
|
|
|
.sheet-netrunning .repcontrol_add,
|
|
.sheet-netrunning .repcontrol_edit {
|
|
display: block;
|
|
background: #fae800;
|
|
color: #0f0f0f;
|
|
border: 1px solid #0f0f0f;
|
|
box-shadow:none;
|
|
text-shadow: none;
|
|
}
|
|
|
|
[data-groupname=repeating_nbi] > button.btn.repcontrol_add::after {
|
|
content: "Install";
|
|
background-color:#fae800;
|
|
margin-left:-30px;
|
|
}
|
|
|
|
[data-groupname=repeating_anti] > button.btn.repcontrol_add::after {
|
|
content: "Install";
|
|
background-color:#fae800;
|
|
margin-left:-30px;
|
|
}
|
|
|
|
|
|
|
|
/*----------------- CYBERWARE SHEET ------------------*/
|
|
|
|
.sheet-cyberware{
|
|
width: 1200px;
|
|
height: auto;
|
|
grid-template-rows: auto auto;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram{
|
|
position: relative;
|
|
width: 1200px;
|
|
height: 1050px;
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
background-image: url(https://raw.githubusercontent.com/ray-cw/roll20-CPR-charactersheet/main/cyberware-diagram-3.jpg);
|
|
}
|
|
|
|
.sheet-cyberware .sheet-cyberware-gear{
|
|
grid-gap: 30px;
|
|
width: 100%;
|
|
display: grid;
|
|
grid-template-columns: auto auto;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-cyberware-gear .sheet-cwtable{
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-cyberware-gear .sheet-cyberware-item{
|
|
grid-column: 1 / 2;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram .sheet-cyberaudio{
|
|
position: absolute;
|
|
left: 350px;
|
|
top: 47px;
|
|
width: 498px;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-cwtable {
|
|
display: grid;
|
|
grid-template-columns: 6fr auto 9fr;
|
|
grid-gap: 4px;
|
|
background: #CD272C;
|
|
padding: 4px;
|
|
}
|
|
|
|
/* Configure a container for the toggle */
|
|
.sheet-cyberware .sheet-cwtable .sheet-cyberware-checkbox,
|
|
.sheet-settings .sheet-my-settings .sheet-settings-checkbox {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 0;
|
|
}
|
|
|
|
/* Configure the button styling. This example makes it look like a checkbox. */
|
|
button.sheet-toggle, button.sheet-mooktoggle, button.sheet-settings-toggle {
|
|
padding: 0;
|
|
border: none;
|
|
background: none;
|
|
cursor: pointer;
|
|
|
|
width: 24px;
|
|
height: 24px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
|
|
font-size: 24px;
|
|
color: #CD272C;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-settings .sheet-settings-checkbox button.sheet-mooktoggle,
|
|
.sheet-settings .sheet-settings-checkbox button.sheet-settings-toggle {
|
|
border: 1px solid #0f0f0f;
|
|
}
|
|
|
|
input.sheet-mooktoggle:not([value="1"]) ~ button.sheet-mooktoggle > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
|
|
input.sheet-mooktoggle:not([value="0"]) ~ div.sheet-character-mode,
|
|
input.sheet-mooktoggle:not([value="1"]) ~ div.sheet-mook-mode {
|
|
display: none;
|
|
}
|
|
|
|
input.sheet-settings-toggle-show-initiative-modifier:not([value="1"]) ~ div.sheet-initiative-modifier {
|
|
display: none;
|
|
}
|
|
|
|
input.sheet-settings-toggle-show-aimed-shot-button:not([value="1"]) ~ button[name="roll_aimed_shot"] {
|
|
display: none;
|
|
}
|
|
|
|
input.sheet-settings-toggle:not([value="1"]) ~ button.sheet-settings-toggle > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
.sheet-profile .sheet-initiative-modifier div {
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
/* Hide the "checked" section of the toggle if the attribute value is not "1". */
|
|
input.sheet-toggle:not([value="1"]) ~ button.sheet-toggle > span.sheet-checked {
|
|
display: none;
|
|
}
|
|
|
|
|
|
.sheet-cyberware .sheet-cwtable div {
|
|
padding: 4px;
|
|
background: white;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-cwtable input[type=text] {
|
|
padding: 0;
|
|
border: 0;
|
|
width:100%;
|
|
}
|
|
|
|
|
|
|
|
.sheet-cyberware .sheet-cwtable div.sheet-cyberware-header {
|
|
color: #fff;
|
|
background: #0f0f0f;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-cyberware-item {
|
|
grid-column: 1 / span 2;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram .sheet-righteye{
|
|
position: absolute;
|
|
left: 0px;
|
|
top: 224px;
|
|
width: 396px;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram .sheet-lefteye{
|
|
position: absolute;
|
|
left: 802px;
|
|
top: 224px;
|
|
width: 396px;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram .sheet-rightarm{
|
|
position: absolute;
|
|
left: 43px;
|
|
top: 414px;
|
|
width: 398px;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram .sheet-leftarm{
|
|
position: absolute;
|
|
left: 762px;
|
|
top: 414px;
|
|
width: 398px;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram .sheet-neurallink{
|
|
position: absolute;
|
|
left: 357px;
|
|
top: 657px;
|
|
width: 478px;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram .sheet-rightleg{
|
|
position: absolute;
|
|
left: 63px;
|
|
top: 879px;
|
|
width: 399px;
|
|
}
|
|
|
|
.sheet-cyberware .sheet-diagram .sheet-leftleg{
|
|
position: absolute;
|
|
left: 755px;
|
|
top: 879px;
|
|
width: 399px;
|
|
}
|
|
|
|
/*----------------- LIFEPATH SHEET ------------------*/
|
|
|
|
.sheet-progression {
|
|
grid-area: progression;
|
|
display: grid;
|
|
grid-template-columns: 2fr 3fr;
|
|
grid-template-rows: 1fr 1fr 1fr;
|
|
grid-gap: 4px;
|
|
}
|
|
|
|
.sheet-progression div
|
|
, .sheet-lp div
|
|
, .sheet-personal div
|
|
, .sheet-rolespecific div{
|
|
display: flex;
|
|
background: white;
|
|
padding: 4px;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.sheet-progression .sheet-alias {
|
|
grid-area: 1 / 1 / 2 / 3 ;
|
|
}
|
|
|
|
.sheet-progression .sheet-improvement {
|
|
grid-area: 2 / 1 / 3 / 2 ;
|
|
}
|
|
|
|
.sheet-progression .sheet-reputation {
|
|
grid-area: 3 / 1 / 4 / 2 ;
|
|
}
|
|
|
|
.sheet-progression .sheet-repevents {
|
|
grid-area: 2 / 2 / 4 / 3 ;
|
|
}
|
|
|
|
.sheet-progression .sheet-notes {
|
|
grid-area: 2 / 2 / 4 / 3 ;
|
|
}
|
|
|
|
.sheet-inventory {
|
|
grid-area: inventory;
|
|
display: block;
|
|
overflow: auto;
|
|
}
|
|
|
|
.sheet-gear-name{
|
|
width: 35%;
|
|
}
|
|
|
|
.sheet-gear-notes{
|
|
width: 64%;
|
|
}
|
|
.sheet-gear-name input, .sheet-gear-notes input {
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-rolespecific {
|
|
grid-area: rolespecific;
|
|
padding: 4px;
|
|
}
|
|
|
|
.sheet-rolespecific .sheet-rolespecificdetails {
|
|
background: white;
|
|
padding: 4px;
|
|
height: 100%;
|
|
}
|
|
|
|
.sheet-personal {
|
|
grid-area: personal;
|
|
display: grid;
|
|
grid-template-columns: 4fr 2fr 3fr;
|
|
grid-template-rows: 2fr 1fr;
|
|
grid-gap: 4px;
|
|
}
|
|
|
|
.sheet-personal .sheet-fashion {
|
|
grid-area: 1 / 1 / 2 / 4;
|
|
}
|
|
|
|
.sheet-personal .sheet-housing {
|
|
grid-area: 2 / 1 / 3 / 2;
|
|
}
|
|
|
|
.sheet-personal .sheet-rent {
|
|
grid-area: 2 / 2 / 3 / 3;
|
|
}
|
|
|
|
.sheet-personal .sheet-lifestyle {
|
|
grid-area: 2 / 3 / 3 / 4;
|
|
}
|
|
|
|
.sheet-lp {
|
|
grid-area: lp;
|
|
display: grid;
|
|
grid-template-rows: auto auto auto auto auto auto 1fr 2fr ;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-gap:4px;
|
|
}
|
|
|
|
|
|
.sheet-lp .sheet-enemies{
|
|
grid-column: 1 / 3;
|
|
display: grid;
|
|
grid-template-columns:auto auto auto auto;
|
|
grid-template-rows:auto auto 1fr 1fr 1fr;
|
|
grid-gap: 4px;
|
|
}
|
|
|
|
.sheet-lp .sheet-enemies div{
|
|
background: #CD272C;
|
|
}
|
|
|
|
.sheet-lp .sheet-enemies .sheet-title{
|
|
grid-column: 1 / 5;
|
|
}
|
|
|
|
.sheet-lp .sheet-enemies h3, .sheet-lp .sheet-enemies h4{
|
|
text-align: center;
|
|
color: white;
|
|
}
|
|
|
|
.sheet-lp .sheet-enemies .sheet-item{
|
|
border: solid 1px #CD272C;
|
|
background: none;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
|
|
|
|
.sheet-lifepath input,
|
|
.sheet-lifepath textarea,
|
|
.sheet-profile input,
|
|
.sheet-profile textarea {
|
|
width: 100%;
|
|
border: none;
|
|
height: 100%;
|
|
resize: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.sheet-mookinventory textarea {
|
|
width: 100%;
|
|
border: none;
|
|
height: 200px;
|
|
margin: 0px;
|
|
margin-top: -4px;
|
|
padding: 0;
|
|
}
|
|
|
|
|
|
|
|
/*----------------- GENERAL CSS ------------------*/
|
|
|
|
.sheet-section {
|
|
padding: 4px;
|
|
background-color: #CD272C;
|
|
}
|
|
|
|
.sheet-statbox {
|
|
background:white;
|
|
overflow: hidden;
|
|
clip-path:
|
|
polygon(
|
|
0% 2rem, /* top left */
|
|
2rem 0%, /* top left */
|
|
100% 0%, /* top right */
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-stats .sheet-statbox .sheet-h2 {
|
|
font-size: 2rem;
|
|
font-weight: bold;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.sheet-statbox div {
|
|
text-align: right;
|
|
padding: 4px;
|
|
}
|
|
|
|
.sheet-h2 {
|
|
font-size: 2rem;
|
|
font-weight: bold;
|
|
padding-right: 31px;
|
|
}
|
|
|
|
.sheet-statbox div.sheet-outof {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
|
|
|
|
.sheet-statbox div.sheet-outof div {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
|
|
.sheet-flex-table .sheet-basic button {
|
|
font-weight: 700;
|
|
}
|
|
|
|
.sheet-main .sheet-stats .sheet-statbox input {
|
|
border: none;
|
|
text-align:right;
|
|
padding: 0;
|
|
margin: 0;
|
|
font-size: 2.2rem;
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
|
|
.sheet-main .sheet-stats .sheet-statbox .sheet-outof input {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-skills input[type=number]:disabled {
|
|
background: none;
|
|
}
|
|
|
|
.sheet-hp textarea{
|
|
width:96%;
|
|
height:90px;
|
|
resize: none;
|
|
border: none;
|
|
}
|
|
|
|
|
|
/*------------- Section-specific CSS -------------*/
|
|
|
|
.sheet-profile {
|
|
grid-area: profile;
|
|
display: grid;
|
|
grid-gap: 4px;
|
|
}
|
|
|
|
.sheet-shownewcharacter[value="0"] ~ .sheet-profile {
|
|
/* grid-template-rows: 0.75fr 0.5fr 0.75fr 2.5fr 1.75fr 0.75fr 0.75fr; */
|
|
grid-template-rows: 0.45fr 0.35fr 0.35fr 2.5fr 0.5fr 0.5fr;
|
|
}
|
|
|
|
.sheet-shownewcharacter[value="1"] ~ .sheet-profile {
|
|
/* grid-template-rows: 0.5fr 0.6fr 0.5fr 0.5fr 2.5fr 1.6fr 0.5fr 0.5fr; */
|
|
grid-template-rows: 0.5fr 0.35fr 0.3fr 0.3fr 2.5fr 0.45fr 0.45fr;
|
|
}
|
|
|
|
|
|
.sheet-profile div.sheet-prof-info {
|
|
background:white;
|
|
overflow: hidden;
|
|
display: flex;
|
|
background: white;
|
|
padding: 4px;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.sheet-profile .sheet-flex-table .sheet-skill-name{
|
|
width: 85%;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.sheet-skill-rank{
|
|
width: 13%;
|
|
}
|
|
|
|
|
|
.sheet-profile .sheet-hp-humanity{
|
|
display: grid;
|
|
grid-template-columns: 1.4fr 1fr 1fr;
|
|
}
|
|
|
|
.sheet-profile .sheet-hp-humanity input{
|
|
font-size: 4rem;
|
|
background: none;
|
|
text-align: center;
|
|
width: 6rem;
|
|
height: 5rem;
|
|
}
|
|
|
|
.sheet-profile .sheet-hp-humanity div{
|
|
padding: 4px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
text-align: center;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-profile .sheet-hp-humanity div:first-child{
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.sheet-profile .sheet-role-ability-panel {
|
|
height: 501px;
|
|
}
|
|
|
|
.sheet-red-bg, .sheet-red-bg input, .sheet-red-bg h3 {
|
|
background: none;
|
|
color:#fff;
|
|
}
|
|
|
|
.sheet-white-bg, .sheet-white-bg input {
|
|
background: #fff;
|
|
}
|
|
|
|
|
|
.sheet-stats {
|
|
grid-area: stats;
|
|
display: grid;
|
|
grid-gap: 8px;
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: repeat(10, 1fr);
|
|
}
|
|
|
|
.sheet-skillA {
|
|
grid-area: skillA;
|
|
}
|
|
|
|
.sheet-skillB {
|
|
grid-area: skillB;
|
|
}
|
|
|
|
.sheet-skillC {
|
|
grid-area: skillC;
|
|
}
|
|
|
|
.sheet-hp {
|
|
grid-area: hp;
|
|
display: grid;
|
|
grid-template-rows: 1fr 2fr;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-gap: 4px;
|
|
grid-template-areas:"deathsave deathsave"
|
|
"injuries addictions";
|
|
}
|
|
|
|
.sheet-hp .sheet-health{
|
|
grid-area: health;
|
|
padding: 10px;
|
|
clip-path:
|
|
polygon(
|
|
0% 2rem, /* top left */
|
|
2rem 0%, /* top left */
|
|
100% 0%, /* top right */
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
text-align: right;
|
|
}
|
|
|
|
.sheet-hp .sheet-injuries{
|
|
grid-area: injuries;
|
|
padding: 10px;
|
|
}
|
|
|
|
.sheet-hp .sheet-addictions{
|
|
grid-area: addictions;
|
|
padding: 10px;
|
|
}
|
|
|
|
.sheet-hp .sheet-deathsave{
|
|
grid-area: deathsave;
|
|
background: none;
|
|
color:#fff;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
font-size:1.4rem;
|
|
grid-gap: 4px;
|
|
}
|
|
|
|
.sheet-hp .sheet-deathsave div{
|
|
background: #2a2a2a;
|
|
color:#fff;
|
|
display: flex;
|
|
flex-direction: column;
|
|
text-align: center;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-clipleft {
|
|
clip-path:
|
|
polygon(
|
|
0% 30px, /* top left */
|
|
30px 0%, /* top left */
|
|
100% 0%,
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
}
|
|
|
|
.sheet-clipright {
|
|
clip-path:
|
|
polygon(
|
|
0% 0%, /* top left */
|
|
calc(100% - 30px) 0%,
|
|
100% 30px,
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
}
|
|
|
|
.sheet-deathsave div.sheet-darker {
|
|
background: #0f0f0f;
|
|
}
|
|
|
|
.sheet-hp .sheet-deathsave input{
|
|
font-size: 4.6rem;
|
|
background: none;
|
|
color:#fff;
|
|
text-align: center;
|
|
width: 8rem;
|
|
border: none;
|
|
}
|
|
|
|
.sheet-hp .sheet-health,
|
|
.sheet-hp .sheet-injuries,
|
|
.sheet-hp .sheet-addictions {
|
|
background: white;
|
|
}
|
|
|
|
|
|
|
|
.sheet-weaponarmor {
|
|
grid-area: weaponarmor;
|
|
display: grid;
|
|
grid-gap: 4px;
|
|
grid-template-columns: 2fr 3fr;
|
|
grid-template-rows: auto auto;
|
|
}
|
|
|
|
.sheet-weaponarmor .sheet-armor{
|
|
grid-area: 2 / 1 / 3 / 2;
|
|
}
|
|
|
|
.sheet-weaponarmor .sheet-title{
|
|
grid-area: 1 / 1 / 2 / 2;
|
|
text-align: center;
|
|
font-size: 3rem;
|
|
color:#fff;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-weaponarmor .sheet-weapon{
|
|
grid-area: 1 / 2 / 4 / 3;
|
|
}
|
|
|
|
.sheet-weapon-name{
|
|
width: 35%;
|
|
}
|
|
|
|
.sheet-weapon-type{
|
|
width: 23%;
|
|
}
|
|
|
|
.sheet-dmg{
|
|
width: 12%;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-ammo{
|
|
width: 12%;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-rof{
|
|
width: 6%;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-bonus{
|
|
width: 8%;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-weapondetails .repcontrol {
|
|
margin-top: -4px;
|
|
}
|
|
|
|
.sheet-weapon .repcontrol_add,
|
|
.sheet-weapon .repcontrol_edit,
|
|
.sheet-weapon .repcontrol_del,
|
|
.sheet-weapondetails .repcontrol_add,
|
|
.sheet-weapondetails .repcontrol_edit,
|
|
.sheet-weapondetails .repcontrol_del {
|
|
display: block;
|
|
background: #CD272C;
|
|
color: #fff;
|
|
border: 1px solid #fff;
|
|
font-weight: bold;
|
|
box-shadow: none;
|
|
text-shadow: none;
|
|
padding: 2px 8px 2px;
|
|
}
|
|
|
|
.sheet-weapon .repcontrol_add:hover,
|
|
.sheet-weapon .repcontrol_edit:hover,
|
|
.sheet-weapon .repcontrol_del:hover,
|
|
.sheet-weapondetails .repcontrol_add:hover,
|
|
.sheet-weapondetails .repcontrol_edit:hover,
|
|
.sheet-weapondetails .repcontrol_del:hover {
|
|
background: #fff;
|
|
color: #CD272C;
|
|
}
|
|
|
|
/*----------------- BUTTONS ------------------*/
|
|
|
|
button[type="roll"].sheet-txt-btn:before{
|
|
content: ' ';
|
|
}
|
|
|
|
button[type="roll"].sheet-txt-btn{
|
|
background: none;
|
|
border: none;
|
|
margin-left: 0px;
|
|
padding: 0 !important;
|
|
font-size: 1.2rem;
|
|
color: #000;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
button[type="roll"].sheet-aimed-shot-icon{
|
|
font-weight: bold;
|
|
color: #CD272C;
|
|
font-size: 1.5rem;
|
|
margin-top: -3px;
|
|
}
|
|
|
|
.sheet-small button[type="roll"].sheet-txt-btn{
|
|
font-size: 1.3rem;
|
|
color: #fff;
|
|
font-weight:bold;
|
|
}
|
|
|
|
button[type="roll"].sheet-txt-btn:hover{
|
|
background: none;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
button[type="roll"].sheet-txt-btn:active{
|
|
background: none;
|
|
border: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
td.sheet-subskill-header:first-child{
|
|
font-weight: bold;
|
|
}
|
|
|
|
td.sheet-subskill-header {
|
|
background: #fae800;
|
|
}
|
|
|
|
|
|
/*----------------- ROLL TEMPLATES ------------------*/
|
|
|
|
.sheet-rolltemplate-interface, .sheet-rolltemplate-roleability, .sheet-rolltemplate-skill, .sheet-rolltemplate-damage, .sheet-rolltemplate-attack, .sheet-rolltemplate-deathsave, .sheet-rolltemplate-initiative {
|
|
font-family: 'Nunito', sans-serif;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface div.sheet-template-container {
|
|
border: none !important;
|
|
color: #fae800;
|
|
position: relative;
|
|
clip-path:
|
|
polygon(
|
|
0% 30px, /* top left */
|
|
30px 0%, /* top left */
|
|
calc(100% - 30px) 0%, /* top right */
|
|
100% 30px, /* top right */
|
|
100% calc(100% - 30px), /* bottom right */
|
|
calc(100% - 30px) 100%, /* bottom right */
|
|
30px 100%, /* bottom left */
|
|
0% calc(100% - 30px) /* bottom left */
|
|
);
|
|
width: 220px;
|
|
margin: 0 auto 4px auto;
|
|
padding: 0;
|
|
}
|
|
|
|
.sheet-rolltemplate-roleability div.sheet-template-container,
|
|
.sheet-rolltemplate-skill div.sheet-template-container,
|
|
.sheet-rolltemplate-attack div.sheet-template-container {
|
|
border: none !important;
|
|
color: #fff;
|
|
position: relative;
|
|
clip-path:
|
|
polygon(
|
|
0% 30px, /* top left */
|
|
30px 0%, /* top left */
|
|
calc(100% - 30px) 0%, /* top right */
|
|
100% 30px, /* top right */
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
width: 220px;
|
|
margin: 0 auto 4px auto;
|
|
padding: 0;
|
|
}
|
|
|
|
.sheet-rolltemplate-deathsave div.sheet-template-container {
|
|
border: none !important;
|
|
background: #0f0f0f;
|
|
color: #fff !important;
|
|
position: relative;
|
|
clip-path:
|
|
polygon(
|
|
0% 30px, /* top left */
|
|
30px 0%, /* top left */
|
|
calc(100% - 30px) 0%, /* top right */
|
|
100% 30px, /* top right */
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
width: 200px;
|
|
margin: 0 auto 4px auto;
|
|
padding: 10px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-initiative div.sheet-template-container {
|
|
border: none !important;
|
|
background: #fff;
|
|
color: #CD272C !important;
|
|
position: relative;
|
|
clip-path:
|
|
polygon(
|
|
0% 30px, /* top left */
|
|
30px 0%, /* top left */
|
|
calc(100% - 30px) 0%, /* top right */
|
|
100% 30px, /* top right */
|
|
100% 100%, /* bottom right */
|
|
0% 100% /* bottom left */
|
|
);
|
|
width: 200px;
|
|
margin: 0 auto 4px auto;
|
|
padding: 10px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface div.sheet-template-container .sheet-template-header,
|
|
.sheet-rolltemplate-roleability div.sheet-template-container .sheet-template-header,
|
|
.sheet-rolltemplate-initiative div.sheet-template-container .sheet-template-header,
|
|
.sheet-rolltemplate-deathsave div.sheet-template-container .sheet-template-header {
|
|
font-size: 4rem;
|
|
height: 5rem;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-deathsave p {
|
|
font-size: 1.5rem;
|
|
font-weight: normal;
|
|
font-family: Nunito, sans-serif;;
|
|
}
|
|
|
|
.sheet-rolltemplate-deathsave div.sheet-template-container .sheet-template-row {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-damage div.sheet-template-container {
|
|
border: none !important;
|
|
background: #0f0f0f;
|
|
color: #fff;
|
|
position: relative;
|
|
clip-path:
|
|
polygon(
|
|
0% 0%, /* top left */
|
|
100% 0%, /* top right */
|
|
100% calc(100% - 30px), /* bottom right */
|
|
calc(100% - 30px) 100%, /* bottom right */
|
|
30px 100%, /* bottom left */
|
|
0% calc(100% - 30px) /* bottom left */
|
|
);
|
|
width: 220px;
|
|
margin: 0 auto 4px auto;
|
|
padding: 0;
|
|
}
|
|
|
|
.sheet-rolltemplate-damage div.sheet-template-damage {
|
|
line-height: 3.3rem;
|
|
font-size: 2rem;
|
|
text-align: center;
|
|
padding: 10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface .sheet-normal {
|
|
background: #000;
|
|
}
|
|
|
|
.sheet-rolltemplate-roleability .sheet-normal {
|
|
background: #696969;
|
|
}
|
|
|
|
.sheet-rolltemplate-skill .sheet-normal,
|
|
.sheet-rolltemplate-attack .sheet-normal {
|
|
background: #0070C0;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface .sheet-crit,
|
|
.sheet-rolltemplate-roleability .sheet-crit,
|
|
.sheet-rolltemplate-skill .sheet-crit,
|
|
.sheet-rolltemplate-attack .sheet-crit{
|
|
background: #00B050;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface .sheet-fail,
|
|
.sheet-rolltemplate-roleability .sheet-fail,
|
|
.sheet-rolltemplate-skill .sheet-fail,
|
|
.sheet-rolltemplate-attack .sheet-fail {
|
|
background: #CD272C;
|
|
}
|
|
|
|
.sheet-rolltemplate-attack div.sheet-rolltemplate-table {
|
|
border: none !important;
|
|
position: relative;
|
|
width: 220px;
|
|
margin: 0 auto;
|
|
padding: 0;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-template-rows: repeat(9, 30px);
|
|
grid-auto-flow: column;
|
|
grid-gap: 4px;
|
|
}
|
|
|
|
.sheet-rolltemplate-attack div.sheet-rolltemplate-table div {
|
|
background: white;
|
|
padding-top: 0.7rem;
|
|
}
|
|
|
|
.sheet-rolltemplate-attack div.sheet-rolltemplate-table div.sheet-header {
|
|
background: #0f0f0f;
|
|
color:#fff;
|
|
}
|
|
|
|
.sheet-rolltemplate-attack div.sheet-template-header {
|
|
padding-top: 1.7rem;
|
|
line-height: 3.3rem;
|
|
font-size: 3rem;
|
|
}
|
|
|
|
.sheet-rolltemplate-skill div.sheet-template-header {
|
|
padding-top: 1.7rem;
|
|
line-height: 3.3rem;
|
|
font-size: 3rem;
|
|
}
|
|
|
|
.sheet-rolltemplate-skill div.sheet-template-row {
|
|
padding-bottom: 1.7rem;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface div.sheet-template-row-subhead,
|
|
.sheet-rolltemplate-attack div.sheet-template-row-subhead {
|
|
line-height: 2.5rem;
|
|
font-size: 2rem;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface div.sheet-template-row,
|
|
.sheet-rolltemplate-attack div.sheet-template-row {
|
|
padding-bottom: 1.7rem;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface a[href^="~"] {
|
|
background-color: transparent;
|
|
padding: 0px;
|
|
border: 0px;
|
|
color: #fae800
|
|
}
|
|
|
|
.sheet-rolltemplate-attack a[href^="~"] {
|
|
background-color: transparent;
|
|
padding: 0px;
|
|
border: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-attack a:hover {
|
|
text-decoration: underline !important; }
|
|
|
|
|
|
.sheet-rolltemplate-attack a:visited {
|
|
pointer-events: none; }
|
|
|
|
.sheet-rolltemplate-interface .sheet-template-header span,
|
|
.sheet-rolltemplate-roleability .sheet-template-header span,
|
|
.sheet-rolltemplate-skill .sheet-template-header span,
|
|
.sheet-rolltemplate-attack .sheet-template-header span {
|
|
background-color: transparent;
|
|
border: 0px;
|
|
padding: 0px;
|
|
}
|
|
|
|
.sheet-rolltemplate-skill .inlinerollresult,
|
|
.sheet-rolltemplate-skill .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-skill .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-skill .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-attack .inlinerollresult,
|
|
.sheet-rolltemplate-attack .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-attack .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-attack .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-damage .inlinerollresult,
|
|
.sheet-rolltemplate-damage .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-damage .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-damage .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-deathsave .inlinerollresult,
|
|
.sheet-rolltemplate-deathsave .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-deathsave .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-deathsave .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-initiative .inlinerollresult,
|
|
.sheet-rolltemplate-initiative .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-initiative .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-initiative .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-roleability .inlinerollresult,
|
|
.sheet-rolltemplate-roleability .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-roleability .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-roleability .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-interface .inlinerollresult,
|
|
.sheet-rolltemplate-interface .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-interface .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-interface .inlinerollresult.importantroll {
|
|
border: none;
|
|
background: none;
|
|
}
|
|
|
|
|
|
.sheet-rolltemplate-interface div,
|
|
.sheet-rolltemplate-roleability div,
|
|
.sheet-rolltemplate-skill div,
|
|
.sheet-rolltemplate-attack div {
|
|
padding: 5px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-interface .sheet-template-crit,
|
|
.sheet-rolltemplate-roleability .sheet-template-crit,
|
|
.sheet-rolltemplate-skill .sheet-template-crit {
|
|
color: green !important;
|
|
}
|
|
|
|
.sheet-rolltemplate-roleability .inlinerollresult,
|
|
.sheet-rolltemplate-skill .inlinerollresult {
|
|
display: inline-block;
|
|
min-width: 1.5em;
|
|
text-align: center;
|
|
border: 2px solid rgba(167, 168, 170,1);
|
|
}
|
|
|
|
/* Auto-expanding textarea */
|
|
|
|
.sheet-auto-expand {
|
|
position: relative;
|
|
cursor: text;
|
|
word-wrap: break-word;
|
|
min-height: 5em;
|
|
}
|
|
.sheet-auto-expand span {
|
|
visibility: hidden;
|
|
white-space: pre-wrap;
|
|
display: block;
|
|
height: auto;
|
|
}
|
|
.sheet-auto-expand textarea {
|
|
border: 1px solid white;
|
|
position: absolute;
|
|
z-index: 1;
|
|
top: 0;
|
|
left: 0;
|
|
margin: 0;
|
|
resize: none;
|
|
height: 100%;
|
|
width: 100%;
|
|
display: block;
|
|
|
|
background: transparent;
|
|
border: none;
|
|
border-radius: 0;
|
|
box-shadow: none;
|
|
color: inherit;
|
|
font: inherit;
|
|
letter-spacing: inherit;
|
|
padding: inherit;
|
|
text-align: inherit;
|
|
text-transform: inherit;
|
|
}
|
|
|
|
/* Flex Table Repeating Sections */
|
|
|
|
.sheet-flex-table {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
flex-flow: row wrap;
|
|
padding: 0;
|
|
margin: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
.sheet-flex-table div {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
|
|
.sheet-main .sheet-flex-table div input,
|
|
.sheet-settings .sheet-settings-value input {
|
|
margin: 0;
|
|
padding: 0;
|
|
width: 100%;
|
|
border: none;
|
|
height: auto;
|
|
min-width:0
|
|
}
|
|
|
|
.sheet-main .sheet-flex-table div input[type=number],
|
|
.sheet-settings .sheet-settings-value input[type=number] {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-main .sheet-flex-table div input:read-only[type=number]{
|
|
background-color: #fff;
|
|
}
|
|
|
|
.sheet-netrunning .sheet-flex-table input{
|
|
text-align: left;
|
|
}
|
|
|
|
.sheet-my-settings {
|
|
max-width: 800px;
|
|
}
|
|
|
|
.sheet-settings-row {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.sheet-settings-option {
|
|
display: flex;
|
|
width: 300px;
|
|
border: 1px solid #0f0f0f;
|
|
margin: 4px;
|
|
padding: 4px;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.sheet-settings-help {
|
|
max-width: 310px;
|
|
text-align: justify;
|
|
}
|
|
|
|
.sheet-settings-title {
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.sheet-settings-value {
|
|
flex: 0 0 auto;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.sheet-aimed-shot-icon {
|
|
font-weight: bold;
|
|
color: #CD272C;
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.sheet-settings-number {
|
|
width: 24px;
|
|
height: 24px;
|
|
border: 1px solid #0f0f0f;
|
|
background-color: var(--color-surface2);
|
|
}
|
|
|
|
.sheet-settings-checkbox {
|
|
background-color: var(--color-surface2);
|
|
}
|
|
|
|
.sheet-weapon {
|
|
background-color: #CD272C;
|
|
margin: -4px;
|
|
padding: 4px;
|
|
}
|
|
|
|
.sheet-settings .sheet-nav {
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.sheet-settings .sheet-reset-check {
|
|
display: none;
|
|
}
|
|
|
|
.sheet-settings .sheet-reset-skills[value="confirm"] ~ div.sheet-reset-button {
|
|
display: none;
|
|
}
|
|
|
|
.sheet-settings .sheet-reset-skills[value="confirm"] ~ div.sheet-reset-check {
|
|
display: grid;
|
|
}
|
|
|
|
.sheet-settings .sheet-reset-check .sheet-heading {
|
|
color: #0f0f0f;
|
|
background: #fff;
|
|
border: 1px solid #0f0f0f;
|
|
font-size: 1.2rem;
|
|
margin: 0;
|
|
padding: 5px 8px;
|
|
height: 30px;
|
|
line-height: 18px;
|
|
border-radius: 0;
|
|
}
|
|
.sheet-settings .sheet-reset-check .sheet-question,
|
|
.sheet-settings .sheet-reset-check .sheet-buttons {
|
|
width: 100%;
|
|
text-align: center;
|
|
background-color: #f5f5f5;
|
|
padding-bottom: 5px;
|
|
}
|
|
.sheet-settings .sheet-reset-check .sheet-question {
|
|
padding-top: 5px;
|
|
}
|
|
|
|
.sheet-profile .sheet-take-damage-panel {
|
|
display: none;
|
|
height: 501px;
|
|
align-items: end;
|
|
}
|
|
.sheet-profile .sheet-take-damage-panel-toggle[value="1"] ~ div.sheet-role-ability-panel {
|
|
display: none;
|
|
}
|
|
.sheet-profile .sheet-take-damage-panel-toggle[value="1"] ~ div.sheet-take-damage-panel {
|
|
display: grid;
|
|
}
|
|
.sheet-profile .sheet-take-damage-flow {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.sheet-take-damage-panel .sheet-flex-table div {
|
|
justify-content: flex-start;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-title {
|
|
text-align: center;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-field {
|
|
font-weight: normal;
|
|
width: 120px;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-preview-label {
|
|
width: 120px;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-input,
|
|
.sheet-take-damage-panel .sheet-take-damage-preview {
|
|
width: 134px;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-preview input {
|
|
background: #fae800;
|
|
font-weight: bold;
|
|
width: 100%;
|
|
text-align: center;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-input select {
|
|
width: 100%;
|
|
background: var(--color-surface2);
|
|
}
|
|
.sheet-profile .sheet-take-damage-panel input[type="checkbox"],
|
|
.sheet-profile .sheet-take-damage-panel input[type="radio"] {
|
|
height: auto;
|
|
width: auto;
|
|
margin: 4px;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-main-buttons {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-main-buttons button {
|
|
width: 83px;
|
|
background: #fff;
|
|
color: #CD272C;
|
|
border: 1px solid #fff;
|
|
font-weight: bold;
|
|
box-shadow: none;
|
|
text-shadow: none;
|
|
padding: 2px 8px 2px;
|
|
border-radius: 4px;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-main-buttons button:hover {
|
|
background: #CD272C;
|
|
color: #fff;
|
|
}
|
|
.sheet-take-damage-panel .sheet-take-damage-main-buttons .sheet-button-left {
|
|
margin-right: 4px;
|
|
}
|
|
.sheet-take-damage-button button {
|
|
background: #0f0f0f;;
|
|
color: #fae800;
|
|
border: 1px solid #0f0f0f;
|
|
font-weight: bold;
|
|
box-shadow: none;
|
|
text-shadow: none;
|
|
padding: 2px 4px;
|
|
border-radius: 4px;
|
|
}
|
|
.sheet-take-damage-button button:hover {
|
|
background: #fae800;
|
|
color: #0f0f0f;
|
|
}
|
|
.sheet-take-damage-button-flag[value="0"] ~ div.sheet-take-damage-button {
|
|
display: none;
|
|
}
|