mirror of
https://github.com/Foundryborne/daggerheart.git
synced 2026-04-22 23:43:37 +02:00
Tighten appearance of ability use chat messages (#1821)
This commit is contained in:
parent
3eda3c4c05
commit
7a4f9d7bc8
2 changed files with 32 additions and 26 deletions
|
|
@ -6,12 +6,6 @@
|
||||||
#interface.theme-light {
|
#interface.theme-light {
|
||||||
.daggerheart.chat.domain-card {
|
.daggerheart.chat.domain-card {
|
||||||
.domain-card-move .domain-card-header {
|
.domain-card-move .domain-card-header {
|
||||||
border-bottom: 1px solid @dark-blue;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background: @dark-blue-10;
|
|
||||||
}
|
|
||||||
|
|
||||||
.domain-label {
|
.domain-label {
|
||||||
.title {
|
.title {
|
||||||
color: @dark-blue;
|
color: @dark-blue;
|
||||||
|
|
@ -29,6 +23,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&:has(.description) .domain-card-move .domain-card-header {
|
||||||
|
border-bottom: 1px solid @dark-blue;
|
||||||
|
&:hover {
|
||||||
|
background: @dark-blue-10;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.description {
|
.description {
|
||||||
color: @dark;
|
color: @dark;
|
||||||
}
|
}
|
||||||
|
|
@ -43,7 +44,7 @@
|
||||||
|
|
||||||
.card-img {
|
.card-img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 200px;
|
height: 180px;
|
||||||
mask-image: linear-gradient(0deg, transparent 0%, black 10%, black 90%, transparent 100%);
|
mask-image: linear-gradient(0deg, transparent 0%, black 10%, black 90%, transparent 100%);
|
||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
}
|
}
|
||||||
|
|
@ -68,23 +69,12 @@
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin: 8px;
|
margin: 8px;
|
||||||
padding-bottom: 5px;
|
|
||||||
width: -webkit-fill-available;
|
|
||||||
gap: 5px;
|
gap: 5px;
|
||||||
border-bottom: 1px solid @golden;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background: @golden-10;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.domain-label {
|
.domain-label {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-bottom: 5px;
|
|
||||||
width: -webkit-fill-available;
|
|
||||||
gap: 5px;
|
gap: 5px;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
|
|
@ -95,7 +85,7 @@
|
||||||
|
|
||||||
.tags {
|
.tags {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 10px;
|
gap: 4px;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
|
||||||
.tag {
|
.tag {
|
||||||
|
|
@ -116,6 +106,16 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&:has(.description) .domain-card-move .domain-card-header {
|
||||||
|
border-bottom: 1px solid @golden;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
&:hover {
|
||||||
|
background: @golden-10;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.description {
|
.description {
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,15 +4,21 @@
|
||||||
<summary class="domain-card-header">
|
<summary class="domain-card-header">
|
||||||
<div class="domain-label">
|
<div class="domain-label">
|
||||||
<h2 class="title">{{item.name}}</h2>
|
<h2 class="title">{{item.name}}</h2>
|
||||||
|
{{#if item.tags}}
|
||||||
<ul class="tags">
|
<ul class="tags">
|
||||||
{{#each item.tags as |tag|}}
|
{{#each item.tags as |tag|}}
|
||||||
<li class="tag"><span>{{tag}}</span></li>
|
<li class="tag"><span>{{tag}}</span></li>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
|
{{/if}}
|
||||||
</div>
|
</div>
|
||||||
|
{{#if description}}
|
||||||
<i class="fa-solid fa-chevron-down"></i>
|
<i class="fa-solid fa-chevron-down"></i>
|
||||||
|
{{/if}}
|
||||||
</summary>
|
</summary>
|
||||||
|
{{#if description}}
|
||||||
<div class="description">{{{description}}}</div>
|
<div class="description">{{{description}}}</div>
|
||||||
|
{{/if}}
|
||||||
</details>
|
</details>
|
||||||
<footer class="ability-card-footer">
|
<footer class="ability-card-footer">
|
||||||
{{#each actions as |action|}}
|
{{#each actions as |action|}}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue