mirror of
https://github.com/Foundryborne/daggerheart.git
synced 2026-04-22 23:43:37 +02:00
Merged with v14-Dev
This commit is contained in:
commit
8d84b8da48
70 changed files with 1076 additions and 936 deletions
|
|
@ -204,6 +204,44 @@
|
|||
}
|
||||
}
|
||||
|
||||
.modifications-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
|
||||
.trait-bonuses-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
|
||||
.bonus-separator {
|
||||
background: light-dark(@dark-blue, @golden);
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
.trait-bonus-container {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
|
||||
.trait-card {
|
||||
border: 1px solid light-dark(@dark-blue, @golden);
|
||||
border-radius: 6px;
|
||||
padding: 2px;
|
||||
opacity: 0.4;
|
||||
flex: 1;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
|
||||
&.selected {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 8px;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -240,12 +240,16 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
gap: 8px;
|
||||
gap: 2px;
|
||||
|
||||
.trait-container {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
span {
|
||||
font-size: var(--font-size-10);
|
||||
}
|
||||
width: 65px;
|
||||
height: 65px;
|
||||
background: url(../assets/svg/trait-shield.svg) no-repeat;
|
||||
background-size: 100%;
|
||||
|
||||
div {
|
||||
filter: drop-shadow(0 0 3px black);
|
||||
|
|
|
|||
|
|
@ -20,16 +20,22 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
gap: 8px;
|
||||
gap: 2px;
|
||||
|
||||
.trait-container {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
width: 65px;
|
||||
height: 65px;
|
||||
background: url(../assets/svg/trait-shield.svg) no-repeat;
|
||||
background-size: 100%;
|
||||
padding-top: 4px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
span {
|
||||
font-size: var(--font-size-10);
|
||||
}
|
||||
|
||||
div {
|
||||
filter: drop-shadow(0 0 3px black);
|
||||
text-shadow: 0 0 3px black;
|
||||
|
|
|
|||
|
|
@ -133,4 +133,18 @@
|
|||
height: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
.deletable-row {
|
||||
display: flex;
|
||||
align-items: end;
|
||||
gap: 8px;
|
||||
|
||||
input {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
a {
|
||||
padding-bottom: 7px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -384,6 +384,15 @@
|
|||
justify-content: center;
|
||||
width: 15px;
|
||||
}
|
||||
&.has-minus:before {
|
||||
content: '-';
|
||||
font-size: var(--font-size-20);
|
||||
grid-area: c;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -15,17 +15,17 @@
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
.menu-refresh-container {
|
||||
.menu-options-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
|
||||
.menu-refresh-inner-container {
|
||||
.menu-options-inner-container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 8px;
|
||||
|
||||
.experience-chip {
|
||||
.option-chip {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 5px;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
@import './tooltip/sheet.less';
|
||||
@import './tooltip/tooltip.less';
|
||||
@import './tooltip/armorManagement.less';
|
||||
@import './tooltip/battlepoints.less';
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: start;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
gap: 0px;
|
||||
|
||||
|
|
|
|||
129
styles/less/ux/tooltip/sheet.less
Normal file
129
styles/less/ux/tooltip/sheet.less
Normal file
|
|
@ -0,0 +1,129 @@
|
|||
#tooltip:has(div.daggerheart.dh-style.tooltip.card-style),
|
||||
aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip),
|
||||
#tooltip.bordered-tooltip {
|
||||
.tooltip-title {
|
||||
font-size: var(--font-size-20);
|
||||
color: light-dark(@dark-blue, @golden);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.tooltip-description {
|
||||
font-style: inherit;
|
||||
text-align: inherit;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
}
|
||||
}
|
||||
|
||||
.tooltip-separator {
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.tooltip-tags {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
position: relative;
|
||||
max-height: 150px;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: light-dark(@dark-blue, @golden) transparent;
|
||||
|
||||
.tooltip-tag {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-direction: column;
|
||||
|
||||
.tooltip-tag-label-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tags {
|
||||
display: flex;
|
||||
gap: 5px 10px;
|
||||
padding-bottom: 16px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
|
||||
&.advantages {
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
padding-bottom: 16px;
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
}
|
||||
|
||||
.tag {
|
||||
background: @green-10;
|
||||
color: @green;
|
||||
border-color: @green;
|
||||
}
|
||||
}
|
||||
|
||||
.tag {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 3px 5px;
|
||||
font-size: var(--font-size-12);
|
||||
font: @font-body;
|
||||
|
||||
background: light-dark(@dark-15, @beige-15);
|
||||
border: 1px solid light-dark(@dark, @beige);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: var(--font-size-12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -13,13 +13,6 @@ aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip.card-style) {
|
|||
outline: 1px solid light-dark(@dark-80, @beige-80);
|
||||
box-shadow: 0 0 25px rgba(0, 0, 0, 0.8);
|
||||
|
||||
.tooltip-title {
|
||||
font-size: var(--font-size-20);
|
||||
color: light-dark(@dark-blue, @golden);
|
||||
font-weight: 700;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.tooltip-subtitle {
|
||||
margin: 0;
|
||||
}
|
||||
|
|
@ -80,110 +73,6 @@ aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip.card-style) {
|
|||
}
|
||||
}
|
||||
|
||||
.tooltip-tags {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
position: relative;
|
||||
padding-top: 10px;
|
||||
max-height: 150px;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: light-dark(@dark-blue, @golden) transparent;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.tooltip-tag {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-direction: column;
|
||||
|
||||
.tooltip-tag-label-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tags {
|
||||
display: flex;
|
||||
gap: 5px 10px;
|
||||
padding-bottom: 16px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
|
||||
&.advantages {
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
padding-bottom: 16px;
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
}
|
||||
|
||||
.tag {
|
||||
background: @green-10;
|
||||
color: @green;
|
||||
border-color: @green;
|
||||
}
|
||||
}
|
||||
|
||||
.tag {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 3px 5px;
|
||||
font-size: var(--font-size-12);
|
||||
font: @font-body;
|
||||
|
||||
background: light-dark(@dark-15, @beige-15);
|
||||
border: 1px solid light-dark(@dark, @beige);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: var(--font-size-12);
|
||||
}
|
||||
}
|
||||
|
||||
.item-icons-list {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue