cosmo/daggerheart
1
0
Fork 0
mirror of https://github.com/Foundryborne/daggerheart.git synced 2026-01-15 05:01:08 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

new style for dialog roll and remove console.log debuggers (#272)

Browse source 
* new style for dialog roll and remove console.log debuggers

* enhance advantage logic
This commit is contained in:
Murilo Brito 2025-07-05 14:34:42 -03:00 • committed by GitHub
parent 0add5f369e
commit 41181f19f1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
50 changed files with 682 additions and 233 deletions
Download patch file Download diff file Expand all files Collapse all files

128
styles/less/dialog/dice-roll/roll-selection.less Normal file
View file

@ -0,0 +1,128 @@
@import '../../utils/colors.less';
@import '../../utils/fonts.less';
.application.daggerheart.dialog.dh-style.views.roll-selection {
.roll-dialog-container {
display: flex;
flex-direction: column;
gap: 12px;
.dices-section {
display: flex;
gap: 60px;
justify-content: center;
.dice-option {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
width: 120px;
.dice-icon {
width: 70px;
height: 70px;
object-fit: contain;
}
.dice-select {
display: flex;
align-items: center;
gap: 10px;
height: 32px;
.label {
font-family: @font-subtitle;
font-style: normal;
font-weight: 700;
font-size: 16px;
line-height: 19px;
color: light-dark(@dark, @beige);
}
}
}
}
.experience-container {
display: flex;
gap: 10px;
flex-wrap: wrap;
.experience-chip {
display: flex;
align-items: center;
border-radius: 5px;
width: fit-content;
gap: 5px;
cursor: pointer;
padding: 5px;
background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden);
.label {
font-family: @font-body;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 17px;
}
&.selected {
background: light-dark(@dark-blue-40, @golden-40);
}
}
}
.modifier-container {
.advantage-chip,
.disadvantage-chip {
display: flex;
align-items: center;
border-radius: 5px;
width: fit-content;
gap: 5px;
cursor: pointer;
padding: 5px;
transition: all 0.3s ease;
.label {
font-family: @font-body;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 17px;
}
}
.advantage-chip {
background: @green-10;
color: @green;
&.selected {
color: @beige;
background: @gradient-green;
}
}
.disadvantage-chip {
background: @red-10;
color: @red;
&.selected {
color: @beige;
background: @gradient-red;
}
}
}
.formula-label {
font-family: @font-body;
font-style: normal;
font-weight: 500;
font-size: 14px;
line-height: 17px;
color: light-dark(@dark, @beige);
}
}
}

41
styles/less/utils/colors.less
View file

@ -1,22 +1,47 @@
@primary-blue: #1488cc;
@secondary-blue: #2b32b2;
@golden: #f3c267;
@golden-40: #f3c26740;
@dark-blue-40: #18162e40;
@golden-10: #f3c26710;
@dark-blue-10: #18162e10;
@dark-blue-50: #18162e50;
@golden-40: #f3c26740;
@red: #e54e4e;
@red-10: #e54e4e10;
@red-40: #e54e4e40;
@dark-red: #3c0000;
@dark-red-10: #3c000010;
@dark-red-40: #3c000040;
@green: #40a640;
@green-10: #40a64010;
@green-40: #40a64040;
@dark-green: #011b01;
@dark-green-10: #011b0110;
@dark-green-40: #011b0140;
@dark-blue: #18162e;
@dark-blue-10: #18162e10;
@dark-blue-40: #18162e40;
@dark-blue-50: #18162e50;
@semi-transparent-dark-blue: rgba(24, 22, 46, 0.33);
@dark: #222;
@dark-15: #22222215;
@deep-black: #0e0d15;
@beige: #efe6d8;
@beige-15: #efe6d815;
@beige-50: #efe6d850;
@dark-blue: rgb(24, 22, 46);
@semi-transparent-dark-blue: rgba(24, 22, 46, 0.33);
@dark: #222;
@dark-15: #22222215;
@light-black: rgba(0, 0, 0, 0.3);
@soft-shadow: rgba(0, 0, 0, 0.05);
@gradient-green: linear-gradient(151.21deg, @green 7.21%, @dark-green 92.79%);
@gradient-red: linear-gradient(151.21deg, @red 7.21%, @dark-red 92.79%);
@gradient-hp: linear-gradient(15deg, rgb(70, 20, 10) 0%, rgb(190, 0, 0) 42%, rgb(252, 176, 69) 100%);
@gradient-stress: linear-gradient(15deg, rgb(130, 59, 1) 0%, rgb(252, 142, 69) 65%, rgb(190, 0, 0) 100%);

16
styles/less/utils/mixin.less
View file

@ -5,18 +5,18 @@
*/
.appTheme(@darkRules, @lightRules) {
// Dark theme selectors
.themed.theme-dark .application.sheet.dh-style,
.themed.theme-dark.application.sheet.dh-style,
body.theme-dark .application,
body.theme-dark.application {
.themed.theme-dark .application.daggerheart.sheet.dh-style,
.themed.theme-dark.application.daggerheart.sheet.dh-style,
body.theme-dark .application.daggerheart,
body.theme-dark.application.daggerheart {
@darkRules();
}
// Light theme selectors
.themed.theme-light .application.sheet.dh-style,
.themed.theme-light.application.sheet.dh-style,
body.theme-light .application,
body.theme-light.application {
.themed.theme-light .application.daggerheart.sheet.dh-style,
.themed.theme-light.application.daggerheart.sheet.dh-style,
body.theme-light .application.daggerheart,
body.theme-light.application.daggerheart {
@lightRules();
}
}