Files
roll20-character-sheets/Aria/Aria.css
T
PixelReveur e5f2156fe4 Update Aria.css
Résolution d'un soucis de lisibilité.
2020-12-06 15:42:07 +01:00

898 lines
15 KiB
CSS

@font-face {
font-family: 'Kalam';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local('Kalam'), local('Kalam-Regular'), url(https://fonts.gstatic.com/s/kalam/v11/YA9dr0Wd4kDdMthfOCfzsw.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Piazzolla';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/piazzolla/v2/N0b52SlTPu5rIkWIZjVKKtYtfxYqZ4RJBFzFfYUjkSDdlqZgy7I_wUL13gA.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
body {
}
input {
font-family: 'Kalam', cursive;
font-size: 18px;
padding: 0px 5px;
color: #307187;
background-color: rgba(255, 255, 255, .5);
border-color: #a69c73;
}
textarea {
font-family: 'Kalam', cursive;
font-size: 18px;
color: #307187;
background-color: rgba(255, 255, 255, .5);
border-color: #a69c73;
resize: none;
}
select {
background-color: rgba(255, 255, 255, .5);
border-color: #a69c73;
width: auto;
}
button {
position: relative;
background-color: rgba(255, 255, 255, .5) !important;
background-image: none !important;
border: 1px solid #a69c73 !important;
border-radius: 0px !important;
padding: 5px 5px !important;
}
.sheet-btn-min {
width: 15px;
height: 15px;
top: -2px;
}
h3 {
margin-top: 10px;
margin-bottom: 5px;
}
.sheet-hr_opt {
margin-top: 5px;
margin-bottom: 10px;
border-top-color: #a69c73;
width: calc(100% - 20px);
}
.sheet-tabstoggle[value="1"] ~ div.sheet-options {
display: block;
}
.sheet-tabstoggle[value="1"] ~ button.sheet-l_options {
background: rgba(0, 0, 0, 0) url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Aria/images/close.png) no-repeat center center !important;
background-size: 100% 100% !important;
}
.sheet-co-comp1-hi[value="1"] ~ div.sheet-co-comp1-div {
display: block;
}
.sheet-co-comp2-hi[value="1"] ~ div.sheet-co-comp2-div {
display: block;
}
.sheet-co-comp3-hi[value="1"] ~ div.sheet-co-comp3-div {
display: block;
}
.sheet-pretire-hi[value="1"] ~ div.sheet-pretire-div {
display: block;
}
.sheet-co-comp1-div {
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
display: none;
text-align: center;
color: #ffffff;
z-index: 500;
width: calc(100% - 10px);
height: calc(100% - 10px);
padding: 5px;
background: rgba(0, 0, 0, 0.90);
}
.sheet-co-comp2-div {
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
display: none;
text-align: center;
color: #ffffff;
z-index: 500;
width: calc(100% - 10px);
height: calc(100% - 10px);
padding: 5px;
background: rgba(0, 0, 0, 0.90);
}
.sheet-co-comp3-div {
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
display: none;
text-align: center;
color: #ffffff;
z-index: 500;
width: calc(100% - 10px);
height: calc(100% - 10px);
padding: 5px;
background: rgba(0, 0, 0, 0.90);
}
.sheet-pretire-div {
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
display: none;
text-align: center;
color: #ffffff;
z-index: 500;
width: calc(100% - 10px);
height: calc(100% - 10px);
padding: 5px;
background: rgba(0, 0, 0, 0.90);
}
.sheet-l_options {
position: absolute;
background: rgba(0, 0, 0, 0) url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Aria/images/options.png) no-repeat center center !important;
background-size: 100% 100% !important;
z-index: 100;
top: 2px;
right: 1px;
height: 10px;
width: 10px;
border: none !important;
filter: brightness(0.8);
}
.sheet-l_options:hover {
filter: brightness(0.4);
}
.sheet-options {
position: relative;
display: none;
z-index: 50;
width: calc(100% - 10px);
height: auto;
padding: 5px;
background: rgba(245, 245, 265, 1);
border: 1px solid #201f22;
}
.sheet-fiche-pnj {
height: 585px;
position: absolute;
width: 100%;
background: #fcf8f2 url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Aria/images/background.jpg) no-repeat center top;
background-size: cover;
border: 1px solid #a69c73;
display: none;
}
.sheet-fiche-pj {
height: 1380px;
position: absolute;
width: 100%;
background: #fcf8f2 url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Aria/images/background.jpg) no-repeat center top;
background-size: cover;
border: 1px solid #a69c73;
display: none;
}
.sheet-toggle-pj-pnj[value="pnj"] ~ div.sheet-fiche-pnj,
.sheet-toggle-pj-pnj[value="pj"] ~ div.sheet-fiche-pj {
display: block;
}
.sheet-body {
position: relative;
font-family: 'Piazzolla', serif;
max-width: 1250px;
min-width: 675px;
margin: 0;
padding: 0;
bottom: 0px;
left: 0px;
right: 0px;
color: #201f22;
}
.sheet-titre {
text-transform: uppercase;
font-size: 18px;
}
.sheet-av-texte {
float: left;
width: 25%;
line-height: 25px;
overflow: hidden;
}
.sheet-av-input-texte {
float: left;
width: 75%;
overflow: hidden;
}
.sheet-ca-button {
float: left;
width: 32px;
height: 29px;
line-height: 25px;
}
.sheet-ca-texte {
float: left;
width: 33%;
line-height: 25px;
overflow: hidden;
}
.sheet-ca-input-texte {
float: left;
width: 50px;
overflow: hidden;
text-align: center;
}
.sheet-vi-button {
position: relative;
top: 30px;
width: 30px;
height: 29px;
line-height: 25px;
}
.sheet-vi-input-texte {
position: relative;
width: calc(100% - 110px);
top: 0px;
left: 32px;
overflow: hidden;
}
.sheet-vi-input-texte-degats {
position: absolute;
float: right;
width: 75px;
height: 75px !important;
top: 0px;
right: 0px;
border-radius: 37px;
overflow: hidden;
text-align: center;
font-size: 20px;
padding: 0px;
}
.sheet-vi-texte1 {
position: absolute;
float: left;
overflow: hidden;
top: 58px;
left: 30px;
}
.sheet-vi-texte2 {
position: absolute;
float: left;
overflow: hidden;
top: 58px;
left: calc(100% - 106px);
}
.sheet-sa-input-texte {
width: 75px;
height: 75px !important;
border-radius: 37px;
overflow: hidden;
text-align: center;
font-size: 25px;
}
.sheet-sa-texte {
overflow: hidden;
text-align: center;
}
.sheet-rp-texte {
line-height: 12px;
}
.sheet-rp-input-texte {
position: relative;
height: 50px;
font-size: 15px;
top: 5px;
}
.sheet-comp {
position: relative;
width: 100%;
height: 1px;
margin-top: 28px;
}
.sheet-co-button {
position: absolute;
top: -4px;
width: 30px;
height: 29px;
line-height: 25px;
}
.sheet-co-nom {
position: absolute;
top: 0px;
left: 32px;
font-size: 12px;
}
.sheet-co-lien {
position: absolute;
top: 0px;
right: 70px;
width: 80px;
text-align: center;
}
.sheet-co-score {
position: absolute;
top: -5px;
right: 0px;
width: 70px;
text-align: center;
}
.sheet-co-input-texte {
width: 50px;
text-align: center;
}
.sheet-comp-sp {
position: relative;
width: 100%;
height: 1px;
margin-top: 28px;
}
.sheet-co-sp-button {
position: absolute;
top: -4px;
width: 30px;
height: 29px;
line-height: 25px;
}
.sheet-co-sp-nom {
position: absolute;
top: -5px;
left: 32px;
width: calc(100% - 212px);
font-size: 12px;
}
.sheet-co-sp-lien {
position: absolute;
top: -5px;
right: 70px;
width: 105px;
text-align: center;
}
.sheet-co-sp-score {
position: absolute;
top: -5px;
right: 0px;
width: 70px;
text-align: center;
}
.sheet-co-sp-input-nom {
width: 100%;
font-size: 15px;
padding: 2px 2px;
}
.sheet-co-sp-input-lien {
width: 40px;
text-align: center;
font-size: 15px;
padding: 2px 2px;
}
.sheet-co-sp-input-score {
width: 50px;
text-align: center;
}
.sheet-po-texte {
text-transform: uppercase;
}
.sheet-po-input-texte {
position: relative;
height: 150px;
font-size: 15px;
}
.sheet-po-input-notes {
/* background: rgba(255, 255, 255, .5) url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Aria/images/logo_250.png) no-repeat center center; */
}
.sheet-bo-texte {
float: left;
width: 25%;
}
.sheet-bo-input-texte {
float: left;
width: calc(25% - 5px);
margin-right: 5px;
font-size: 15px;
}
/*------------- AVENTURIER -------------*/
.sheet-block-av-ca {
position: relative;
top: 20px;
left: 10px;
width: calc(50% - 70px);
}
.sheet-t-aventurier {
position: absolute;
width: 100%;
}
.sheet-av-nom {
position: absolute;
top: 35px;
width: 100%;
}
.sheet-av-profession {
position: absolute;
top: 65px;
width: 100%;
}
.sheet-av-age {
position: absolute;
top: 95px;
width: 100%;
}
/*---------- CARACTERISTIQUES ----------*/
.sheet-t-carac {
position: absolute;
top: 125px;
width: 100%;
}
.sheet-ca-force {
position: absolute;
top: 160px;
width: 100%;
}
.sheet-ca-dexterite {
position: absolute;
top: 190px;
width: 100%;
}
.sheet-ca-endurance {
position: absolute;
top: 220px;
width: 100%;
}
.sheet-ca-intelligence {
position: absolute;
top: 250px;
width: 100%;
}
.sheet-ca-charisme {
position: absolute;
top: 280px;
width: 100%;
}
/*--------- VIVRE OU SURVIVRE ---------*/
.sheet-block-vi {
position: relative;
top: 20px;
left: calc(50% - 40px);
width: calc(50% - 70px);
}
.sheet-t-vivre {
position: absolute;
top: 0px;
width: 100%;
}
.sheet-vi-arme1 {
position: absolute;
top: 35px;
width: 100%;
}
.sheet-vi-arme2 {
position: absolute;
top: 135px;
width: 100%;
}
.sheet-vi-arme3 {
position: absolute;
top: 235px;
width: 100%;
}
/*--------------- SANTE ---------------*/
.sheet-block-sa {
position: relative;
top: 20px;
left: calc(100% - 100px);
width: 100px;
text-align: center;
}
.sheet-sa-vie {
position: absolute;
top: 0px;
width: 100%;
text-align: center;
}
.sheet-sa-blessures {
position: absolute;
top: 110px;
width: 100%;
text-align: center;
}
.sheet-sa-protection {
position: absolute;
top: 220px;
width: 100%;
text-align: center;
}
.sheet-sa-hr1 {
position: relative;
top: 350px;
}
/*----------------- RP -----------------*/
.sheet-block-rp {
position: relative;
top: 360px;
left: 10px;
width: calc(100% - 20px);
}
.sheet-rp-genial {
float: left;
width: calc(50% - 18px);
padding-right: 10px;
}
.sheet-rp-problemes {
float: left;
width: calc(50% - 18px);
padding-left: 10px;
}
.sheet-hr1 {
position: relative;
border-top-color: #a69c73;
top: 380px;
width: calc(100% - 20px);
}
/*----------- COMPETENCES -----------*/
.sheet-block-co-titre {
position: relative;
top: 380px;
left: 10px;
width: calc(50% - 20px);
text-transform: uppercase;
}
.sheet-co-titre1 {
position: absolute;
top: 0px;
left: 0px;
}
.sheet-co-titre2 {
position: absolute;
top: 0px;
right: 70px;
width: 80px;
text-align: center;
}
.sheet-co-titre3 {
position: absolute;
top: 0px;
right: 0px;
width: 70px;
text-align: center;
}
.sheet-block-co {
position: relative;
top: 400px;
left: 10px;
width: calc(50% - 20px);
}
.sheet-block-co-separateur {
position: absolute;
top: -20px;
left: -13px;
width: 1px;
height: 600px;
background: #a69c73;
}
.sheet-block-co-sp-titre {
position: relative;
top: -180px;
left: calc(50% + 10px);
width: calc(50% - 20px);
text-transform: uppercase;
}
.sheet-co-sp-titre1 {
position: absolute;
top: 0px;
left: 0px;
}
.sheet-co-sp-titre2 {
position: absolute;
top: 0px;
right: 70px;
width: 105px;
text-align: center;
}
.sheet-co-sp-titre3 {
position: absolute;
top: 0px;
right: 0px;
width: 70px;
text-align: center;
}
.sheet-block-co-sp {
position: relative;
top: -180px;
left: calc(50% + 10px);
width: calc(50% - 20px);
}
.sheet-hr2 {
position: relative;
border-top-color: #a69c73;
top: -150px;
width: calc(100% - 20px);
}
.sheet-block-co-sp-titre-pnj {
position: relative;
top: 120px;
left: 0px;
width: calc(100% - 20px);
text-transform: uppercase;
}
.sheet-block-co-sp-pnj {
position: relative;
top: 150px;
left: 0px;
width: calc(100% - 20px);
}
.sheet-co-sp-nom-pnj {
position: absolute;
top: -5px;
left: 32px;
width: calc(100% - 50px);
font-size: 12px;
}
/*---------- POSSESSION/NOTES ----------*/
.sheet-block-po {
position: relative;
top: -150px;
left: 10px;
width: calc(100% - 20px);
}
.sheet-po-possessions {
float: left;
width: calc(50% - 18px);
padding-right: 10px;
}
.sheet-po-notes {
float: left;
width: calc(50% - 18px);
padding-left: 10px;
}
.sheet-block-bo {
position: relative;
width: calc(100% + 15px);
height: 50px;
top: -10px;
}
.sheet-block-bo-texte {
}
.sheet-block-bo-input-texte {
position: relative;
}
/*---------- OPTIONS ----------*/
.sheet-opt-titre {
position: absolute;
width: 100%;
text-transform: uppercase;
font-size: 18px;
left: 30px;
}
.sheet-opt-content {
position: absolute;
width: calc(100% - 10px);
left: 5px;
top: 30px;
}
.sheet-opt-ligne {
position: relative;
width: 100%;
}
.sheet-opt-nom {
float: left;
width: 100%;
line-height: 25px;
overflow: hidden;
}
/* ===================================================== */
/* ===================== TEMPLATES ===================== */
/* ===================================================== */
.sheet-rolltemplate-aria1 {
border-color: #a69c73;
border-style: solid;
border-width: 2px;
background: #fcf8f2;
padding: 5px 5px;
padding-bottom: 1px;
font-family: 'Piazzolla', serif;
font-size: 10pt;
}
.sheet-rolltemplate-aria1 h1,
.sheet-rolltemplate-aria1 h2 {
margin: 0;
padding: 0;
line-height: 1;
}
.sheet-rolltemplate-aria1 h1 {
font-size: 16pt;
margin-bottom: 2px;
}
.sheet-rolltemplate-aria1 h2 {
border-bottom: 2px solid rgba(85, 78, 48, 0.20);
margin-bottom: 10px;
color: rgba(85, 78, 48, 1);
font-size: 12pt;
}
.sheet-rolltemplate-aria1 .sheet-aria1-body {
margin-left: 1px;
}
.sheet-rolltemplate-aria1 .sheet-aria1-roll {
margin-top: 10px;
text-align: center;
}
.sheet-rolltemplate-aria1 .sheet-aria1-footer {
width: 100%;
height: 10px;
}
.sheet-rolltemplate-aria1 .sheet-aria1-buttons {
text-align: center;
}
.sheet-rolltemplate-aria1 .sheet-aria1-buttons a {
background: rgba(85, 78, 48, 1);
padding: 5px;
color: white;
display: inline-block;
border: 1px solid white;
}
.sheet-rolltemplate-aria1 .sheet-aria1-buttons .sheet-aria1-buttontext {
font-style: italic;
}
.sheet-rolltemplate-aria1 .sheet-aria1-body .importantroll,
.sheet-rolltemplate-aria1 .sheet-aria1-body .fullcrit,
.sheet-rolltemplate-aria1 .sheet-aria1-body .fullfail,
.sheet-rolltemplate-aria1 .sheet-aria1-body .inlinerollresult,
.sheet-rolltemplate-aria1 .sheet-aria1-roll .importantroll,
.sheet-rolltemplate-aria1 .sheet-aria1-roll .fullcrit,
.sheet-rolltemplate-aria1 .sheet-aria1-roll .fullfail,
.sheet-rolltemplate-aria1 .sheet-aria1-roll .inlinerollresult {
border: none;
background: transparent;
font-family: inherit;
font-size: 18pt;
font-weight: bold;
}
.sheet-rolltemplate-aria1 .sheet-aria1-body .fullfail,
.sheet-rolltemplate-aria1 .sheet-aria1-roll .fullfail {
color: rgba(160, 50, 50, 1);
}
.sheet-rolltemplate-aria1 .sheet-aria1-body .fullcrit,
.sheet-rolltemplate-aria1 .sheet-aria1-roll .fullcrit {
color: rgba(50, 120, 50, 1);
}