mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 11:42:29 +00:00
453 lines
10 KiB
CSS
453 lines
10 KiB
CSS
/*
|
|
EDITED by Gorthian
|
|
Version 1.1
|
|
Letzte Änderung 2022-07-19
|
|
|
|
GitHub https://github.com/Gorthian/Roll20_NHKS_CharacterSheet
|
|
Wiki https://github.com/Gorthian/Roll20_NHKS_CharacterSheet/wiki
|
|
Bugs & Issues https://github.com/Gorthian/Roll20_NHKS_CharacterSheet/issues
|
|
*/
|
|
|
|
|
|
/* GRUNDLAGEN */
|
|
|
|
div.sheet-wrapper {
|
|
--sheet-bg : #ffffff;
|
|
--sheet-text-color : #000000;
|
|
--sheet-border : 1px solid black;
|
|
}
|
|
|
|
/* TABS */
|
|
div.sheet-NHKS .sheet-main-tab, div.sheet-NHKS .sheet-weapon-tab {
|
|
display: none;
|
|
}
|
|
|
|
div.sheet-NHKS .sheet-tabstoggle[value="main"] ~ div.sheet-main-tab,
|
|
div.sheet-NHKS .sheet-tabstoggle[value="weapons"] ~ div.sheet-weapon-tab {
|
|
display: block;
|
|
}
|
|
|
|
/* GRIDS */
|
|
|
|
div.sheet-NHKS {
|
|
background-color : var(--sheet-bg);
|
|
color : var(--sheet-text-color);
|
|
min-width : 800px;
|
|
}
|
|
|
|
div.sheet-tab-buttons {
|
|
display : grid;
|
|
grid-template-columns : repeat(4, 25%);
|
|
grid-auto-flow : columns;
|
|
}
|
|
|
|
div.sheet-general {
|
|
display : grid;
|
|
grid-template-columns : repeat(2, 50%);
|
|
grid-auto-flow : columns;
|
|
gap : 10px;
|
|
}
|
|
|
|
div.sheet-attributes {
|
|
display : grid;
|
|
grid-template-columns : 20% 80%;
|
|
grid-auto-flow : columns;
|
|
gap : 10px;
|
|
}
|
|
|
|
div.sheet-attributes-base {
|
|
display : grid;
|
|
align-self : start;
|
|
gap : 10px;
|
|
}
|
|
|
|
div.sheet-attributes-base .sheet-input-line {
|
|
align-self : start;
|
|
}
|
|
|
|
div.sheet-attributes-calc {
|
|
display : grid;
|
|
grid-template-columns : repeat(3, 33%);
|
|
grid-auto-flow : columns;
|
|
gap : 10px;
|
|
}
|
|
|
|
div.sheet-footer {
|
|
display : grid;
|
|
}
|
|
|
|
div.sheet-skills {
|
|
display : grid;
|
|
grid-template-columns : 70% 30%;
|
|
grid-auto-flow : colums dense;
|
|
}
|
|
|
|
div.sheet-radio-set {
|
|
display : flex;
|
|
gap : 5px;
|
|
}
|
|
|
|
div.sheet-weapon-entry {
|
|
border : var(--sheet-border);
|
|
display : grid;
|
|
grid-template-columns : 70% 30%;
|
|
grid-auto-flow : colums dense;
|
|
}
|
|
|
|
div.sheet-weapon-entry .sheet-input-line .sheet-label {
|
|
width : 120px;
|
|
}
|
|
|
|
div.sheet-weapon-entry textarea {
|
|
width : 80%;
|
|
}
|
|
|
|
/* Movie Awards */
|
|
|
|
div.sheet-movies div.sheet-radio-set input.sheet-radiobox {
|
|
order : 1;
|
|
border : 1px solid gold;
|
|
border-radius : 50%;
|
|
background : gold;
|
|
height : 2rem;
|
|
width : 2rem;
|
|
-webkit-appearance : none;
|
|
cursor : pointer;
|
|
z-index : 1;
|
|
}
|
|
|
|
div.sheet-movies div.sheet-radio-set input.sheet-radiobox:checked {
|
|
opacity : 0;
|
|
z-index : 0;
|
|
position : absolute;
|
|
}
|
|
|
|
div.sheet-movies div.sheet-radio-set input.sheet-radiobox:checked ~ .sheet-radiobox {
|
|
order : 3;
|
|
background-color : transparent;
|
|
}
|
|
|
|
div.sheet-movies div.sheet-radio-set input.sheet-radiobox.sheet-reset {
|
|
order : 2;
|
|
background-color : gold;
|
|
}
|
|
|
|
/* Martial Arts */
|
|
|
|
div.sheet-martialarts div.sheet-radio-set input.sheet-radiobox {
|
|
order : 1;
|
|
border : var(--sheet-border);
|
|
border-radius : 50%;
|
|
background : grey;
|
|
height : 2rem;
|
|
width : 2rem;
|
|
-webkit-appearance : none;
|
|
cursor : pointer;
|
|
z-index : 1;
|
|
}
|
|
|
|
div.sheet-martialarts div.sheet-radio-set input.sheet-radiobox:checked {
|
|
opacity : 0;
|
|
z-index : 0;
|
|
position : absolute;
|
|
}
|
|
|
|
div.sheet-martialarts div.sheet-radio-set input.sheet-radiobox:checked ~ .sheet-radiobox {
|
|
order : 3;
|
|
background-color : transparent;
|
|
}
|
|
|
|
div.sheet-martialarts div.sheet-radio-set input.sheet-radiobox.sheet-reset {
|
|
order : 2;
|
|
background-color : grey;
|
|
}
|
|
|
|
/* Waffen */
|
|
|
|
div.sheet-weapon-box {
|
|
border : var(--sheet-border);
|
|
border-radius : 5px;
|
|
background-color : lightblue;
|
|
margin : 5px;
|
|
}
|
|
|
|
div.sheet-role-weapon-table div.sheet-weapon-description {
|
|
float : left;
|
|
text-align : left;
|
|
width : auto;
|
|
}
|
|
|
|
div.sheet-role-weapon-table div.sheet-weapon-attribute {
|
|
float : left;
|
|
width : 1.6em;
|
|
text-align : center;
|
|
}
|
|
|
|
div.sheet-clear-float {
|
|
clear : both;
|
|
}
|
|
|
|
div.sheet-weapon-attribute span:nth-child(2){
|
|
display : none;
|
|
}
|
|
|
|
div.sheet-weapon-attribute *:nth-child(1):hover ~span {
|
|
display : inline;
|
|
position : absolute;
|
|
border : 1px solid grey;
|
|
background-color : lightgrey;
|
|
}
|
|
|
|
/* DIVERSES */
|
|
|
|
div.sheet-NHKS h1 {
|
|
--h1-height : 1.5em;
|
|
width : 100%;
|
|
height : var(--h1-height);
|
|
background : linear-gradient(to right, black, black 90%, white);
|
|
color : white;
|
|
font-size : var(--h1-height);
|
|
font-weight : bold;
|
|
}
|
|
|
|
div.sheet-general input, div.sheet-skills input, div.sheet-misc input {
|
|
background : transparent;
|
|
border-style : none none solid none;
|
|
color : #000000;
|
|
}
|
|
|
|
div.sheet-general .sheet-label {
|
|
width : 100px;
|
|
}
|
|
|
|
div.sheet-general textarea, div.sheet-skills textarea {
|
|
height : 30px;
|
|
width : 90%;
|
|
}
|
|
|
|
div.sheet-general textarea.sheet-textarea-big {
|
|
height : 90%;
|
|
width : 90%;
|
|
}
|
|
|
|
.sheet-label {
|
|
font-weight : bold;
|
|
}
|
|
|
|
div.sheet-skill-entry .sheet-label {
|
|
text-align : center;
|
|
}
|
|
|
|
.sheet-input-line .sheet-attr-short {
|
|
font-weight : bold;
|
|
font-size : 1.2em;
|
|
}
|
|
|
|
.sheet-input-line .sheet-attr-full {
|
|
font-weight : bold;
|
|
font-size : 0.5em;
|
|
}
|
|
|
|
.sheet-height-45 {
|
|
height : 45%;
|
|
}
|
|
|
|
.sheet-attributes-calc .sheet-input-line {
|
|
display : inline;
|
|
text-align : center;
|
|
border : var(--sheet-border);
|
|
}
|
|
|
|
.sheet-attributes-calc .sheet-input-line .sheet-attr-name, .sheet-role-stats .sheet-attr-name {
|
|
font-weight : bold;
|
|
font-size : 1.0em;
|
|
}
|
|
|
|
.sheet-attributes-calc .sheet-input-line .sheet-attr-desc {
|
|
font-weight : bold;
|
|
font-size : 0.7em;
|
|
}
|
|
|
|
.sheet-attributes-calc .sheet-input-line input {
|
|
width : 45%;
|
|
text-align : center;
|
|
}
|
|
|
|
.sheet-input-line {
|
|
display : inline-flex;
|
|
width : 95%;
|
|
}
|
|
|
|
.sheet-input-line .sheet-label {
|
|
display : inline-block;
|
|
}
|
|
|
|
.sheet-input-line input.sheet-attribute-value {
|
|
height : 100%;
|
|
text-align : center;
|
|
font-weight : bold;
|
|
font-size : 1.5em;
|
|
margin-left : 15px;
|
|
margin-top : 5px;
|
|
}
|
|
|
|
.sheet-skill-list select {
|
|
width : 60px;
|
|
}
|
|
|
|
div.sheet-skill-list * {
|
|
font-size : 0.95em;
|
|
}
|
|
|
|
div.sheet-actor-advantage {
|
|
border : var(--sheet-border);
|
|
margin : 2px;
|
|
}
|
|
|
|
div.sheet-skill-entry {
|
|
display : grid;
|
|
grid-template-columns : 40% repeat(4, 15%);
|
|
grid-auto-flow : columns;
|
|
|
|
}
|
|
|
|
div.sheet-combat-entry {
|
|
display : grid;
|
|
grid-template-columns : 30% 20% repeat(3, 15%);
|
|
grid-auto-flow : columns;
|
|
}
|
|
|
|
div.sheet-skill-entry div, div.sheet-combat-entry div {
|
|
width : auto;
|
|
vertical-align : middle;
|
|
}
|
|
|
|
div.sheet-skill-name, div.sheet-combat-attack {
|
|
width : 100px;
|
|
text-align : left;
|
|
}
|
|
|
|
div.sheet-skill-entry div.sheet-skill-value, div.sheet-combat-entry div.sheet-combat-value {
|
|
text-align : center;
|
|
}
|
|
|
|
div.sheet-skill-entry button[type="action"]{
|
|
width : 200px;
|
|
}
|
|
|
|
div.sheet-combat-attack button[type="action"]{
|
|
width : 150px;
|
|
}
|
|
|
|
div.sheet-combat-parry button[type="action"]{
|
|
width : 100px;
|
|
}
|
|
|
|
div.sheet-skill-entry input {
|
|
display : block;
|
|
margin-right : auto;
|
|
margin-left : auto;
|
|
}
|
|
|
|
/* Chrome, Safari, Edge, Opera */
|
|
input.sheet-no-arrows::-webkit-outer-spin-button,
|
|
input.sheet-no-arrows::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
/* Firefox */
|
|
input[type=number].sheet-no-arrows {
|
|
-moz-appearance: textfield;
|
|
}
|
|
|
|
/* Allgemeine Buttons */
|
|
|
|
button[type="action"] {
|
|
width : 85%;
|
|
}
|
|
|
|
/* Hintergrundbilder */
|
|
|
|
div.sheet-main-tab {
|
|
background-image : url("https://github.com/Gorthian/Roll20_NHKS_CharacterSheet/blob/main/images/standard/Schauspielerbogen_1_50_freigestellt.png?raw=true");
|
|
background-position : bottom right;
|
|
background-size : 25%;
|
|
background-repeat : no-repeat;
|
|
}
|
|
|
|
div.sheet-general {
|
|
background-image : url("https://github.com/Gorthian/Roll20_NHKS_CharacterSheet/blob/main/images/standard/Schauspielerbogen_2_25_freigestellt.png?raw=true");
|
|
background-position : top right;
|
|
background-size : 70%;
|
|
background-repeat : no-repeat;
|
|
}
|
|
|
|
div.sheet-skills {
|
|
background-image : url("https://github.com/Gorthian/Roll20_NHKS_CharacterSheet/blob/main/images/standard/Schauspielerbogen_3_25_freigestellt.png?raw=true");
|
|
background-position : bottom;
|
|
background-size : contain;
|
|
background-repeat : no-repeat;
|
|
}
|
|
|
|
/* Roll Templates */
|
|
|
|
.sheet-rolltemplate-initiative .sheet-template-container,
|
|
.sheet-rolltemplate-skill .sheet-template-container,
|
|
.sheet-rolltemplate-attribute .sheet-template-container {
|
|
border : 1px solid lightgrey;
|
|
background : white;
|
|
background-image : url("https://github.com/Gorthian/Roll20_NHKS_CharacterSheet/blob/main/images/standard/Schauspielerbogen_2_25_freigestellt.png?raw=true");
|
|
}
|
|
|
|
.sheet-rolltemplate-initiative .sheet-template-header,
|
|
.sheet-rolltemplate-skill .sheet-template-header,
|
|
.sheet-rolltemplate-attribute .sheet-template-header {
|
|
width : 100%;
|
|
background : linear-gradient(to right, black, black 90%, white);
|
|
color : white;
|
|
font-weight : bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-initiative .sheet-template-row,
|
|
.sheet-rolltemplate-skill .sheet-template-row,
|
|
.sheet-rolltemplate-attribute .sheet-template-row {
|
|
padding : 3px;
|
|
display : grid;
|
|
grid-template-columns : 80% 20%;
|
|
grid-template-areas : "key value";
|
|
}
|
|
|
|
.sheet-rolltemplate-initiative .sheet-template-key,
|
|
.sheet-rolltemplate-skill .sheet-template-key,
|
|
.sheet-rolltemplate-attribute .sheet-template-key {
|
|
grid-area : key;
|
|
text-align : left;
|
|
font-weight : bold;
|
|
font-size : 0.95em;
|
|
}
|
|
|
|
.sheet-rolltemplate-initiative .sheet-template-value,
|
|
.sheet-rolltemplate-skill .sheet-template-value,
|
|
.sheet-rolltemplate-attribute .sheet-template-value {
|
|
grid-area : value;
|
|
text-align : left;
|
|
}
|
|
|
|
.sheet-rolltemplate-initiative .sheet-template-result,
|
|
.sheet-rolltemplate-skill .sheet-template-result,
|
|
.sheet-rolltemplate-attribute .sheet-template-result {
|
|
padding : 3px;
|
|
text-align : center;
|
|
font-weight : bold;
|
|
}
|
|
|
|
/* Schriftarten */
|
|
|
|
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap");
|
|
|
|
div {font-family: "Open Sans";}
|
|
|
|
div.sheet-NHKS h1 {font-family: "Bebas Neue";}
|
|
|