mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-09-01 12:42:32 +00:00
Valanor
b5f8a976ea
General updates: Version 0.5: Bugfixes: -Berrechung des Würfelpools für Zauber und Beschwörungen -Berechnen der Würfelpools für Komplexeformen (Fertigkeit muss neu ausgewählt werden nach update) -Iniziativeberechung wurde überarbeitet -Schiksalswürfel wurden überarbeitet. Die Regeln für eine 1 und 5 bzw 6 Werden nun korrekt verwendet(Ausnahme Explodirende würfel) Neue Funktion: Neben den Einstellungensschatern im Header ist nun einkleiner würfel zum einfachen würfeln von Proben.(nur Kurzer header) Es ist nun Möglich Statusefekte unter Attribute zu hinterelgen. Status effekte können einen Bonus auf Attribute und Fertigkeiten geben. der Bonus kann auch negativ sein. Cyberware und Vorteile und Nachteile können auch Bonis verteilen Alle Bonis sind aktivirbar/deaktivierbar Für Hexerei und Beschwörung sind nurnoch vorgegebene Spezialisierungen möglich Dies ist nötig um die Vorteile im bereich Zaubern und Beschwören zu ererfassen Design: Shadowrun Logo wurde hinzugefügt Diveres kleine Tunings Der Werte für Magie und Kraftpunkte sind nun wie Attribute dargestellt(nötig aufgrund des Bonus-Systems). Zauberei bereich und beschwörungen wurden überarbeitet Technisch: Mit hilfe der Template engine EJS wurde die zukünftige bearbeitung erleichtert. Eine Anleitung zum editiren befindet sich in der Readme.md magische Fertigkeiten und Normale Ferigkeiten wurden vereinheitlicht. English: General updates: Version 0.5: Bugfixes: -Calculation of the dicepool for spells and summons -Calculation of dicepools for complexes (skill must be reselected after update) -Initiative calculation was revised -Wilddice were revised. The rules for a 1 and 5 or 6 are now used correctly (exception: exploding dice). New function: Next to the settings buttons in the header is now a small dice for easy rolling of samples (short header only). It is now possible to store status effects under attributes. Status effects can give a bonus to attributes and skills. the bonus can also be negative. Cyberware and Advantages and Disadvantages can also give bonuses. All bonuses can be activated/deactivated For witchcraft and conjuration only predefined specializations are possible This is necessary to capture the advantages in the area of spellcasting and summoning Design: Shadowrunlogo was added small tunings The values for magic and power points are now displayed like attributes (necessary because of the bonus system). Spellcasting area and summons were reworked Technical: With the help of the template engine EJS the future editing was made easier. A guide for editing can be found in the Readme.md. Magic skills and normal skills were unified.
2456 lines
58 KiB
CSS
2456 lines
58 KiB
CSS
|
|
@import url("https://fonts.googleapis.com/css?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap");
|
|
/* Roll20-Standards überschreiben funktioniert nicht, daher müssen Klassen sein*/
|
|
* {
|
|
background-color: transparent;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
/*https://www.w3schools.com/css/css3_box-sizing.asp*/
|
|
}
|
|
|
|
.charsheet {
|
|
padding: 0px;
|
|
font-family: "Roboto Condensed",sans-serif;
|
|
font-weight: 400;
|
|
--base-color: #906;
|
|
--text-color: #000;
|
|
--text-gray: #404040;
|
|
--base-backcolor2: #FFFFFF;
|
|
--base-backcolor3: #edeaef;
|
|
--select-backcolor: #460141;
|
|
--base-backcolor:#e0f2f8;
|
|
--base-border-color:#E5E5E5;
|
|
--section-backcolor:#cacaca;
|
|
--section-backcolor-select: #d8d8d8;
|
|
--base-backcolor-alternate-color:#c1bebe;
|
|
--base-warning-color:#B31515;
|
|
--base-crit-color:#3FB315;
|
|
--box-shadow: #906;
|
|
--boxsize:20px;
|
|
--base-padding: 0.4rem;
|
|
--base-padding-neg: -0.4rem;
|
|
--fontsize-button: 1.1rem;
|
|
--fontsize-medium:12px;
|
|
--fontsize-base: 1.2rem;
|
|
--fontsize-seltab: 1.4rem;
|
|
--fontsize-hover: 1.8rem;
|
|
/* Clear default button styling */
|
|
/* condition monitor */
|
|
/* action monitor*/
|
|
/* show the selected tab */
|
|
/*allgemeine Dinge*/
|
|
/*https://wiki.roll20.net/CSS_Wizardry#Icon_Fonts*/
|
|
/*NEVER TRY TO CSS INPUT TYPE=CHECKBOX!*/
|
|
/*Config input*/
|
|
/*Farbschema:*/
|
|
/*making the specialisation and expertise roll buttons appear/disappear*/
|
|
/*Tabset */
|
|
/* show the selected tab */
|
|
/* SWITCHES
|
|
============================= */
|
|
/* The switch - the box around the slider 50x24*/
|
|
/* Hide default HTML checkbox */
|
|
/* The slider 34 .4s*/
|
|
/*remove up/down arrows https://app.roll20.net/forum/post/901339/turning-off-the-arrows-in-a-number-field-when-input-is-disabled*/
|
|
}
|
|
|
|
.charsheet .logo {
|
|
background-image: url(https://www.shadowrun6.de/templates/shadowrun6/img/sr-logo-schriftzug.png);
|
|
background-repeat: no-repeat;
|
|
background-size: 250px;
|
|
background-position: right top;
|
|
width: 350px;
|
|
height: 150px;
|
|
position: absolute;
|
|
right: 50px;
|
|
top: 75px;
|
|
}
|
|
|
|
.charsheet input[value="1"].largefont ~ * {
|
|
--fontsize-button: 1.3rem;
|
|
--fontsize-medium:14px;
|
|
--fontsize-base: 1.6rem;
|
|
--fontsize-seltab: 1.6rem;
|
|
}
|
|
|
|
.charsheet input[value="1"].darkstyle ~ * {
|
|
--base-color: rgb(188, 194, 188);
|
|
--text-color: rgb(105, 105, 105);
|
|
--text-gray: #afafaf;
|
|
--base-backcolor2: #414141;
|
|
--base-backcolor3: #555744;
|
|
--select-backcolor: #460141;
|
|
--base-backcolor:#262b2b;
|
|
--base-border-color:#E5E5E5;
|
|
--box-shadow: #000;
|
|
--section-backcolor:rgb(88, 2, 60);
|
|
--section-backcolor-select: rgb(80 80 80);
|
|
--base-backcolor-alternate-color: rgb(88, 2, 60);
|
|
--base-warning-color:#B31515;
|
|
--base-crit-color:#3FB315;
|
|
}
|
|
|
|
.charsheet button.direction {
|
|
margin: 0;
|
|
overflow: visible;
|
|
text-transform: none;
|
|
border-style: none;
|
|
padding: 0;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.charsheet span.unchecked {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet input.direction:not([value="checked"]) + button.healthbutton > span.checked,
|
|
.charsheet input.direction:not([value="checked"]) + button.healthbutton-startofblock > span.checked {
|
|
color: transparent;
|
|
-webkit-transition: color 0.5s;
|
|
transition: color 0.5s;
|
|
}
|
|
|
|
.charsheet input.direction[value="checked"] + button.healthbutton > span.checked,
|
|
.charsheet input.direction[value="checked"] + button.healthbutton-startofblock > span.checked {
|
|
color: var(--base-color);
|
|
-webkit-transition: color 0.5s;
|
|
transition: color 0.5s;
|
|
}
|
|
|
|
.charsheet button[type=action].healthbutton:hover span.checked, .charsheet button[type=action].healthbutton-startofblock:hover span.checked {
|
|
color: var(--base-backcolor2) !important;
|
|
}
|
|
|
|
.charsheet input.direction:not([value="struck"]) + button.actionbutton > span.struck,
|
|
.charsheet input.direction:not([value="unstruck"]) + button.actionbutton > span.unstruck,
|
|
.charsheet input.direction:not([value="struck"]) + button.minoractionbutton > span.struck,
|
|
.charsheet input.direction:not([value="unstruck"]) + button.minoractionbutton > span.unstruck {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet input[type=checkbox] {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide:checked + h4::before,
|
|
.charsheet input[type=checkbox].toggle-hide:checked + div h4.collapsearrow::before {
|
|
content: "►";
|
|
color: var(--base-color);
|
|
font-size: 0.95rem;
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg);
|
|
display: inline-block;
|
|
-webkit-transition: -webkit-transform 0.5s;
|
|
transition: -webkit-transform 0.5s;
|
|
transition: transform 0.5s;
|
|
transition: transform 0.5s, -webkit-transform 0.5s;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide:not(:checked) + h4::before,
|
|
.charsheet input[type=checkbox].toggle-hide:not(:checked) + div h4.collapsearrow::before {
|
|
content: "►";
|
|
color: var(--base-color);
|
|
font-size: 0.95rem;
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
-webkit-transition: -webkit-transform 0.5s;
|
|
transition: -webkit-transform 0.5s;
|
|
transition: transform 0.5s;
|
|
transition: transform 0.5s, -webkit-transform 0.5s;
|
|
display: inline-block;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide:checked + h4.invert::before {
|
|
content: "►";
|
|
color: var(--base-color);
|
|
font-size: 0.95rem;
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
display: inline-block;
|
|
-webkit-transition: -webkit-transform 0.5s;
|
|
transition: -webkit-transform 0.5s;
|
|
transition: transform 0.5s;
|
|
transition: transform 0.5s, -webkit-transform 0.5s;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide:not(:checked) + h4.invert::before {
|
|
content: "►";
|
|
color: var(--base-color);
|
|
font-size: 0.95rem;
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg);
|
|
-webkit-transition: -webkit-transform 0.5s;
|
|
transition: -webkit-transform 0.5s;
|
|
transition: transform 0.5s;
|
|
transition: transform 0.5s, -webkit-transform 0.5s;
|
|
display: inline-block;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.charsheet div.togglesection {
|
|
width: 100%;
|
|
}
|
|
|
|
.charsheet div.rangeWeapon {
|
|
max-height: 300px;
|
|
-webkit-transition: max-height 0.5s ease-in-out;
|
|
transition: max-height 0.5s ease-in-out;
|
|
}
|
|
|
|
.charsheet label.collapse {
|
|
max-width: 25px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.charsheet div.rangeWeapon label {
|
|
display: inline;
|
|
width: 20px;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide-not:checked + div.rangeWeapon,
|
|
.charsheet input[type=checkbox].toggle-hide:checked + div.rangeWeapon {
|
|
max-height: 24px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide-not:checked + div.collapseble,
|
|
.charsheet input[type=checkbox].toggle-hide:checked + div.collapseble {
|
|
max-height: 29px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.charsheet div.collapseble {
|
|
max-height: 300px;
|
|
-webkit-transition: max-height 1s;
|
|
transition: max-height 1s;
|
|
}
|
|
|
|
.charsheet div.conditionmonitorbutton {
|
|
padding: 0px;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide:checked + div.conditionmonitorbutton,
|
|
.charsheet input[type=checkbox].toggle-hide:not(:checked) + div.togglesection,
|
|
.charsheet input[type=checkbox].toggle-hide-not:not(:checked) + div.togglesection,
|
|
.charsheet input[type=checkbox].toggle-hide-invert:checked + div.togglesection,
|
|
.charsheet input[type=checkbox].toggle-hide-invert-not:checked + div.togglesection,
|
|
.charsheet input[type=checkbox].toggle-hide:not(:checked) + div.table-row-flat,
|
|
.charsheet input[type=checkbox].toggle-hide:not(:checked) + div.table-row,
|
|
.charsheet input[type=checkbox].toggle-hide:checked + button.iconbutton,
|
|
.charsheet input[type=checkbox].toggle-hide-invert:not(:checked) + button.iconbutton {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet input[type=checkbox] {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
outline-style: none;
|
|
font-size: 1.8rem;
|
|
background-color: var(--base-backcolor2);
|
|
border: solid;
|
|
border-radius: 1px;
|
|
border-width: 1px;
|
|
border-color: var(--base-backcolor2);
|
|
-webkit-transition: font-size 0.25s, color 0.25s, border-color 0.25s;
|
|
transition: font-size 0.25s, color 0.25s, border-color 0.25s;
|
|
color: var(--text-color);
|
|
width: 13px;
|
|
height: 13px;
|
|
line-height: 7px;
|
|
}
|
|
|
|
.charsheet input[type=checkbox]::after {
|
|
/* font-family: "pictos"; */
|
|
content: " ";
|
|
}
|
|
|
|
.charsheet input[type=checkbox]:hover {
|
|
border-color: var(--base-color);
|
|
}
|
|
|
|
.charsheet input[type=checkbox]:hover:not(:checked)::after {
|
|
font-family: "pictos";
|
|
content: "3";
|
|
opacity: 0.5;
|
|
color: var(--base-crit-color);
|
|
}
|
|
|
|
.charsheet input[type=checkbox]:checked::after {
|
|
color: var(--base-crit-color);
|
|
font-family: "pictos";
|
|
content: "3";
|
|
}
|
|
|
|
.charsheet input[type=checkbox]:hover:checked:not(:focus):after {
|
|
font-family: "pictos";
|
|
content: "3";
|
|
opacity: 0.5;
|
|
color: var(--base-warning-color);
|
|
}
|
|
|
|
.charsheet input[type=checkbox].eye {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
font-size: var(--fontsize-base);
|
|
background-color: transparent;
|
|
border: none;
|
|
-webkit-transition: font-size 0.25s, color 0.25s;
|
|
transition: font-size 0.25s, color 0.25s;
|
|
color: var(--text-color);
|
|
vertical-align: baseline;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].eye:hover {
|
|
font-size: var(--fontsize-seltab);
|
|
color: var(--base-color);
|
|
}
|
|
|
|
.charsheet input[type=checkbox].eye::after {
|
|
font-family: "pictos";
|
|
content: "E";
|
|
color: var(--text-color);
|
|
}
|
|
|
|
.charsheet input[type=checkbox].eye:checked::after {
|
|
font-family: "pictos";
|
|
content: "d";
|
|
color: var(--text-color);
|
|
}
|
|
|
|
.charsheet input[type=checkbox].eye:hover:checked:not(:focus):after {
|
|
font-family: "pictos";
|
|
content: "d";
|
|
opacity: 1;
|
|
color: var(--base-color);
|
|
}
|
|
|
|
.charsheet input[type=checkbox].eye:hover:not(:checked)::after {
|
|
font-family: "pictos";
|
|
content: "E";
|
|
opacity: 1;
|
|
color: var(--base-color);
|
|
}
|
|
|
|
.charsheet div.edgetoken {
|
|
-webkit-filter: grayscale(0);
|
|
filter: grayscale(0);
|
|
-webkit-transition: -webkit-filter 0.5s;
|
|
transition: -webkit-filter 0.5s;
|
|
transition: filter 0.5s;
|
|
transition: filter 0.5s, -webkit-filter 0.5s;
|
|
}
|
|
|
|
.charsheet div.edgetoken label {
|
|
padding: 0px;
|
|
margin-bottom: 1px;
|
|
}
|
|
|
|
.charsheet div.edgetoken:hover, .charsheet div.edgetoken:hover ~ div.edgetoken {
|
|
-webkit-filter: blur(1px);
|
|
filter: blur(1px);
|
|
-webkit-transition: -webkit-filter 0.5s;
|
|
transition: -webkit-filter 0.5s;
|
|
transition: filter 0.5s;
|
|
transition: filter 0.5s, -webkit-filter 0.5s;
|
|
}
|
|
|
|
.charsheet div.edgetoken label img {
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide-edge:checked + div.edgetoken {
|
|
-webkit-filter: grayscale(1) brightness(2) opacity(0.25);
|
|
filter: grayscale(1) brightness(2) opacity(0.25);
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide-edge:checked + div.edgetoken:hover {
|
|
-webkit-filter: grayscale(0.7);
|
|
filter: grayscale(0.7);
|
|
}
|
|
|
|
.charsheet .toggle-hide:not(:checked) + input,
|
|
.charsheet .toggle-hide:not(:checked) + select {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet input[type=checkbox].toggle-hide-not:not(:checked) + div.togglesection,
|
|
.charsheet input[type=checkbox].toggle-hide-invert:checked + div.togglesection,
|
|
.charsheet button[type=action] {
|
|
background-image: none;
|
|
border-color: var(--base-backcolor2);
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
color: var(--base-color);
|
|
text-shadow: none;
|
|
outline-style: none;
|
|
-webkit-transition: border-color 0.5s;
|
|
transition: border-color 0.5s;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.charsheet button[type=action]:hover {
|
|
border-color: var(--base-color);
|
|
}
|
|
|
|
.charsheet div.rightalign {
|
|
position: relative;
|
|
float: right;
|
|
}
|
|
|
|
.charsheet button[type=action].rightalign {
|
|
position: relative;
|
|
float: right;
|
|
}
|
|
|
|
.charsheet button[type=action].slim {
|
|
height: 20px;
|
|
}
|
|
|
|
.charsheet button[type=action].togglebutton {
|
|
background-color: var(--select-backcolor);
|
|
font-size: var(--fontsize-button);
|
|
margin-bottom: 2px;
|
|
/*margin-left: 50px;*/
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
width: 100px;
|
|
}
|
|
|
|
.charsheet button[type=action].spelltogglebutton, .charsheet label input span.spelltogglebutton {
|
|
background-color: var(--base-backcolor2);
|
|
border: 0px;
|
|
font-size: var(--fontsize-button);
|
|
height: 18px;
|
|
margin-left: 5px;
|
|
margin-top: 2px;
|
|
text-align: left;
|
|
width: 133px;
|
|
}
|
|
|
|
.charsheet button[type=action].mini-togglebutton {
|
|
background-color: var(--base-backcolor2);
|
|
border: 0px;
|
|
font-size: var(--fontsize-button);
|
|
height: 18px;
|
|
margin-bottom: 2px;
|
|
/*margin-left: 50px;*/
|
|
margin-right: 1px;
|
|
padding: 2px 1px;
|
|
text-align: left;
|
|
width: 50px;
|
|
}
|
|
|
|
.charsheet button[type=action].bluebutton {
|
|
background-image: none;
|
|
border: 1px solid var(--base-backcolor);
|
|
color: var(--base-color);
|
|
font-size: var(--fontsize-button);
|
|
padding: 0px;
|
|
padding-left: 3px;
|
|
padding-right: 3px;
|
|
text-shadow: none;
|
|
}
|
|
|
|
.charsheet button[type=action].headlinebutton {
|
|
background-color: var(--base-backcolor2);
|
|
background-image: none;
|
|
border: 2px solid var(--base-backcolor2);
|
|
border-top-left-radius: 10px;
|
|
color: var(--base-color);
|
|
height: 22px;
|
|
line-height: 18px;
|
|
/* padding: 2px;*/
|
|
-webkit-transition: border-color 1s, border-top-left-radius 1s,background-color 1s,color 1s;
|
|
transition: border-color 1s, border-top-left-radius 1s,background-color 1s,color 1s;
|
|
}
|
|
|
|
.charsheet button[type=action].headlinebutton:hover {
|
|
border-color: var(--base-color);
|
|
}
|
|
|
|
.charsheet button[type=action].headlinebutton:focus {
|
|
border-color: var(--base-color);
|
|
outline-style: none;
|
|
}
|
|
|
|
.charsheet .tabstoggle[value="copyright"] ~ button.tabcopyright,
|
|
.charsheet .tabstoggle[value="chardata"] ~ button.tabchardata,
|
|
.charsheet .tabstoggle[value="attributes"] ~ button.tabattributes,
|
|
.charsheet .tabstoggle[value="skills"] ~ button.tabskills,
|
|
.charsheet .tabstoggle[value="attacks"] ~ button.tabattacks,
|
|
.charsheet .tabstoggle[value="magic"] ~ button.tabmagic,
|
|
.charsheet .tabstoggle[value="matrix"] ~ button.tabmatrix,
|
|
.charsheet .tabstoggle[value="rigging"] ~ button.tabrigging,
|
|
.charsheet .tabstoggle[value="contacts"] ~ button.tabcontacts,
|
|
.charsheet .tabstoggle[value="gear"] ~ button.tabgear,
|
|
.charsheet .tabstoggle[value="notes"] ~ button.tabnotes,
|
|
.charsheet .tabstoggle[value="configuration"] ~ button.tabconfig {
|
|
background-color: var(--base-color);
|
|
color: var(--base-backcolor2);
|
|
border-color: var(--base-color);
|
|
font-size: var(--fontsize-seltab);
|
|
}
|
|
|
|
.charsheet button[type=action].edgebutton {
|
|
background-image: none;
|
|
border: 2px solid var(--base-backcolor2);
|
|
color: var(--base-color);
|
|
text-align: center;
|
|
line-height: 18px;
|
|
padding: 2px;
|
|
min-width: 80px;
|
|
max-width: 80px;
|
|
}
|
|
|
|
.charsheet button[type=action].edgebuttonshort {
|
|
background-image: none;
|
|
border: 1px solid var(--base-backcolor2);
|
|
color: var(--base-color);
|
|
text-align: center;
|
|
line-height: 18px;
|
|
padding: 2px;
|
|
min-width: 22px;
|
|
max-width: 22px;
|
|
-webkit-transition: border 0.5s;
|
|
transition: border 0.5s;
|
|
}
|
|
|
|
.charsheet button[type=action].edgebuttonshort:hover {
|
|
border: 1px solid var(--base-color);
|
|
}
|
|
|
|
.charsheet button[type=action].actionbutton {
|
|
background-image: none;
|
|
border: 2px solid var(--base-backcolor2);
|
|
color: var(--base-color);
|
|
line-height: 18px;
|
|
margin-top: 5px;
|
|
max-width: 121px;
|
|
min-width: 121px;
|
|
padding: 2px;
|
|
text-align: center;
|
|
-webkit-transition: border 0.5s;
|
|
transition: border 0.5s;
|
|
}
|
|
|
|
.charsheet button[type=action].minoractionbutton {
|
|
background-image: none;
|
|
border: 2px solid var(--base-backcolor2);
|
|
color: var(--base-color);
|
|
font-size: var(--fontsize-button);
|
|
line-height: 14px;
|
|
margin-top: 5px;
|
|
max-width: 46px;
|
|
min-width: 46px;
|
|
padding: 2px;
|
|
text-align: center;
|
|
-webkit-transition: border 0.5s;
|
|
transition: border 0.5s;
|
|
}
|
|
|
|
.charsheet button[type=action].resetbutton {
|
|
background-image: none;
|
|
border: 2px solid var(--base-backcolor2);
|
|
color: var(--base-color);
|
|
text-align: center;
|
|
line-height: 18px;
|
|
padding: 2px;
|
|
min-width: 90px;
|
|
max-width: 90px;
|
|
vertical-align: sub;
|
|
-webkit-transition: border 0.5s;
|
|
transition: border 0.5s;
|
|
}
|
|
|
|
.charsheet button[type=action].minoractionbutton:hover, .charsheet button[type=action].actionbutton:hover, .charsheet button[type=action].resetbutton:hover {
|
|
border: 2px solid var(--base-color);
|
|
-webkit-transition: border 0.5s;
|
|
transition: border 0.5s;
|
|
}
|
|
|
|
.charsheet button[type=action].longer {
|
|
max-width: 50px;
|
|
min-width: 50px;
|
|
}
|
|
|
|
.charsheet button[type=action].healthbutton, .charsheet button[type=action].healthbutton-startofblock {
|
|
background-image: none;
|
|
border: 1px solid var(--base-backcolor2);
|
|
color: var(--base-color);
|
|
font-size: var(--fontsize-medium);
|
|
height: var(--boxsize);
|
|
margin-left: 0px;
|
|
max-width: var(--boxsize);
|
|
min-width: var(--boxsize);
|
|
padding: 2px;
|
|
padding-top: 0px;
|
|
vertical-align: middle;
|
|
-webkit-transition: border 0.2s,color 0.2s;
|
|
transition: border 0.2s,color 0.2s;
|
|
}
|
|
|
|
.charsheet button[type=action].healthbutton:hover, .charsheet button[type=action].healthbutton-startofblock:hover {
|
|
border: 2px solid var(--base-color);
|
|
color: var(--base-backcolor2);
|
|
}
|
|
|
|
.charsheet button[type=roll] {
|
|
background-color: var(--base-backcolor2);
|
|
background-image: none;
|
|
color: var(--base-color);
|
|
font-size: 1.3em;
|
|
text-shadow: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.charsheet button[type=roll] span {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.charsheet button[type=roll].magicrollbutton {
|
|
width: 138px;
|
|
}
|
|
|
|
.charsheet button[type=roll].shortcutbutton {
|
|
background-color: var(--base-backcolor2);
|
|
font-size: var(--fontsize-base);
|
|
margin-bottom: 7px;
|
|
/*margin-left: 50px;*/
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
width: 245px;
|
|
}
|
|
|
|
.charsheet button[type=roll].postbutton {
|
|
background-color: var(--base-backcolor2);
|
|
font-size: 0.8em;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
width: 200px;
|
|
}
|
|
|
|
.charsheet button[type=roll].smallbutton {
|
|
background-color: var(--base-backcolor2);
|
|
font-size: 0.8em;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
width: 42px;
|
|
}
|
|
|
|
.charsheet button[type=roll].iconbutton {
|
|
FONT-WEIGHT: 100;
|
|
background-color: transparent;
|
|
border-radius: 0%;
|
|
border: none;
|
|
color: var(--text-color);
|
|
/* font-size: 0.8em; */
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
outline-style: none;
|
|
width: 25px;
|
|
height: 25px;
|
|
-webkit-transition: color 0.5s, background-color 0.5s;
|
|
transition: color 0.5s, background-color 0.5s;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.charsheet button[type=roll].iconbutton::before,
|
|
.charsheet button[type=roll].iconbutton50::before,
|
|
.charsheet button[type=roll].iconbutton70::before,
|
|
.charsheet button[type=roll].longbutton::before,
|
|
.charsheet button[type=roll].mediumlongbutton::before,
|
|
.charsheet button[type=roll].mediumbutton::before,
|
|
.charsheet button[type=roll].widesmallbutton::before,
|
|
.charsheet button[type=roll].magicrollbutton::before,
|
|
.charsheet button[type=roll].shortcutbutton::before,
|
|
.charsheet button[type=roll].smallbutton::before {
|
|
content: "E";
|
|
font-family: "dicefontd6";
|
|
}
|
|
|
|
.charsheet button[type=roll].postbutton::before {
|
|
content: "w";
|
|
font-size: 1.3rem;
|
|
font-family: "pictos";
|
|
}
|
|
|
|
.charsheet button[type=roll].inibutton::before {
|
|
content: "t";
|
|
font-size: 1.3rem;
|
|
font-family: "pictos";
|
|
}
|
|
|
|
.charsheet button[type=roll].iconbutton50 {
|
|
FONT-WEIGHT: 100;
|
|
background-color: transparent;
|
|
border-radius: 0%;
|
|
border: none;
|
|
color: var(--text-color);
|
|
/* font-size: 0.8em; */
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
outline-style: none;
|
|
width: 50px;
|
|
height: 25px;
|
|
-webkit-transition: color 0.2s, background-color 0.2s;
|
|
transition: color 0.2s, background-color 0.2s;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.charsheet button[type=roll].iconbutton50 span.red {
|
|
line-height: inherit;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.charsheet button[type=roll].iconbutton70 {
|
|
FONT-WEIGHT: 100;
|
|
background-color: transparent;
|
|
border-radius: 0%;
|
|
border: none;
|
|
color: var(--text-color);
|
|
/* font-size: 0.8em; */
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
outline-style: none;
|
|
width: 70px;
|
|
height: 25px;
|
|
-webkit-transition: color 0.2s, background-color 0.2s,font-size 0.2s;
|
|
transition: color 0.2s, background-color 0.2s,font-size 0.2s;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.charsheet button[type=roll].iconbutton:hover, .charsheet button[type=roll].iconbutton50:hover, .charsheet button[type=roll].iconbutton70:hover {
|
|
color: var(--base-color);
|
|
font-size: 1.5em;
|
|
}
|
|
|
|
.charsheet button[type=roll].widesmallbutton {
|
|
background-color: var(--base-backcolor2);
|
|
font-size: 0.8em;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
width: 52px;
|
|
}
|
|
|
|
.charsheet button[type=roll].mediumbutton {
|
|
background-color: var(--base-backcolor2);
|
|
font-size: 0.8em;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
width: 72px;
|
|
}
|
|
|
|
.charsheet button[type=roll].mediumlongbutton {
|
|
background-color: var(--base-backcolor2);
|
|
font-size: 0.8em;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: center;
|
|
width: 130px;
|
|
}
|
|
|
|
.charsheet button[type=roll].longbutton {
|
|
background-color: var(--base-backcolor2);
|
|
font-size: 0.8em;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: center;
|
|
width: 195px;
|
|
}
|
|
|
|
.charsheet button[type=roll].illigalbutton, .charsheet button[type=roll].illigalbutton span {
|
|
color: var(--base-warning-color);
|
|
font-weight: 700;
|
|
}
|
|
|
|
.charsheet button[type=roll].hiddensmallbutton {
|
|
font-size: 0.8em;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
width: 72px;
|
|
visibility: hidden;
|
|
}
|
|
|
|
.charsheet button[type=roll].invisbutton {
|
|
display: none;
|
|
font-size: 0.8em;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
text-align: left;
|
|
width: 72px;
|
|
}
|
|
|
|
.charsheet div {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.charsheet div.repcontainer[data-groupname="repeating_meleeweapons"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_rangeweapons"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_vehicle"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_sprites"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_contacts"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_armor"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_cyberware"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_gear"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_perks"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_adeptpowers"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_spirits"] > .repitem {
|
|
background-color: var(--base-backcolor3);
|
|
border: none;
|
|
display: inline-block;
|
|
margin: 5px;
|
|
padding: 2px;
|
|
-webkit-box-shadow: 2px 2px 2px var(--box-shadow);
|
|
box-shadow: 2px 2px 2px var(--box-shadow);
|
|
-webkit-transition: max-height 1s;
|
|
transition: max-height 1s;
|
|
width: 90%;
|
|
}
|
|
|
|
.charsheet div.repcontainer[data-groupname="repeating_meleeweapons"] > .repitem {
|
|
width: 200px;
|
|
}
|
|
|
|
.charsheet div.repcontainer[data-groupname="repeating_rangeweapons"] > .repitem {
|
|
width: 700px;
|
|
max-height: 500px;
|
|
}
|
|
|
|
.charsheet div.repcontainer[data-groupname="repeating_contacts"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_armor"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_gear"] > .repitem,
|
|
.charsheet div.repcontainer[data-groupname="repeating_cyberware"] > .repitem {
|
|
margin: 0px;
|
|
margin-left: 5px;
|
|
margin-bottom: 3px;
|
|
min-width: 700px;
|
|
width: 720px;
|
|
}
|
|
|
|
.charsheet div.repcontainer[data-groupname="repeating_vehicle"] > .repitem {
|
|
margin-left: 5px;
|
|
margin-bottom: 3px;
|
|
min-width: 700px;
|
|
max-height: 500px;
|
|
}
|
|
|
|
.charsheet div.repcontainer[data-groupname="repeating_spirits"] > .repitem {
|
|
margin-left: 5px;
|
|
margin-bottom: 3px;
|
|
min-height: 25px;
|
|
min-width: 700px;
|
|
max-height: 500px;
|
|
}
|
|
|
|
.charsheet div.repcontainer[data-groupname="repeating_sprites"] > .repitem {
|
|
margin-left: 5px;
|
|
margin-bottom: 3px;
|
|
min-width: 700px;
|
|
max-height: 500px;
|
|
}
|
|
|
|
.charsheet div.repcontainer[data-groupname="repeating_spells"] > .repitem {
|
|
height: auto;
|
|
min-width: 700px;
|
|
max-height: 500px;
|
|
}
|
|
|
|
.charsheet div.spellbox {
|
|
background-color: var(--base-backcolor3);
|
|
border: none;
|
|
display: inline-block;
|
|
margin: 5px;
|
|
padding: 2px;
|
|
-webkit-box-shadow: 2px 2px 2px var(--box-shadow);
|
|
box-shadow: 2px 2px 2px var(--box-shadow);
|
|
-webkit-transition: max-height 1s;
|
|
transition: max-height 1s;
|
|
width: 90%;
|
|
max-height: 300px;
|
|
transition: max-height 1s;
|
|
}
|
|
|
|
.charsheet div.wholedocument {
|
|
background-color: var(--base-backcolor);
|
|
border: none;
|
|
/*padding: 5px;*/
|
|
-webkit-box-shadow: 8px 9px 10px 0px #949494;
|
|
box-shadow: 8px 9px 10px 0px #949494;
|
|
border-bottom: 30px solid var(--base-backcolor);
|
|
border-top: 30px solid var(--base-backcolor);
|
|
/* border-left: transparent solid 30px; */
|
|
border-radius: 0px 30px 15px 0px;
|
|
}
|
|
|
|
.charsheet div.inline {
|
|
display: inline-block;
|
|
}
|
|
|
|
.charsheet div.center {
|
|
text-align: center;
|
|
}
|
|
|
|
.charsheet div.margin-fifty {
|
|
margin-left: 50px;
|
|
}
|
|
|
|
.charsheet div.slider-label, .charsheet span.slider-label {
|
|
display: inline-block;
|
|
color: var(--text-gray);
|
|
font-size: var(--fontsize-medium);
|
|
line-height: 14px;
|
|
}
|
|
|
|
.charsheet div.whiteborder {
|
|
border: 1px solid var(--base-backcolor2);
|
|
margin-bottom: 5px;
|
|
margin-top: 5px;
|
|
width: 100%;
|
|
line-height: 22px;
|
|
}
|
|
|
|
.charsheet div.edgetokengraphic {
|
|
background: radial-gradient(5px -9px, circle, #906 8%, black 26px);
|
|
background: -webkit-radial-gradient(5px -9px, circle, #906 8%, black 26px);
|
|
background-color: red;
|
|
border: 2px solid #906;
|
|
border-radius: 12px;
|
|
/* one half of ( (border * 2) + height + padding ) */
|
|
-webkit-box-shadow: 1px 1px 1px black;
|
|
box-shadow: 1px 1px 1px black;
|
|
color: white;
|
|
font-size: 1.0rem;
|
|
line-height: 12px;
|
|
height: 23px;
|
|
padding: 4px 3px 0 3px;
|
|
text-align: center;
|
|
min-width: 23px;
|
|
}
|
|
|
|
.charsheet div.header,
|
|
.charsheet div.range-table {
|
|
display: table;
|
|
padding: var(--base-padding);
|
|
width: inherit;
|
|
}
|
|
|
|
.charsheet div.tabpanel {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
width: inherit;
|
|
background-color: var(--base-backcolor-alternate-color);
|
|
border-bottom: solid var(--base-color);
|
|
}
|
|
|
|
.charsheet div.sectionheader {
|
|
padding: var(--base-padding);
|
|
background-color: var(--section-backcolor);
|
|
border-bottom-color: var(--base-color);
|
|
border-bottom-width: thin;
|
|
border-bottom-style: solid;
|
|
border-radius: 10px 0px 0px 10px;
|
|
margin-left: 3px;
|
|
}
|
|
|
|
.charsheet div.sectionheaderstatic {
|
|
padding: var(--base-padding);
|
|
background-color: var(--section-backcolor);
|
|
border-bottom-color: var(--base-color);
|
|
border-bottom-width: thin;
|
|
border-bottom-style: solid;
|
|
border-radius: 10px 0px 0px 10px;
|
|
}
|
|
|
|
.charsheet div.sectionheader + input + div.togglesection {
|
|
padding-top: 10px;
|
|
padding-left: 10px;
|
|
-webkit-box-shadow: inset 9px 7px 9px -6px var(--text-gray);
|
|
box-shadow: inset 9px 7px 9px -6px var(--text-gray);
|
|
border-left: solid 5px;
|
|
/* margin-left: 3px; */
|
|
border-radius: 10px 0px 0px 10px;
|
|
}
|
|
|
|
.charsheet div.sectionheader:hover {
|
|
background-color: var(--section-backcolor-select);
|
|
margin-left: 0px;
|
|
}
|
|
|
|
.charsheet div.sectionheader label {
|
|
margin: 0px;
|
|
}
|
|
|
|
.charsheet div.repeating-header {
|
|
width: 720px;
|
|
}
|
|
|
|
.charsheet div.repeating-header90 {
|
|
width: 90%;
|
|
margin-left: var(--base-padding);
|
|
}
|
|
|
|
.charsheet div.flexcontainer {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.charsheet div.flexcontainer > * {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1;
|
|
flex: 1;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.charsheet div.flex-center {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.charsheet div.flex-table {
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
padding: var(--base-padding);
|
|
-ms-flex-item-align: start;
|
|
align-self: flex-start;
|
|
}
|
|
|
|
.charsheet div.flex-table > div {
|
|
padding-bottom: var(--base-padding);
|
|
}
|
|
|
|
.charsheet div.flex--al-center {
|
|
text-align: center;
|
|
}
|
|
|
|
.charsheet div.flex--warp {
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.charsheet span.flex--half, .charsheet div.flex--half,
|
|
.charsheet input.flex--half, .charsheet button.flex--half {
|
|
-webkit-box-flex: 0.5;
|
|
-ms-flex: 0.5;
|
|
flex: 0.5;
|
|
}
|
|
|
|
.charsheet span.flex--2, .charsheet div.flex--2,
|
|
.charsheet input.flex--2, .charsheet button.flex--2 {
|
|
-webkit-box-flex: 2;
|
|
-ms-flex: 2;
|
|
flex: 2;
|
|
}
|
|
|
|
.charsheet span.flex--3, .charsheet div.flex--3,
|
|
.charsheet input.flex--3, .charsheet button.flex--3 {
|
|
-webkit-box-flex: 3;
|
|
-ms-flex: 3;
|
|
flex: 3;
|
|
}
|
|
|
|
.charsheet span.flex--4, .charsheet div.flex--4,
|
|
.charsheet input.flex--4, .charsheet button.flex--4 {
|
|
-webkit-box-flex: 4;
|
|
-ms-flex: 4;
|
|
flex: 4;
|
|
}
|
|
|
|
.charsheet span.flex--5, .charsheet div.flex--5,
|
|
.charsheet input.flex--5, .charsheet button.flex--5 {
|
|
-webkit-box-flex: 5;
|
|
-ms-flex: 5;
|
|
flex: 5;
|
|
}
|
|
|
|
.charsheet span.flex--6, .charsheet div.flex--6,
|
|
.charsheet input.flex--6, .charsheet button.flex--6 {
|
|
-webkit-box-flex: 6;
|
|
-ms-flex: 6;
|
|
flex: 6;
|
|
}
|
|
|
|
.charsheet span.flex--7, .charsheet div.flex--7,
|
|
.charsheet input.flex--7, .charsheet button.flex--7 {
|
|
-webkit-box-flex: 7;
|
|
-ms-flex: 7;
|
|
flex: 7;
|
|
}
|
|
|
|
.charsheet span.flex--8, .charsheet div.flex--8,
|
|
.charsheet input.flex--8, .charsheet button.flex--8 {
|
|
-webkit-box-flex: 8;
|
|
-ms-flex: 8;
|
|
flex: 8;
|
|
}
|
|
|
|
.charsheet span.flex--9, .charsheet div.flex--9,
|
|
.charsheet input.flex--9, .charsheet button.flex--9 {
|
|
-webkit-box-flex: 9;
|
|
-ms-flex: 9;
|
|
flex: 9;
|
|
}
|
|
|
|
.charsheet span.flex--10, .charsheet div.flex--10,
|
|
.charsheet input.flex--10, .charsheet button.flex--10 {
|
|
-webkit-box-flex: 10;
|
|
-ms-flex: 10;
|
|
flex: 10;
|
|
}
|
|
|
|
.charsheet span.flex--11, .charsheet div.flex--11,
|
|
.charsheet input.flex--11, .charsheet button.flex--11 {
|
|
-webkit-box-flex: 11;
|
|
-ms-flex: 11;
|
|
flex: 11;
|
|
}
|
|
|
|
.charsheet span.flex--12, .charsheet div.flex--12,
|
|
.charsheet input.flex--12, .charsheet button.flex--12 {
|
|
-webkit-box-flex: 12;
|
|
-ms-flex: 12;
|
|
flex: 12;
|
|
}
|
|
|
|
.charsheet span.flex--13, .charsheet div.flex--13,
|
|
.charsheet input.flex--13, .charsheet button.flex--13 {
|
|
-webkit-box-flex: 13;
|
|
-ms-flex: 13;
|
|
flex: 13;
|
|
}
|
|
|
|
.charsheet span.flex--14, .charsheet div.flex--14,
|
|
.charsheet input.flex--14, .charsheet button.flex--14 {
|
|
-webkit-box-flex: 14;
|
|
-ms-flex: 14;
|
|
flex: 14;
|
|
}
|
|
|
|
.charsheet span.flex--15, .charsheet div.flex--15,
|
|
.charsheet input.flex--15, .charsheet button.flex--15 {
|
|
-webkit-box-flex: 15;
|
|
-ms-flex: 15;
|
|
flex: 15;
|
|
}
|
|
|
|
.charsheet span.flex--16, .charsheet div.flex--16,
|
|
.charsheet input.flex--16, .charsheet button.flex--16 {
|
|
-webkit-box-flex: 16;
|
|
-ms-flex: 16;
|
|
flex: 16;
|
|
}
|
|
|
|
.charsheet span.flex--17, .charsheet div.flex--17,
|
|
.charsheet input.flex--17, .charsheet button.flex--17 {
|
|
-webkit-box-flex: 17;
|
|
-ms-flex: 17;
|
|
flex: 17;
|
|
}
|
|
|
|
.charsheet span.flex--18, .charsheet div.flex--18,
|
|
.charsheet input.flex--18, .charsheet button.flex--18 {
|
|
-webkit-box-flex: 18;
|
|
-ms-flex: 18;
|
|
flex: 18;
|
|
}
|
|
|
|
.charsheet span.flex--19, .charsheet div.flex--19,
|
|
.charsheet input.flex--19, .charsheet button.flex--19 {
|
|
-webkit-box-flex: 19;
|
|
-ms-flex: 19;
|
|
flex: 19;
|
|
}
|
|
|
|
.charsheet span.flex--60, .charsheet div.flex--60,
|
|
.charsheet input.flex--60, .charsheet button.flex--60 {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: auto;
|
|
flex: auto;
|
|
-ms-flex-preferred-size: 60px;
|
|
flex-basis: 60px;
|
|
}
|
|
|
|
.charsheet span.flex--r, .charsheet div.flex--r {
|
|
text-align: right;
|
|
padding-right: var(--base-padding);
|
|
}
|
|
|
|
.charsheet span.flex--center, .charsheet div.flex--center {
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.charsheet div.innertable {
|
|
display: table;
|
|
width: 100%;
|
|
}
|
|
|
|
.charsheet div.innertable-stagger {
|
|
display: table;
|
|
margin-bottom: 5px;
|
|
width: auto;
|
|
}
|
|
|
|
.charsheet div.innertable-stagger-flat {
|
|
display: table;
|
|
font-size: 2px;
|
|
margin-bottom: 0px;
|
|
width: auto;
|
|
}
|
|
|
|
.charsheet div.header-centered {
|
|
display: table;
|
|
margin: 0 auto;
|
|
width: auto;
|
|
}
|
|
|
|
.charsheet div.header-row,
|
|
.charsheet div.range-ranges-row {
|
|
display: table-row;
|
|
width: 100%;
|
|
}
|
|
|
|
.charsheet div.table-row-group {
|
|
display: table-row-group;
|
|
}
|
|
|
|
.charsheet div.header-hugecell {
|
|
display: table-cell;
|
|
width: 300px;
|
|
}
|
|
|
|
.charsheet div.header-monitorcell {
|
|
display: table-cell;
|
|
width: 480px;
|
|
}
|
|
|
|
.charsheet div.header-monitortitlecell {
|
|
display: table-cell;
|
|
width: 70px;
|
|
}
|
|
|
|
.charsheet div.header-fullcell {
|
|
display: table-cell;
|
|
width: 250px;
|
|
}
|
|
|
|
.charsheet div.table-cell-one-third {
|
|
display: table-cell;
|
|
width: 33%;
|
|
}
|
|
|
|
.charsheet div.header-shortcell {
|
|
display: table-cell;
|
|
width: 180px;
|
|
}
|
|
|
|
.charsheet div.table-cell-one-forth {
|
|
display: table-cell;
|
|
height: 20px;
|
|
vertical-align: center;
|
|
width: 25%;
|
|
}
|
|
|
|
.charsheet div.table-cell-one-fifth {
|
|
display: table-cell;
|
|
height: 20px;
|
|
vertical-align: center;
|
|
width: 20%;
|
|
}
|
|
|
|
.charsheet div.table-cell-one-sixth {
|
|
display: table-cell;
|
|
height: 20px;
|
|
vertical-align: center;
|
|
width: 16.6%;
|
|
}
|
|
|
|
.charsheet div.table-cell-adept-description {
|
|
display: table-cell;
|
|
padding-left: 10px;
|
|
width: 140px;
|
|
}
|
|
|
|
.charsheet div.header-longcell {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: 450px;
|
|
}
|
|
|
|
.charsheet div.header-cell,
|
|
.charsheet div.table-cell-adept-name {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: 250px;
|
|
}
|
|
|
|
.charsheet div.header-cell-huge {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: 100px;
|
|
}
|
|
|
|
.charsheet div.table-row {
|
|
display: table-row;
|
|
height: 25px;
|
|
line-height: 14px;
|
|
}
|
|
|
|
.charsheet div.table-row div {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.charsheet div.table-row-flat {
|
|
display: table-row;
|
|
height: 18px;
|
|
}
|
|
|
|
.charsheet div.table-row-superflat {
|
|
display: table-row;
|
|
height: 4px;
|
|
}
|
|
|
|
.charsheet div.innertable .repcontainer {
|
|
display: table-row-group;
|
|
}
|
|
|
|
.charsheet div.innertable .itemcontrol {
|
|
height: auto !important;
|
|
}
|
|
|
|
.charsheet div.innertable .repitem {
|
|
display: table-row;
|
|
height: 25px;
|
|
line-height: 14px;
|
|
}
|
|
|
|
.charsheet div.innertable .repcontrol {
|
|
display: inline-block;
|
|
}
|
|
|
|
.charsheet div.innertable .itemcontrol {
|
|
width: 80px !important;
|
|
}
|
|
|
|
.charsheet div.table-fullrow {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: inherit;
|
|
}
|
|
|
|
.charsheet div.table-cell {
|
|
display: table-cell;
|
|
/* padding: 2px;*/
|
|
width: 3.3rem;
|
|
}
|
|
|
|
.charsheet div.table-cell-middleinput {
|
|
display: table-cell;
|
|
/* padding: 2px;*/
|
|
width: 6rem;
|
|
height: 25px;
|
|
}
|
|
|
|
.charsheet div.table-cell-long {
|
|
display: table-cell;
|
|
/* padding: 2px;*/
|
|
width: 12rem;
|
|
}
|
|
|
|
.charsheet div.table-cell-center {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
text-align: center;
|
|
}
|
|
|
|
.charsheet div.table-cell-full {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: 750px;
|
|
}
|
|
|
|
.charsheet div.table-cell-threequarter {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: 700px;
|
|
}
|
|
|
|
.charsheet div.table-cell-half {
|
|
display: table-cell;
|
|
width: 50%;
|
|
}
|
|
|
|
.charsheet div.table-cell-half {
|
|
display: table-cell;
|
|
width: 50%;
|
|
}
|
|
|
|
.charsheet div.table-cell-threequater {
|
|
display: table-cell;
|
|
width: 75%;
|
|
}
|
|
|
|
.charsheet div.table-cell-full {
|
|
display: table-cell;
|
|
width: 100%;
|
|
}
|
|
|
|
.charsheet .cell-adeptpowername {
|
|
width: 240px;
|
|
}
|
|
|
|
.charsheet .pictos {
|
|
font-family: "pictos";
|
|
}
|
|
|
|
.charsheet .pictos--c {
|
|
font-family: "Pictos Custom";
|
|
}
|
|
|
|
.charsheet .pictos--3 {
|
|
font-family: "pictos three";
|
|
}
|
|
|
|
.charsheet .pictos--fontello {
|
|
font-family: "fontello";
|
|
}
|
|
|
|
.charsheet .dicefontd4 {
|
|
font-family: "dicefontd4";
|
|
}
|
|
|
|
.charsheet .dicefontd6 {
|
|
font-family: "dicefontd6";
|
|
}
|
|
|
|
.charsheet .dicefontd8 {
|
|
font-family: "dicefontd8";
|
|
}
|
|
|
|
.charsheet .dicefontd10 {
|
|
font-family: "dicefontd10";
|
|
}
|
|
|
|
.charsheet .dicefontd20 {
|
|
font-family: "dicefontd20";
|
|
}
|
|
|
|
.charsheet .dicefontd30 {
|
|
font-family: "dicefontd30";
|
|
}
|
|
|
|
.charsheet .dicefontd8 {
|
|
font-family: "dicefontd8";
|
|
}
|
|
|
|
.charsheet div.table-cell-huge-center,
|
|
.charsheet div.table-cell-adept-showchat,
|
|
.charsheet div.table-cell-adept-longdesc {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
text-align: center;
|
|
width: 120px;
|
|
}
|
|
|
|
.charsheet div.table-cell-quarter {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: 25%;
|
|
}
|
|
|
|
.charsheet div.table-cell-skill-rolls {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
text-align: center;
|
|
width: 50%;
|
|
min-width: 100px;
|
|
}
|
|
|
|
.charsheet div.table-cell-speedup-rolls {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
text-align: center;
|
|
}
|
|
|
|
.charsheet div.table-cell-adept-pp {
|
|
display: table-cell;
|
|
margin: 0 auto;
|
|
padding: 2px;
|
|
text-align: center;
|
|
width: 40px;
|
|
}
|
|
|
|
.charsheet div.table-cell-skill-name,
|
|
.charsheet div.table-cell-skill-hide {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: 150px;
|
|
}
|
|
|
|
.charsheet div.table-cell-skill-spec,
|
|
.charsheet div.table-cell-skill-exp {
|
|
display: table-cell;
|
|
width: 100px;
|
|
min-width: 75px;
|
|
}
|
|
|
|
.charsheet div.table-cell-skill-attribute {
|
|
display: table-cell;
|
|
width: 90px;
|
|
}
|
|
|
|
.charsheet div.table-cell-skill-total {
|
|
display: table-cell;
|
|
font-weight: 400;
|
|
padding: 2px;
|
|
text-align: center;
|
|
width: 45px;
|
|
}
|
|
|
|
.charsheet div.table-cell-skill-total input {
|
|
font-weight: 400;
|
|
}
|
|
|
|
.charsheet div.skill-electronics-toggle-on {
|
|
height: 10px;
|
|
line-height: 10px;
|
|
}
|
|
|
|
.charsheet div.table-cell-skill-level,
|
|
.charsheet div.table-cell-skill-mod,
|
|
.charsheet div.table-cell-adept-level {
|
|
display: table-cell;
|
|
padding: 2px;
|
|
width: 40px;
|
|
}
|
|
|
|
.charsheet div.table-cell-tiny {
|
|
height: 4px;
|
|
padding: 0px;
|
|
}
|
|
|
|
.charsheet div.range-textbox-colossal {
|
|
display: inline-block;
|
|
font-size: var(--fontsize-button);
|
|
width: 150px;
|
|
}
|
|
|
|
.charsheet div.range-textbox-huge {
|
|
display: inline-block;
|
|
font-size: var(--fontsize-button);
|
|
width: 110px;
|
|
}
|
|
|
|
.charsheet div.range-textbox-huge-center,
|
|
.charsheet div.box-wilddie-ranged {
|
|
display: inline-block;
|
|
font-size: var(--fontsize-button);
|
|
text-align: center;
|
|
width: 100px;
|
|
}
|
|
|
|
.charsheet div.melee-textbox-large,
|
|
.charsheet div.range-textbox-large {
|
|
display: inline-block;
|
|
font-size: var(--fontsize-button);
|
|
width: 110px;
|
|
}
|
|
|
|
.charsheet div.melee-textbox-medium,
|
|
.charsheet div.range-textbox-medium,
|
|
.charsheet div.radio-em-visible,
|
|
.charsheet div.radio-hm-visible,
|
|
.charsheet div.radio-sm-visible,
|
|
.charsheet div.radio-am-visible {
|
|
display: inline-block;
|
|
font-size: var(--fontsize-button);
|
|
width: 50px;
|
|
}
|
|
|
|
.charsheet div.melee-textbox-small,
|
|
.charsheet div.range-textbox-small {
|
|
display: inline-block;
|
|
font-size: var(--fontsize-button);
|
|
width: 30px;
|
|
}
|
|
|
|
.charsheet div.range-textbox-tiny {
|
|
display: inline-block;
|
|
font-size: var(--fontsize-button);
|
|
width: 5px;
|
|
}
|
|
|
|
.charsheet div.smallspacer {
|
|
display: inline-block;
|
|
width: 30px;
|
|
}
|
|
|
|
.charsheet div.smallspacertwenty {
|
|
display: inline-block;
|
|
width: 15px;
|
|
}
|
|
|
|
.charsheet div.smallerspacer {
|
|
display: inline-block;
|
|
width: 7px;
|
|
}
|
|
|
|
.charsheet div.tinyspacer {
|
|
display: inline-block;
|
|
width: 4px;
|
|
}
|
|
|
|
.charsheet fieldset {
|
|
background: transparent;
|
|
}
|
|
|
|
.charsheet h4 {
|
|
color: var(--base-color);
|
|
display: inline;
|
|
}
|
|
|
|
.charsheet h6 {
|
|
color: var(--base-color);
|
|
display: inline;
|
|
padding-left: 7px;
|
|
padding-right: 7px;
|
|
}
|
|
|
|
.charsheet input {
|
|
background-color: var(--base-backcolor2);
|
|
border-color: var(--base-backcolor2);
|
|
border-radius: 0px;
|
|
color: var(--base-color);
|
|
font-size: var(--fontsize-button);
|
|
font-weight: 400;
|
|
padding: 1px;
|
|
text-align: center;
|
|
height: 25px;
|
|
-webkit-transition: border-color 1s;
|
|
transition: border-color 1s;
|
|
}
|
|
|
|
.charsheet input[type=text] {
|
|
text-align: left;
|
|
height: 20px;
|
|
}
|
|
|
|
.charsheet input[type=number] {
|
|
height: 20px;
|
|
}
|
|
|
|
.charsheet input:disabled, .charsheet input:-moz-read-only {
|
|
cursor: text;
|
|
}
|
|
|
|
.charsheet input:disabled, .charsheet input:read-only {
|
|
cursor: text;
|
|
}
|
|
|
|
.charsheet input:focus, .charsheet input:hover, .charsheet input:disabled:focus, .charsheet input:disabled:hover {
|
|
/*background-color: var(--bg-input);*/
|
|
border-color: var(--base-color);
|
|
outline-style: none;
|
|
}
|
|
|
|
.charsheet input[type=number].right {
|
|
float: right;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.charsheet input[type=number].smallinput {
|
|
width: 3.0em;
|
|
/* margin-right: -3px; */
|
|
}
|
|
|
|
.charsheet input[type=number].middleinput {
|
|
/* height: 20px; */
|
|
width: 6.0em;
|
|
margin-right: -3px;
|
|
}
|
|
|
|
.charsheet input[type=number].tinyinput {
|
|
border: 0px;
|
|
font-size: var(--fontsize-button);
|
|
height: 18px;
|
|
padding: 0px;
|
|
width: 1.0em;
|
|
}
|
|
|
|
.charsheet input[type=number].hiddeninput {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet input[type=text].adeptpowername {
|
|
font-size: var(--fontsize-button);
|
|
line-height: 0.8em;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
text-align: left;
|
|
width: 240px;
|
|
}
|
|
|
|
.charsheet input[type=text].komplexformname {
|
|
font-size: var(--fontsize-button);
|
|
line-height: 0.8em;
|
|
height: 18px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
text-align: left;
|
|
width: 100px;
|
|
}
|
|
|
|
.charsheet input[type=text].weaponname {
|
|
font-size: var(--fontsize-button);
|
|
line-height: 0.8em;
|
|
height: 18px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
text-align: left;
|
|
width: 140px;
|
|
}
|
|
|
|
.charsheet input[type=text].spellname {
|
|
font-size: var(--fontsize-medium);
|
|
line-height: 0.8em;
|
|
height: 18px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
text-align: left;
|
|
width: 143px;
|
|
}
|
|
|
|
.charsheet input[type=text].mediumtext {
|
|
font-size: var(--fontsize-medium);
|
|
line-height: 0.8em;
|
|
height: 18px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
text-align: left;
|
|
width: 143px;
|
|
}
|
|
|
|
.charsheet input[type=text].spellrules {
|
|
border: 0px;
|
|
font-size: var(--fontsize-button);
|
|
line-height: 0.8em;
|
|
height: 18px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
text-align: left;
|
|
width: 60px;
|
|
}
|
|
|
|
.charsheet input[type=text].shorttext {
|
|
font-size: var(--fontsize-button);
|
|
line-height: 0.8em;
|
|
height: 18px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
text-align: center;
|
|
width: 30px;
|
|
}
|
|
|
|
.charsheet input[type=text].fullrow {
|
|
height: 23px;
|
|
width: 720px;
|
|
}
|
|
|
|
.charsheet textarea.fulltextbox {
|
|
width: 720px;
|
|
}
|
|
|
|
.charsheet input[type=text].smallinput {
|
|
width: 3.0em;
|
|
}
|
|
|
|
.charsheet input[type=text].input-mediumshort, .charsheet select.input-mediumshort {
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
text-align: left;
|
|
/* height: 23px; */
|
|
width: 96px;
|
|
}
|
|
|
|
.charsheet input.smallinput:-moz-read-only, .charsheet input.smallinput:disabled,
|
|
.charsheet input.middleinput:-moz-read-only, .charsheet input.middleinput:disabled {
|
|
background-color: var(--base-backcolor-alternate-color);
|
|
}
|
|
|
|
.charsheet input.smallinput:read-only, .charsheet input.smallinput:disabled,
|
|
.charsheet input.middleinput:read-only, .charsheet input.middleinput:disabled {
|
|
background-color: var(--base-backcolor-alternate-color);
|
|
}
|
|
|
|
.charsheet select {
|
|
border: 1px;
|
|
width: auto;
|
|
-moz-appearance: none;
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
background-color: var(--base-backcolor2);
|
|
border: 1px solid;
|
|
border-color: var(--base-backcolor2);
|
|
border-radius: 0;
|
|
color: var(--base-color);
|
|
font-size: 0.8em;
|
|
height: 20px;
|
|
padding: 0px;
|
|
margin-bottom: 0px;
|
|
padding-left: 5px;
|
|
outline-style: none;
|
|
-webkit-transition: border-color 1s;
|
|
transition: border-color 1s;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.charsheet select.whitebackground {
|
|
background-color: var(--base-backcolor2);
|
|
}
|
|
|
|
.charsheet select.right {
|
|
float: right;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.charsheet select.spellresistdropdown {
|
|
background-color: var(--base-backcolor2);
|
|
border: 1px solid var(--base-border-color);
|
|
border-radius: 3px 3px 3px 3px;
|
|
color: var(--base-color);
|
|
font-size: 0.8em;
|
|
height: 20px;
|
|
margin-bottom: 0px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
width: 140px;
|
|
}
|
|
|
|
.charsheet select.attributedropdown {
|
|
width: 86px;
|
|
}
|
|
|
|
.charsheet select.attributedropdown:hover {
|
|
border-color: var(--base-color);
|
|
}
|
|
|
|
.charsheet select.last {
|
|
border-bottom-right-radius: 10px;
|
|
}
|
|
|
|
.charsheet select.spirittypedropdown {
|
|
border: 1px solid var(--base-border-color);
|
|
border-radius: 3px 3px 3px 3px;
|
|
color: var(--base-color);
|
|
font-size: 0.8em;
|
|
height: 20px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
width: 105px;
|
|
}
|
|
|
|
.charsheet select.spellcategorydropdown {
|
|
border: 1px solid var(--base-border-color);
|
|
border-radius: 3px 3px 3px 3px;
|
|
color: var(--base-color);
|
|
font-size: 0.8em;
|
|
height: 20px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
width: 86px;
|
|
}
|
|
|
|
.charsheet select.spellrangedropdown {
|
|
background-color: var(--base-backcolor2);
|
|
border: 1px solid var(--base-border-color);
|
|
border-radius: 3px 3px 3px 3px;
|
|
color: var(--base-color);
|
|
direction: rtl;
|
|
font-size: 0.8em;
|
|
height: 20px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
width: 45px;
|
|
}
|
|
|
|
.charsheet select.adeptpowercostdropdown {
|
|
background-color: var(--base-backcolor2);
|
|
border: 1px solid var(--base-border-color);
|
|
border-radius: 3px 3px 3px 3px;
|
|
color: var(--base-color);
|
|
font-size: 0.8em;
|
|
height: 20px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
width: 35px;
|
|
}
|
|
|
|
.charsheet select.spelltypedropdown {
|
|
background-color: var(--base-backcolor2);
|
|
border: 1px solid var(--base-border-color);
|
|
border-radius: 3px 3px 3px 3px;
|
|
color: var(--base-color);
|
|
font-size: 0.8em;
|
|
height: 20px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
width: 20px;
|
|
}
|
|
|
|
.charsheet select.meleetypedropdown,
|
|
.charsheet select.rangetypedropdown {
|
|
font-size: var(--fontsize-button);
|
|
height: 18px;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
color: var(--base-color);
|
|
}
|
|
|
|
.charsheet select.damagetypedropdown,
|
|
.charsheet select.firemodedropdown,
|
|
.charsheet select.reloadtypdropdown,
|
|
.charsheet select.ammotypedropdown {
|
|
color: var(--base-color);
|
|
font-size: var(--fontsize-button);
|
|
font-weight: 400;
|
|
height: 18px;
|
|
margin: 0px;
|
|
min-width: 30px;
|
|
padding: 0px;
|
|
padding-left: 5px;
|
|
text-align: center;
|
|
}
|
|
|
|
.charsheet select.center {
|
|
text-align-last: center;
|
|
min-width: 32px;
|
|
}
|
|
|
|
.charsheet span.wb {
|
|
word-break: break-word;
|
|
}
|
|
|
|
.charsheet span.center {
|
|
text-align: center;
|
|
}
|
|
|
|
.charsheet span.struck {
|
|
color: var(--base-color);
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
.charsheet span.unstruck {
|
|
color: var(--base-color);
|
|
}
|
|
|
|
.charsheet span.red {
|
|
color: var(--base-color);
|
|
font-size: var(--fontsize-button);
|
|
/* height: 18px; */
|
|
line-height: 0.8em;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
text-align: left;
|
|
}
|
|
|
|
.charsheet span.cyberberry-nopadding {
|
|
color: var(--base-color);
|
|
font-size: var(--fontsize-button);
|
|
/* padding-left: 3px;*/
|
|
padding-right: 3px;
|
|
}
|
|
|
|
.charsheet span.cyberberry-normal {
|
|
color: var(--base-color);
|
|
font-size: var(--fontsize-button);
|
|
padding-left: 7px;
|
|
padding-right: 7px;
|
|
}
|
|
|
|
.charsheet span.cyberberry {
|
|
color: var(--base-color);
|
|
/* font-size: var(--fontsize-base); */
|
|
padding-left: 7px;
|
|
padding-right: 7px;
|
|
vertical-align: baseline;
|
|
}
|
|
|
|
.charsheet textarea {
|
|
background-color: var(--base-backcolor2);
|
|
color: var(--base-color);
|
|
border: 1px;
|
|
overflow-wrap: break-word;
|
|
resize: vertical;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.charsheet input[type=text].fullrow {
|
|
height: 20px;
|
|
width: 720px;
|
|
}
|
|
|
|
.charsheet .toggle-hide:not(:checked) + .actionbutton {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet .toggle-hide:checked + .actionbutton {
|
|
display: inline-block;
|
|
}
|
|
|
|
.charsheet .toggle-hide:not(:checked) ~ .headlinebutton {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet .toggle-hide:checked ~ .headlinebutton {
|
|
display: inline-block;
|
|
}
|
|
|
|
.charsheet .hidebyboth, .charsheet .toggle-hide-both:checked ~ .unhidebyboth {
|
|
display: inline;
|
|
}
|
|
|
|
.charsheet .unhidebyboth, .charsheet .toggle-hide-both:checked ~ .hidebyboth {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet .hidebycomplexammo,
|
|
.charsheet .hidebycomplexdamage {
|
|
display: inline;
|
|
visibility: visible;
|
|
}
|
|
|
|
.charsheet .toggle-hide-complex-ammo:checked ~ .range-ranges-row-ammo,
|
|
.charsheet .toggle-hide-complex-damage:checked ~ .range-ranges-row-damage {
|
|
display: table-row;
|
|
width: 100%;
|
|
}
|
|
|
|
.charsheet .range-ranges-row-ammo,
|
|
.charsheet .range-ranges-row-damage,
|
|
.charsheet .toggle-hide-complex-ammo:checked ~ .hidebycomplexammo,
|
|
.charsheet .toggle-hide-complex-damage:checked ~ .hidebycomplexdamage {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet .magictoggle-off, .charsheet .toggle-hide:checked ~ .magictoggle-on {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet .magictoggle-on, .charsheet .toggle-hide:checked ~ .magictoggle-off {
|
|
display: inline-block;
|
|
}
|
|
|
|
.charsheet .visible-spec, .charsheet .toggle-hide:checked ~ .invisible-spec,
|
|
.charsheet .visible-exp, .charsheet .toggle-hide:checked ~ .invisible-exp {
|
|
display: inline;
|
|
visibility: visible;
|
|
}
|
|
|
|
.charsheet .invisible-spec, .charsheet .toggle-hide:checked ~ .visible-spec,
|
|
.charsheet .invisible-exp, .charsheet .toggle-hide:checked ~ .visible-exp {
|
|
display: none;
|
|
visibility: hidden;
|
|
}
|
|
|
|
.charsheet button.toggle-hide,
|
|
.charsheet input[type=text].toggle-hide,
|
|
.charsheet input[type=number].hide,
|
|
.charsheet input[type=checkbox].toggle-hide,
|
|
.charsheet input[type=checkbox].toggle-hide-spec,
|
|
.charsheet input[type=checkbox].toggle-hide-exp,
|
|
.charsheet input[type=checkbox].toggle-hide-em,
|
|
.charsheet input[type=checkbox].toggle-hide-hm,
|
|
.charsheet input[type=checkbox].toggle-hide-sm,
|
|
.charsheet input[type=checkbox].toggle-hide-am {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet input.toggle-hide-skill {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet input.filteredit:not(:checked) ~ div > div > input.skillfilter {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet input.filteredit:not(:checked) ~ input.toggle-hide-skill:checked + div.skill,
|
|
.charsheet input.toggle-hide-em:not(:checked) ~ div.radio-em-visible,
|
|
.charsheet input.toggle-hide-hm:not(:checked) ~ div.radio-hm-visible,
|
|
.charsheet input.toggle-hide-sm:not(:checked) ~ div.radio-sm-visible,
|
|
.charsheet input.toggle-hide-am:not(:checked) ~ div.radio-am-visible,
|
|
.charsheet .em-visible, .charsheet .toggle-hide:checked ~ .em-invisible,
|
|
.charsheet .hm-visible, .charsheet .toggle-hide:checked ~ .hm-invisible,
|
|
.charsheet .sm-visible, .charsheet .toggle-hide:checked ~ .sm-invisible,
|
|
.charsheet .am-visible, .charsheet .toggle-hide:checked ~ .am-invisible,
|
|
.charsheet input.toggle-hide-invert {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet div.skill {
|
|
/*margin-top: -10px;*/
|
|
}
|
|
|
|
.charsheet div.skill:hover > div:first-child {
|
|
/*margin-top: -10px;*/
|
|
font-weight: 700;
|
|
}
|
|
|
|
.charsheet div.table-row-skill {
|
|
margin-top: -10px;
|
|
display: table-row;
|
|
line-height: 14px;
|
|
}
|
|
|
|
.charsheet .copyright, .charsheet .chardata, .charsheet .attributes, .charsheet .skills, .charsheet .attacks,
|
|
.charsheet .magic, .charsheet .matrix, .charsheet .rigging, .charsheet .contacts, .charsheet .gear, .charsheet .notes, .charsheet .config, .charsheet .customrolls {
|
|
padding: 0px;
|
|
opacity: 0%;
|
|
margin: 0px;
|
|
max-height: 0px;
|
|
-webkit-transition: opacity 0s;
|
|
transition: opacity 0s;
|
|
visibility: hidden;
|
|
overflow: hidden;
|
|
padding-left: var(--base-padding);
|
|
padding-right: var(--base-padding);
|
|
background-color: var(--base-backcolor);
|
|
}
|
|
|
|
.charsheet .tabstoggle[value="copyright"] ~ div.copyright,
|
|
.charsheet .tabstoggle[value="chardata"] ~ div.chardata,
|
|
.charsheet .tabstoggle[value="attributes"] ~ div.attributes,
|
|
.charsheet .tabstoggle[value="skills"] ~ div.skills,
|
|
.charsheet .tabstoggle[value="attacks"] ~ div.attacks,
|
|
.charsheet .tabstoggle[value="magic"] ~ div.magic,
|
|
.charsheet .tabstoggle[value="matrix"] ~ div.matrix,
|
|
.charsheet .tabstoggle[value="rigging"] ~ div.rigging,
|
|
.charsheet .tabstoggle[value="contacts"] ~ div.contacts,
|
|
.charsheet .tabstoggle[value="gear"] ~ div.gear,
|
|
.charsheet .tabstoggle[value="notes"] ~ div.notes,
|
|
.charsheet .tabstoggle[value="customrolls"] ~ div.customrolls,
|
|
.charsheet .tabstoggle[value="configuration"] ~ div.config {
|
|
color: var(--base-color);
|
|
padding: 0px;
|
|
opacity: 100%;
|
|
width: inherit;
|
|
max-height: 99999px;
|
|
visibility: visible;
|
|
-webkit-transition: opacity 1s, max-height 2s;
|
|
transition: opacity 1s, max-height 2s;
|
|
}
|
|
|
|
.charsheet label.switch {
|
|
display: inline-block;
|
|
height: 13px;
|
|
margin-bottom: 0px;
|
|
position: relative;
|
|
width: 30px;
|
|
vertical-align: sub;
|
|
}
|
|
|
|
.charsheet label.switch input {
|
|
opacity: 0;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
|
|
.charsheet .hidden {
|
|
display: none;
|
|
}
|
|
|
|
.charsheet .slider {
|
|
-webkit-transition: .2s;
|
|
background-color: var(--base-backcolor-alternate-color);
|
|
border-radius: 22px;
|
|
bottom: 0;
|
|
cursor: pointer;
|
|
left: 0;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
transition: .2s;
|
|
}
|
|
|
|
.charsheet .slider:before {
|
|
-webkit-transition: .2s;
|
|
background-color: white;
|
|
border-radius: 50%;
|
|
bottom: 3px;
|
|
content: "";
|
|
height: 8px;
|
|
left: 4px;
|
|
position: absolute;
|
|
transition: .2s;
|
|
width: 8px;
|
|
}
|
|
|
|
.charsheet input:checked + .slider {
|
|
background-color: var(--select-backcolor);
|
|
}
|
|
|
|
.charsheet input:focus + .slider {
|
|
-webkit-box-shadow: 0 0 1px var(--base-backcolor-alternate-color);
|
|
box-shadow: 0 0 1px var(--base-backcolor-alternate-color);
|
|
}
|
|
|
|
.charsheet input:checked + .slider:before {
|
|
-webkit-transform: translateX(13px);
|
|
transform: translateX(13px);
|
|
}
|
|
|
|
.charsheet input::-webkit-outer-spin-button,
|
|
.charsheet input::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
.charsheet input[type="number"] {
|
|
-moz-appearance: textfield;
|
|
}
|
|
|
|
.charsheet .pd--left, .charsheet div.pd--left, .charsheet select.pd--left {
|
|
padding-left: 5px;
|
|
}
|
|
|
|
.charsheet .pd--right, .charsheet div.pd--right, .charsheet select.pd--right {
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.charsheet .pd15--right, .charsheet div.pd15--right, .charsheet select.pd15--right {
|
|
padding-right: 15px;
|
|
}
|
|
|
|
.charsheet .pd--top, .charsheet div.pd--top, .charsheet div.select-pd--top {
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.charsheet .pd--bottom, .charsheet div.pd--bottom, .charsheet select.pd--bottom {
|
|
padding-bottom: 5px;
|
|
}
|
|
|
|
.charsheet .bd--r, .charsheet input.bd--r {
|
|
border-right: solid 1px var(--base-border-color);
|
|
}
|
|
|
|
.charsheet .bd--l, .charsheet input.bd--l {
|
|
border-left: solid 1px var(--base-border-color);
|
|
}
|
|
|
|
.charsheet .mr--right {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.charsheet .mr--left {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.charsheet div.mr--bottom {
|
|
margin-bottom: -1.4rem;
|
|
}
|
|
|
|
.charsheet div.mr--topgeg10, .charsheet button.mr--topgeg10 {
|
|
margin-top: -10px;
|
|
}
|
|
|
|
.charsheet .first, .charsheet select.first, .charsheet input.first {
|
|
border-top-left-radius: 10px;
|
|
}
|
|
|
|
.charsheet input.last, .charsheet .last, .charsheet select.last {
|
|
border-bottom-right-radius: 10px;
|
|
}
|
|
|
|
.charsheet .half, .charsheet div.half {
|
|
width: 50%;
|
|
}
|
|
/*# sourceMappingURL=sheet.css.map */
|
|
.sheet-rolltemplate-roll,
|
|
.sheet-rolltemplate-post,
|
|
.sheet-rolltemplates-initiative{
|
|
|
|
font-family: "Roboto Condensed",sans-serif;
|
|
font-weight: 400;
|
|
--base-color: #906;
|
|
--text-color: #000;
|
|
--text-gray: #404040;
|
|
--base-backcolor2: #FFFFFF;
|
|
--base-backcolor3: #edeaef;
|
|
--select-backcolor: #460141;
|
|
--base-backcolor:#D9EBF4;
|
|
--base-border-color:#E5E5E5;
|
|
--section-backcolor:#cacaca;
|
|
--section-backcolor-select: #d8d8d8;
|
|
--base-backcolor-alternate-color:#c1bebe;
|
|
--base-warning-color:#B31515;
|
|
--base-crit-color:#3FB315;
|
|
--box-shadow: #906;
|
|
--boxsize:20px;
|
|
|
|
--base-padding: 0.4rem;
|
|
--base-padding-neg: -0.4rem;
|
|
--fontsize-button: 1.1rem;
|
|
--fontsize-medium:12px;
|
|
--fontsize-base: 1.2rem;
|
|
--fontsize-seltab: 1.4rem;
|
|
--fontsize-hover: 1.8rem;
|
|
}
|
|
|
|
|
|
/* roll sheet*/
|
|
.sheet-rolltemplate-initiative div.sheet-template-container,
|
|
.sheet-rolltemplate-post div.sheet-template-container,
|
|
.sheet-rolltemplate-roll div.sheet-template-container,
|
|
.sheet-rolltemplate-wilddie div.sheet-template-container{
|
|
border: 1px solid var(--base-color) !important;
|
|
border-radius: 3px 3px 3px 3px;
|
|
}
|
|
|
|
.sheet-rolltemplate-roll .sheet-template-header,
|
|
.sheet-rolltemplate-post .sheet-template-header,
|
|
.sheet-rolltemplate-wilddie .sheet-template-header{
|
|
background-color: var(--base-backcolor2);
|
|
color: var(--text-color);
|
|
padding: 5px;
|
|
border-bottom: 1px solid var(--base-color);
|
|
line-height: 1.6em;
|
|
font-size: 1.0em;
|
|
}
|
|
.sheet-rolltemplate-initiative .sheet-template-header {
|
|
background-color: var(--base-backcolor2);
|
|
color: var(--text-color);
|
|
padding: 5px;
|
|
line-height: 1.6em;
|
|
font-size: 1.0em;
|
|
}
|
|
|
|
.sheet-rolltemplate-roll div.sheet-template-flatrow{
|
|
background-color: var(--base-backcolor2);
|
|
padding: 2px
|
|
}
|
|
|
|
.sheet-rolltemplate-post div.sheet-template-row:nth-child(odd),
|
|
.sheet-rolltemplate-roll div.sheet-template-row:nth-child(odd),
|
|
.sheet-rolltemplate-wilddie div.sheet-template-row:nth-child(odd){
|
|
background-color: var(--base-backcolor2);
|
|
padding: 5px;
|
|
}
|
|
.sheet-rolltemplate-post div.sheet-template-row:nth-child(even),
|
|
.sheet-rolltemplate-roll div.sheet-template-row:nth-child(even),
|
|
.sheet-rolltemplate-wilddie div.sheet-template-row:nth-child(even){
|
|
background-color: var(--base-backcolor);
|
|
padding: 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-post .sheet-hidden-block,/*block layout without roll*/
|
|
.sheet-rolltemplate-roll .sheet-hidden-block,
|
|
.sheet-rolltemplate-wilddie .sheet-hidden-block{
|
|
display: inline-block;
|
|
width: 61.5px; /*recalculate if needed*/
|
|
}
|
|
.sheet-rolltemplate-post .sheet-sub-headline,
|
|
.sheet-rolltemplate-roll .sheet-sub-headline,
|
|
.sheet-rolltemplate-wilddie .sheet-sub-headline{
|
|
color: var(--base-color);
|
|
display: inline-block;
|
|
font-weight: 400;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
.sheet-rolltemplate-post .sheet-small-black-text,
|
|
.sheet-rolltemplate-roll .sheet-small-black-text,
|
|
.sheet-rolltemplate-wilddie .sheet-small-black-text{
|
|
color: var(--text-color);
|
|
display: inline-block;
|
|
font-size: 8pt;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
.sheet-rolltemplate-post .inlinerollresult,
|
|
.sheet-rolltemplate-roll .inlinerollresult,
|
|
.sheet-rolltemplate-wilddie .inlinerollresult
|
|
{
|
|
background-color: var(--base-backcolor2);
|
|
border: 0.25px solid var(--base-border-color);
|
|
display: inline-block;
|
|
margin-right: 30px;
|
|
min-width: 25px;
|
|
text-align: center;
|
|
}
|
|
.sheet-rolltemplate-fakeroll{
|
|
background-color: var(--base-backcolor2);
|
|
border: 0.25px solid var(--base-border-color);
|
|
display: inline-block;
|
|
min-width: 25px;
|
|
text-align: center;
|
|
padding: 0 3px 0 3px;
|
|
font-size: 1.1em;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.sheet-rolltemplate-post .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-roll .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-wilddie .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-fakeroll-crit{
|
|
border: 0.25px solid var(--base-crit-color);
|
|
}
|
|
|
|
.sheet-rolltemplate-post .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-roll .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-wilddie .inlinerollresult.fullfail{
|
|
border: 0.25px solid var(--base-warning-color);
|
|
}
|
|
|
|
.sheet-rolltemplate-post .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-roll .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-wilddie .inlinerollresult.importantroll{
|
|
border: 0.25px solid #4A57ED;
|
|
}
|
|
.sheet-rolltemplate-warning {
|
|
color:var(--base-warning-color);
|
|
} |