1202 lines
28 KiB
Plaintext
1202 lines
28 KiB
Plaintext
/* ==================== Actor Sheet Styles ==================== */
|
|
|
|
/* Base actor sheet styling */
|
|
.fvtt-wasteland.actor {
|
|
/* Background pour toute la fiche d'acteur */
|
|
background: url("../assets/ui/pc_sheet_bg.webp") repeat;
|
|
|
|
/* AppV2 - Structure flex */
|
|
.window-content {
|
|
height: 100%;
|
|
padding: 0;
|
|
margin: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
overflow: hidden;
|
|
}
|
|
|
|
section {
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex: 1;
|
|
min-height: 0;
|
|
overflow: hidden;
|
|
background: url("../assets/ui/pc_sheet_bg.webp") repeat-y;
|
|
color: black;
|
|
}
|
|
|
|
.sheet-header {
|
|
background: linear-gradient(to bottom, rgba(42, 37, 32, 0.95) 0%, rgba(26, 21, 16, 0.95) 100%);
|
|
border-bottom: none;
|
|
padding: 0.6rem 0.8rem;
|
|
margin: 0;
|
|
flex: 0 0 auto;
|
|
overflow: visible;
|
|
display: flex;
|
|
gap: 0.8rem;
|
|
align-items: flex-start;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
|
|
|
|
.header-portrait {
|
|
flex: 0 0 auto;
|
|
margin-top: -2px;
|
|
|
|
.profile-img {
|
|
width: 128px;
|
|
height: 128px;
|
|
border: 2px solid #6a0606;
|
|
border-radius: 3px;
|
|
object-fit: cover;
|
|
cursor: pointer;
|
|
transition: all 0.3s ease;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
|
|
|
|
&:hover {
|
|
border-color: #8a0808;
|
|
box-shadow: 0 0 8px rgba(106, 6, 6, 0.6);
|
|
transform: scale(1.02);
|
|
}
|
|
}
|
|
}
|
|
|
|
.header-main {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.5rem;
|
|
min-width: 0;
|
|
}
|
|
|
|
.header-identity {
|
|
.charname {
|
|
margin: 0;
|
|
padding: 0;
|
|
|
|
input {
|
|
font-family: "Charlemagne", serif;
|
|
font-size: 1.1rem;
|
|
font-weight: bold;
|
|
color: #f5f5f5;
|
|
background: rgba(0, 0, 0, 0.3);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
padding: 0.3rem 0.5rem;
|
|
width: 100%;
|
|
max-width: 400px;
|
|
transition: all 0.3s ease;
|
|
|
|
&:hover {
|
|
background: rgba(0, 0, 0, 0.4);
|
|
border-color: #8a0808;
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
background: rgba(0, 0, 0, 0.5);
|
|
border-color: #aa0a0a;
|
|
box-shadow: 0 0 6px rgba(170, 10, 10, 0.4);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.header-resources {
|
|
display: flex;
|
|
gap: 0.6rem;
|
|
flex-wrap: wrap;
|
|
|
|
.resource-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.2rem;
|
|
background: rgba(0, 0, 0, 0.25);
|
|
border: 1px solid #403f3e;
|
|
border-radius: 3px;
|
|
padding: 0.35rem 0.5rem;
|
|
|
|
&.bonne-aventure {
|
|
.resource-values {
|
|
gap: 0.4rem;
|
|
}
|
|
}
|
|
|
|
> label {
|
|
font-family: "Charlemagne", serif;
|
|
font-size: 0.7rem;
|
|
font-weight: bold;
|
|
color: rgba(218, 218, 218, 0.95);
|
|
text-transform: uppercase;
|
|
margin-bottom: 0.1rem;
|
|
letter-spacing: 0.3px;
|
|
}
|
|
|
|
.resource-values {
|
|
display: flex;
|
|
gap: 0.3rem;
|
|
align-items: center;
|
|
|
|
.resource-field {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.1rem;
|
|
|
|
.resource-label {
|
|
font-size: 0.6rem;
|
|
color: rgba(218, 218, 218, 0.7);
|
|
text-transform: uppercase;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
|
|
input[type="number"] {
|
|
background: rgba(0, 0, 0, 0.4);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 2px;
|
|
color: #f5f5f5;
|
|
padding: 0.2rem 0.3rem;
|
|
font-size: 0.9rem;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
width: 50px;
|
|
transition: all 0.3s ease;
|
|
|
|
&:hover {
|
|
background: rgba(0, 0, 0, 0.5);
|
|
border-color: #8a0808;
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
background: rgba(0, 0, 0, 0.6);
|
|
border-color: #aa0a0a;
|
|
box-shadow: 0 0 4px rgba(170, 10, 10, 0.3);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Navigation tabs - Modern style matching items */
|
|
nav.tabs {
|
|
display: flex;
|
|
border-bottom: none;
|
|
margin: 0;
|
|
padding: 4px 8px;
|
|
background: linear-gradient(to bottom, #2a2520 0%, #1a1510 100%);
|
|
flex: 0 0 auto;
|
|
gap: 4px;
|
|
|
|
a.item {
|
|
padding: 8px 16px;
|
|
color: rgba(218, 218, 218, 0.85);
|
|
text-decoration: none;
|
|
border: 1px solid transparent;
|
|
border-radius: 6px 6px 0 0;
|
|
font-family: "Charlemagne", serif;
|
|
font-size: 0.9rem;
|
|
font-weight: normal;
|
|
transition: all 0.3s ease;
|
|
background: rgba(64, 63, 62, 0.3);
|
|
min-width: 80px;
|
|
text-align: center;
|
|
|
|
i {
|
|
display: none; // Hide icons for cleaner look
|
|
}
|
|
|
|
&:hover {
|
|
background: rgba(74, 4, 4, 0.4);
|
|
color: #f5f5f5;
|
|
border-color: rgba(218, 218, 218, 0.2);
|
|
}
|
|
|
|
&.active {
|
|
background: linear-gradient(to bottom, #4a0404 0%, #3a0303 100%);
|
|
border: 1px solid transparent;
|
|
color: #f5f5f5;
|
|
font-weight: bold;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Sheet body - scrollable content */
|
|
.sheet-body {
|
|
margin: 0;
|
|
padding: 0.5rem;
|
|
flex: 1;
|
|
min-height: 0;
|
|
overflow-y: auto;
|
|
|
|
&[data-tab] {
|
|
display: none;
|
|
height: auto;
|
|
|
|
&.active {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
// Section titles styling
|
|
h3 {
|
|
margin: 0.75rem 0 0.5rem 0;
|
|
padding-bottom: 0.25rem;
|
|
border-bottom: 2px solid #403f3e;
|
|
font-size: 1.1rem;
|
|
color: #2a1510;
|
|
font-family: "Charlemagne", serif;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
}
|
|
|
|
// Section styling
|
|
.sheet-section {
|
|
padding: 0.5rem;
|
|
background: rgba(255, 255, 255, 0.3);
|
|
border: 1px solid #999;
|
|
border-radius: 4px;
|
|
margin-bottom: 0.75rem;
|
|
}
|
|
|
|
// Grid layouts
|
|
.grid {
|
|
display: grid;
|
|
gap: 0.75rem;
|
|
|
|
&.grid-2col {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
&.grid-3col {
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
}
|
|
}
|
|
|
|
// Combat stats for creature sheet
|
|
.combat-stats {
|
|
margin-bottom: 1rem;
|
|
|
|
.grid-2col {
|
|
gap: 0.5rem;
|
|
}
|
|
|
|
.combat-stat-row {
|
|
display: flex;
|
|
align-items: center;
|
|
background: rgba(255, 255, 255, 0.2);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
padding: 0.4rem 0.6rem;
|
|
gap: 0.5rem;
|
|
|
|
.stat-label {
|
|
font-weight: bold;
|
|
font-size: 0.85rem;
|
|
color: #2a1510;
|
|
min-width: 90px;
|
|
flex: 0 0 auto;
|
|
}
|
|
|
|
.stat-values {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.3rem;
|
|
flex: 1;
|
|
|
|
.stat-base {
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
min-width: 30px;
|
|
text-align: center;
|
|
}
|
|
|
|
.input-numeric-short {
|
|
width: 50px;
|
|
text-align: center;
|
|
padding: 0.2rem;
|
|
border: 1px solid #6a0606;
|
|
border-radius: 2px;
|
|
background: rgba(255, 255, 255, 0.8);
|
|
}
|
|
|
|
.stat-total {
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
color: #6a0606;
|
|
min-width: 40px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Bio tab specific styles
|
|
.sheet-body[data-tab="biodata"] {
|
|
.biodata-info {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.biodata-section {
|
|
background: rgba(255, 255, 255, 0.2);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 4px;
|
|
padding: 0.75rem;
|
|
|
|
h3 {
|
|
margin: 0 0 0.5rem 0;
|
|
padding-bottom: 0.3rem;
|
|
border-bottom: 2px solid #6a0606;
|
|
font-size: 0.95rem;
|
|
color: #2a1510;
|
|
font-family: "Charlemagne", serif;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.item-list {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
|
|
li.item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
padding: 0.4rem;
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
|
&:hover {
|
|
background: rgba(106, 6, 6, 0.05);
|
|
}
|
|
|
|
label {
|
|
flex: 0 0 90px;
|
|
font-weight: bold;
|
|
font-size: 0.85rem;
|
|
color: #2a1510;
|
|
}
|
|
|
|
.value {
|
|
flex: 1;
|
|
font-size: 0.9rem;
|
|
color: #2a1510;
|
|
}
|
|
|
|
.item-controls-fixed {
|
|
display: flex;
|
|
gap: 0.25rem;
|
|
flex: 0 0 auto;
|
|
|
|
.item-control {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 24px;
|
|
height: 24px;
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
color: #2a1510;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
|
|
i {
|
|
font-size: 0.75rem;
|
|
}
|
|
|
|
&:hover {
|
|
background: rgba(106, 6, 6, 0.2);
|
|
border-color: #8a0808;
|
|
color: #6a0606;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.biodata-fields {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.4rem;
|
|
|
|
.biodata-field {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
|
|
label {
|
|
flex: 0 0 110px;
|
|
font-weight: bold;
|
|
font-size: 0.85rem;
|
|
color: #2a1510;
|
|
}
|
|
|
|
input[type="text"] {
|
|
flex: 1;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
padding: 0.3rem 0.5rem;
|
|
font-size: 0.9rem;
|
|
color: #1a1510;
|
|
|
|
&:hover {
|
|
background: rgba(255, 255, 255, 0.6);
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
background: rgba(255, 255, 255, 0.7);
|
|
border-color: #aa0a0a;
|
|
box-shadow: 0 0 4px rgba(170, 10, 10, 0.3);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
> .editor-section {
|
|
margin-bottom: 1rem;
|
|
|
|
h3 {
|
|
margin: 0 0 0.4rem 0;
|
|
padding-bottom: 0.2rem;
|
|
border-bottom: 2px solid #6a0606;
|
|
font-size: 1rem;
|
|
color: #2a1510;
|
|
font-family: "Charlemagne", serif;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
}
|
|
|
|
> .textarea-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 1rem;
|
|
margin-bottom: 1rem;
|
|
|
|
.form-group {
|
|
margin-bottom: 0;
|
|
|
|
label {
|
|
display: block;
|
|
margin-bottom: 0.4rem;
|
|
padding-bottom: 0.2rem;
|
|
border-bottom: 2px solid #6a0606;
|
|
font-size: 1rem;
|
|
color: #2a1510;
|
|
font-family: "Charlemagne", serif;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
textarea {
|
|
width: 100%;
|
|
min-height: 80px;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
padding: 0.5rem;
|
|
font-size: 0.9rem;
|
|
color: #1a1510;
|
|
font-family: inherit;
|
|
resize: vertical;
|
|
|
|
&:hover {
|
|
background: rgba(255, 255, 255, 0.6);
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
background: rgba(255, 255, 255, 0.7);
|
|
border-color: #aa0a0a;
|
|
box-shadow: 0 0 4px rgba(170, 10, 10, 0.3);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
> .form-group {
|
|
margin-bottom: 1rem;
|
|
|
|
label {
|
|
display: block;
|
|
margin-bottom: 0.4rem;
|
|
padding-bottom: 0.2rem;
|
|
border-bottom: 2px solid #6a0606;
|
|
font-size: 1rem;
|
|
color: #2a1510;
|
|
font-family: "Charlemagne", serif;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
textarea {
|
|
width: 100%;
|
|
min-height: 80px;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
padding: 0.5rem;
|
|
font-size: 0.9rem;
|
|
color: #1a1510;
|
|
font-family: inherit;
|
|
resize: vertical;
|
|
|
|
&:hover {
|
|
background: rgba(255, 255, 255, 0.6);
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
background: rgba(255, 255, 255, 0.7);
|
|
border-color: #aa0a0a;
|
|
box-shadow: 0 0 4px rgba(170, 10, 10, 0.3);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Item lists
|
|
.item-list {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
|
|
.item {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0.4rem 0.5rem;
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
gap: 0.5rem;
|
|
flex-wrap: nowrap;
|
|
height: auto;
|
|
line-height: normal;
|
|
|
|
&:hover {
|
|
background: rgba(106, 6, 6, 0.1);
|
|
}
|
|
|
|
.item-img {
|
|
width: 32px;
|
|
height: 32px;
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
object-fit: cover;
|
|
flex: 0 0 32px;
|
|
}
|
|
|
|
.item-name {
|
|
min-width: 0;
|
|
|
|
a {
|
|
color: #2a1510;
|
|
text-decoration: none;
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
white-space: nowrap;
|
|
|
|
&:hover {
|
|
color: #6a0606;
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Competence-specific styles
|
|
&[data-item-type="competence"] {
|
|
align-items: center;
|
|
|
|
.competence-info {
|
|
flex: 1 1 auto;
|
|
min-width: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.1rem;
|
|
|
|
.competence-name {
|
|
line-height: 1;
|
|
min-width: 12rem;
|
|
max-width: 12rem;
|
|
|
|
a {
|
|
color: #2a1510;
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
text-decoration: none;
|
|
|
|
&:hover {
|
|
color: #6a0606;
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
|
|
.predilection-text {
|
|
display: block;
|
|
font-size: 0.7rem;
|
|
color: rgba(42, 21, 16, 0.7);
|
|
font-style: italic;
|
|
line-height: 1;
|
|
}
|
|
}
|
|
|
|
.competence-niveau {
|
|
flex: 0 0 60px;
|
|
margin-top: 4px;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
padding: 0.2rem 0.3rem;
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
color: #1a1510;
|
|
text-align: center;
|
|
height: 28px;
|
|
|
|
&:hover {
|
|
background: rgba(255, 255, 255, 0.6);
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
background: rgba(255, 255, 255, 0.7);
|
|
border-color: #aa0a0a;
|
|
box-shadow: 0 0 4px rgba(170, 10, 10, 0.3);
|
|
}
|
|
}
|
|
|
|
.competence-buttons {
|
|
flex: 0 0 200px;
|
|
display: flex;
|
|
gap: 0.35rem;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.button-sheet-roll {
|
|
padding: 0.3rem 0.6rem;
|
|
background: linear-gradient(to bottom, #4a0404 0%, #3a0303 100%);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
color: #f5f5f5;
|
|
font-size: 0.75rem;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
white-space: nowrap;
|
|
height: 28px;
|
|
|
|
&:hover {
|
|
background: linear-gradient(to bottom, #5a0505 0%, #4a0404 100%);
|
|
box-shadow: 0 0 4px rgba(106, 6, 6, 0.6);
|
|
}
|
|
}
|
|
|
|
.item-filler {
|
|
flex: 1 1 auto;
|
|
min-width: 10px;
|
|
}
|
|
|
|
.item-controls-fixed {
|
|
display: flex;
|
|
gap: 0.25rem;
|
|
flex: 0 0 auto;
|
|
|
|
.item-control {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 24px;
|
|
height: 24px;
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
color: #2a1510;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
|
|
i {
|
|
font-size: 0.75rem;
|
|
}
|
|
|
|
&:hover {
|
|
background: rgba(106, 6, 6, 0.2);
|
|
border-color: #8a0808;
|
|
color: #6a0606;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.item-detail {
|
|
flex: 0 0 auto;
|
|
min-width: 140px;
|
|
font-size: 0.85rem;
|
|
color: rgba(42, 21, 16, 0.8);
|
|
font-weight: normal;
|
|
text-align: right;
|
|
padding-right: 0.5rem;
|
|
}
|
|
|
|
.item-quantity-controls {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.25rem;
|
|
flex: 0 0 auto;
|
|
|
|
button {
|
|
width: 20px;
|
|
height: 20px;
|
|
padding: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: linear-gradient(to bottom, #4a0404 0%, #3a0303 100%);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
color: #f5f5f5;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
|
|
i {
|
|
font-size: 0.65rem;
|
|
}
|
|
|
|
&:hover {
|
|
background: linear-gradient(to bottom, #5a0505 0%, #4a0404 100%);
|
|
box-shadow: 0 0 4px rgba(106, 6, 6, 0.6);
|
|
}
|
|
|
|
&:active {
|
|
transform: scale(0.95);
|
|
}
|
|
}
|
|
|
|
.quantity-value {
|
|
min-width: 30px;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
color: #2a1510;
|
|
}
|
|
}
|
|
|
|
input[type="checkbox"] {
|
|
flex: 0 0 18px;
|
|
width: 18px;
|
|
height: 18px;
|
|
cursor: pointer;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.item-controls {
|
|
display: flex;
|
|
gap: 0.25rem;
|
|
flex: 0 0 auto;
|
|
margin-left: auto;
|
|
|
|
.item-control {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 24px;
|
|
height: 24px;
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
color: #2a1510;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
|
|
i {
|
|
font-size: 0.75rem;
|
|
}
|
|
|
|
&:hover {
|
|
background: rgba(106, 6, 6, 0.2);
|
|
border-color: #8a0808;
|
|
color: #6a0606;
|
|
}
|
|
}
|
|
}
|
|
|
|
input[type="number"],
|
|
select {
|
|
width: 50px;
|
|
text-align: center;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
padding: 0.2rem 0.3rem;
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
color: #1a1510;
|
|
|
|
&:hover {
|
|
background: rgba(255, 255, 255, 0.6);
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
background: rgba(255, 255, 255, 0.7);
|
|
border-color: #aa0a0a;
|
|
box-shadow: 0 0 4px rgba(170, 10, 10, 0.3);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Add item buttons
|
|
button[data-action="createItem"] {
|
|
margin-top: 0.5rem;
|
|
padding: 0.4rem 0.8rem;
|
|
background: linear-gradient(to bottom, #4a0404 0%, #3a0303 100%);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 4px;
|
|
color: #f5f5f5;
|
|
font-family: "Charlemagne", serif;
|
|
font-size: 0.85rem;
|
|
cursor: pointer;
|
|
transition: all 0.3s ease;
|
|
|
|
i {
|
|
margin-right: 0.3rem;
|
|
}
|
|
|
|
&:hover {
|
|
background: linear-gradient(to bottom, #5a0505 0%, #4a0404 100%);
|
|
box-shadow: 0 0 6px rgba(106, 6, 6, 0.6);
|
|
}
|
|
}
|
|
|
|
// Specific styles for pouvoir and charme lists
|
|
.sheet-body[data-tab="pouvoirs"] {
|
|
.item-list {
|
|
.item[data-item-type="pouvoir"],
|
|
.item[data-item-type="charme"],
|
|
.item[data-item-type="tour"] {
|
|
.item-name {
|
|
flex: 0 0 12rem;
|
|
min-width: 12rem;
|
|
max-width: 12rem;
|
|
}
|
|
|
|
.button-sheet-roll {
|
|
flex: 0 0 auto;
|
|
width: 28px;
|
|
height: 28px;
|
|
padding: 0;
|
|
background: linear-gradient(to bottom, #4a0404 0%, #3a0303 100%);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
color: #f5f5f5;
|
|
font-size: 0.85rem;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
&:hover {
|
|
background: linear-gradient(to bottom, #5a0505 0%, #4a0404 100%);
|
|
box-shadow: 0 0 4px rgba(106, 6, 6, 0.6);
|
|
}
|
|
}
|
|
|
|
.item-filler {
|
|
flex: 1 1 auto;
|
|
min-width: 10px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Specific styles for equipement and monnaie lists
|
|
.sheet-body[data-tab="equipement"] {
|
|
.item-list {
|
|
.item[data-item-type="equipement"],
|
|
.item[data-item-type="monnaie"] {
|
|
.item-name {
|
|
flex: 0 0 12rem;
|
|
min-width: 12rem;
|
|
max-width: 12rem;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Specific styles for arme and protection lists
|
|
.sheet-body[data-tab="combat"] {
|
|
.item-list {
|
|
.item[data-item-type="arme"],
|
|
.item[data-item-type="protection"] {
|
|
.item-name {
|
|
flex: 0 0 12rem;
|
|
min-width: 12rem;
|
|
max-width: 12rem;
|
|
}
|
|
|
|
.weapon-stats {
|
|
display: flex;
|
|
gap: 0.75rem;
|
|
align-items: center;
|
|
flex: 0 0 auto;
|
|
font-size: 0.85rem;
|
|
font-weight: bold;
|
|
|
|
.stat-offensif,
|
|
.stat-defensif,
|
|
.stat-placeholder {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.25rem;
|
|
padding: 0.2rem 0.4rem;
|
|
background: rgba(255, 255, 255, 0.3);
|
|
border-radius: 3px;
|
|
border: 1px solid rgba(106, 6, 6, 0.3);
|
|
min-width: 50px;
|
|
|
|
i {
|
|
font-size: 0.75rem;
|
|
}
|
|
}
|
|
|
|
.stat-offensif {
|
|
color: #6a0606;
|
|
|
|
i {
|
|
color: #8b0000;
|
|
}
|
|
}
|
|
|
|
.stat-defensif {
|
|
color: #4a6017;
|
|
|
|
i {
|
|
color: #6b8e23;
|
|
}
|
|
}
|
|
|
|
.stat-placeholder {
|
|
background: transparent;
|
|
border: 1px dashed rgba(106, 6, 6, 0.2);
|
|
visibility: hidden;
|
|
}
|
|
}
|
|
|
|
.button-sheet-roll {
|
|
flex: 0 0 auto;
|
|
width: 28px;
|
|
height: 28px;
|
|
padding: 0;
|
|
background: linear-gradient(to bottom, #4a0404 0%, #3a0303 100%);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
color: #f5f5f5;
|
|
font-size: 0.85rem;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
&:hover {
|
|
background: linear-gradient(to bottom, #5a0505 0%, #4a0404 100%);
|
|
box-shadow: 0 0 4px rgba(106, 6, 6, 0.6);
|
|
}
|
|
}
|
|
|
|
.item-filler {
|
|
flex: 1 1 auto;
|
|
min-width: 10px;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Actions spéciales
|
|
.action-buttons-row {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
padding: 0.5rem 0;
|
|
margin-bottom: 0.5rem;
|
|
|
|
button {
|
|
margin: 0;
|
|
flex: 1;
|
|
}
|
|
|
|
.button-sheet-roll-large {
|
|
min-width: 8rem;
|
|
max-width: 10rem;
|
|
padding: 0.4rem 0.6rem;
|
|
font-size: 0.85rem;
|
|
white-space: nowrap;
|
|
background: linear-gradient(to bottom, #4a0404 0%, #3a0303 100%);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
color: #f5f5f5;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
|
|
&:hover {
|
|
background: linear-gradient(to bottom, #5a0505 0%, #4a0404 100%);
|
|
box-shadow: 0 0 4px rgba(106, 6, 6, 0.6);
|
|
}
|
|
}
|
|
|
|
.mounted-checkbox {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.4rem;
|
|
padding: 0.3rem 0.6rem;
|
|
white-space: nowrap;
|
|
background: rgba(106, 6, 6, 0.1);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
|
|
label {
|
|
margin: 0;
|
|
font-size: 0.85rem;
|
|
font-weight: bold;
|
|
color: #2a1510;
|
|
}
|
|
|
|
input[type="checkbox"] {
|
|
margin: 0;
|
|
cursor: pointer;
|
|
accent-color: #6a0606;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Competences tab specific styles
|
|
.sheet-body[data-tab="competences"] {
|
|
.competences-header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
border-bottom: 2px solid rgba(106, 6, 6, 0.3);
|
|
|
|
h3 {
|
|
margin: 0;
|
|
}
|
|
|
|
.reset-predilections-button {
|
|
padding: 0.4rem 0.8rem;
|
|
background: linear-gradient(to bottom, #5a4a3a 0%, #3a2a1a 100%);
|
|
border: 2px solid #8b7355;
|
|
border-radius: 3px;
|
|
color: #e8dcc4;
|
|
font-size: 0.85rem;
|
|
font-weight: bold;
|
|
font-family: "Charlemagne", serif;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.1);
|
|
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.9);
|
|
|
|
&:hover {
|
|
background: linear-gradient(to bottom, #6a5a4a 0%, #4a3a2a 100%);
|
|
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2);
|
|
border-color: #c9a86a;
|
|
}
|
|
|
|
i {
|
|
margin-right: 0.5rem;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Form groups
|
|
.form-group {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
padding: 0.3rem 0;
|
|
|
|
label {
|
|
flex: 0 0 100px;
|
|
font-weight: bold;
|
|
font-size: 0.85rem;
|
|
color: #2a1510;
|
|
}
|
|
|
|
input[type="number"],
|
|
input[type="text"] {
|
|
flex: 0 0 100px;
|
|
background: rgba(255, 255, 255, 0.5);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
padding: 0.25rem 0.4rem;
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
text-align: center;
|
|
color: #1a1510;
|
|
|
|
&:hover {
|
|
background: rgba(255, 255, 255, 0.6);
|
|
}
|
|
|
|
&:focus {
|
|
outline: none;
|
|
background: rgba(255, 255, 255, 0.7);
|
|
border-color: #aa0a0a;
|
|
box-shadow: 0 0 4px rgba(170, 10, 10, 0.3);
|
|
}
|
|
}
|
|
|
|
.value-display {
|
|
flex: 0 0 100px;
|
|
font-weight: bold;
|
|
font-size: 0.9rem;
|
|
color: #2a1510;
|
|
text-align: center;
|
|
}
|
|
|
|
.btn-adjust {
|
|
width: 24px;
|
|
height: 24px;
|
|
padding: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: linear-gradient(to bottom, #4a0404 0%, #3a0303 100%);
|
|
border: 1px solid #6a0606;
|
|
border-radius: 3px;
|
|
color: #f5f5f5;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
flex: 0 0 24px;
|
|
|
|
i {
|
|
font-size: 0.7rem;
|
|
}
|
|
|
|
&:hover {
|
|
background: linear-gradient(to bottom, #5a0505 0%, #4a0404 100%);
|
|
box-shadow: 0 0 4px rgba(106, 6, 6, 0.6);
|
|
}
|
|
|
|
&:active {
|
|
transform: scale(0.95);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Actor-specific styles will be added as we migrate actor sheets */
|