public/fvtt-cthulhu-eternal
0
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases 20 Wiki Activity

Attempt to add HUD core

Browse Source
This commit is contained in:
LeRatierBretonnien
2025-11-12 23:41:15 +01:00
parent 68a0d03740
commit 6ad8226265
37 changed files with 1639 additions and 903 deletions
Download Patch File Download Diff File Expand all files Collapse all files

238
styles/roll.less
View File

@@ -97,21 +97,6 @@
font-family: var(--font-primary);
font-size: calc(var(--font-size-standard) * 1);
}
.nudge-roll {
font-size: calc(var(--font-size-standard) * 1);
margin-left: 2rem;
display: none;
}
.healing-roll {
font-size: calc(var(--font-size-standard) * 1);
margin-left: 2rem;
display: none;
}
.roll-damage {
font-size: calc(var(--font-size-standard) * 1);
margin-left: 2rem;
display: none;
}
.result-success {
color: var(--color-success);
font-family: var(--font-title);
@@ -149,4 +134,227 @@
font-size: calc(var(--font-size-standard) * 1.2);
text-shadow: 0 0 10px var(--color-shadow-primary);
}
.chat-actions {
display: flex;
flex-wrap: wrap;
gap: 0.375rem;
padding: 0.5rem;
margin-top: 0.5rem;
border-top: 1px solid var(--color-border-light-primary);
background: rgba(0, 0, 0, 0.05);
border-radius: 0 0 5px 5px;
justify-content: center;
.chat-action-button {
display: inline-flex !important;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
padding: 0 !important;
margin: 0 !important;
background: var(--color-dark-6);
color: var(--color-light-1);
border: 1px solid var(--color-border-light-primary);
border-radius: 3px;
cursor: pointer;
transition: all 0.2s ease;
text-decoration: none;
line-height: 1;
&:hover {
background: var(--color-dark-5);
border-color: var(--color-border-dark);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
transform: translateY(-1px);
}
i {
font-size: 1rem !important;
line-height: 1;
display: block;
margin: 0;
}
}
.nudge-roll,
.damage-roll,
.healing-roll,
.opposed-roll {
display: none;
}
}
}
.opposed-roll-result {
padding: 1rem;
background: rgba(0, 0, 0, 0.05);
border-radius: 5px;
font-family: var(--font-primary);
.opposed-header {
text-align: center;
margin-bottom: 1rem;
padding-bottom: 0.5rem;
border-bottom: 2px solid var(--color-border-light-primary);
h3 {
margin: 0;
font-family: var(--font-title);
font-size: calc(var(--font-size-standard) * 1.2);
color: var(--color-dark-1);
}
}
.opposed-content {
display: flex;
flex-direction: column;
gap: 1rem;
margin-bottom: 1rem;
}
.opposed-winner,
.opposed-loser {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem;
border-radius: 5px;
}
.opposed-winner {
background: rgba(34, 139, 34, 0.1);
border: 2px solid var(--color-success);
}
.opposed-loser {
background: rgba(220, 20, 60, 0.1);
border: 2px solid var(--color-failure);
}
.character-info {
display: flex;
align-items: center;
gap: 0.75rem;
img {
width: 48px;
height: 48px;
border-radius: 50%;
border: 2px solid var(--color-border-light-primary);
}
.character-name {
display: flex;
flex-direction: column;
gap: 0.25rem;
strong {
font-size: calc(var(--font-size-standard) * 0.85);
text-transform: uppercase;
color: var(--color-dark-2);
}
.winner-name {
font-size: calc(var(--font-size-standard) * 1.1);
font-weight: bold;
color: var(--color-success);
}
.loser-name {
font-size: calc(var(--font-size-standard) * 1.1);
font-weight: bold;
color: var(--color-failure);
}
}
}
.roll-result {
display: flex;
align-items: center;
gap: 0.5rem;
.roll-value {
font-size: calc(var(--font-size-standard) * 1.5);
font-weight: bold;
font-family: var(--font-title);
}
.critical-badge {
padding: 0.25rem 0.5rem;
border-radius: 3px;
font-size: calc(var(--font-size-standard) * 0.8);
font-weight: bold;
text-transform: uppercase;
background: var(--color-critical-success);
color: white;
}
}
.winner-result .roll-value {
color: var(--color-success);
}
.loser-result .roll-value {
color: var(--color-failure);
}
.versus-separator {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 0.5rem 0;
font-size: calc(var(--font-size-standard) * 1.1);
font-weight: bold;
color: var(--color-dark-2);
i {
font-size: calc(var(--font-size-standard) * 1.3);
}
}
.chat-actions {
display: flex;
justify-content: center;
gap: 0.375rem;
padding: 0.75rem;
margin-top: 0.5rem;
border-top: 1px solid var(--color-border-light-primary);
background: rgba(0, 0, 0, 0.05);
border-radius: 0 0 5px 5px;
.chat-action-button {
display: inline-flex !important;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
padding: 0 !important;
margin: 0 !important;
background: var(--color-dark-6);
color: var(--color-light-1);
border: 1px solid var(--color-border-light-primary);
border-radius: 3px;
cursor: pointer;
transition: all 0.2s ease;
text-decoration: none;
line-height: 1;
&:hover {
background: var(--color-dark-5);
border-color: var(--color-border-dark);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
transform: translateY(-1px);
}
i {
font-size: 1rem !important;
line-height: 1;
display: block;
margin: 0;
}
}
}
}