mirror of
https://github.com/Foundryborne/daggerheart.git
synced 2026-06-05 20:34:15 +02:00
Minor visual tweaks to daggerheart setting dialogs (#1905)
This commit is contained in:
parent
10a608a1a5
commit
2f589c1b8e
4 changed files with 80 additions and 60 deletions
|
|
@ -7,12 +7,12 @@
|
|||
input[type='text'],
|
||||
input[type='number'],
|
||||
textarea,
|
||||
file-picker,
|
||||
.input[contenteditable] {
|
||||
background: light-dark(transparent, transparent);
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 4px 30px @soft-shadow;
|
||||
backdrop-filter: blur(9.5px);
|
||||
-webkit-backdrop-filter: blur(9.5px);
|
||||
outline: 2px solid transparent;
|
||||
color: light-dark(@dark-blue, @golden);
|
||||
border: 1px solid light-dark(@dark, @beige);
|
||||
|
|
@ -98,7 +98,7 @@
|
|||
color: light-dark(@dark, @beige);
|
||||
}
|
||||
|
||||
button:where(:not(.plain)) {
|
||||
button:where(:not(.plain, color-picker *, file-picker *)) {
|
||||
background: light-dark(transparent, @golden);
|
||||
border: 1px solid light-dark(@dark-blue, @dark-blue);
|
||||
color: light-dark(@dark-blue, @dark-blue);
|
||||
|
|
@ -252,6 +252,15 @@
|
|||
text-shadow: 0 0 1px currentColor, 0 0 1px currentColor, 0 0 8px light-dark(@dark-blue, @golden);
|
||||
}
|
||||
|
||||
file-picker, color-picker {
|
||||
> input[type=text] {
|
||||
background: transparent;
|
||||
border: none;
|
||||
outline: none;
|
||||
backdrop-filter: unset;
|
||||
}
|
||||
}
|
||||
|
||||
fieldset {
|
||||
align-items: center;
|
||||
margin-top: 5px;
|
||||
|
|
@ -597,59 +606,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.application.setting.dh-style {
|
||||
h2,
|
||||
h3,
|
||||
h4 {
|
||||
margin: 8px 0 4px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 8px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
|
||||
button {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.form-group {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 0.25rem 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
|
||||
label {
|
||||
font-size: var(--font-size-14);
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.form-fields {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&.setting-two-values {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 0.25rem 0.5rem;
|
||||
|
||||
.form-group {
|
||||
justify-content: end;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.hint {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.system-daggerheart {
|
||||
.tagify {
|
||||
background: light-dark(transparent, transparent);
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
.resource-icons-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
|
||||
.resource-icon-container {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,67 @@
|
|||
@import '../../utils/colors.less';
|
||||
|
||||
.daggerheart.dh-style.setting {
|
||||
--color-form-label: var(--color-text-primary);
|
||||
|
||||
h2,
|
||||
h3,
|
||||
h4 {
|
||||
margin: 8px 0 4px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 8px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
|
||||
button {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.standard-form {
|
||||
gap: var(--spacer-8);
|
||||
.form-group .form-fields {
|
||||
width: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.form-group {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 0.25rem 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
|
||||
label {
|
||||
font-size: var(--font-size-14);
|
||||
font-weight: normal;
|
||||
line-height: var(--input-height);
|
||||
}
|
||||
|
||||
.form-fields {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&.setting-two-values {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 0.25rem 0.5rem;
|
||||
|
||||
.form-group {
|
||||
justify-content: end;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.hint {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fieldset {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
@ -19,7 +80,10 @@
|
|||
&.three-columns {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
gap: 2px;
|
||||
gap: 4px;
|
||||
.form-group label {
|
||||
line-height: unset;
|
||||
}
|
||||
}
|
||||
|
||||
&.six-columns {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div>
|
||||
<div class="standard-form">
|
||||
{{formGroup settingFields.schema.fields.hideObserverPermissionInChat value=settingFields._source.hideObserverPermissionInChat localize=true}}
|
||||
{{formGroup settingFields.schema.fields.hidePartyStats value=settingFields._source.hidePartyStats localize=true}}
|
||||
</div>
|
||||
{{formGroup settingFields.schema.fields.hidePartyStats value=settingFields._source.hidePartyStats localize=true}}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue