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

style items and action chat messages

Browse source
This commit is contained in:
moliloo 2025-07-27 14:16:20 -03:00
parent dddee78356
commit a9fca36ed5
17 changed files with 365 additions and 102 deletions
Download patch file Download diff file Expand all files Collapse all files

18
styles/less/global/chat.less Normal file
View file

@ -0,0 +1,18 @@
@import '../utils/colors.less';
@import '../utils/fonts.less';
@import '../utils/mixin.less';
.dh-chat-message {
background-image: url('../assets/parchments/dh-parchment-dark.png');
border: none !important;
padding: 8px 0;
.message-header {
padding: 0 8px 8px;
color: @beige;
.message-sender,
.message-metadata {
font-family: @font-body;
}
}
}

2
styles/less/global/elements.less
View file

@ -1,7 +1,7 @@
@import '../utils/colors.less';
@import '../utils/fonts.less';
.application.dh-style {
.dh-style {
border: 1px solid light-dark(@dark-blue, @golden);
input[type='text'],

1
styles/less/global/index.less
View file

@ -1,5 +1,6 @@
@import './sheet.less';
@import './dialog.less';
@import './chat.less';
@import './elements.less';
@import './tab-navigation.less';
@import './tab-form-footer.less';

5
styles/less/global/inventory-item.less
View file

@ -1,5 +1,6 @@
@import '../utils/colors.less';
@import '../utils/fonts.less';
@import '../utils/mixin.less';
.theme-light .application.daggerheart.dh-style {
.inventory-item,
@ -50,6 +51,10 @@
.roll-img {
position: absolute;
transition: opacity 300ms ease-in;
height: 40px;
width: 40px;
object-fit: cover;
border-radius: 3px;
}
.roll-img {

84
styles/less/ui/chat/ability-use.less Normal file
View file

@ -0,0 +1,84 @@
@import '../../utils/colors.less';
@import '../../utils/fonts.less';
@import '../../utils/spacing.less';
.daggerheart.chat {
&.domain-card {
display: flex;
flex-direction: column;
align-items: center;
.card-img {
width: 100%;
height: 200px;
mask-image: linear-gradient(0deg, transparent 0%, black 10%, black 90%, transparent 100%);
object-fit: cover;
}
.domain-card-header {
display: flex;
flex-direction: column;
width: 100%;
padding: 8px;
gap: 5px;
border-bottom: 1px solid @golden;
.title {
font-size: 20px;
color: @golden;
font-family: @font-subtitle;
margin: 0;
}
.tags {
display: flex;
gap: 10px;
.tag {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 3px 5px;
font-size: 12px;
font-family: @font-body;
background: light-dark(@dark-15, @beige-15);
border: 1px solid light-dark(@dark, @beige);
color: light-dark(@dark, @beige);
border-radius: 3px;
}
}
}
.description {
color: @beige;
padding: 8px;
font-family: @font-body;
}
.ability-card-footer {
display: flex;
flex-wrap: wrap;
gap: 5px;
width: 100%;
padding: 0 8px;
button {
font-family: @font-body;
font-weight: 600;
height: 40px;
flex: 1 1 calc(50% - 5px);
&:nth-last-child(1):nth-child(odd) {
flex-basis: 100%;
}
}
.ability-card-action-cost {
margin: auto;
font-size: 1.5em;
}
}
}
}

77
styles/less/ui/chat/action.less Normal file
View file

@ -0,0 +1,77 @@
@import '../../utils/colors.less';
@import '../../utils/fonts.less';
@import '../../utils/spacing.less';
.daggerheart.chat {
&.action {
display: flex;
flex-direction: column;
align-items: center;
.action-section {
display: flex;
flex-direction: row;
width: 100%;
padding: 8px;
gap: 5px;
border-bottom: 1px solid @golden;
.action-img {
width: 40px;
height: 40px;
border-radius: 3px;
object-fit: cover;
}
.action-header {
display: flex;
flex-direction: column;
gap: 5px;
.title {
font-size: 20px;
color: @golden;
font-family: @font-subtitle;
margin: 0;
}
.label {
font-size: 12px;
color: @beige;
font-family: @font-body;
margin: 0;
}
}
}
.description {
color: @beige;
padding: 8px;
font-family: @font-body;
}
.ability-card-footer {
display: flex;
flex-wrap: wrap;
gap: 5px;
width: 100%;
padding: 0 8px;
button {
font-family: @font-body;
font-weight: 600;
height: 40px;
flex: 1 1 calc(50% - 5px);
&:nth-last-child(1):nth-child(odd) {
flex-basis: 100%;
}
}
.ability-card-action-cost {
margin: auto;
font-size: 1.5em;
}
}
}
}

77
styles/less/ui/chat/chat.less
View file

@ -1,31 +1,8 @@
@import '../../utils/colors.less';
@import '../../utils/fonts.less';
@import '../../utils/spacing.less';
.daggerheart.chat {
&.downtime {
display: flex;
flex-direction: column;
align-items: center;
.downtime-title-container {
display: flex;
flex-direction: column;
align-items: center;
.downtime-subtitle {
font-size: 17px;
}
}
.downtime-image {
width: 80px;
}
.action-use-button {
width: 100%;
}
}
&.resource-roll {
.reroll-message {
text-align: center;
@ -358,58 +335,6 @@
}
}
&.domain-card {
display: flex;
flex-direction: column;
align-items: center;
.domain-card-title {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
div {
font-size: 20px;
font-variant: small-caps;
font-weight: bold;
}
h2 {
width: 100%;
text-align: center;
margin: 0;
}
}
.ability-card-footer {
display: flex;
width: 100%;
margin-top: @fullMargin;
flex-wrap: wrap;
button {
border-radius: 6px;
background: @positive;
border-color: black;
flex-basis: calc(50% - 2px);
&:nth-of-type(n + 3) {
margin-top: @tinyMargin;
}
}
.ability-card-action-cost {
margin: auto;
font-size: 1.5em;
}
}
img {
width: 80px;
}
}
button {
&.inner-button {
--button-size: 1.25rem;

98
styles/less/ui/chat/downtime.less Normal file
View file

@ -0,0 +1,98 @@
@import '../../utils/colors.less';
@import '../../utils/fonts.less';
@import '../../utils/spacing.less';
.daggerheart.chat {
&.downtime {
display: flex;
flex-direction: column;
align-items: center;
.downtime-header {
display: flex;
gap: 13px;
flex-direction: row;
align-items: center;
width: 100%;
padding-left: 8px;
margin-bottom: 12px;
.profile {
width: 40px;
height: 40px;
border-radius: 50%;
object-fit: cover;
}
.header-label {
.title {
font-size: 20px;
color: @golden;
font-family: @font-subtitle;
margin: 0;
}
.label {
font-size: 12px;
color: @beige;
font-family: @font-body;
margin: 0;
}
}
}
.downtime-moves-list {
display: flex;
flex-direction: column;
gap: 5px;
.downtime-move {
width: 100%;
.downtime-label {
display: flex;
align-items: center;
gap: 5px;
border-bottom: 1px solid @golden;
margin: 0 8px;
.downtime-image {
width: 40px;
height: 40px;
border-radius: 3px;
}
.header-label {
padding: 8px;
.title {
font-size: 16px;
color: @golden;
font-family: @font-subtitle;
margin: 0;
}
.label {
font-size: 12px;
color: @beige;
font-family: @font-body;
margin: 0;
}
}
}
.description {
padding: 8px;
color: beige;
font-family: @font-body;
font-size: 14px;
}
}
.action-use-button {
width: -webkit-fill-available;
margin: 0 8px;
font-family: @font-body;
font-weight: 600;
height: 40px;
}
}
}
}

3
styles/less/ui/index.less
View file

@ -1,4 +1,7 @@
@import './chat/ability-use.less';
@import './chat/action.less';
@import './chat/chat.less';
@import './chat/downtime.less';
@import './chat/sheet.less';
@import './chat/theme-colorful.less';