mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
645 lines
16 KiB
CSS
645 lines
16 KiB
CSS
/* Character sheet for Les Oubliés RPG (FR)
|
|
RPG Publisher: Les 12 Singes
|
|
Sheet Author: Kapirklaa
|
|
Sheet version: 1.0
|
|
*/
|
|
|
|
@import url('https://fonts.googleapis.com/css?family=Averia+Serif+Libre&display=swap');
|
|
|
|
|
|
/* ========================================================================== */
|
|
/* =============================== NAVIGATION =============================== */
|
|
/* ========================================================================== */
|
|
|
|
/*Configure the tab buttons*/
|
|
.sheet-character,
|
|
.sheet-skills,
|
|
.sheet-combat,
|
|
.sheet-equipment_and_spells,
|
|
.sheet-journal {
|
|
display: none;
|
|
}
|
|
|
|
/* show the selected tab */
|
|
.sheet-tabstoggle[value="character"] ~ div.sheet-character,
|
|
.sheet-tabstoggle[value="skills"] ~ div.sheet-skills,
|
|
.sheet-tabstoggle[value="combat"] ~ div.sheet-combat,
|
|
.sheet-tabstoggle[value="equipment_and_spells"] ~ div.sheet-equipment_and_spells,
|
|
.sheet-tabstoggle[value="journal"] ~ div.sheet-journal,
|
|
.sheet-tabstoggle[value="fullsheet"] ~ div.sheet-character,
|
|
.sheet-tabstoggle[value="fullsheet"] ~ div.sheet-skills,
|
|
.sheet-tabstoggle[value="fullsheet"] ~ div.sheet-combat,
|
|
.sheet-tabstoggle[value="fullsheet"] ~ div.sheet-equipment_and_spells,
|
|
.sheet-tabstoggle[value="fullsheet"] ~ div.sheet-journal {
|
|
display: block;
|
|
}
|
|
|
|
/* Hide repeated information if fullsheet */
|
|
.sheet-tabstoggle[value="fullsheet"] ~ div.sheet-skills table.sheet-pds-et-pdc,
|
|
.sheet-tabstoggle[value="fullsheet"] ~ div.sheet-combat div.sheet-init-combatsheet,
|
|
.sheet-tabstoggle[value="combat"] ~ div.sheet-combat div.sheet-init-fullsheet {
|
|
display: none;
|
|
}
|
|
.sheet-tabstoggle[value="fullsheet"] ~ div.sheet-combat div.sheet-init-fullsheet,
|
|
.sheet-tabstoggle[value="combat"] ~ div.sheet-combat div.sheet-init-combatsheet {
|
|
display: block;
|
|
}
|
|
|
|
/* highlight the selected button */
|
|
.sheet-tabstoggleforbtn[value="character"] ~ button[name="act_character"],
|
|
.sheet-tabstoggleforbtn[value="skills"] ~ button[name="act_skills"],
|
|
.sheet-tabstoggleforbtn[value="combat"] ~ button[name="act_combat"],
|
|
.sheet-tabstoggleforbtn[value="equipment_and_spells"] ~ button[name="act_equipment_and_spells"],
|
|
.sheet-tabstoggleforbtn[value="journal"] ~ button[name="act_journal"],
|
|
.sheet-tabstoggleforbtn[value="fullsheet"] ~ button[name="act_fullsheet"] {
|
|
background-color: rgb(230, 230, 230);
|
|
border-color: rgb(30, 30, 30);
|
|
}
|
|
|
|
/* move the image */
|
|
.sheet-navigation-div {
|
|
position: sticky;
|
|
z-index: 2;
|
|
}
|
|
.sheet-navigation-div img {
|
|
position: absolute;
|
|
z-index: -1;
|
|
top: -155px;
|
|
width: 280px;
|
|
height: auto;
|
|
}
|
|
.sheet-navigation-div .sheet-tabstoggleforbtn[value="character"] ~ img {
|
|
left: -80px;
|
|
}
|
|
.sheet-navigation-div .sheet-tabstoggleforbtn[value="skills"] ~ img {
|
|
left: 40px;
|
|
}
|
|
.sheet-navigation-div .sheet-tabstoggleforbtn[value="combat"] ~ img {
|
|
left: 150px;
|
|
}
|
|
.sheet-navigation-div .sheet-tabstoggleforbtn[value="equipment_and_spells"] ~ img {
|
|
left: 300px;
|
|
}
|
|
.sheet-navigation-div .sheet-tabstoggleforbtn[value="journal"] ~ img {
|
|
left: 445px;
|
|
}
|
|
.sheet-navigation-div .sheet-tabstoggleforbtn[value="fullsheet"] ~ img {
|
|
left: 570px;
|
|
}
|
|
|
|
.sheet-navigation-div {
|
|
border-bottom: 1px solid rgb(30, 30, 30);
|
|
margin-top: 20px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.sheet-navigation-div button {
|
|
border-radius: 15px 15px 0px 0px;
|
|
border-bottom: 0;
|
|
border-color: gray;
|
|
border-style: solid;
|
|
padding: 5px 13px;
|
|
background-color: rgba(255, 255, 255, 0.8);
|
|
font-size: 16px;
|
|
}
|
|
|
|
.sheet-navigation-div button:hover {
|
|
background-color: rgb(200, 200, 200);
|
|
}
|
|
|
|
|
|
/* ========================================================================== */
|
|
/* =============================== SECTIONS ================================= */
|
|
/* ========================================================================== */
|
|
|
|
|
|
.charsheet { /* General sheet properties */
|
|
position: relative;
|
|
color: black;
|
|
font-family: "Averia Serif Libre", "Verdana", sans-serif;
|
|
}
|
|
|
|
div.sheet-outline {
|
|
overflow: hidden;
|
|
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Les-Oublies/images/background.png");
|
|
background-repeat: repeat;
|
|
width: 800px;
|
|
border: 2px solid gray;
|
|
padding: 10px;
|
|
}
|
|
|
|
div.sheet-small-outline {
|
|
margin: 15px 1px;
|
|
padding-top: 15px;
|
|
padding-bottom: 15px;
|
|
border: 1px dotted rgba(150, 150, 150, 0.3);
|
|
border-radius: 5px;
|
|
background-color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
|
|
table {
|
|
margin-left:auto;
|
|
margin-right:auto;
|
|
width: 90%;
|
|
}
|
|
|
|
td {
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
}
|
|
|
|
.sheet-title {
|
|
font-variant: small-caps;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
td.sheet-title {
|
|
font-size: 17px;
|
|
}
|
|
|
|
h1 {
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.sheet-center-content {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-section-oublie table tr:nth-last-child(2) td { /* label 'Taille' and 'Points de vie' */
|
|
padding-bottom: 0px;
|
|
}
|
|
|
|
.sheet-section-oublie table tr:last-child td { /* inputs 'Taille' and 'Points de vie' */
|
|
padding-top: 0px;
|
|
}
|
|
|
|
.sheet-section-songes-cauchemar table tr:nth-child(odd) td { /* label */
|
|
padding-bottom: 0px;
|
|
}
|
|
|
|
.sheet-section-songes-cauchemar table tr:nth-child(even) td { /* inputs */
|
|
padding-top: 0px;
|
|
padding-bottom: 18px;
|
|
}
|
|
|
|
.sheet-section-competences div {
|
|
display: table;
|
|
width: 95%;
|
|
}
|
|
|
|
.sheet-section-competences div span {
|
|
display: table-cell;
|
|
white-space:nowrap;
|
|
}
|
|
|
|
.sheet-section-compagnie {
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-section-compagnie table {
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-section-compagnie span.sheet-company-name-label {
|
|
display: inline-block;
|
|
width: 180px;
|
|
}
|
|
|
|
.sheet-section-compagnie .sheet-company-name {
|
|
width: calc(100% - 220px);
|
|
}
|
|
|
|
.sheet-section-compagnie span.sheet-company-power-label {
|
|
padding: 0px 15px;
|
|
}
|
|
|
|
.sheet-section-compagnie .sheet-company-power-label {
|
|
width: 100px;
|
|
}
|
|
|
|
.sheet-section-compagnie .sheet-company-power {
|
|
width: calc(100% - 100px);
|
|
}
|
|
|
|
.sheet-repeating-section {
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
.sheet-section-initiative {
|
|
text-align: center;
|
|
width: 100%;
|
|
margin: 20px auto;
|
|
}
|
|
|
|
.sheet-section-initiative button[type=roll] {
|
|
width: 200px;
|
|
padding: 15px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.sheet-section-initiative button[type=roll]:before {
|
|
margin-right: 20px;
|
|
font-size: x-large;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.sheet-section-armes {
|
|
width: 796px;
|
|
}
|
|
|
|
.sheet-section-armes span {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-section-competences-combat {
|
|
width: 796px;
|
|
font-size: 15px;
|
|
}
|
|
|
|
.sheet-section-competences-combat {
|
|
width: 796px;
|
|
font-size: medium;
|
|
}
|
|
|
|
.sheet-section-competences-combat td,
|
|
.sheet-section-competences-combat th {
|
|
text-align: center;
|
|
}
|
|
.sheet-section-competences-combat td:first-of-type,
|
|
.sheet-section-competences-combat th:first-of-type {
|
|
text-align: right;
|
|
color: gray;
|
|
padding-right: 20px;
|
|
width: 1%;
|
|
white-space: nowrap;
|
|
}
|
|
.sheet-section-competences-combat td:nth-of-type(2),
|
|
.sheet-section-competences-combat th:nth-of-type(2) {
|
|
text-align: left;
|
|
}
|
|
.sheet-section-competences-combat td:nth-of-type(5) button[type=roll] {
|
|
color: blue;
|
|
}
|
|
|
|
.sheet-section-armures {
|
|
width: 796px;
|
|
}
|
|
|
|
.sheet-section-armures span {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-section-armures .sheet-armure-penalite {
|
|
margin-top: 10px;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.sheet-section-sortileges {
|
|
width: 796px;
|
|
}
|
|
|
|
.sheet-section-sortileges span {
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-section-sortileges hr {
|
|
display: block;
|
|
height: 1px;
|
|
border-style: dotted;
|
|
margin: 2px 8px;
|
|
padding: 0;
|
|
}
|
|
|
|
.sheet-section-notes {
|
|
width: 796px;
|
|
}
|
|
|
|
.sheet-footer {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.sheet-footer img.sheet-bottom-img {
|
|
position: absolute;
|
|
height: 130px;
|
|
width: auto;
|
|
bottom: 12px;
|
|
right: 20px;
|
|
}
|
|
|
|
/* ========================================================================== */
|
|
/* ================================= INPUTS ================================= */
|
|
/* ========================================================================== */
|
|
|
|
.sheet-section-oublie input[type=text] {
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-section-oublie input[type=number],
|
|
.sheet-section-songes-cauchemar input[type=number] {
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
width: 100px;
|
|
}
|
|
|
|
.sheet-section-compagnie .sheet-title-input {
|
|
border-top: 0;
|
|
border-right: 0;
|
|
border-left: 0;
|
|
border-bottom: 1px dashed gray;
|
|
margin-left: 20px;
|
|
margin-bottom: 10px;
|
|
font-size: inherit;
|
|
background-color: transparent;
|
|
}
|
|
|
|
input[type=number].sheet-number-with-max {
|
|
width: 50px;
|
|
}
|
|
|
|
.sheet-section-competences input[type=number].sheet-input-important {
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-section-competences input[type=text] {
|
|
display: table-cell;
|
|
width: 100%;
|
|
border-top: 0;
|
|
border-left: 0;
|
|
border-right: 0;
|
|
border-bottom: 1px dashed gray;
|
|
margin-bottom: 2px;
|
|
margin-left: 5px;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.sheet-section-competences input[type=number] {
|
|
display: inline-block;
|
|
text-align: center;
|
|
width: 60px;
|
|
}
|
|
|
|
.sheet-section-competences .repcontainer {
|
|
width: 100%;
|
|
}
|
|
.sheet-section-competences .repitem {
|
|
display: flex;
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
.sheet-section-competences .repitem input[type="text"] {
|
|
display: initial;
|
|
width: 194px;
|
|
}
|
|
|
|
.sheet-section-montures input[type=text],
|
|
.sheet-section-equipement input[type=text] {
|
|
margin-left: 5%;
|
|
margin-right: 5%;
|
|
display: inline-block;
|
|
width: 90%;
|
|
}
|
|
|
|
.sheet-section-armes .sheet-label-name,
|
|
.sheet-section-armes input[type=text].sheet-input-name {
|
|
margin-left: 8px;
|
|
display: inline-block;
|
|
width: 150px;
|
|
}
|
|
|
|
.sheet-section-armes .sheet-label-number,
|
|
.sheet-section-armes input[type=number].sheet-input-number {
|
|
display: inline-block;
|
|
width: 50px;
|
|
}
|
|
|
|
.sheet-section-armes .sheet-label-particularites,
|
|
.sheet-section-armes input[type=text].sheet-input-particularites {
|
|
display: inline-block;
|
|
width: 350px;
|
|
}
|
|
|
|
.sheet-section-armes .sheet-label-roll {
|
|
display: inline-block;
|
|
width: 120px;
|
|
}
|
|
|
|
.sheet-section-armes button[type="roll"].sheet-init-roll {
|
|
display: inline-block;
|
|
padding: 5px 10px 5px 10px;
|
|
margin: 0px 0px 20px 20px;
|
|
}
|
|
|
|
.sheet-section-armes .sheet-init-roll:before,
|
|
.sheet-section-armes .sheet-input-roll:before {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.sheet-section-armes .sheet-input-roll:first-child {
|
|
width: 45px;
|
|
vertical-align: middle;
|
|
}
|
|
.sheet-section-armes .sheet-input-roll:nth-child(2) {
|
|
width: 35px;
|
|
}
|
|
.sheet-section-armes .sheet-small-text {
|
|
font-size: x-small;
|
|
}
|
|
|
|
.sheet-section-armures .sheet-label-type,
|
|
.sheet-section-armures input[type=text].sheet-input-type {
|
|
margin-left: 8px;
|
|
display: inline-block;
|
|
width: calc(100% - 250px);
|
|
}
|
|
|
|
.sheet-section-armures .sheet-label-number,
|
|
.sheet-section-armures input[type=number].sheet-input-number {
|
|
display: inline-block;
|
|
width: 100px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-section-sortileges span,
|
|
.sheet-section-sortileges input {
|
|
display: inline-block;
|
|
width: 16%;
|
|
}
|
|
|
|
.sheet-section-sortileges textarea.sheet-input-descr {
|
|
width: calc(100% - 26px);
|
|
margin: 3px 8px 3px 8px;
|
|
resize: vertical;
|
|
height: 2em;
|
|
}
|
|
|
|
.sheet-section-sortileges span:first-child,
|
|
.sheet-section-sortileges input:first-child {
|
|
margin-left: 8px;
|
|
}
|
|
|
|
.sheet-section-primes-penalites th:first-child,
|
|
.sheet-section-primes-penalites td:first-child {
|
|
padding-right: 8px;
|
|
}
|
|
.sheet-section-primes-penalites th:last-child,
|
|
.sheet-section-primes-penalites td:first-child {
|
|
padding-left: 8px;
|
|
}
|
|
.sheet-section-primes-penalites select {
|
|
width: 90%;
|
|
}
|
|
.sheet-section-primes-penalites textarea {
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
width: 90%;
|
|
height: 5em;
|
|
resize: none;
|
|
}
|
|
|
|
.sheet-section-notes textarea {
|
|
display: block;
|
|
margin: auto;
|
|
width:95%;
|
|
resize: vertical;
|
|
height: auto;
|
|
}
|
|
|
|
/* ========================================================================== */
|
|
/* ============================= ROLL TEMPLATES ============================= */
|
|
/* ========================================================================== */
|
|
|
|
/* All rolltemplates */
|
|
|
|
.sheet-rolltemplate-classic-roll div.sheet-template-container,
|
|
.sheet-rolltemplate-attack-roll div.sheet-template-container,
|
|
.sheet-rolltemplate-initiative-roll div.sheet-template-container {
|
|
background-color: rgb(233, 233, 233);
|
|
color: rgba(50, 50, 50);
|
|
border: 2px solid gray !important;
|
|
border-radius: 3px;
|
|
font-family: "Averia Serif Libre", "Verdana", sans-serif;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll .sheet-template-header,
|
|
.sheet-rolltemplate-attack-roll .sheet-template-header,
|
|
.sheet-rolltemplate-initiative-roll .sheet-template-header {
|
|
background-color: rgba(50, 50, 50);
|
|
border-bottom: 1px solid black;
|
|
color: rgb(233, 233, 233);
|
|
padding: 2px 2px 2px 15px;
|
|
line-height: 1.6em;
|
|
font-size: 1.2em;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll .sheet-template-white,
|
|
.sheet-rolltemplate-attack-roll .sheet-template-white,
|
|
.sheet-rolltemplate-initiative-roll .sheet-template-white {
|
|
background-color: white;
|
|
color: black;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll .sheet-template-black,
|
|
.sheet-rolltemplate-attack-roll .sheet-template-black,
|
|
.sheet-rolltemplate-initiative-roll .sheet-template-black {
|
|
background-color: black;
|
|
color: white;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll .inlinerollresult,
|
|
.sheet-rolltemplate-attack-roll .inlinerollresult,
|
|
.sheet-rolltemplate-initiative-roll .inlinerollresult {
|
|
display: inline-block;
|
|
color: black;
|
|
min-width: 1.5em;
|
|
text-align: center;
|
|
border: 2px solid rgba(167, 168, 170,1);
|
|
}
|
|
.sheet-rolltemplate-classic-roll .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-attack-roll .inlinerollresult.fullcrit,
|
|
.sheet-rolltemplate-initiative-roll .inlinerollresult.fullcrit {
|
|
border: 2px solid #3FB315;
|
|
}
|
|
.sheet-rolltemplate-classic-roll .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-attack-roll .inlinerollresult.fullfail,
|
|
.sheet-rolltemplate-initiative-roll .inlinerollresult.fullfail {
|
|
border: 2px solid #B31515;
|
|
}
|
|
.sheet-rolltemplate-classic-roll .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-attack-roll .inlinerollresult.importantroll,
|
|
.sheet-rolltemplate-initiative-roll .inlinerollresult.importantroll {
|
|
border: 2px solid #4A57ED;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll .sheet-template-strong,
|
|
.sheet-rolltemplate-attack-roll .sheet-template-strong,
|
|
.sheet-rolltemplate-initiative-roll .sheet-template-strong {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll .sheet-template-weak,
|
|
.sheet-rolltemplate-attack-roll .sheet-template-weak,
|
|
.sheet-rolltemplate-initiative-roll .sheet-template-weak {
|
|
color: rgba(80, 80, 80);
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll table,
|
|
.sheet-rolltemplate-attack-roll table,
|
|
.sheet-rolltemplate-initiative-roll table {
|
|
width: 100%;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll table td,
|
|
.sheet-rolltemplate-attack-roll table td,
|
|
.sheet-rolltemplate-initiative-roll table td{
|
|
padding: 10px 5px 10px 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll .sheet-template-primes-penalites,
|
|
.sheet-rolltemplate-attack-roll .sheet-template-primes-penalites,
|
|
.sheet-rolltemplate-initiative-roll .sheet-template-primes-penalites {
|
|
border-top: 1px dotted gray;
|
|
}
|
|
|
|
/* Classic roll */
|
|
|
|
.sheet-rolltemplate-classic-roll table tr {
|
|
border-bottom: 1px dotted gray;
|
|
}
|
|
|
|
.sheet-rolltemplate-classic-roll .sheet-template-first-col {
|
|
width: 150px;
|
|
}
|
|
|
|
/* Attack roll */
|
|
|
|
.sheet-rolltemplate-attack-roll table th {
|
|
height: 2em;
|
|
text-align: center;
|
|
padding: 0px 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-attack-roll .sheet-template-row-rolls {
|
|
border-bottom: 2px solid gray;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-rolltemplate-attack-roll .sheet-template-difficulte {
|
|
border-left: 2px dotted gray;
|
|
}
|
|
|
|
.sheet-rolltemplate-attack-roll .sheet-template-particularites {
|
|
word-break: break-word;
|
|
font-style: italic;
|
|
font-weight: 200;
|
|
}
|
|
|
|
/* Initiative roll */ |