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

refactor styles folder (#302)

Browse source
This commit is contained in:
Murilo Brito 2025-07-08 19:39:00 -03:00 • committed by GitHub
parent 059b814fdf
commit 4150de757b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
78 changed files with 4208 additions and 8824 deletions
Download patch file Download diff file Expand all files Collapse all files

46
styles/less/dialog/beastform/beastform-container.less Normal file
View file

@ -0,0 +1,46 @@
@import '../../utils/colors.less';
.application.daggerheart.dh-style.views.beastform-selection {
.beastforms-container {
display: flex;
flex-direction: column;
gap: 4px;
.beastforms-tier {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 4px;
.beastform-container {
position: relative;
display: flex;
justify-content: center;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
cursor: pointer;
&.inactive {
opacity: 0.4;
}
img {
width: 100%;
border-radius: 6px;
}
.beastform-title {
position: absolute;
top: 4px;
display: flex;
flex-wrap: wrap;
font-size: 16px;
margin: 0 4px;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
color: light-dark(@beige, @dark);
background-image: url('../assets/parchments/dh-parchment-light.png');
}
}
}
}
}

21
styles/less/dialog/beastform/sheet.less Normal file
View file

@ -0,0 +1,21 @@
@import '../../utils/colors.less';
@import '../../utils/mixin.less';
.appTheme({
&.beastform-selection {
.beastforms-container .beastforms-tier .beastform-container .beastform-title {
background-image: url('../assets/parchments/dh-parchment-dark.png');
}
}
}, {});
.application.daggerheart.dh-style.views.beastform-selection {
footer {
margin-top: 8px;
display: flex;
button {
flex: 1;
}
}
}

13
styles/less/dialog/character-creation/creation-action-footer.less Normal file
View file

@ -0,0 +1,13 @@
.daggerheart.dh-style.dialog.character-creation {
.creation-action-footer {
display: flex;
align-items: center;
gap: 32px;
button {
flex: 1;
height: 100%;
white-space: nowrap;
}
}
}

325
styles/less/dialog/character-creation/selections-container.less Normal file
View file

@ -0,0 +1,325 @@
@import '../../utils/colors.less';
.daggerheart.dh-style.dialog.character-creation {
.main-selections-container {
display: flex;
flex-direction: column;
gap: 4px;
.selections-container {
width: 140px;
display: flex;
flex-direction: column;
text-align: center;
.card-preview-container {
border-color: light-dark(@dark-blue, @golden);
}
}
.selections-outer-container {
display: flex;
justify-content: space-evenly;
height: 210px;
}
.section-container {
border-radius: 8px;
border-color: light-dark(@dark-blue, @golden);
legend {
margin-left: auto;
margin-right: auto;
font-size: 28px;
font-weight: bold;
padding: 0 8px;
}
.section-inner-container {
position: relative;
border-radius: 8px;
border-color: light-dark(@dark-blue, @golden);
display: flex;
justify-content: center;
legend {
font-size: 20px;
}
.action-button {
position: absolute;
bottom: -8px;
height: 16px;
width: 110px;
min-height: unset;
border: 1px solid light-dark(@dark-blue, @golden);
color: light-dark(@beige, @beige);
background-color: light-dark(var(--color-warm-3), var(--color-warm-3));
&:hover {
background-color: light-dark(var(--color-warm-2), var(--color-warm-2));
filter: drop-shadow(0 0 3px light-dark(var(--color-warm-2), var(--color-warm-2)));
}
}
}
}
.traits-container {
text-align: center;
display: flex;
gap: 16px;
.suggested-traits-container {
display: flex;
flex-wrap: wrap;
width: 176px;
gap: 4px;
margin-bottom: 8px;
.suggested-trait-container {
width: 56px;
white-space: nowrap;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
color: light-dark(@beige, @dark);
background-image: url('../assets/parchments/dh-parchment-light.png');
}
}
.traits-inner-container {
display: flex;
justify-content: space-evenly;
gap: 8px;
.trait-container {
border: 1px solid light-dark(@dark-blue, @golden);
padding: 0 4px;
}
}
}
.experiences-inner-container {
display: flex;
justify-content: space-evenly;
text-align: center;
.experience-container {
position: relative;
display: flex;
align-items: center;
.experience-description {
border-color: light-dark(@dark-blue, @golden);
padding-right: 24px;
}
.experience-value {
position: absolute;
right: 0;
width: 22px;
border-left: 1px solid light-dark(@dark-blue, @golden);
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
}
}
.creation-action-footer {
display: flex;
align-items: center;
gap: 32px;
.footer-section {
display: flex;
align-items: center;
gap: 32px;
nav {
flex: 1;
gap: 8px;
border: 0;
a {
flex: 1;
text-align: center;
display: flex;
justify-content: center;
position: relative;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
.nav-section-text {
position: relative;
display: flex;
align-items: center;
}
.finish-marker {
position: absolute;
align-self: center;
top: -10px;
padding: 4px;
border: 1px solid;
border-radius: 50%;
height: 20px;
width: 20px;
font-size: 14px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--color-cool-4);
content: '';
&.finished {
background-color: var(--color-warm-2);
}
}
.descriptor {
position: absolute;
bottom: -8px;
font-size: 12px;
border-radius: 8px;
width: 56px;
text-align: center;
line-height: 1;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
color: light-dark(@beige, @dark);
background-image: url(../assets/parchments/dh-parchment-light.png);
}
}
}
button {
flex: 1;
height: 100%;
white-space: nowrap;
}
}
}
.main-equipment-selection {
display: grid;
grid-template-columns: 1fr 2fr;
gap: 16px;
&.triple {
grid-template-columns: 1fr 1fr 1fr;
}
}
.equipment-selection {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
border: 2px solid light-dark(@dark-blue, @golden);
border-radius: 8px;
legend {
margin-left: auto;
margin-right: auto;
font-size: 28px;
font-weight: bold;
padding: 0 8px;
white-space: nowrap;
}
.equipment-subsection {
display: flex;
align-items: start;
gap: 32px;
}
.equipment-wrapper {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
}
.simple-equipment-container {
display: flex;
flex-direction: column;
justify-content: space-evenly;
gap: 8px;
height: 100%;
.simple-equipment {
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 8px;
position: relative;
display: flex;
justify-content: center;
&.selectable {
cursor: pointer;
}
&.inactive {
opacity: 0.4;
}
label {
position: absolute;
top: -8px;
font-size: 12px;
white-space: nowrap;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
color: light-dark(@beige, @dark);
background-image: url('../assets/parchments/dh-parchment-light.png');
padding: 0 2px;
}
img {
width: 60px;
height: 60px;
border-radius: 8px;
}
}
}
.suggestion-container {
position: relative;
display: flex;
justify-content: center;
height: min-content;
border: 2px solid light-dark(@dark-blue, @golden);
border-radius: 8px;
legend {
margin-left: auto;
margin-right: auto;
font-size: 12px;
}
.suggestion-inner-container {
position: relative;
display: flex;
justify-content: center;
align-items: center;
padding: 6px;
cursor: grab;
&.taken {
opacity: 0.4;
}
label {
position: absolute;
top: -2px;
font-size: 12px;
}
img {
width: 120px;
}
}
}
}
}
}

27
styles/less/dialog/character-creation/sheet.less Normal file
View file

@ -0,0 +1,27 @@
@import '../../utils/colors.less';
@import '../../utils/mixin.less';
.appTheme({
.character-creation {
.tab-navigation nav a .descriptor {
background-image: url('../assets/parchments/dh-parchment-dark.png');
}
.main-selections-container {
.traits-container .suggested-traits-container .suggested-trait-container,
.creation-action-footer .footer-section nav a .descriptor,
.equipment-selection .simple-equipment-container .simple-equipment label {
background-image: url('../assets/parchments/dh-parchment-dark.png');
}
}
}
}, {});
.daggerheart.dh-style.dialog.character-creation {
.window-content {
gap: 16px;
.tab {
overflow-y: auto;
}
}
}

62
styles/less/dialog/character-creation/tab-navigation.less Normal file
View file

@ -0,0 +1,62 @@
@import '../../utils/colors.less';
.daggerheart.dh-style.dialog.character-creation {
.tab-navigation {
nav {
flex: 1;
a {
flex: 1;
text-align: center;
display: flex;
justify-content: center;
position: relative;
&.disabled {
opacity: 0.4;
}
.nav-section-text {
position: relative;
display: flex;
align-items: center;
}
.finish-marker {
position: absolute;
align-self: center;
top: -8px;
padding: 4px;
border: 1px solid;
border-radius: 50%;
height: 16px;
width: 16px;
font-size: 12px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--color-cool-4);
content: '';
&.active {
background-color: var(--color-warm-2);
}
}
.descriptor {
position: absolute;
bottom: -8px;
font-size: 12px;
border-radius: 8px;
width: 56px;
text-align: center;
line-height: 1;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
color: light-dark(@beige, @dark);
background-image: url(../assets/parchments/dh-parchment-light.png);
}
}
}
}
}

143
styles/less/dialog/damage-reduction/damage-reduction-container.less Normal file
View file

@ -0,0 +1,143 @@
@import '../../utils/colors.less';
.daggerheart.views.damage-reduction {
.damage-reduction-container {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
.section-container {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
}
.padded {
padding: 0 8px;
}
.armor-title {
margin: 0;
white-space: nowrap;
}
.resources-container {
display: flex;
gap: 8px;
width: 100%;
.resource-container {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
}
}
.mark-selection {
display: flex;
align-items: center;
width: 100%;
margin: 0;
.mark-selection-inner {
display: flex;
gap: 2px;
&:not(:last-child) {
margin-right: 8px;
}
.mark-container {
cursor: pointer;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
height: 26px;
padding: 0 1px;
font-size: 18px;
display: flex;
align-items: center;
justify-content: center;
opacity: 0.4;
&.selected {
opacity: 1;
}
&.inactive {
cursor: initial;
opacity: 0.2;
}
.fa-shield {
position: relative;
right: 0.5px;
}
}
}
}
.stress-reduction-container {
margin: 0;
width: 100%;
.stress-reduction {
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
height: 26px;
padding: 0 4px;
font-size: 18px;
display: flex;
align-items: center;
justify-content: center;
gap: 4px;
opacity: 0.4;
&.active {
opacity: 1;
cursor: pointer;
}
&.selected {
opacity: 1;
background: var(--color-warm-2);
color: white;
}
.stress-reduction-cost {
display: flex;
align-items: center;
}
}
}
.markers-subtitle {
margin: -4px 0 0 0;
&.bold {
font-variant: all-small-caps;
font-weight: bold;
}
}
footer {
display: flex;
width: 100%;
button {
flex: 1;
.damage-value {
font-weight: bold;
&.reduced-value {
opacity: 0.4;
text-decoration: line-through;
}
}
}
}
}
}

7
styles/less/dialog/damage-reduction/sheets.less Normal file
View file

@ -0,0 +1,7 @@
@import '../../utils/colors.less';
.daggerheart.views.damage-reduction {
.window-content {
padding: 8px 0;
}
}

81
styles/less/dialog/downtime/downtime-container.less Normal file
View file

@ -0,0 +1,81 @@
@import '../../utils/spacing.less';
@import '../../utils/colors.less';
.daggerheart.views {
.downtime-container {
.downtime-header {
margin: 0;
color: light-dark(@dark-blue, @golden);
text-align: center;
}
.activity-container {
display: flex;
align-items: center;
padding: 8px;
.activity-title {
flex: 1;
display: flex;
align-items: center;
.activity-title-text {
font-size: 24px;
font-weight: bold;
}
.activity-image {
width: 80px;
position: relative;
display: flex;
justify-content: center;
margin-right: 8px;
border: 2px solid black;
border-radius: 50%;
cursor: pointer;
.activity-select-label {
position: absolute;
top: -9px;
font-size: 14px;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
color: light-dark(@beige, @dark);
background-image: url(../assets/parchments/dh-parchment-light.png);
padding: 0 8px;
line-height: 1;
font-weight: bold;
}
img {
border-radius: 50%;
}
&:hover,
&.selected {
filter: drop-shadow(0 0 6px gold);
}
}
.custom-name-input {
font-size: 24px;
font-weight: bold;
padding: 0;
background: transparent;
color: rgb(239, 230, 216);
}
}
.activity-body {
flex: 1;
font-style: italic;
}
}
}
&.downtime {
.activity-text-area {
resize: none;
}
}
}

19
styles/less/dialog/index.less Normal file
View file

@ -0,0 +1,19 @@
@import './level-up/navigation-container.less';
@import './level-up/selections-container.less';
@import './level-up/sheet.less';
@import './level-up/summary-container.less';
@import './level-up/tiers-container.less';
@import './downtime/downtime-container.less';
@import './beastform/beastform-container.less';
@import './beastform/sheet.less';
@import './character-creation/creation-action-footer.less';
@import './character-creation/selections-container.less';
@import './character-creation/sheet.less';
@import './character-creation/tab-navigation.less';
@import './dice-roll/roll-selection.less';
@import './damage-reduction/damage-reduction-container.less';
@import './damage-reduction/sheets.less';

30
styles/less/dialog/level-up/navigation-container.less Normal file
View file

@ -0,0 +1,30 @@
.daggerheart.levelup {
.levelup-navigation-container {
display: flex;
align-items: center;
gap: 22px;
height: 36px;
nav {
flex: 1;
.levelup-tab-container {
display: flex;
align-items: center;
gap: 4px;
}
}
.levelup-navigation-actions {
width: 306px;
display: flex;
justify-content: end;
gap: 16px;
margin-right: 4px;
* {
width: calc(50% - 8px);
}
}
}
}

108
styles/less/dialog/level-up/selections-container.less Normal file
View file

@ -0,0 +1,108 @@
.daggerheart.levelup {
.levelup-selections-container {
.achievement-experience-cards {
display: flex;
gap: 8px;
.achievement-experience-card {
border: 1px solid;
border-radius: 4px;
padding-right: 4px;
font-size: 18px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 4px;
.achievement-experience-marker {
border: 1px solid;
border-radius: 50%;
height: 18px;
width: 18px;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
}
}
}
.levelup-card-selection {
display: flex;
flex-wrap: wrap;
gap: 40px;
.card-preview-container {
width: calc(100% * (1 / 5));
}
.levelup-domains-selection-container {
display: flex;
flex-direction: column;
gap: 8px;
.levelup-domain-selection-container {
display: flex;
flex-direction: column;
align-items: center;
flex: 1;
position: relative;
cursor: pointer;
&.disabled {
pointer-events: none;
opacity: 0.4;
}
.levelup-domain-label {
position: absolute;
text-align: center;
top: 4px;
background: grey;
padding: 0 12px;
border-radius: 6px;
}
img {
height: 124px;
}
.levelup-domain-selected {
position: absolute;
height: 54px;
width: 54px;
border-radius: 50%;
border: 2px solid;
font-size: 48px;
display: flex;
align-items: center;
justify-content: center;
background-image: url(../assets/parchments/dh-parchment-light.png);
color: var(--color-dark-5);
top: calc(50% - 29px);
i {
position: relative;
right: 2px;
}
}
}
}
}
.levelup-selections-title {
display: flex;
align-items: center;
gap: 4px;
}
.levelup-radio-choices {
display: flex;
gap: 8px;
label {
flex: 0;
}
}
}
}

37
styles/less/dialog/level-up/sheet.less Normal file
View file

@ -0,0 +1,37 @@
@import '../../utils/mixin.less';
.appTheme({}, {
&.levelup {
.tiers-container {
.tier-container {
background-image: url('../assets/parchments/dh-parchment-light.png');
}
}
}
});
.daggerheart.levelup {
.window-content {
max-height: 960px;
overflow: auto;
}
div[data-application-part='form'] {
display: flex;
flex-direction: column;
gap: 8px;
}
section {
.section-container {
display: flex;
flex-direction: column;
gap: 8px;
margin-top: 8px;
}
}
.levelup-footer {
display: flex;
}
}

37
styles/less/dialog/level-up/summary-container.less Normal file
View file

@ -0,0 +1,37 @@
.daggerheart.levelup {
.levelup-summary-container {
.level-achievements-container,
.level-advancements-container {
display: flex;
flex-direction: column;
gap: 8px;
h2,
h3,
h4,
h5 {
margin: 0;
color: var(--color-text-secondary);
}
}
.increase-container {
display: flex;
align-items: center;
gap: 4px;
font-size: 20px;
}
.summary-selection-container {
display: flex;
gap: 8px;
.summary-selection {
border: 2px solid;
border-radius: 6px;
padding: 0 4px;
font-size: 18px;
}
}
}
}

65
styles/less/dialog/level-up/tiers-container.less Normal file
View file

@ -0,0 +1,65 @@
.daggerheart.levelup {
.tiers-container {
display: flex;
gap: 16px;
.tier-container {
flex: 1;
display: flex;
flex-direction: column;
gap: 8px;
background-image: url('../assets/parchments/dh-parchment-dark.png');
&.inactive {
opacity: 0.4;
pointer-events: none;
}
legend {
margin-left: auto;
margin-right: auto;
font-size: 22px;
font-weight: bold;
padding: 0 12px;
}
.checkbox-group-container {
display: grid;
grid-template-columns: 1fr 3fr;
gap: 4px;
.checkboxes-container {
display: flex;
justify-content: end;
gap: 4px;
.checkbox-grouping-coontainer {
display: flex;
height: min-content;
&.multi {
border: 2px solid grey;
padding: 2.4px 2.5px 0;
border-radius: 4px;
gap: 2px;
.selection-checkbox {
margin-left: 0;
margin-right: 0;
}
}
.selection-checkbox {
margin: 0;
}
}
}
.checkbox-group-label {
font-size: 14px;
font-style: italic;
}
}
}
}
}