mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 19:52:29 +00:00
Este archivo contiene la estructura CSS de la hoja de personaje del juego de rol ROJO. Es parte del conjunto de archivos que forman la hoja completa del sistema.
269 lines
4.2 KiB
CSS
269 lines
4.2 KiB
CSS
/* Estructura general */
|
|
.sheet-rojo-ficha {
|
|
font-family: Arial, sans-serif;
|
|
font-size: 12px;
|
|
color: #000;
|
|
background-color: white;
|
|
padding: 10px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.sheet-columnas {
|
|
display: flex;
|
|
gap: 20px;
|
|
}
|
|
|
|
.sheet-col-izq {
|
|
flex: 3;
|
|
}
|
|
|
|
.sheet-col-der {
|
|
flex: 2;
|
|
}
|
|
|
|
/* Línea doble */
|
|
.sheet-linea-doble {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 5px;
|
|
}
|
|
.sheet-linea-doble label {
|
|
width: 120px;
|
|
font-weight: bold;
|
|
}
|
|
.sheet-linea-doble input {
|
|
flex: 1;
|
|
}
|
|
|
|
.sheet-logo-img {
|
|
max-width: 100%;
|
|
height: auto;
|
|
display: block;
|
|
margin: 0 auto;
|
|
padding: 5px 0;
|
|
}
|
|
|
|
/* Atributos y combate */
|
|
.sheet-bloque-atributos-combate {
|
|
display: flex;
|
|
margin-bottom: 10px;
|
|
gap: 10px;
|
|
}
|
|
|
|
.sheet-atributos,
|
|
.sheet-combate {
|
|
border: 1px solid #000;
|
|
padding: 10px;
|
|
flex: 1;
|
|
}
|
|
|
|
.sheet-atributos h4,
|
|
.sheet-combate h4 {
|
|
text-align: center;
|
|
font-size: 11px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.sheet-atributos label,
|
|
.sheet-combate label {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
/* Recuadro */
|
|
.sheet-recuadro {
|
|
border: 1px solid #000;
|
|
padding: 8px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.sheet-recuadro h4 {
|
|
margin: 0 0 5px 0;
|
|
font-size: 11px;
|
|
text-align: center;
|
|
}
|
|
|
|
/* Inputs */
|
|
.sheet-tab-numerico {
|
|
text-align: center; /*hace que los numeros queden centrados en las celdas numéricas */
|
|
width: 40px;
|
|
padding: 2px 4px;
|
|
line-height: 1;
|
|
}
|
|
|
|
.sheet-tab-numerico::-webkit-outer-spin-button,
|
|
.sheet-tab-numerico::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
.sheet-input-ancho-completo {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.sheet-ocupacion-linea {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 6px;
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.sheet-ocupacion-linea input[type="text"] {
|
|
flex: 1;
|
|
}
|
|
|
|
.sheet-ocupacion-linea input[type="number"] {
|
|
width: 40px;
|
|
text-align: right;
|
|
}
|
|
|
|
.sheet-atributo-linea {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
gap: 6px;
|
|
}
|
|
|
|
.sheet-mod-texto {
|
|
font-weight: bold;
|
|
margin-right: 6px;
|
|
}
|
|
|
|
.sheet-rollboton {
|
|
min-width: 110px;
|
|
}
|
|
|
|
.sheet-etiqueta-fija {
|
|
min-width: 160px;
|
|
font-weight: bold;
|
|
text-align: left;
|
|
}
|
|
|
|
.sheet-align-right {
|
|
text-align: right;
|
|
}
|
|
|
|
.sheet-linea-ajustada {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
gap: 6px;
|
|
align-items: center;
|
|
width: 100%;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.sheet-habilidad-arma-select {
|
|
width: 20%;
|
|
}
|
|
|
|
/* Logo */
|
|
.sheet-logo {
|
|
text-align: center;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.sheet-logo-linea {
|
|
border-top: 2px solid #990000;
|
|
margin: 4px 0;
|
|
}
|
|
|
|
.sheet-logo-texto {
|
|
font-size: 52px;
|
|
font-weight: bold;
|
|
color: #990000;
|
|
letter-spacing: 2px;
|
|
}
|
|
|
|
.sheet-logo-subtexto {
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
color: #990000;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
/* Casillas (Vitalidad y PS) */
|
|
.sheet-casillas {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
align-items: center;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.sheet-casillas input[type="checkbox"] {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
|
|
/* Inferior */
|
|
.sheet-inferior {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-top: 20px;
|
|
gap: 20px;
|
|
}
|
|
|
|
.sheet-usos-ps,
|
|
.sheet-tabla-dificultad {
|
|
flex: 1;
|
|
border: 1px solid #000;
|
|
padding: 10px;
|
|
}
|
|
|
|
.sheet-usos-ps ul {
|
|
padding-left: 15px;
|
|
margin: 0;
|
|
font-size: 11px;
|
|
}
|
|
|
|
.sheet-tabla-dificultad table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
font-size: 11px;
|
|
}
|
|
|
|
.sheet-tabla-dificultad th,
|
|
.sheet-tabla-dificultad td {
|
|
border: 1px solid #000;
|
|
padding: 3px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-tabla-dificultad th:first-child,
|
|
.sheet-tabla-dificultad th:not(:first-child) {
|
|
background-color: #eee;
|
|
color: black;
|
|
}
|
|
|
|
.sheet-credito {
|
|
font-size: 9px;
|
|
text-align: center;
|
|
color: #666;
|
|
margin-top: 20px;
|
|
}
|
|
|
|
/* ROLL TEMPLATE ROJO */
|
|
.sheet-rolltemplate-rojo .sheet-template-container {
|
|
border: 1px solid #990000;
|
|
background-color: #fff;
|
|
font-family: Arial, sans-serif;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.sheet-rolltemplate-rojo .sheet-template-header {
|
|
background-color: #990000;
|
|
color: white;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
padding: 5px;
|
|
font-size: 14px;
|
|
border-bottom: 1px solid #660000;
|
|
}
|
|
|
|
.sheet-rolltemplate-rojo .sheet-template-row {
|
|
padding: 5px;
|
|
border-top: 1px solid #ccc;
|
|
}
|