mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
527 lines
9.9 KiB
CSS
527 lines
9.9 KiB
CSS
.charsheet {
|
|
font-family: 'Times New Roman', Times, serif;
|
|
}
|
|
|
|
.charsheet table {
|
|
width: 100%;
|
|
}
|
|
.charsheet td {
|
|
padding: 0px 2px 0px 2px;
|
|
border: 0px solid #000;
|
|
vertical-align: text-top;
|
|
}
|
|
|
|
.charsheet th {
|
|
padding: 5px;
|
|
border: 0 solid #000;
|
|
background-color: #6d2b35;
|
|
color: #FFF
|
|
}
|
|
.sheet-image{
|
|
float: left;
|
|
}
|
|
|
|
img {
|
|
vertical-align:top;
|
|
}
|
|
/* roulette */
|
|
.sheet-roulette{
|
|
clear: both;
|
|
position:relative;
|
|
top:0px;
|
|
left:0px;
|
|
height: 135px;
|
|
width:135px
|
|
border: 1px solid green;
|
|
}
|
|
|
|
.sheet-roulette-img{
|
|
position:absolute;
|
|
top:15px;
|
|
left:2px;
|
|
border: 0px;
|
|
width:100px;
|
|
}
|
|
|
|
/* ===== Sélection Check ===== */
|
|
input[type="checkbox"].sheet-roulette-chk{
|
|
width: 20px;
|
|
height: 20px;
|
|
max-width: 20px;
|
|
opacity: 0;
|
|
z-index: 2;
|
|
margin: 0;
|
|
}
|
|
input[type="checkbox"].sheet-roulette-chk + span{
|
|
display: inline-block;
|
|
text-align: center;
|
|
padding: 0;
|
|
margin: 0;
|
|
margin-left: -20px;
|
|
width: 20px;
|
|
max-width: 20px;
|
|
height: 20px;
|
|
z-index: 1;
|
|
font-family: pictos;
|
|
color: #DDB29B;
|
|
opacity: 0.3;
|
|
filter: alpha(opacity=30); /* For IE8 and earlier */
|
|
font-size: 15px;
|
|
line-height: 20px;
|
|
}
|
|
input[type="checkbox"].sheet-roulette-chk:hover + span{
|
|
color: #000;
|
|
opacity: 0.4;
|
|
filter: alpha(opacity=40); /* For IE8 and earlier */
|
|
}
|
|
input[type="checkbox"].sheet-roulette-chk:checked + span{
|
|
font-weight: bold;
|
|
color: #CF3134;
|
|
opacity: 0.6;
|
|
filter: alpha(opacity=60); /* For IE8 and earlier */
|
|
}
|
|
|
|
|
|
.sheet-roulette1{
|
|
position:absolute;
|
|
top:20px;
|
|
left:20px;
|
|
border: 0px solid blue;
|
|
}
|
|
|
|
|
|
.sheet-roulette2{
|
|
position:absolute;
|
|
top:20px;
|
|
left:50px;
|
|
border: 0px solid blue;
|
|
}
|
|
.sheet-roulette3{
|
|
position:absolute;
|
|
top:45px;
|
|
left:62px;
|
|
border: 0px solid blue;
|
|
}
|
|
.sheet-roulette4{
|
|
position:absolute;
|
|
top:70px;
|
|
left:50px;
|
|
border: 0px solid blue;
|
|
}
|
|
.sheet-roulette5{
|
|
position:absolute;
|
|
top:70px;
|
|
left:20px;
|
|
border: 0px solid blue;
|
|
}
|
|
.sheet-roulette6{
|
|
position:absolute;
|
|
top:42px;
|
|
left:10px;
|
|
border: 0px solid blue;
|
|
}
|
|
|
|
.sheet-roulette-roll{
|
|
position:absolute;
|
|
/* sur le côté top:80px;
|
|
left:82px;*/
|
|
top:52px;
|
|
left:38px;
|
|
z-index:3;
|
|
|
|
border: 0px solid blue;
|
|
}
|
|
|
|
/* fin roulette */
|
|
|
|
/* Les cercles */
|
|
.sheet-contenant-cercle{
|
|
clear: both;
|
|
position:relative;
|
|
top:0px;
|
|
left:0px;
|
|
height: 525px;
|
|
width:565px;
|
|
border: 0px solid green;
|
|
}
|
|
|
|
.sheet-obs-skills{
|
|
position:absolute;
|
|
top:0px;
|
|
left:435px;
|
|
}
|
|
|
|
.sheet-shotgun{
|
|
position:absolute;
|
|
top:60px;
|
|
left:15px;
|
|
font-size: 30px;
|
|
}
|
|
|
|
.sheet-circle-muscle{
|
|
position:absolute;
|
|
top:0px;
|
|
left:150px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
.sheet-circle-mojo{
|
|
position:absolute;
|
|
top:0px;
|
|
left:300px;
|
|
width:110px;
|
|
height:110px;
|
|
border-radius:50%;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-toughness{
|
|
position:absolute;
|
|
top:80px;
|
|
left:50px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-guts{
|
|
position:absolute;
|
|
top:80px;
|
|
left:400px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-physical-damage{
|
|
position:absolute;
|
|
top:160px;
|
|
left:150px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-mental-damage{
|
|
position:absolute;
|
|
top:160px;
|
|
left:300px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-social-damage{
|
|
position:absolute;
|
|
top:270px;
|
|
left:225px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-dexterity{
|
|
position:absolute;
|
|
top:190px;
|
|
left:0px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-brains{
|
|
position:absolute;
|
|
top:190px;
|
|
left:450px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-mug{
|
|
position:absolute;
|
|
top:300px;
|
|
left:70px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-chutzpah{
|
|
position:absolute;
|
|
top:300px;
|
|
left:380px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
|
|
.sheet-circle-cool{
|
|
position:absolute;
|
|
top:410px;
|
|
left:225px;
|
|
border-radius:50%;
|
|
width:110px;
|
|
height:110px;
|
|
border:1px solid #000;
|
|
text-align: center;
|
|
display: flex; /* contexte sur le parent */
|
|
flex-direction: column; /* direction d'affichage verticale */
|
|
justify-content: center; /* alignement vertical */
|
|
}
|
|
/* Fin des cercles */
|
|
|
|
|
|
/* === fieldset button === */
|
|
div.repcontrol{
|
|
display: inline-block;
|
|
width: 100%;
|
|
}
|
|
.repcontrol_move{
|
|
height: 11px;
|
|
line-height: 11px;
|
|
margin-top: 4px;
|
|
}
|
|
.repcontrol_del {
|
|
height: 22px;
|
|
line-height: 12px;
|
|
margin-top: 4px;
|
|
width: 30px;
|
|
}
|
|
.repcontrol_add, .repcontrol_edit {
|
|
color: transparent;
|
|
box-shadow: none;
|
|
background: transparent;
|
|
border-color: transparent;
|
|
text-shadow:none;
|
|
width: 100px;
|
|
}
|
|
.repcontrol_add:focus, .repcontrol_edit:focus {
|
|
outline: none;
|
|
}
|
|
.repcontrol .repcontrol_edit:after {
|
|
content: 'y';
|
|
visibility: visible;
|
|
font-family: pictos;
|
|
border: 1px solid transparent;
|
|
border-radius: 2px;
|
|
font-size: 20px;
|
|
height: 20px;
|
|
width: 20px;
|
|
padding: 2px 4px 2px 4px;
|
|
color: rgba(177,121,63,0.7);
|
|
}
|
|
.editmode ~ .repcontrol .repcontrol_edit:after {
|
|
content: '2';
|
|
}
|
|
.repcontrol .repcontrol_add:before {
|
|
content: '+';
|
|
visibility: visible;
|
|
font-family: pictos;
|
|
border: 1px solid transparent;
|
|
border-radius: 2px;
|
|
font-size: 20px;
|
|
height: 20px;
|
|
width: 20px;
|
|
padding: 2px 4px 2px 4px;
|
|
color: rgba(177,121,63,0.7);
|
|
}
|
|
.repcontrol .repcontrol_edit:hover:after,
|
|
.repcontrol .repcontrol_add:hover:before
|
|
{
|
|
box-shadow: 1px 1px 4px 2px rgba(147,35,21,0.8);
|
|
border-color: #CF3134;
|
|
color: #CF3134;
|
|
}
|
|
.repcontrol_add:focus:before, .repcontrol_edit:focus:after {
|
|
color: #CF3134;
|
|
}
|
|
/* === Fin fieldset button === */
|
|
|
|
input[type="text"] {
|
|
background-color: transparent;
|
|
border: 0 solid #000;
|
|
border-bottom-width: 1px;
|
|
border-left-width: 1px;
|
|
height:22px;
|
|
}
|
|
|
|
input[type="number"] {
|
|
background-color: transparent;
|
|
}
|
|
|
|
input[type="text"]:read-only, input[type="number"]:read-only {
|
|
background-color: #d9d9d9;
|
|
}
|
|
|
|
select {
|
|
background-color: transparent;
|
|
border: 0 solid #000;
|
|
border-bottom-width: 1px;
|
|
border-left-width: 1px;
|
|
height:20px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
textarea{
|
|
width:95%;
|
|
}
|
|
|
|
.sheet-skill-level{
|
|
width: 50px;
|
|
height:20px;
|
|
font-size: 11px;
|
|
}
|
|
|
|
|
|
.sheet-titre{
|
|
font-size: 150%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
|
|
.sheet-attribut{
|
|
font-size: 105%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.sheet-attribut2{
|
|
font-size: 105%;
|
|
font-weight: bold;
|
|
color: #ccc;
|
|
}
|
|
|
|
.sheet-mini{
|
|
font-size: 75%;
|
|
color: #ccc;
|
|
}
|
|
|
|
input[type="text"].sheet-consequence-repetition{
|
|
width: 95%;
|
|
}
|
|
|
|
select.sheet-consequence-level{
|
|
width:50px;
|
|
height:22px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
input[type="text"].sheet-equipment-repetition{
|
|
width: 95%;
|
|
}
|
|
|
|
input[type="text"].sheet-past-repetition{
|
|
width: 95%;
|
|
}
|
|
|
|
.sheet-texte{
|
|
color: #ccc;
|
|
font-styel: italic;
|
|
}
|
|
|
|
div.sheet-skills{
|
|
background-color: #F4F6F6;
|
|
}
|
|
|
|
|
|
button[type="roll"] {
|
|
color: #CF3134;
|
|
background: transparent;
|
|
border: none;
|
|
border-radius: 0px;
|
|
}
|
|
button[type="roll"]:hover{
|
|
font-weight: bold;
|
|
}
|
|
|
|
|
|
/* Templates*/
|
|
.sheet-rolltemplate-hellywood-roulette table, .sheet-rolltemplate-hellywood-skill table {
|
|
width: 100%;
|
|
background-color: #FFF;
|
|
border: 1px solid;
|
|
color: black;
|
|
font-size: 1em;
|
|
font-family: 'Times New Roman', Times, serif;
|
|
}
|
|
.sheet-rolltemplate-hellywood-skill th{
|
|
background-color: #CF3134;
|
|
color: #ffffff;
|
|
padding: 2px;
|
|
border-bottom: 1px solid black;
|
|
line-height: 1.2em;
|
|
font-size: 1.1em;
|
|
}
|
|
.sheet-rolltemplate-hellywood-roulette th{
|
|
background-color: #000;
|
|
color: #ffffff;
|
|
padding: 2px;
|
|
border-bottom: 1px solid black;
|
|
line-height: 1.2em;
|
|
font-size: 1.1em;
|
|
}
|
|
|
|
.sheet-rolltemplate-hellywood-skill .sheet-success{
|
|
font-weight: bold;
|
|
color: #28b463;
|
|
}
|
|
|
|
.sheet-rolltemplate-hellywood-skill .sheet-failure{
|
|
font-weight: bold;
|
|
color: red;
|
|
} |