mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
1246 lines
24 KiB
CSS
1246 lines
24 KiB
CSS
/* Roll20 - Fiche Insectopia V2.1 by Giovanninatale & Surfandko V2.1 2020-09-06 */
|
|
|
|
/* classe affichage hexagon */
|
|
.sheet-hexagon {
|
|
position: relative;
|
|
background: black;
|
|
float: left;
|
|
}
|
|
.sheet-hexagon-geant {
|
|
height: 500px;
|
|
width: 850px;
|
|
}
|
|
.sheet-hexagon-entete {
|
|
height: 225px;
|
|
width: 640px;
|
|
}
|
|
.sheet-hexagon-equipements {
|
|
height: 200px;
|
|
width: 630px;
|
|
}
|
|
.sheet-hexagon-grand {
|
|
height: 300px;
|
|
width: 300px;
|
|
}
|
|
.sheet-hexagon-moyen {
|
|
height: 60px;
|
|
width: 60px;
|
|
}
|
|
.sheet-hexagon-petit {
|
|
height: 45px;
|
|
width: 45px;
|
|
}
|
|
.sheet-hexagon-central {
|
|
height: 200px;
|
|
width: 200px;
|
|
}
|
|
|
|
.sheet-hexagon-alonge {
|
|
height: 45px;
|
|
width: 175px;
|
|
}
|
|
.sheet-hexagon-alonge2 {
|
|
height: 45px;
|
|
width: 160px;
|
|
}
|
|
.sheet-hexagon-alonge3 {
|
|
height: 45px;
|
|
width: 100px;
|
|
}
|
|
.sheet-hexagon:before {
|
|
position: absolute;
|
|
content: '';
|
|
}
|
|
.sheet-hexagon:before {
|
|
top: 1px; /* border width */
|
|
left: 1px; /* border width */
|
|
height: calc(100% - 2px); /* 100% - (2 * border width) */
|
|
width: calc(100% - 2px); /* 100% - (2 * border width) */
|
|
background: white;
|
|
}
|
|
.sheet-hexagon-petit:before {
|
|
top: 1px; /* border width */
|
|
left: 1px; /* border width */
|
|
height: calc(100% - 2px); /* 100% - (2 * border width) */
|
|
width: calc(100% - 2px); /* 100% - (2 * border width) */
|
|
background: white;
|
|
}
|
|
.sheet-hexagon-central:before {
|
|
top: 1px; /* border width */
|
|
left: 1px; /* border width */
|
|
height: calc(100% - 2px); /* 100% - (2 * border width) */
|
|
width: calc(100% - 2px); /* 100% - (2 * border width) */
|
|
background: white;
|
|
}
|
|
|
|
.sheet-hexagon-central, .sheet-hexagon-central:before{
|
|
clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
|
|
}
|
|
.sheet-hexagon-petit, .sheet-hexagon-petit:before{
|
|
clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
|
|
}
|
|
|
|
.sheet-hexagon-moyen, .sheet-hexagon-moyen:before{
|
|
clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
|
|
}
|
|
|
|
.sheet-hexagon-grand, .sheet-hexagon-grand:before{
|
|
clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
|
|
}
|
|
|
|
.sheet-hexagon-entete, .sheet-hexagon-entete:before{
|
|
clip-path: polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0 50%);
|
|
}
|
|
|
|
.sheet-hexagon-equipements, .sheet-hexagon-equipements:before{
|
|
clip-path: polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0 50%);
|
|
}
|
|
.sheet-hexagon-geant, .sheet-hexagon-geant:before{
|
|
clip-path: polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0 50%);
|
|
}
|
|
|
|
.sheet-hexagon-alonge, .sheet-hexagon-alonge:before{
|
|
clip-path: polygon(7% 0, 93% 0, 100% 50%, 93% 100%, 7% 100%, 0 50%);
|
|
}
|
|
|
|
.sheet-hexagon-alonge2, .sheet-hexagon-alonge2:before{
|
|
clip-path: polygon(7% 0, 93% 0, 100% 50%, 93% 100%, 7% 100%, 0 50%);
|
|
}
|
|
|
|
.sheet-hexagon-alonge3, .sheet-hexagon-alonge3:before{
|
|
clip-path: polygon(7% 0, 93% 0, 100% 50%, 93% 100%, 7% 100%, 0 50%);
|
|
}
|
|
|
|
/* classe affichage hexagon entete avec informations */
|
|
.sheet-chevauche-entete{
|
|
position:relative;
|
|
left:40px;
|
|
top:7px;
|
|
}
|
|
|
|
/* classe input hexagon */
|
|
.sheet-input-hexagon-petit{
|
|
font-size:14px;
|
|
max-width:31px;
|
|
border:0px;
|
|
padding:0px;
|
|
text-align:center;
|
|
position: relative;
|
|
right: 1px;
|
|
}
|
|
|
|
.sheet-input-hexagon-moyen{
|
|
font-size:26px;
|
|
max-width:44px;
|
|
border:0px;
|
|
padding:0px;
|
|
text-align:center;
|
|
position: relative;
|
|
right: 7px;
|
|
}
|
|
|
|
.sheet-input-hexagon-petit-alonge{
|
|
font-size:14px;
|
|
max-width:27px;
|
|
border:0px;
|
|
padding:0px;
|
|
text-align:center;
|
|
position: relative;
|
|
right: 43px;
|
|
}
|
|
|
|
.sheet-input-hexagon-alonge{
|
|
font-size:13px;
|
|
max-width:110px;
|
|
border:0px;
|
|
padding:0px;
|
|
text-align:left;
|
|
}
|
|
|
|
.sheet-input-hexagon-alonge-sspetithex{
|
|
font-size:13px;
|
|
max-width:140px;
|
|
border:0px;
|
|
padding:0px;
|
|
text-align:left;
|
|
height:20px;
|
|
}
|
|
|
|
/* classe affichage hexagon avec table/input */
|
|
.sheet-chevauche-hexagon-petit{
|
|
position:relative;
|
|
left:9px;
|
|
top:10px;
|
|
}
|
|
|
|
.sheet-chevauche-hexagon-moyen{
|
|
position:relative;
|
|
left:15px;
|
|
top:15px;
|
|
}
|
|
|
|
.sheet-chevauche-hexagon-alonge{
|
|
position:relative;
|
|
left:-7px;
|
|
top:-6px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.sheet-chevauche-hexagon-alonge-sscercle{
|
|
position:relative;
|
|
left:1px;
|
|
top:-7px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.sheet-chevauche-hexagon-alonge-sspetithex{
|
|
position:relative;
|
|
left:9px;
|
|
top:10px;
|
|
height:20px;
|
|
overflow: hidden;
|
|
width:156px;
|
|
}
|
|
.sheet-chevauche-hexagon-alonge2-sspetithex{
|
|
position:relative;
|
|
left:9px;
|
|
top:10px;
|
|
height:20px;
|
|
overflow: hidden;
|
|
width:145px;
|
|
}
|
|
.sheet-chevauche-hexagon-alonge3-sspetithex{
|
|
position:relative;
|
|
left:9px;
|
|
top:10px;
|
|
height:20px;
|
|
overflow: hidden;
|
|
width:145px;
|
|
}
|
|
.sheet-diagonale-hexagon-petit{
|
|
position:relative;
|
|
left:38px;
|
|
top:-22px;
|
|
overflow: hidden;
|
|
}
|
|
.sheet-droite-libelle{
|
|
position:relative;
|
|
left:66px;
|
|
top:6px;
|
|
overflow: hidden;
|
|
}
|
|
.sheet-droite2-libelle{
|
|
position:relative;
|
|
left:38px;
|
|
top:6px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* classe affichage hexagones en diagonales */
|
|
.sheet-col2{
|
|
bottom: 22.5px;
|
|
right: 11.25px;
|
|
position:relative;
|
|
}
|
|
.sheet-col3{
|
|
position: relative;
|
|
bottom: 45px;
|
|
right: 22.5px;
|
|
}
|
|
.sheet-col4{
|
|
position: relative;
|
|
bottom: 67.5px;
|
|
right: 33.75px;
|
|
}
|
|
.sheet-col5{
|
|
position: relative;
|
|
bottom: 90px;
|
|
right: 45px;
|
|
}
|
|
|
|
/* cercles */
|
|
.sheet-rolltemplate-blattes .sheet-circle,.sheet-circle{
|
|
height: 30px;
|
|
width: 30px;
|
|
position: relative;
|
|
float: left;
|
|
left:7px;
|
|
top:7px;
|
|
clip-path: circle(50% at 50% 50%);
|
|
}
|
|
/* */
|
|
.sheet-rolltemplate-blattes10 .sheet-circle,.sheet-circle {
|
|
height: 30px;
|
|
width: 30px;
|
|
position: relative;
|
|
float: left;
|
|
left:7px;
|
|
top:7px;
|
|
clip-path: circle(50% at 50% 50%);
|
|
}
|
|
|
|
.sheet-rolltemplate-blattes10 div.sheet-tableau-blatte {
|
|
display: grid;
|
|
grid-template-columns: 30px 30px 30px 30px 30px;
|
|
column-gap: 5px;
|
|
}
|
|
.sheet-rolltemplate-blattes10 div.sheet-roll-entete {
|
|
display: grid;
|
|
grid-template-columns: 210px;
|
|
column-gap: 0px;
|
|
margin-left: 10px;
|
|
}
|
|
.sheet-rolltemplate-blattes10 div.sheet-blackboxlarge {
|
|
border: 2px solid black;
|
|
}
|
|
.sheet-rolltemplate-blattes10 div.sheet-blackboxlargered {
|
|
border: 2px solid red;
|
|
}
|
|
.sheet-rolltemplate-blattes10 div.sheet-relance a[href^="!"],
|
|
.sheet-rolltemplate-blattes10 div.sheet-relance a[href^="~"] {
|
|
background-color: #ce0f69;
|
|
padding: 5px;
|
|
color: white;
|
|
display: inline-block;
|
|
border: 1px solid white;
|
|
}
|
|
|
|
/* */
|
|
.sheet-rolltemplate-reussitecompetence .sheet-circle,.sheet-circle {
|
|
height: 30px;
|
|
width: 30px;
|
|
position: relative;
|
|
float: left;
|
|
left:7px;
|
|
top:7px;
|
|
clip-path: circle(50% at 50% 50%);
|
|
}
|
|
|
|
.sheet-rolltemplate-reussitecompetence div.sheet-tableau-blatte-texte {
|
|
display: grid;
|
|
grid-template-columns: 50px 150px;
|
|
grid-template-rows: 50px 50px;
|
|
column-gap: 0px;
|
|
margin-left: 10px;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetence div.sheet-roll-entete {
|
|
display: grid;
|
|
grid-template-columns: 210px;
|
|
column-gap: 0px;
|
|
margin-left: 10px;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetence div.sheet-blackboxlarge {
|
|
border: 2px solid black;
|
|
}
|
|
|
|
/* */
|
|
.sheet-rolltemplate-reussitecompetencecombat .sheet-circle,.sheet-circle{
|
|
height: 30px;
|
|
width: 30px;
|
|
position: relative;
|
|
float: left;
|
|
left:7px;
|
|
top:7px;
|
|
clip-path: circle(50% at 50% 50%);
|
|
}
|
|
.sheet-rolltemplate-reussitecompetencecombat div.sheet-roll-entete {
|
|
display: grid;
|
|
grid-template-columns: 210px;
|
|
column-gap: 0px;
|
|
margin-left: 10px;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetencecombat div.sheet-tableau-blatte-texte{
|
|
display: grid;
|
|
grid-template-columns: 50px 150px;
|
|
grid-template-rows: 45px;
|
|
column-gap: 0px;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.sheet-rolltemplate-reussitecompetencecombat div.sheet-tableau-blatte-degats{
|
|
display: grid;
|
|
grid-template-columns: 30px 30px 30px 30px 30px;
|
|
column-gap: 5px;
|
|
}
|
|
|
|
.sheet-rolltemplate-reussitecompetencecombat div.sheet-blackboxlarge {
|
|
border: 2px solid black;
|
|
}
|
|
|
|
.sheet-rolltemplate-reussitecompetencecombat div.sheet-relance a[href^="!"],
|
|
.sheet-rolltemplate-reussitecompetencecombat div.sheet-relance a[href^="~"] {
|
|
background-color: #ce0f69;
|
|
padding: 5px;
|
|
color: white;
|
|
display: inline-block;
|
|
border: 1px solid white;
|
|
}
|
|
|
|
/* */
|
|
.sheet-rolltemplate-reussitedegats .sheet-circle,.sheet-circle{
|
|
height: 30px;
|
|
width: 30px;
|
|
position: relative;
|
|
float: left;
|
|
left:7px;
|
|
top:7px;
|
|
clip-path: circle(50% at 50% 50%);
|
|
}
|
|
.sheet-rolltemplate-reussitedegats div.sheet-roll-entete {
|
|
display: grid;
|
|
grid-template-columns: 210px;
|
|
column-gap: 0px;
|
|
margin-left: 10px;
|
|
}
|
|
.sheet-rolltemplate-reussitedegats div.sheet-tableau-blatte-texte{
|
|
display: grid;
|
|
grid-template-columns: 50px 150px;
|
|
grid-template-rows: 50px;
|
|
column-gap: 0px;
|
|
margin-left: 10px;
|
|
}
|
|
.sheet-rolltemplate-reussitedegats div.sheet-blackboxlarge {
|
|
border: 2px solid black;
|
|
}
|
|
|
|
/* cercles */
|
|
.sheet-circle-small{
|
|
height: 17px;
|
|
width: 17px;
|
|
clip-path: circle(50% at 50% 50%);
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-alonge{
|
|
position: relative;
|
|
float: left;
|
|
left:-10px;
|
|
top:-4px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-moyen-1{
|
|
position: relative;
|
|
float: left;
|
|
left:-51px;
|
|
top:49px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-moyen-2{
|
|
position: relative;
|
|
float: left;
|
|
left:-67px;
|
|
top:21px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-moyen-3{
|
|
position: relative;
|
|
float: left;
|
|
left:-51px;
|
|
top:-8px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-moyen-4{
|
|
position: relative;
|
|
float: left;
|
|
left:-24px;
|
|
top:-8px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-moyen-5{
|
|
position: relative;
|
|
float: left;
|
|
left:-9px;
|
|
top:20px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-moyen-6{
|
|
position: relative;
|
|
float: left;
|
|
left:-24px;
|
|
top:50px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-petit-1{
|
|
position: relative;
|
|
float: left;
|
|
left:-42px;
|
|
top:35px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-petit-2{
|
|
position: relative;
|
|
float: left;
|
|
left:-51px;
|
|
top:14px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-petit-3{
|
|
position: relative;
|
|
float: left;
|
|
left:-42px;
|
|
top:-7px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-petit-4{
|
|
position: relative;
|
|
float: left;
|
|
left:-19px;
|
|
top:-7px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-petit-5{
|
|
position: relative;
|
|
float: left;
|
|
left:-9px;
|
|
top:14px;
|
|
}
|
|
|
|
.sheet-circle-small-hexagon-petit-6{
|
|
position: relative;
|
|
float: left;
|
|
left:-19px;
|
|
top:35px;
|
|
}
|
|
|
|
/* rolltemplate1 blatte */
|
|
.sheet-rolltemplate-blattes .sheet-circle-black,.sheet-circle-black {
|
|
background: black;
|
|
}
|
|
.sheet-rolltemplate-blattes .sheet-circle-gray,.sheet-circle-gray {
|
|
background: lightgrey;
|
|
}
|
|
.sheet-rolltemplate-blattes .sheet-circle-blue,.sheet-circle-blue {
|
|
background: blue;
|
|
}
|
|
.sheet-rolltemplate-blattes .sheet-circle-green,.sheet-circle-green {
|
|
background: green;
|
|
}
|
|
.sheet-rolltemplate-blattes .sheet-circle-red,.sheet-circle-red {
|
|
background: red;
|
|
}
|
|
|
|
/* rolltemplate1 blatte 10 */
|
|
.sheet-rolltemplate-blattes10 .sheet-circle-black,.sheet-circle-black {
|
|
background: black;
|
|
}
|
|
.sheet-rolltemplate-blattes10 .sheet-circle-gray,.sheet-circle-gray {
|
|
background: lightgrey;
|
|
}
|
|
.sheet-rolltemplate-blattes10 .sheet-circle-blue,.sheet-circle-blue {
|
|
background: blue;
|
|
}
|
|
.sheet-rolltemplate-blattes10 .sheet-circle-green,.sheet-circle-green {
|
|
background: green;
|
|
}
|
|
.sheet-rolltemplate-blattes10 .sheet-circle-red,.sheet-circle-red {
|
|
background: red;
|
|
}
|
|
.sheet-rolltemplate-blattes10 a[href^="!"],
|
|
.sheet-rolltemplate-blattes10 a[href^="~"]{
|
|
background-color: transparent;
|
|
padding: 5px;
|
|
color: white;
|
|
display: inline-block;
|
|
border: 0px solid white;
|
|
}
|
|
|
|
/* rolltemplate1 reussitecompetence */
|
|
.sheet-rolltemplate-reussitecompetence .sheet-circle-black,.sheet-circle-black {
|
|
background: black;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetence .sheet-circle-gray,.sheet-circle-gray {
|
|
background: lightgrey;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetence .sheet-circle-blue,.sheet-circle-blue {
|
|
background: blue;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetence .sheet-circle-green,.sheet-circle-green {
|
|
background: green;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetence .sheet-circle-red,.sheet-circle-red {
|
|
background: red;
|
|
}
|
|
|
|
/* rolltemplate1 reussitecompetencecombat */
|
|
.sheet-rolltemplate-reussitecompetencecombat .sheet-circle-black,.sheet-circle-black {
|
|
background: black;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetencecombat .sheet-circle-gray,.sheet-circle-gray {
|
|
background: lightgrey;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetencecombat .sheet-circle-blue,.sheet-circle-blue {
|
|
background: blue;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetencecombat .sheet-circle-green,.sheet-circle-green {
|
|
background: green;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetencecombat .sheet-circle-red,.sheet-circle-red {
|
|
background: red;
|
|
}
|
|
.sheet-rolltemplate-reussitecompetencecombat a[href^="!"],
|
|
.sheet-rolltemplate-reussitecompetencecombat a[href^="~"]{
|
|
background-color: transparent;
|
|
padding: 5px;
|
|
color: white;
|
|
display: inline-block;
|
|
border: 0px solid white;
|
|
}
|
|
|
|
/* rolltemplate1 reussitedegats */
|
|
.sheet-rolltemplate-reussitedegats .sheet-circle-black,.sheet-circle-black {
|
|
background: black;
|
|
}
|
|
.sheet-rolltemplate-reussitedegats .sheet-circle-gray,.sheet-circle-gray {
|
|
background: lightgrey;
|
|
}
|
|
.sheet-rolltemplate-reussitedegats .sheet-circle-blue,.sheet-circle-blue {
|
|
background: blue;
|
|
}
|
|
.sheet-rolltemplate-reussitedegats .sheet-circle-green,.sheet-circle-green {
|
|
background: green;
|
|
}
|
|
.sheet-rolltemplate-reussitedegats .sheet-circle-red,.sheet-circle-red {
|
|
background: red;
|
|
}
|
|
|
|
/* Caractéristiques hexagon central */
|
|
.sheet-label-antenne {
|
|
position: relative;
|
|
float: left;
|
|
left:117px;
|
|
top:80px;
|
|
}
|
|
|
|
.sheet-chevauche-central{
|
|
position:relative;
|
|
left:34px;
|
|
top:32px;
|
|
}
|
|
.sheet-chevauche-central-1{
|
|
position:relative;
|
|
left:-7px;
|
|
top:-1px;
|
|
font-size:11px;
|
|
}
|
|
.sheet-chevauche-central-2{
|
|
position:relative;
|
|
left:-20px;
|
|
top:1px;
|
|
font-size:11px;
|
|
}
|
|
|
|
.sheet-label-mandibules {
|
|
}
|
|
.sheet-label-chitine {
|
|
}
|
|
.sheet-label-temperature {
|
|
}
|
|
|
|
/* hexagones hexagon central */
|
|
.sheet-hexagon-pheromone {
|
|
position: relative;
|
|
float: left;
|
|
left:65px;
|
|
top:124px;
|
|
}
|
|
|
|
.sheet-hexagon-instinct {
|
|
position: relative;
|
|
float: left;
|
|
left:307px;
|
|
top:42px;
|
|
}
|
|
|
|
.sheet-hexagon-central {
|
|
position: relative;
|
|
float: left;
|
|
left:-16px;
|
|
top:30px;
|
|
}
|
|
|
|
/* GRID */
|
|
.sheet-entete{
|
|
display: grid;
|
|
grid-template-columns: 640px 225px;
|
|
column-gap: 10px;
|
|
}
|
|
|
|
.sheet-logo-jets{
|
|
display: grid;
|
|
grid-template-columns: 140px 300px 180px;
|
|
column-gap: 10px;
|
|
}
|
|
|
|
.sheet-xp{
|
|
grid-column-start: 2;
|
|
grid-column-end: 3;
|
|
grid-row-start: 1;
|
|
grid-row-end: 3;
|
|
}
|
|
|
|
.sheet-nom{
|
|
display: grid;
|
|
grid-template-columns: 72px 210px 72px 210px;
|
|
grid-template-rows: 37px 37px 37px 37px 37px 37px 37px 37px;
|
|
column-gap: 10px;
|
|
}
|
|
|
|
.sheet-espece{
|
|
display: grid;
|
|
grid-template-columns: auto auto;
|
|
column-gap: 2px;
|
|
}
|
|
|
|
.sheet-xpchance{
|
|
display: grid;
|
|
grid-template-columns: 45px 45px 45px 45px 45px;
|
|
|
|
}
|
|
|
|
.sheet-caste-competence-capacite{
|
|
display: grid;
|
|
grid-template-columns: 190px 440px 190px;
|
|
column-gap: 16px;
|
|
}
|
|
.sheet-aff-competence-capacite {
|
|
display: grid;
|
|
grid-template-columns: 15px 200px;
|
|
}
|
|
|
|
.sheet-grid{
|
|
display: grid;
|
|
}
|
|
|
|
.sheet-caracteristique{
|
|
display: grid;
|
|
grid-template-columns: 62px 15px 62px 77px 28px 77px 62px 15px 62px;
|
|
row-gap: 16px;
|
|
}
|
|
|
|
.sheet-left{
|
|
justify-self:left;
|
|
}
|
|
.sheet-right{
|
|
justify-self:right;
|
|
}
|
|
.sheet-center{
|
|
justify-self:center;
|
|
}
|
|
|
|
/* Compétences hexagon central */
|
|
/* ligne 1 */
|
|
.sheet-label-pheromone {
|
|
grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 1;
|
|
grid-row-end: 2;
|
|
align-self:center;
|
|
justify-self:right;
|
|
}
|
|
.sheet-hexagone-antenne{
|
|
grid-column-start: 4;
|
|
grid-column-end: 5;
|
|
grid-row-start: 1;
|
|
grid-row-end: 3;
|
|
position: relative;
|
|
right: 23px;
|
|
top: 3px;
|
|
}
|
|
|
|
.sheet-hexagone-esprit{
|
|
grid-column-start: 6;
|
|
grid-column-end: 7;
|
|
grid-row-start: 1;
|
|
grid-row-end: 3;
|
|
position: relative;
|
|
left: 21px;
|
|
top: 6px;
|
|
}
|
|
.sheet-label-esprit{
|
|
position: relative;
|
|
left: 4px;
|
|
}
|
|
.sheet-label-instinct {
|
|
grid-column-start: 8;
|
|
grid-column-end: 10;
|
|
grid-row-start: 1;
|
|
grid-row-end: 2;
|
|
align-self:center;
|
|
position: relative;
|
|
right: 14px;
|
|
}
|
|
/* ligne 2 */
|
|
.sheet-label-tir {
|
|
grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 2;
|
|
grid-row-end: 3;
|
|
align-self:center;
|
|
justify-self:right;
|
|
}
|
|
.sheet-label-conscience {
|
|
grid-column-start: 8;
|
|
grid-column-end: 10;
|
|
grid-row-start: 2;
|
|
grid-row-end: 3;
|
|
align-self:center;
|
|
position: relative;
|
|
right: 14px;
|
|
}
|
|
.sheet-hexagone-central{
|
|
grid-column-start: 4;
|
|
grid-column-end: 7;
|
|
grid-row-start: 2;
|
|
grid-row-end: 6;
|
|
position: relative;
|
|
left: 0px;
|
|
top: 0px;
|
|
}
|
|
|
|
/* ligne 3*/
|
|
.sheet-hexagone-mandibule{
|
|
grid-column-start: 2;
|
|
grid-column-end: 4;
|
|
grid-row-start: 3;
|
|
grid-row-end: 5;
|
|
position: relative;
|
|
right: 21px;
|
|
top: 22px;
|
|
}
|
|
|
|
.sheet-hexagone-aile{
|
|
grid-column-start: 7;
|
|
grid-column-end: 9;
|
|
grid-row-start: 3;
|
|
grid-row-end: 5;
|
|
position: relative;
|
|
left: 21px;
|
|
top: 22px;
|
|
}
|
|
.sheet-label-aile{
|
|
position: relative;
|
|
left: 14px;
|
|
}
|
|
|
|
/* ligne 5*/
|
|
.sheet-label-chrysalide {
|
|
grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 5;
|
|
grid-row-end: 6;
|
|
align-self:center;
|
|
justify-self:right;
|
|
}
|
|
.sheet-hexagone-chitine{
|
|
grid-column-start: 4;
|
|
grid-column-end: 5;
|
|
grid-row-start: 5;
|
|
grid-row-end: 7;
|
|
position: relative;
|
|
right: 21px;
|
|
top: 22px;
|
|
}
|
|
|
|
.sheet-hexagone-temperature{
|
|
grid-column-start: 6;
|
|
grid-column-end: 7;
|
|
grid-row-start: 5;
|
|
grid-row-end: 7;
|
|
position: relative;
|
|
left: 21px;
|
|
top: 22px;
|
|
}
|
|
.sheet-label-temperature {
|
|
position: relative;
|
|
right: 30px;
|
|
}
|
|
.sheet-label-activite {
|
|
grid-column-start: 8;
|
|
grid-column-end: 10;
|
|
grid-row-start: 5;
|
|
grid-row-end: 6;
|
|
align-self:center;
|
|
position: relative;
|
|
right: 14px;
|
|
}
|
|
/* ligne 6*/
|
|
.sheet-label-resistance {
|
|
grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 6;
|
|
grid-row-end: 7;
|
|
align-self:center;
|
|
justify-self:right;
|
|
}
|
|
|
|
.sheet-label-metabolisme {
|
|
grid-column-start: 8;
|
|
grid-column-end: 10;
|
|
grid-row-start: 6;
|
|
grid-row-end: 7;
|
|
align-self:center;
|
|
position: relative;
|
|
right: 14px;
|
|
}
|
|
|
|
/*sheet-caracteristique-derive*/
|
|
.sheet-caracteristique-derive{
|
|
display: grid;
|
|
grid-template-columns: auto auto auto auto auto auto;
|
|
column-gap: 10px;
|
|
}
|
|
.sheet-vitesse{
|
|
display: grid;
|
|
grid-template-columns: 25px 45px;
|
|
}
|
|
.sheet-label-vitesse
|
|
{
|
|
grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 1;
|
|
grid-row-end: 2;
|
|
align-self:center;
|
|
justify-self:right;
|
|
}
|
|
.sheet-impact{
|
|
display: grid;
|
|
grid-template-columns: 55px 45px;
|
|
}
|
|
.sheet-label-impact{
|
|
grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 1;
|
|
grid-row-end: 2;
|
|
align-self:center;
|
|
justify-self:right;
|
|
}
|
|
.sheet-blessures{
|
|
display: grid;
|
|
grid-template-columns: 55px 45px;
|
|
}
|
|
.sheet-label-blessures{
|
|
grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 1;
|
|
grid-row-end: 2;
|
|
align-self:center;
|
|
justify-self:right;
|
|
position: relative;
|
|
left: 6px;
|
|
}
|
|
.sheet-fluide{
|
|
display: grid;
|
|
grid-template-columns: 55px 45px;
|
|
}
|
|
.sheet-label-fluide{
|
|
grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 1;
|
|
grid-row-end: 2;
|
|
align-self:center;
|
|
justify-self:right;
|
|
}
|
|
.sheet-souillure{
|
|
display: grid;
|
|
grid-template-columns: 60px;
|
|
}
|
|
|
|
.sheet-initiative-defense-carapace{
|
|
display: grid;
|
|
grid-template-columns: 66px 66px;
|
|
justify-items: center;
|
|
}
|
|
.sheet-label-carapace
|
|
{
|
|
/* grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 3;
|
|
grid-row-end: 4;
|
|
align-self:center;
|
|
justify-self:center;*/
|
|
}
|
|
.sheet-hexagone-carapace
|
|
{
|
|
/* grid-column-start: 1;
|
|
grid-column-end: 3;
|
|
grid-row-start: 4;
|
|
grid-row-end: 5;
|
|
align-self:center;
|
|
justify-self:center;*/
|
|
}
|
|
|
|
/* equipements et armure*/
|
|
.sheet-armure-equipement{
|
|
display: grid;
|
|
grid-template-columns: 225px 640px;
|
|
}
|
|
|
|
.sheet-armure{
|
|
display: grid;
|
|
grid-template-columns: 50px 215px;
|
|
}
|
|
|
|
.sheet-equipement-label-equipement{
|
|
position: relative;
|
|
left:40px;
|
|
font-size:16px;
|
|
}
|
|
.sheet-equipement-01{
|
|
position: relative;
|
|
bottom: 0px;
|
|
right: 0px;
|
|
}
|
|
.sheet-equipement-02{
|
|
position: relative;
|
|
bottom:198px;
|
|
right:-283px;
|
|
}
|
|
.sheet-equipement-02-aff{
|
|
grid-template-columns: 105px 125px;
|
|
display: grid;
|
|
}
|
|
|
|
/* armes */
|
|
.sheet-armes {
|
|
display: grid;
|
|
grid-template-columns: auto;
|
|
}
|
|
|
|
.sheet-arme {
|
|
display: grid;
|
|
grid-template-columns: 170px 170px 170px 170px 170px;
|
|
}
|
|
|
|
/* Magie */
|
|
.sheet-partie-magie{
|
|
display: grid;
|
|
grid-template-columns: 15px 800px;
|
|
}
|
|
.sheet-magie-label-jeteur{
|
|
display: grid;
|
|
grid-template-columns: 160px 160px;
|
|
}
|
|
.sheet-magie{
|
|
display: grid;
|
|
grid-template-columns: 150px 150px 150px 150px 150px;
|
|
}
|
|
.sheet-magie-position{
|
|
position: relative;
|
|
top:5px;
|
|
left:47px;
|
|
}
|
|
|
|
textarea.sheet-magie-textarea {
|
|
height:75px;
|
|
width:145px;
|
|
margin:0px 0px 9px;
|
|
}
|
|
|
|
/* affichage public/MJ */
|
|
input.sheet-CSSJetPGM
|
|
{
|
|
opacity: 0;
|
|
height: 26px;
|
|
width: 66px;
|
|
top:4px;
|
|
}
|
|
span.sheet-CSSJetPGM
|
|
{
|
|
display: inline-block;
|
|
border: 2px outset;
|
|
height: 20px;
|
|
width: 60px;
|
|
line-height: 20px;
|
|
font-size: 15px;
|
|
margin-left: -66px;
|
|
text-align: center;
|
|
margin-top: 0px;
|
|
}
|
|
input.sheet-CSSJetPGM:checked + span.sheet-CSSJetPGM
|
|
{
|
|
background-color:black;
|
|
color :white;
|
|
border: 2px inset !important;
|
|
}
|
|
|
|
/* Fiche pnj */
|
|
.sheet-pnj-jets {
|
|
display: grid;
|
|
grid-template-columns: 600px 300px;
|
|
column-gap: 20px;
|
|
}
|
|
.sheet-tableau-pnj {
|
|
display: grid;
|
|
grid-template-columns: 600px;
|
|
}
|
|
.sheet-tableau-pnj-entete {
|
|
display: grid;
|
|
grid-template-columns: 600px;
|
|
grid-template-rows: 37px;
|
|
}
|
|
.sheet-tableau-pnj-race-aff {
|
|
display: grid;
|
|
grid-template-columns: 10px 60px 240px 10px 55px 100px;
|
|
}
|
|
.sheet-tableau-pnj-caracteristiques {
|
|
display: grid;
|
|
grid-template-columns: 200px 200px 200px;
|
|
grid-template-rows: 37px 37px 37px;
|
|
}
|
|
.sheet-tableau-pnj-detaille-caracteristiques {
|
|
display: grid;
|
|
grid-template-columns: 200px 200px 200px;
|
|
}
|
|
.sheet-tableau-pnj-caracteristique-aff {
|
|
display: grid;
|
|
grid-template-columns: 10px 130px 60px;
|
|
}
|
|
.sheet-tableau-pnj-caracteristique-aff2 {
|
|
display: grid;
|
|
grid-template-columns: 10px 70px 60px 60px;
|
|
}
|
|
.sheet-tableau-pnj-echelle-aff {
|
|
display: grid;
|
|
grid-template-columns: 10px 55px 130px;
|
|
}
|
|
.sheet-tableau-pnj-armes-capacites {
|
|
display: grid;
|
|
grid-template-columns: 300px 300px;
|
|
}
|
|
.sheet-tableau-pnj-echelle {
|
|
display: grid;
|
|
grid-template-columns: 600px;
|
|
grid-template-rows: 37px;
|
|
}
|
|
.sheet-blackboxlarge {
|
|
border: 2px solid black;
|
|
}
|
|
|
|
.sheet-tableau-pnj-informations {
|
|
display: grid;
|
|
grid-template-columns: 150px 150px 150px 150px;
|
|
grid-template-rows: 35px 35px;
|
|
}
|
|
/* affichage selon coche des informations détaillées */
|
|
.sheet-souvenir-info {
|
|
display: none;
|
|
}
|
|
input.sheet-souvenir-info-button:checked ~ div.sheet-souvenir-info {
|
|
display: block;
|
|
}
|
|
|
|
/* non affichage */
|
|
.sheet-invisible {
|
|
display: none;
|
|
}
|
|
/* affichage selon bascule pnj simple / pnj détaillé */
|
|
input.sheet-pnj-affiche:checked ~ div.sheet-pnj-detaille,
|
|
input.sheet-pnj-affiche:not(:checked) ~ div.sheet-pnj-simple, {
|
|
display: block;
|
|
}
|
|
|
|
/* affichage selon bascule caracteristiques pnj simple / caracteristiques pnj détaillé */
|
|
input.sheet-pnj-affiche-caracteristiques:checked ~ div.sheet-pnj-caracteristiques-detaille,
|
|
input.sheet-pnj-affiche-caracteristiques:not(:checked) ~ div.sheet-pnj-caracteristiques-simple, {
|
|
display: block;
|
|
}
|
|
|
|
/* bascule fiche joueur / fiche non joueur / paramètres */
|
|
div.sheet-tab-content {
|
|
display: none;
|
|
}
|
|
input.sheet-tab:checked ~ div.sheet-tab2,
|
|
input.sheet-tab:not(:checked) ~ div.sheet-tab1, {
|
|
display: block;
|
|
}
|
|
div.sheet-sub-tab-content {
|
|
display: none;
|
|
}
|
|
input.sheet-sub-tab:checked ~ div.sheet-sub-tab1,
|
|
input.sheet-sub-tab:not(:checked) ~ div.sheet-sub-tab2, {
|
|
display: block;
|
|
}
|
|
input.sheet-tab-content {
|
|
float:right;
|
|
opacity: 0;
|
|
width: 20px;
|
|
height: 20px;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
position: relative;
|
|
top: 15px;
|
|
left: -10px;
|
|
margin: -10px;
|
|
}
|
|
input[type="checkbox"].sheet-tab-content + span::before {
|
|
float:right;
|
|
text-align: center;
|
|
font-family: "Pictos";
|
|
font-size: 20px;
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
content: "y";
|
|
}
|
|
input[type="checkbox"].sheet-tab-content:checked + span::before {
|
|
content: "H";
|
|
}
|
|
input.sheet-sub-tab-content {
|
|
float:right;
|
|
opacity: 0;
|
|
width: 75px;
|
|
height: 20px;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
position: relative;
|
|
top: -20px;
|
|
left: -61px;
|
|
margin: -10px;
|
|
transform: scale(1.5);
|
|
}
|
|
input[type="checkbox"].sheet-sub-tab-content + span::before {
|
|
float:right;
|
|
position: relative;
|
|
top: -33px;
|
|
left: -35px;
|
|
text-align: center;
|
|
font-size: 15px;
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
content: "Fiche non joueur";
|
|
border: 1px solid black;
|
|
padding: 2px;
|
|
}
|
|
input[type="checkbox"].sheet-sub-tab-content:checked + span::before {
|
|
content: "Fiche Joueur";
|
|
}
|
|
|
|
/* Affichage libellé sur span */
|
|
/* Tooltip container */
|
|
.sheet-tooltip {
|
|
position: relative;
|
|
display: inline-block;
|
|
border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
|
|
}
|
|
|
|
/* Tooltip text */
|
|
.sheet-tooltip .sheet-tooltiptext {
|
|
visibility: hidden;
|
|
width: 225px;
|
|
background-color: black;
|
|
color: #fff;
|
|
text-align: justify;
|
|
padding: 5px 10px;
|
|
border-radius: 6px;
|
|
|
|
/* Position the tooltip text - see examples below! */
|
|
position: absolute;
|
|
z-index: 1;
|
|
}
|
|
|
|
/* Show the tooltip text when you mouse over the tooltip container */
|
|
.sheet-tooltip:hover .sheet-tooltiptext {
|
|
visibility: visible;
|
|
}
|
|
.sheet-underline {
|
|
text-decoration: underline;
|
|
}
|