803 lines
14 KiB
CSS
803 lines
14 KiB
CSS
/* Header Formatting */
|
|
.sheet-gametitleimg {float: left; }
|
|
.sheet-alignright {text-align: right; }
|
|
.sheet-typeselector {}
|
|
.sheet-aligncenter {text-align: center;}
|
|
|
|
/* Tabs for switching between different content sections */
|
|
.sheet-tab-content {
|
|
display: none;
|
|
}
|
|
|
|
input.sheet-tab-char:checked ~ div.sheet-tab-char,
|
|
input.sheet-tab-playbook:checked ~ div.sheet-tab-playbook,
|
|
input.sheet-tab-clocks:checked ~ div.sheet-tab-clocks,
|
|
input.sheet-tab-crew:checked ~ div.sheet-tab-crew,
|
|
input.sheet-tab-factions:checked ~ div.sheet-tab-factions {
|
|
display: block;
|
|
}
|
|
|
|
input.sheet-tab {
|
|
opacity: 0;
|
|
width: 100px;
|
|
height: 20px;
|
|
margin-bottom: 5px;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
position: absolute;
|
|
}
|
|
|
|
input.sheet-tab + span {
|
|
border: solid 1px #a7a7a7;
|
|
border-bottom-color: #ffffff;
|
|
text-align: center;
|
|
display: inline-block;
|
|
|
|
background: #000000;
|
|
color: #ffffff;
|
|
|
|
width: 100px;
|
|
height: 20px;
|
|
font-size: 18px;
|
|
}
|
|
|
|
input.sheet-tab:checked + span {
|
|
background: #ffffff;
|
|
color: #000000;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-char,
|
|
input[type=radio].sheet-tab-char + span {
|
|
left: 0px;
|
|
}
|
|
|
|
input[type=radio].sheet-tab-playbook,
|
|
input[type=radio].sheet-tab-playbook + span {
|
|
left: 110px;
|
|
}
|
|
|
|
|
|
/* Char/Crew Button Functionality */
|
|
div.sheet-type-crew { display: none; }
|
|
input.sheet-typeselector:checked ~ div.sheet-type-crew { display: block;}
|
|
input.sheet-typeselector:checked ~ div.sheet-type-character { display: none; }
|
|
|
|
/* Char/Crew Button Appearance */
|
|
input.sheet-typeselector {
|
|
opacity: 0;
|
|
width: 100px;
|
|
height: 20px;
|
|
margin-bottom: 5px;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
}
|
|
|
|
input.sheet-typeselector + span {
|
|
border: solid 1px #a7a7a7;
|
|
border-bottom-color: #ffffff;
|
|
text-align: center;
|
|
display: inline-block;
|
|
|
|
background: #cccccc;
|
|
color: #000000;
|
|
|
|
width: 100px;
|
|
height: 20px;
|
|
font-size: 18px;
|
|
}
|
|
|
|
input.sheet-typeselector,
|
|
input.sheet-typeselector + span {
|
|
position: absolute;
|
|
right: 0;
|
|
}
|
|
|
|
input.sheet-typeselector + span::before {
|
|
content: "Character";
|
|
}
|
|
|
|
input.sheet-typeselector:checked + span::before {
|
|
content: "Crew";
|
|
}
|
|
|
|
/* Trauma Options */
|
|
input.sheet-trauma-check {
|
|
opacity: 0;
|
|
width: 80px;
|
|
height: 20px;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
}
|
|
|
|
input.sheet-trauma-check + span {
|
|
border: solid thin #a7a7a7;
|
|
text-align: center;
|
|
display: inline-block;
|
|
|
|
background: white;
|
|
color: #000000;
|
|
|
|
width: 80px;
|
|
height: 20px;
|
|
line-height: 22px;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
input.sheet-trauma-check:checked + span {
|
|
color: #ff0000;
|
|
}
|
|
|
|
.sheet-trauma-container {
|
|
position: relative;
|
|
/* This allows us to absolutely position within each of the column
|
|
containers so that we can overlap the checkbox and the span. */
|
|
width: 80px;
|
|
margin-left: 10px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
input.sheet-trauma-check,
|
|
input.sheet-trauma-check + span {
|
|
position: absolute;
|
|
left: 0;
|
|
}
|
|
|
|
/* Other Options */
|
|
input[type=checkbox].sheet-check,
|
|
input[type=checkbox].sheet-check-first {
|
|
display: inline-block;
|
|
width: 16px;
|
|
height: 16px;
|
|
cursor: pointer;
|
|
z-index: 2;
|
|
opacity: 1;
|
|
position: relative;
|
|
opacity: 0;
|
|
}
|
|
|
|
input[type=checkbox].sheet-check + span,
|
|
input[type=checkbox].sheet-check-first + span {
|
|
display: inline-block;
|
|
background: #ffffff;
|
|
background: white;
|
|
width: 16px;
|
|
height: 16px;
|
|
position: relative;
|
|
left: -16px;
|
|
top: 5px;
|
|
z-index: 1;
|
|
border: solid thin #000000;
|
|
}
|
|
|
|
input[type=checkbox].sheet-check,
|
|
input.sheet-friend-info,
|
|
input.sheet-item-info,
|
|
input.sheet-crew-ability-name,
|
|
input.sheet-crew-upgrade-info,
|
|
input.sheet-contact-friend-info
|
|
{
|
|
margin-left: -16px;
|
|
}
|
|
|
|
.sheet-check-last + span {
|
|
margin-right: -16px;
|
|
}
|
|
|
|
input[type=checkbox].sheet-check:checked + span,
|
|
input[type=checkbox].sheet-check-first:checked + span {
|
|
background: black;
|
|
}
|
|
|
|
input.sheet-armor:before, input.sheet-cohort-armor:before , input.sheet-coin:before,
|
|
input.sheet-recovery:before, input.sheet-ability:before,
|
|
input.sheet-friend:before, input.sheet-rival:before,
|
|
input.sheet-item:before, input.sheet-carry:before,
|
|
input.sheet-turf:before, input.sheet-rep:before, input.sheet-clock:before {
|
|
content: "";
|
|
display: inline-block;
|
|
background: #ffffff;
|
|
width: 15px;
|
|
height: 15px;
|
|
}
|
|
|
|
input.sheet-armor:before, input.sheet-cohort-armor:before , input.sheet-coin:before,
|
|
input.sheet-recovery:before, input.sheet-ability:before,
|
|
input.sheet-item:before, input.sheet-carry:before,
|
|
input.sheet-turf:before, input.sheet-rep:before, input.sheet-clock:before {
|
|
border: solid thin #000000;
|
|
}
|
|
|
|
input[type=checkbox].sheet-friend + span {
|
|
border: solid thin #007700;
|
|
}
|
|
|
|
input[type=checkbox].sheet-rival + span {
|
|
border: solid thin #770000;
|
|
}
|
|
|
|
input[type=checkbox].sheet-friend:checked + span {
|
|
background: #007700;
|
|
}
|
|
|
|
.sheet-clock-col {
|
|
width: 350px;
|
|
}
|
|
|
|
input.sheet-friend:checked::before {
|
|
background: #007700;
|
|
}
|
|
|
|
input[type=checkbox].sheet-rival:checked + span {
|
|
background: #770000;
|
|
}
|
|
|
|
input[type=checkbox].sheet-item-onebox {
|
|
/* Extra indentation so that we align nicely with the two-box and three-box
|
|
items below*/
|
|
margin-left: 42px;
|
|
}
|
|
|
|
input[type=checkbox].sheet-item-twobox {
|
|
/* Extra indentation so that we align nicely with the two-box and three-box
|
|
items below*/
|
|
margin-left: 21px;
|
|
}
|
|
|
|
input.sheet-item-info {
|
|
width: 155px;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
.sheet-turfrow {
|
|
margin-bottom: -13px;
|
|
}
|
|
|
|
.sheet-turfrow-outer {
|
|
margin: auto;
|
|
}
|
|
|
|
label.sheet-turf-label, label.sheet-rep-label {
|
|
width: 25px;
|
|
}
|
|
|
|
label.sheet-wanted-label, label.sheet-coin-label {
|
|
width: 40px;
|
|
text-align: right;
|
|
margin-left: -20px;
|
|
margin-right: -10px;
|
|
}
|
|
|
|
label.sheet-heat-label, label.sheet-vault-label {
|
|
width: 40px;
|
|
text-align: right;
|
|
margin-left: 6px;
|
|
margin-right: -27px;
|
|
}
|
|
|
|
label.sheet-tier-label, label.sheet-hold-label {
|
|
width: 20px;
|
|
text-align: right;
|
|
margin-left: 6px;
|
|
margin-right: -13px;
|
|
}
|
|
|
|
/* Character Tab */
|
|
h1 {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-version {
|
|
text-align: left;
|
|
font-size: 10px;
|
|
}
|
|
|
|
label {
|
|
line-height: 25px;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
label.sheet-alias, label.sheet-background {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
input.sheet-name, input.sheet-alias {
|
|
width: 350px;
|
|
}
|
|
|
|
input.sheet-look {
|
|
margin-left: 5px;
|
|
width: 771px;
|
|
}
|
|
|
|
input.sheet-heritage, input.sheet-background {
|
|
width: 312px;
|
|
}
|
|
|
|
input.sheet-vice {
|
|
width: 699px;
|
|
}
|
|
|
|
label.sheet-trauma {
|
|
margin-left: 25px;
|
|
}
|
|
|
|
input.sheet-stress, input.sheet-trauma, input.sheet-stash,
|
|
input.sheet-insight, input.sheet-prowess, input.sheet-resolve {
|
|
width: 25px;
|
|
text-align: center;
|
|
font-size: 16px;
|
|
}
|
|
|
|
h3 {
|
|
text-align: center;
|
|
}
|
|
|
|
h5 {
|
|
line-height: 27px;
|
|
}
|
|
|
|
.sheet-harm-full {
|
|
width: 424px;
|
|
}
|
|
|
|
label.sheet-armor, input.sheet-spec, label.sheet-coin,
|
|
label.sheet-stash {
|
|
margin-left: 35px;
|
|
}
|
|
|
|
label.sheet-heavy {
|
|
margin-left: 18px;
|
|
}
|
|
|
|
input.sheet-spec {
|
|
width: 175px;
|
|
}
|
|
|
|
/* Playbook Tab */
|
|
input.sheet-ability-name {
|
|
width: 125px;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
margin-left: -16px;
|
|
}
|
|
|
|
input.sheet-ability-info {
|
|
width: 292px;
|
|
}
|
|
|
|
input.sheet-xp-goal {
|
|
width: 416px;
|
|
}
|
|
|
|
.sheet-xp-conditions {
|
|
width: 440px;
|
|
}
|
|
.sheet-actions {
|
|
margin-left: 35px;
|
|
}
|
|
|
|
h4 {
|
|
line-height: 27px;
|
|
}
|
|
|
|
.sheet-actions-hr {
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
input.sheet-insight {
|
|
margin-left: 175px;
|
|
}
|
|
|
|
input.sheet-prowess {
|
|
margin-left: 159px;
|
|
}
|
|
|
|
input.sheet-resolve {
|
|
margin-left: 164px;
|
|
}
|
|
|
|
.sheet-secondary-actions {
|
|
margin-left: 35px;
|
|
}
|
|
|
|
.sheet-insight-actions {
|
|
margin-left: 33px;
|
|
}
|
|
|
|
.sheet-prowess-actions {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
.sheet-resolve-actions {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.sheet-loads {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
input.sheet-carry {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
input.sheet-carry + span {
|
|
margin-right: -16px;
|
|
}
|
|
|
|
.sheet-bandolier {
|
|
margin-left: 15px;
|
|
}
|
|
|
|
|
|
|
|
/* Crew Sheet Field Layout And Formatting */
|
|
input.sheet-crew-name, input.sheet-crew-reputation {
|
|
width: 330px;
|
|
}
|
|
|
|
input.sheet-crew-lair {
|
|
width: 782px;
|
|
}
|
|
|
|
|
|
/* Claims Map */
|
|
|
|
.sheet-map-row-claims {
|
|
margin-left: 51px;
|
|
width: 800px;
|
|
}
|
|
|
|
.sheet-map-row-claims textarea {
|
|
width: 130px;
|
|
height: 60px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
background: #cccccc;
|
|
z-index: 0;
|
|
position: relative;
|
|
resize: none;
|
|
}
|
|
|
|
.sheet-map-claim, .sheet-map-connector {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
text-align: center;
|
|
margin: -3px;
|
|
}
|
|
|
|
.sheet-connector-row {
|
|
margin-bottom: -20px;
|
|
margin-left: 48px;
|
|
width: 800px;
|
|
}
|
|
|
|
|
|
|
|
/* Hide right-connector checkbox */
|
|
input.sheet-connector-check[type="checkbox"]
|
|
{
|
|
opacity: 0;
|
|
width: 16px;
|
|
height: 16px;
|
|
position: relative;
|
|
top: -2px;
|
|
left: 15px;
|
|
margin: -10px;
|
|
cursor: pointer;
|
|
z-index: 2;
|
|
}
|
|
|
|
/* Hide right-connector when unchecked */
|
|
input.sheet-connector-check[type="checkbox"] + span::before
|
|
{
|
|
opacity: 0;
|
|
display: inline-block;
|
|
width: 30px;
|
|
height: 20px;
|
|
content: "";
|
|
}
|
|
|
|
/* Show right-connector when checked */
|
|
input.sheet-connector-check[type="checkbox"]:checked + span::before
|
|
{
|
|
opacity: 1;
|
|
content: "";
|
|
width: 30px;
|
|
height: 20px;
|
|
background: #cccccc;
|
|
z-index: -1;
|
|
border: 1px 0px 1px 0px;
|
|
position: relative;
|
|
left: -1px;
|
|
}
|
|
|
|
/* Row for the down-connectors */
|
|
.sheet-down-connector {
|
|
width: 132px;
|
|
display: inline-block;
|
|
margin-right: 17px;
|
|
margin-left: 0px;
|
|
height: 30px;
|
|
text-align:center;
|
|
}
|
|
|
|
.sheet-notfirstrow {
|
|
margin-top: 15px;
|
|
}
|
|
|
|
|
|
/* Hide down-connector checkbox */
|
|
input.sheet-down-connector-check[type="checkbox"]
|
|
{
|
|
opacity: 0;
|
|
position: relative;
|
|
cursor: pointer;
|
|
z-index: 2;
|
|
width: 16px;
|
|
height: 36px;
|
|
top: -12px;
|
|
left: 8px;
|
|
|
|
}
|
|
|
|
|
|
/* Hide down-connector when unchecked */
|
|
input.sheet-down-connector-check[type="checkbox"] + span::before
|
|
{
|
|
opacity: 0;
|
|
display: inline-block;
|
|
content: "";
|
|
background: green;
|
|
position: relative;
|
|
z-index: 1;
|
|
width: 16px;
|
|
height: 26px;
|
|
top: 1px;
|
|
left: -8px;
|
|
}
|
|
|
|
|
|
/* Show down-connector when checked */
|
|
input.sheet-down-connector-check[type="checkbox"]:checked + span::before
|
|
{
|
|
opacity: 1;
|
|
display: inline-block;
|
|
content: "";
|
|
background: #cccccc;
|
|
position: relative;
|
|
z-index: 1;
|
|
width: 16px;
|
|
height: 26px;
|
|
top: 0px;
|
|
left: -8px;
|
|
}
|
|
|
|
/* Left-fillable radio buttons - Hide actual radio */
|
|
input.sheet-leftradio[type="radio"]
|
|
{
|
|
opacity: 0;
|
|
width: 16px;
|
|
height: 16px;
|
|
position: relative;
|
|
top: -2px;
|
|
left: 8px;
|
|
margin: -9px;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
}
|
|
|
|
/* Show fake radio buttons for left-fillable */
|
|
input.sheet-leftradio[type="radio"] + span::before
|
|
{
|
|
width: 16px;
|
|
height: 16px;
|
|
content: "";
|
|
display: inline-block;
|
|
border: solid thin #000000;
|
|
background: #000000;
|
|
position: relative;
|
|
top: 5px;
|
|
}
|
|
|
|
input.sheet-leftradiolast[type="radio"] + span::before {
|
|
margin-right: 0px;
|
|
}
|
|
|
|
/* Remove dot from all radios _after_ selected one */
|
|
/* Ensure that your radio groups are encapsulated in a div, otherwise they will interfere with each other */
|
|
input.sheet-leftradio[type="radio"]:checked ~ input.sheet-leftradio[type="radio"] + span::before
|
|
{
|
|
content: "";
|
|
background: #ffffff;
|
|
}
|
|
|
|
|
|
/* Empty radio - used for clearing the line*/
|
|
input.sheet-zero:checked + span::before
|
|
{
|
|
opacity: 0;
|
|
}
|
|
|
|
input.sheet-zero:hover + span::before
|
|
{
|
|
opacity: 0.25;
|
|
font-size: 12px;
|
|
content: "✖";
|
|
text-indent: 0.5px;
|
|
position:relative;
|
|
top: 2px;
|
|
}
|
|
|
|
input.sheet-zero + span::before
|
|
{
|
|
opacity: 0;
|
|
position: relative;
|
|
top: 5px;
|
|
}
|
|
|
|
input[type=radio].sheet-radioindent,
|
|
input[type=radio].sheet-radioindent + span {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
/* Crew Upgrades */
|
|
.sheet-lair-upgrade-info, .sheet-quality-upgrade-info {
|
|
width: 170px;
|
|
}
|
|
|
|
.sheet-crew-upgrade-info {
|
|
width: 160px;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
.sheet-linkedbox + span::after {
|
|
content: "-";
|
|
line-height: 24px;
|
|
position: relative;
|
|
left: 16px;
|
|
font-size: 15px;
|
|
top: -4px;
|
|
}
|
|
|
|
.sheet-crew-ability-name {
|
|
width: 125px;
|
|
}
|
|
|
|
.sheet-crew-ability-info {
|
|
width: 680px;
|
|
}
|
|
|
|
.sheet-advancement-descr {
|
|
width: 335px;
|
|
}
|
|
|
|
.sheet-contact-friend-info, .sheet-friend-info {
|
|
width: 155px;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
textarea.sheet-cohort-notes {
|
|
width: 298px;
|
|
height: 50px;
|
|
}
|
|
|
|
.sheet-cohort-label, .sheet-crew-advancement-label {
|
|
display: inline;
|
|
margin-right: -11px;
|
|
}
|
|
|
|
select.sheet-cohort-health {
|
|
width: 100px;
|
|
}
|
|
|
|
.sheet-cohort-name {
|
|
width: 250px;
|
|
margin: 5px;
|
|
}
|
|
|
|
.sheet-freejob textarea, .repeating_freejob textarea {
|
|
width: 330px;
|
|
height: 50px;
|
|
}
|
|
|
|
.sheet-freejob-name {
|
|
width: 194px;
|
|
}
|
|
|
|
.sheet-freejobs {
|
|
width: 340px;
|
|
margin-bottom: 10px;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
.sheet-faction-section {
|
|
margin: 30px;
|
|
}
|
|
|
|
select.sheet-faction-status,
|
|
select.sheet-faction-tier,
|
|
select.sheet-faction-hold {
|
|
width: 45px;
|
|
}
|
|
|
|
|
|
.sheet-war-description {
|
|
width: 350px;
|
|
}
|
|
|
|
input.sheet-knifeimg[type="radio"] {
|
|
opacity: 1;
|
|
z-index: 1;
|
|
}
|
|
|
|
|
|
.sheet-claim-checkboxes {
|
|
position: relative;
|
|
}
|
|
|
|
input.sheet-claim-claimed1,
|
|
input.sheet-claim-claimed2,
|
|
input.sheet-claim-claimed3,
|
|
input.sheet-claim-claimed4,
|
|
input.sheet-claim-claimed5 {
|
|
position: absolute;
|
|
}
|
|
|
|
input.sheet-claim-claimed1 {left: 50px;}
|
|
input.sheet-claim-claimed2 {left: 203px;}
|
|
input.sheet-claim-claimed3 {left: 357px;}
|
|
input.sheet-claim-claimed4 {left: 511px;}
|
|
input.sheet-claim-claimed5 {left: 665px;}
|
|
|
|
.sheet-claimsection { margin-bottom: -70px;}
|
|
.sheet-claims-checks1 { position: relative; top: -175px; }
|
|
.sheet-claims-checks2 { position: relative; top: -92px; }
|
|
.sheet-claims-checks3 { position: relative; top: -10px; }
|
|
|
|
|
|
/* Roll template */
|
|
|
|
.sheet-rolltemplate-bitd table {
|
|
width: 240px;
|
|
padding: 2px;
|
|
border: 1px solid;
|
|
background: url(https://i.imgur.com/DCcJ8p2.jpg);
|
|
background-size: 240px;
|
|
background-repeat: no-repeat;
|
|
font-family: "Times New Roman", Times, serif;
|
|
min-height: 85px;
|
|
}
|
|
|
|
.sheet-rolltemplate-bitd th {
|
|
color: darkred;
|
|
padding-left: 5px;
|
|
line-height: 1.6em;
|
|
font-size: 1.2em;
|
|
text-align: left;
|
|
font-family: "Times New Roman", Times, serif;
|
|
font-variant: small-caps;
|
|
width: 180px;
|
|
}
|
|
|
|
.sheet-rolltemplate-bitd .sheet-subheader {
|
|
color: black;
|
|
font-size: 1.5em;
|
|
font-style: bold;
|
|
font-family: "Times New Roman", Times, serif;
|
|
}
|
|
|
|
.sheet-rolltemplate-bitd td {
|
|
padding-left: 5px;
|
|
font-family: "Times New Roman", Times, serif;
|
|
}
|
|
|
|
.sheet-rolltemplate-bitd .sheet-result {
|
|
font-size: 3em;
|
|
vertical-align: center;
|
|
text-align: center;
|
|
font-family: "Times New Roman", Times, serif;
|
|
}
|