Files
roll20-character-sheets/L5R Fantasy Flight Games/L5RFFGSheetCSS.css
T
rdefendi aea2100396 Update L5RFFGSheetCSS.css
Fixed recent break to Composure and Endurance Calculation, while maintaining the attempt to correct the new books swap of the stat calculations...

Updated the wording on Adversities and Anxieties to reflect the official release character sheet.

Changed "status" to "standing" in the section on other characters to reflect the wording on the official release character sheet.

Although not every stance changed mechanically, changed the tooltips on every stance to reflect the wording on the new, official character sheet, post-release.

Added sections for ninjutsu and maho technique to the PC sheet. NPCs will follow.
2018-12-03 14:17:00 -07:00

844 lines
19 KiB
CSS

.charsheet
{
background-color: #fff;
overflow: hidden;
font-family: Calibri;
}
.sheet-vspace { margin-top:10px; }
h4
{
font-weight: bold;
margin-left: 0;
text-align: Center;
}
h5
{
font-weight: bold;
margin-left: 0;
text-align: Left;
font-size: 12px;
}
h1,
hr
{
background-image: url(http://i.imgur.com/T67Y0e5.jpg);
background-position: center top 100%;
//backgrund-repeat: repea-x;
background-size: auto 67px;
text-align: Left;
width: 100%;
height: 50px;
font-size: 20px;
}
h6,
hr
{
background-image: url(http://i.imgur.com/T67Y0e5.jpg);
background-position: center top 100%;
//backgrund-repeat: repea-x;
background-size: auto 30px;
text-align: Left;
width: 100%;
height: 25px;
font-size: 10px;
}
hr { height: 10px; }
label { font-size: 12px;
margin-bottom: 0px;
}
h1 span
{
color: #BE4136;
padding: 0 75px;
text-align: Center;
}
img { max-height: 100%; }
img.sheet-arrow {
height: 250px;
vertical-align: middle
}
span.sheet-attribute,
span.sheet-ability
{
display: inline-block;
font-size: 12px;
font-weight: 700;
}
div.sheet-attribute,
div.sheet-ability,
ul.sheet-craft-types li { clear: right;
text-align: center;
}
.sheet-col .sheet-2colrow.sheet-sub2colrow { width: 841px; padding: 0 auto 0 auto;
}
.sheet-borderedtable
{ border:1px #745035;
width:460px
}
.sheet-borderedtable td
{ border:1px solid black;
color: #6C4C34;
background-color: #DDC69A;
}
.sheet-borderedtable th
{ border:1px solid black;
color: #FFFFFF;
background-color: #6C4C34;
}
.sheet-span2
{
margin-left: 0;
width: 543px;
}
.sheet-air
{
color=#7290AA
}
.sheet-skill,
.sheet-charm,
.sheet-sorcery,
.sheet-artifacts,
.sheet-hearthstones,
.sheet-languages,
.sheet-background,
.sheet-specialty,
.sheet-intimacy,
.sheet-merit,
.sheet-flaw { margin-bottom: 5px; }
.sheet-eight-lines { height: 40ex; }
.sheet-four-lines { height: 20ex; }
.sheet-three-lines { height: 15ex; }
.sheet-two-lines { height: 10ex; }
.sheet-one-line { height: 5ex; }
.sheet-regular { width: 120px; }
.sheet-narrow { width: 80px; }
.sheet-very-narrow { width: 40px; }
.sheet-span-header
{
display: inline-block;
font-size: 110%;
font-weight: 700;
margin: 0;
padding: 4px;
}
.sheet-2colrow.sheet-span2 .sheet-col { width: 250px; }
.sheet-2colrow.sheet-span2 .sheet-col .sheet-span-header:first-child { width: 200px; }
[data-groupname=repeating_attack] div:not(:first-child) .sheet-attack { border-top: 1px solid #ccc; }
[data-groupname=repeating_intimacies] .repitem:nth-child(even) { margin-left: 40px; }
.sheet-combat-equipment .sheet-weapons
{
display: inline-block;
vertical-align: top;
}
.sheet-weapons .sheet-rolls { padding: 5px; }
.sheet-weapons span
{
border-right: 1px solid #000;
border-top: 3px solid #000;
}
.sheet-weapons span:first-of-type,
.sheet-weapons .sheet-rolls,
.sheet-weapons .sheet-attack input:first-of-type { border-left: 3px solid #000; }
.sheet-weapons span:last-of-type,
.sheet-weapons .sheet-rolls,
.sheet-weapons .sheet-attack input:last-of-type { border-right: 3px solid #000; }
.sheet-weapons .sheet-attack select
{
height: 28px;
vertical-align: top;
}
.sheet.attibute
.sheet-weapons .sheet-attack input,
.sheet-weapons .sheet-attack select
{
border: 1px solid #000;
border-left: none;
border-radius: 0;
margin: 0;
}
.repcontainer[data-groupname=repeating_attacks] .repitem:last-child .sheet-rolls { border-bottom: 3px solid #000; }
.sheet-weapons .repcontrol { width: 400px; }
.sheet-anima:first-of-type > tbody > tr > td:last-child,
.sheet-anima:last-of-type > thead > tr:last-child > th:last-child,
.sheet-anima:last-of-type > tbody > tr > td:first-child { padding-left: 10px; }
.sheet-anima:last-of-type { margin-top: 30px; }
.sheet-anima:last-of-type > thead > tr > td { width: 70px; }
.sheet-anima th
{
font-size: 18px;
text-align: left;
}
.sheet-anima td { font-weight: 700; }
.sheet-anima > thead > tr:first-child > th { font-size: 20px; }
.sheet-familiar-attacks > thead > tr > th:first-child { text-align: left; }
label,
.sheet-background,
.sheet-charm,
.sheet-combo,
.sheet-sorcery,
.sheet-artifacts,
.sheet-hearthstones,
.sheet-languages,
.sheet-specialty,
.sheet-intimacy,
.sheet-familiar-row,
.sheet-merit,
.sheet-flaw
{
display: flex;
width: 100%;
}
.sheet-background input[type=text],
.sheet-charm input,
.sheet-skills input:not(.sheet-narrow),
.sheet-sorcery input:not(.sheet-regular):not(.sheet-narrow),
.sheet-artifacts input,
.sheet-hearthstones input[type=text],
.sheet-languages input[type=text],
.sheet-specialty input[type=text],
.sheet-intimacy > input,
.sheet-merit input[type=text],
.sheet-flaw input[type=text],
label input,
label select
{
-webkit-flex: 1 1 auto;
flex: 1 1 auto;
}
.sheet-intimacy > input { max-width: 220px; }
.sheet-intimacy .sheet-dots { width: 185px; }
.sheet-sorcery .sheet-wide-flex,
.sheet-artifacts .sheet-wide-flex,
.sheet-hearthstones .sheet-wide-flex
{
-webkit-flex: 70%;
flex: 70%;
}
.sheet-sorcery input,
.sheet-artifacts input,
.sheet-artifacts select,
.sheet-hearthstones input,
.sheet-hearthstones select,
.sheet-charm select,
.sheet-charm input,
.sheet-skills input,
.sheet-merit input[type=text],
.sheet-flaw input[type=text] { margin-right: 5px; }
.sheet-artifacts select,
.sheet-hearthstones select:not(:first-of-type) { font-size: 21px; }
label span
{
-webkit-flex: 0 1 auto;
flex: 0 1 auto;
margin-right: 20px;
}
ul.sheet-craft-types
{
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border: 1px solid #3f8ff3;
background-color: #fefefe;
display: none;
list-style-type: none;
padding: 5px;
position: absolute;
width: 190px;
z-index: 5;
}
div.sheet-craft-types:hover ul.sheet-craft-types + div { opacity: 0.4; }
label input[type=text],
label:not(.sheet-dv) input[type=number],
label select,
.sheet-background > input,
.sheet-charm input,
.sheet-charm select,
.sheet-skills input,
.sheet-sorcery input,
.sheet-artifacts input,
.sheet-artifacts select,
.sheet-hearthstones > input,
.sheet-hearthstones select,
.sheet-languages input[type=text],
.sheet-specialty input[type=text],
.sheet-intimacy > input,
.sheet-familiar-health-row select,
.sheet-merit input,
.sheet-flaw input,
.sheet-familiar-attacks > tbody > tr > td > input,
.sheet-health-label,
.sheet-health-value,
.sheet-essence input:not([disabled]),
.sheet-fancy
{
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
background: transparent;
border: 0;
border-bottom: 1px solid #000;
border-radius: 0;
vertical-align: baseline;
}
.sheet-charm select,
.sheet-artifacts select,
.sheet-hearthstones select { margin-bottom: 0; }
label input:focus,
label.sheet-essence input:focus,
label.sheet-soak input:focus,
.sheet-background > input:focus,
.sheet-charm input:focus,
.sheet-skills input:focus,
.sheet-sorcery input:focus,
.sheet-artifacts input:focus,
.sheet-hearthstones > input:focus,
.sheet-languages input[type=text]:focus,
.sheet-specialty input[type=text]:focus,
.sheet-intimacy > input:focus,
.sheet-merit input:focus,
.sheet-flaw input:focus,
.sheet-familiar-attacks > tbody > tr > td > input:focus,
.sheet-essence input:focus,
.sheet-armor > label > input:focus,
.sheet-familiar-row > label > input:focus,
.sheet-fancy:focus { box-shadow: rgba(83, 167, 235, 0.466667) 0 0 6px 0; }
.sheet-soak,
.sheet-dv
{
display: inline-block;
max-width: 70px;
}
.sheet-dv { max-width: 100px; }
.sheet-essence label:not(.sheet-committed),
.sheet-essence input[type=number]
{
display: inline;
padding-right: 0;
}
input[type=radio],
input[type=checkbox]
{
cursor: pointer;
top: 5px;
left: 6px;
width: 16px;
height: 16px;
margin: -10px;
opacity: 0;
position: relative;
z-index: 1;
}
input[type=radio].sheet-tab + span::before,
input[type=checkbox].sheet-tab + span::before
{
-moz-box-shadow: 0 0 2px #ccc;
-webkit-box-shadow: 0 0 2px #ccc;
box-shadow: 0 0 2px #ccc;
border: solid 1px #a8a8a8;
display: inline-block;
line-height: 14px;
text-align: center;
vertical-align: middle;
}
/* background: radial-gradient(#DDC69A, #745035);
margin-right: 0px;
}*/
/*input[type=radio].sheet-tab + span::before
{
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
content:" ";
font-size: 24px;
width: 12px;
height: 12px;
}*/
input[type=checkbox].sheet-tab + span::before
{
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
content: "";
font-size: 12px;
width: 14px;
height: 14px;
}
.sheet-dots input[type=checkbox]:first-child + span::before { opacity: 0.3; }
.sheet-ability input[type=checkbox]:first-child:checked + span::before,
.sheet-will input[type=checkbox]:checked + span::before,
.sheet-hearthstones input[type=checkbox]:checked + span::before,
.sheet-languages input[type=checkbox]:checked + span::before,
.sheet-anima input[type=checkbox]:checked + span::before
{
-moz-box-shadow: 0 0 2px #ccc;
-webkit-box-shadow: 0 0 2px #ccc;
box-shadow: 0 0 2px #ccc;
background: radial-gradient(#f6f6f6,#dfdfdf);
color: #bea000;
content: "?";
}
.sheet-hearthstones input[type=checkbox] + span::before
{
margin-left: -15px;
margin-top: 5px;
}
.sheet-dots input[type=checkbox]:first-child:checked + span::before
{
-moz-box-shadow: 0 0 2px transparent;
-webkit-box-shadow: 0 0 2px transparent;
box-shadow: 0 0 2px transparent;
background: transparent;
border: solid 1px transparent;
color: #a00;
content: "?";
}
.sheet-dots input[type=checkbox]:first-child:hover:checked + span::before,
.sheet-ability input[type=checkbox]:first-child + span::before
{
-moz-box-shadow: 0 0 2px #ccc;
-webkit-box-shadow: 0 0 2px #ccc;
box-shadow: 0 0 2px #ccc;
border: solid 1px #a8a8a8;
margin-right: 4px;
}
.sheet-dots input[type=checkbox]:checked ~ input[type=radio] + span { opacity: 0.5; }
.sheet-health-label,.sheet-health-value { width: 45px; }
.sheet-familiar-health-row select.sheet-health-value { float: none; }
input.sheet-tab
{
width: 100px;
height: 18px;
position:inherit;
}
input.sheet-tab:first-of-type { margin-left: 5px; }
input.sheet-tab:first-of-type + span::before { margin-left: -85px; }
input.sheet-tab + span::before,
input.sheet-tab:checked ~ input.sheet-tab + span::before
{
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background-color: #DDC69A;
background-image: -webkit-gradient(linear, left top, left bottom, from(#DDC69A), to(#745035 ));
background-image: -webkit-linear-gradient(top, #DDC69A, #745035 );
background-image: -moz-linear-gradient(top, #DDC69A, #745035 );
background-image: -ms-linear-gradient(top, #DDC69A, #745035 );
background-image: -o-linear-gradient(top, #DDC69A, #745035 );
background-image: linear-gradient(to bottom, #DDC69A, #745035 );
filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#DDC69A, endColorstr=#745035 );
color: #f8f8f8;
content: attr(title);
font-size: 14px;
font-weight: 700;
width: 100px;
height: 18px;
margin-left: -90px;
margin-right: 10px;
padding-top: 2px;
text-shadow: -1px -1px 0 rgba(0,0,0,0.5);
}
input.sheet-tab:checked + span::before
{
background-color: #62442d;
background-image: -webkit-gradient(linear, left top, left bottom, from(#62442d), to(#d7bb87));
background-image: -webkit-linear-gradient(top, #62442d, #d7bb87);
background-image: -moz-linear-gradient(top, #62442d, #d7bb87);
background-image: -ms-linear-gradient(top, #62442d, #d7bb87);
background-image: -o-linear-gradient(top, #62442d, #d7bb87);
background-image: linear-gradient(to bottom, #62442d, #d7bb87);
filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#62442d, endColorstr=#d7bb87);
border: 1px solid #6a7000;
}
/* Hide actual checkbox */
input[type="checkbox"].sheet-toggle {
opacity: 0;
width: 16px;
height: 16px;
position: relative;
top: 5px;
left: 6px;
margin: -10px;
cursor: pointer;
z-index: 1;
}
input[type="radio"].sheet-toggle {
opacity: 0;
width: 16px;
height: 16px;
position: relative;
top: 5px;
left: 6px;
margin: -10px;
cursor: pointer;
z-index: 1;
}
.sheet-tab-content { display: none; }
.sheet-center,
h3.sheet-ability,
h4,
.sheet-familiar-attacks > tbody > tr > td:nth-child(2),
.sheet-familiar-attacks > tbody > tr > td:nth-child(3),
.sheet-familiar-attacks > tbody > tr > td:nth-child(5),
input[type=number] { text-align: center; }
.sheet-right,
.sheet-background .sheet-dots,
.sheet-specialty .sheet-dots,
.sheet-intimacy .sheet-dots { text-align: right; }
button[type=roll].sheet-blank-roll-button::before,
input[type=radio]:not(.sheet-tab):checked ~ input[type=radio] + span::before,
.sheet-dots input[type=checkbox]:checked ~ input[type=radio] + span::before { content: ""; }
span.sheet-attribute + div,
span.sheet-ability + div,
.sheet-virtue,
[data-groupname=repeating_intimacies] .repitem,
.sheet-combat-equipment .sheet-armor { display: inline-block; }
div.sheet-attribute div,
div.sheet-ability div,
.sheet-health-value { float: right; }
[data-groupname=repeating_charms] .repitem,
.sheet-anima,
.sheet-familiar-attacks,
.sheet-familiar-attacks > tbody > tr > td > input[type=text] { width: 100%; }
.repcontrol,
.sheet-familiar-attacks > tbody > tr:not(:first-child) > td > input { margin-top: 5px; }
div.sheet-craft-types:hover ul.sheet-craft-types,
.sheet-tab-narrative-mode:checked ~ .sheet-tab-narrative-mode,
.sheet-tab-conflict-mode:checked ~ .sheet-tab-conflict-mode,
.sheet-tab-techniques:checked ~ .sheet-tab-techniques,
.sheet-tab-experience-advancement:checked ~ .sheet-tab-experience-advancement,
.sheet-tab-campaign-sheet:checked ~ .sheet-tab-campaign-sheet,
.sheet-tab-twenty-questions:checked ~ .sheet-tab-twenty-questions,
.sheet-tab-npc-sheet:checked ~ .sheet-tab-npc-sheet,
.sheet-tab-army:checked ~ .sheet-tab-army,
.sheet-tab-npc-kata:checked ~ .sheet-tab-npc-kata,
.sheet-tab-npc-artisan:checked ~ .sheet-tab-npc-artisan,
.sheet-tab-npc-martial:checked ~ .sheet-tab-npc-martial,
.sheet-tab-npc-social:checked ~ .sheet-tab-npc-social,
.sheet-tab-npc-scholar:checked ~ .sheet-tab-npc-scholar,
.sheet-tab-npc-trade:checked ~ .sheet-tab-npc-trade,
.sheet-tab-npc-advantages:checked ~ .sheet-tab-npc-advantages,
.sheet-tab-npc-honor:checked ~ .sheet-tab-npc-honor,
.sheet-tab-npc-ninjo:checked ~ .sheet-tab-npc-ninjo,
.sheet-tab-npc-giri:checked ~ .sheet-tab-npc-giri,
.sheet-tab-npc-disadvantages:checked ~ .sheet-tab-npc-disadvantages,
.sheet-tab-npc-demeanor:checked ~ .sheet-tab-npc-demeanor,
.sheet-tab-npc-abilities:checked ~ .sheet-tab-npc-abilities,
.sheet-tab-npc-gear:checked ~ .sheet-tab-npc-gear,
.sheet-tab-npc-gearother:checked ~ .sheet-tab-npc-gearother,
.sheet-tab-npc-kiho:checked ~ .sheet-tab-npc-kiho,
.sheet-tab-npc-rituals:checked ~ .sheet-tab-npc-rituals,
.sheet-tab-npc-invocations:checked ~ .sheet-tab-npc-invocations,
.sheet-tab-npc-shuji:checked ~ .sheet-tab-npc-shuji,
.sheet-tab-kata:checked ~ .sheet-tab-kata,
.sheet-tab-kiho:checked ~ .sheet-tab-kiho,
.sheet-tab-ninjutsu:checked ~ .sheet-tab-ninjutsu,
.sheet-tab-rituals:checked ~ .sheet-tab-rituals,
.sheet-tab-invocations:checked ~ .sheet-tab-invocations,
.sheet-tab-shuji:checked ~ .sheet-tab-shuji,
.sheet-tab-maho:checked ~ .sheet-tab-maho,
.sheet-tab-ninjo:checked ~ .sheet-tab-ninjo,
.sheet-tab-session:checked ~ .sheet-tab-session,
.sheet-tab-npc-sample:checked ~ .sheet-tab-npc-sample { display: block; }
div.sheet-ability > input[type=checkbox]:first-child + span::before,
.sheet-dots input[type=checkbox]:first-child:hover + span::before,
.sheet-dots input[type=checkbox]:first-child:checked + span::before { opacity: 1; }
.sheet-col select {width: 65px; margin-bottom: 0px}
.sheet-center select {width: 65px; margin-bottom: 0px}
.sheet-colleft {
width: 10%;
float: left;
}
.sheet-colright {
width: 10%;
float: right;
}
.sheet-collarge {
width: 80%;
float: left;
}
.sheet-skillselect {
width: 85px;
}
.sheet-spelltable {
width:100%;
}
/* == ROLL TEMPLATE == */
.sheet-rolltemplate-l5r table {
width: 189px;
height: 189px;
padding: 2px;
background: url(http://i.imgur.com/xBk4U1p.jpg) top left;
background-size: 189px 189px;
background-repeat: no-repeat;
font-family: "Papyrus", Papyrus, fantasy;
font-weight: bold;
border-spacing: 0;
}
.sheet-rolltemplate-l5r th {
color: rgb(112, 0, 0);
padding: 15px 2px 2px 20px;
line-height: 1.2em;
font-size: 1.2em;
text-align: left;
}
.sheet-rolltemplate-l5r td {
padding-left: 20px;
font-size: 1.0em;
vertical-align: top;
}
.sheet-rolltemplate-l5r .sheet-result {
font-size: 1.2em;
text-align: center;
color: rgb(112, 0, 0);
padding-bottom: 20px;
}
.sheet-rolltemplate-l5r .inlinerollresult {
background-color: transparent;
color: #000000;
border: none;
}
.sheet-rolltemplate-l5r .inlinerollresult.fullcrit {
color: #3FB315;
border: none;
}
.sheet-rolltemplate-l5r .inlinerollresult.fullfail {
color: #000000;
border: none;
}
.sheet-rolltemplate-l5r .inlinerollresult.importantroll {
color: #3FB315;
border: none;
}
input.sheet-player:checked ~ .sheet-player-sheet,
input.sheet-gm:checked ~ .sheet-gm-sheet {
display: inline-block;
}
input.sheet-player:checked ~ .sheet-player-dice {
display: block;
}
input.sheet-gm:checked ~ div.sheet-tab-content {
display: none;
}
input.sheet-gm:checked ~ div.sheet-tab-gm-dice {
display: block;
}
/* Tooltip container */
.sheet-tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}
/* Tooltip text */
.sheet-tooltip .sheet-tooltiptext {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
padding: 5px 0;
border-radius: 6px;
/* Position the tooltip text - see examples below! */
position: absolute;
z-index: 1;
}
/* Show the tooltip text when you mouse over the tooltip container */
.sheet-tooltip:hover .sheet-tooltiptext {
visibility: visible;
}
/* Fake checkbox */
input[type="checkbox"].sheet-toggle + span::before {
content: "►";
margin-left: .5em;
}
/* Fake checkbox */
input[type="checkbox"].sheet-checkmark + span::before {
margin-right: 4px;
border: solid 1px #a8a8a8;
line-height: 14px;
text-align: center;
display: inline-block;
vertical-align: middle;
box-shadow: 0 0 2px #ccc;
background: #f6f6f6;
background: radial-gradient(#f6f6f6, #dfdfdf);
}
/* Fake checkbox */
input[type="checkbox"].sheet-checkmark + span::before {
content: "";
width: 14px;
height: 14px;
font-size: 12px;
border-radius: 3px;
}
input[type="checkbox"].sheet-checkmark:checked + span::before {
content: "✓";
}
input[type="checkbox"].sheet-toggle:checked + span::before {
margin-right: 4px;
line-height: 14px;
text-align: center;
display: inline-block;
vertical-align: middle;
content: "▼";
width: 14px;
height: 14px;
font-size: 12px;
}