Nighthawk/roll20-character-sheets
1
0
Fork 0
mirror of https://github.com/Nighthawk42/roll20-character-sheets.git synced 2026-08-30 03:40:32 +00:00
Code Issues Packages Projects Releases Wiki Activity
Files
master
roll20-character-sheets/Aventures/Aventures.css
T
Mihawk59 0c1606bab4 Update Aventures.css
2022-01-04 15:43:56 +01:00

831 lines
18 KiB
CSS
Raw Permalink Blame History

/*Page*/
.page {
background-image:url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Aventures/img/Aventures-bg.jpg');
border: 1px solid #D3D3D3;
font-weight: normal;
}
.page-form ~ div.page {
display: block;
}
.page-head {
border: 1px solid gray;
margin-block: 1%;
width: 100%;
text-align: center;
font-weight: bold;
background-color: #fff;
font-size: 1em;
}
/*Configure les boutons de tabs*/
.charsheet .page-competences,
.charsheet .page-equipement {
display: none;
}
/* Afficher/Masquer les tabs */
.charsheet .page-tabstoggle[value="competences"] ~ div.page-competences,
.charsheet .page-tabstoggle[value="equipement"] ~ div.page-equipement {
display: block;
}
/* Style de tab */
.tab {
overflow: hidden;
border-bottom: 5px solid #ccc;
border-top: 5px solid #ccc;
background-color : transparent;
}
/* Style des boutons de tabs */
.tab button {
background-color: inherit;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
}
/* Background des boutons tabs */
.tab button:hover {
background-color: rgb(253, 237, 165);
}
/*Logo*/
div.page-logo-aventures {
text-align: center;
margin: auto;
}
/*Blocks*/
div.page-block {
display: inline-block;
font-weight: bold;
margin: 1%;
width: 98%;
}
/* === Grids === */
/* === Grid character === */
.grid-character {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
gap: 1%;
padding-block: 1%;
}
.grid-character-nom {
grid-column: 1;
grid-row: 1;
padding-block: 1%;
}
.grid-character-race {
grid-column: 2;
grid-row: 1;
padding-block: 1%;
}
.grid-character-classe {
grid-column: 3;
grid-row: 1;
padding-block: 1%;
}
.grid-character-element {
grid-column: 4;
grid-row: 1;
padding-block: 1%;
}
.grid-character-themes {
grid-column: 1 / 3;
grid-row: 2;
padding-block: 1%;
}
.grid-character-langues {
grid-column: 3 / 5;
grid-row: 2;
padding-block: 1%;
}
.grid-character-vocation {
grid-column: 1 / 5;
grid-row: 3;
}
/* === Grid stats principales === */
.grid-global-stats {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
gap: 2%;
}
.grid-stats {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
border:1px solid rgba(26, 27, 28, 0.1);
grid-column: 1 / 4;
}
.grid-stats-physique {
display: grid;
grid-column: 1 / 3;
grid-row: 1;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-social {
display: grid;
grid-column: 3 / 5;
grid-row: 1;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-mental {
display: grid;
grid-column: 5 / 7;
grid-row: 1;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-physique-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 1 / 3;
grid-row: 2;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-social-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 3 / 5;
grid-row: 2;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-mental-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 5 / 7;
grid-row: 2;
border:1px solid rgba(26, 27, 28, 0.1);
}
/* === Grid stats secondaires === */
.grid-stats-puissance {
display: grid;
grid-column: 1;
grid-row: 3;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-finesse {
display: grid;
grid-column: 2;
grid-row: 3;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-aura {
display: grid;
grid-column: 3;
grid-row: 3;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-relations {
display: grid;
grid-column: 4;
grid-row: 3;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-instinct {
display: grid;
grid-column: 5;
grid-row: 3;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-savoir {
display: grid;
grid-column: 6;
grid-row: 3;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-puissance-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 1;
grid-row: 4;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-finesse-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 2;
grid-row: 4;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-aura-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 3;
grid-row: 4;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-relations-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 4;
grid-row: 4;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-instinct-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 5;
grid-row: 4;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-savoir-value {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
grid-column: 6;
grid-row: 4;
border:1px solid rgba(26, 27, 28, 0.1);
}
/*Grid cartons */
.grid-carton-puissance {
display: flex;
align-items: center;
justify-content: space-evenly;
text-align: center;
grid-column: 1;
grid-row: 5;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-carton-finesse {
display: flex;
align-items: center;
justify-content: space-evenly;
text-align: center;
grid-column: 2;
grid-row: 5;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-carton-aura {
display: flex;
align-items: center;
justify-content: space-evenly;
text-align: center;
grid-column: 3;
grid-row: 5;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-carton-relation {
display: flex;
align-items: center;
justify-content: space-evenly;
text-align: center;
grid-column: 4;
grid-row: 5;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-carton-instinct {
display: flex;
align-items: center;
justify-content: space-evenly;
text-align: center;
grid-column: 5;
grid-row: 5;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-carton-savoir {
display: flex;
align-items: center;
justify-content: space-evenly;
text-align: center;
grid-column: 6;
grid-row: 5;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
/* === Grid bonus de sous-stats === */
.grid-stats-bonus {
display: grid;
grid-column: 1 / 7;
grid-row: 6;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-bonus-puissance {
display: grid;
grid-column: 1;
grid-row: 7;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-bonus-finesse {
display: grid;
grid-column: 2;
grid-row: 7;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-bonus-aura {
display: grid;
grid-column: 3;
grid-row: 7;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-bonus-relation {
display: grid;
grid-column: 4;
grid-row: 7;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-bonus-instinct {
display: grid;
grid-column: 5;
grid-row: 7;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
.grid-bonus-savoir {
display: grid;
grid-column: 6;
grid-row: 7;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: transparent;
}
/* === Grid stats ingame === */
.grid-stats-ingame {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
border:1px solid rgba(26, 27, 28, 0.1);
grid-column: 4;
}
.grid-stats-lvl {
display: grid;
grid-column: 1;
grid-row: 1;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-pv {
display: grid;
grid-column: 1;
grid-row: 2;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-psy {
display: grid;
grid-column: 1;
grid-row: 3;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-posture {
display: grid;
grid-column: 1;
grid-row: 4;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-lvl-value {
display: grid;
grid-column: 2;
grid-row: 1;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
background-color: #fff;
}
.grid-stats-pv-value {
display: flex;
grid-column: 2;
grid-row: 2;
justify-content: center;
align-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-psy-value {
display: flex;
grid-column: 2;
grid-row: 3;
justify-content: center;
align-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-stats-posture-value {
display: grid;
grid-column: 2;
grid-row: 4;
align-items: center;
justify-items: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-des-aventures-des {
display: flex;
grid-column: 1;
grid-row: 5;
align-items: center;
justify-content: space-between;
padding-left: 5%;
padding-right: 5%;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-des-aventures-reste {
display: flex;
grid-column: 2;
grid-row: 5;
align-items: center;
justify-content: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-des-mesaventures-des {
display: flex;
grid-column: 1;
grid-row: 6;
align-items: center;
justify-content: space-between;
padding-left: 5%;
padding-right: 5%;
border:1px solid rgba(26, 27, 28, 0.1);
}
.grid-des-mesaventures-reste {
display: flex;
grid-column: 2;
grid-row: 6;
align-items: center;
justify-content: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
/*Grid avantage desavantage*/
.grid-bonus-detail {
grid-column: 1 / 7;
grid-row: 8;
border:1px solid rgba(26, 27, 28, 0.1);
}
/*Grid avantage desavantage*/
.grid-avantage {
grid-column: 1 / 7;
grid-row: 9;
text-align: center;
font-weight: bold;
border:1px solid rgba(26, 27, 28, 0.1);
}
/* === Grid competences et dons === */
.grid-competences-dons {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
gap: 2%;
padding-block: 1%;
}
.grid-competences {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
border:1px solid rgba(26, 27, 28, 0.1);
grid-column: 1 / 4;
}
.grid-dons {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
border:1px solid rgba(26, 27, 28, 0.1);
grid-column: 4 / 7;
}
.grid-competences-passiv {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
border:1px solid rgba(26, 27, 28, 0.1);
gap: 2%;
padding-block: 1%;
}
/* === Grid equipement === */
.grid-equipement {
display: grid;
grid-auto-columns: minmax(10%, auto);
grid-auto-rows: minmax(10%, auto);
gap: 2%;
padding-block: 1%;
}
.grid-armes {
display: grid;
border:1px solid rgba(26, 27, 28, 0.1);
grid-column: 1 / 4;
grid-row: 1;
}
.grid-armure {
display: grid;
border:1px solid rgba(26, 27, 28, 0.1);
grid-column: 4 / 7;
grid-row: 1;
}
.grid-sac {
display: grid;
border:1px solid rgba(26, 27, 28, 0.1);
grid-column: 1 / 4;
grid-row: 2;
}
.grid-autre {
display: grid;
border:1px solid rgba(26, 27, 28, 0.1);
grid-column: 4 / 7;
grid-row: 2;
}
/*Input text*/
textarea {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
max-width: 95% !important;
max-height: 80% !important;
}
textarea.themes-langues {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
min-width: 95% !important;
max-height: 30px !important;
}
textarea.vocation {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
min-width: 98% !important;
max-height: 30px !important;
}
textarea.bonus-detail {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
min-width: 98% !important;
max-height: 80% !important;
}
textarea.passiv {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
min-width: 100% !important;
min-height: 10px !important;
}
input[type=text] {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
width: 98%;
}
input[type=text].page-text-don {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
width: 50%;
}
input[type=text].page-text-competence {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
width: 50%;
}
input[type=text].page-objet-nom {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
width: 90%;
display:inline;
}
input[type=text].page-arme {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
width: 40%;
}
input[type=text].page-armure {
border: transparent;
background-color:rgba(255, 255, 255, 0.5);
width: 85%;
}
/* === Inputs number === */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
opacity: 1;
-webkit-appearance: none;
}
input[type=number] {
-moz-appearance: textfield;
width: 25px;
display: inline;
text-align: center;
border:1px solid rgba(26, 27, 28, 0.1);
}
input[type=number].page-number {
-moz-appearance: textfield;
align-content: center;
width: 20px !important;
display: inline;
font-weight: bold;
font-size: 1em;
background-color:rgba(255, 255, 255, 0.3);
border:1px solid rgba(26, 27, 28, 0.1);
}
input[type=number].page-number-main {
-moz-appearance: textfield;
align-content: center;
width: 30px !important;
display: inline;
font-weight: bold;
font-size: 1.2em;
background-color:rgba(255, 255, 255, 0.6);
border:1px solid rgba(26, 27, 28, 0.1);
}
input[type=number].page-number-bar-max {
-moz-appearance: textfield;
align-content: center;
width: 30px !important;
color: #b74437;
display: inline;
font-weight: bold;
font-size: 1.2em;
background-color:rgba(255, 255, 255, 0.6);
border:1px solid rgba(26, 27, 28, 0.1);
}
input[type=number].page-number-long {
-moz-appearance: textfield;
align-content: center;
width: 35px !important;
display: inline;
font-size: 1em;
background-color:rgba(255, 255, 255, 0.6);
border:1px solid rgba(26, 27, 28, 0.1);
}
input[type=number].page-query {
-moz-appearance: textfield;
display: none;
}
/* === Inputs checkbox === */
input[type="checkbox"].page-carton-jaune
{
margin: 2px;
outline: inset 3px #f4df42;
}
input[type="checkbox"].page-carton-rouge
{
margin: 2px;
outline: inset 3px #b74437;
}
/* ==== Placeholders ====== */
input::placeholder {
opacity: 60%;
}
/* === Select === */
.page-select {
width: 100px !important;
display: inline;
position: relative;
top: 2px;
background-color:rgba(255, 255, 255, 0.8);
}
.page-comp-dX-select {
width: 55px;
display: inline;
position: relative;
top: 2px;
background-color:rgba(255, 255, 255, 0.7);
}
/* === Options === */
.page-options {
text-align: right;
font-size: 0.8em;
color: rgba(25,26,27,0.7);
background-color: rgba(255, 255, 255, 0.4);
}
/* === Boutons === */
button[type=roll] {
background-color: rgba(255, 255, 255, 1);
border-radius: 5px;
border: outset 1px;
width: 15px;
}
.des_buttons {
background-color: transparent;
border: transparent;
width: 15px;
}
/* === Boutons de répétitions de lignes === */
.repcontrol_edit {
opacity: 50%;
}
.repcontrol_add {
opacity: 50%;
}
Reference in New Issue View Git Blame Copy Permalink