feat: modern theme stuff like rounded corners and card gradient (#3766)

Co-authored-by: Vlad Stan <stan.v.vlad@gmail.com>
This commit is contained in:
Arc
2026-02-25 07:54:14 +01:00
committed by dni ⚡
co-authored by Vlad Stan
parent 4894b70bad
commit 130f4fd0bc
13 changed files with 431 additions and 16 deletions
@@ -257,12 +257,50 @@
>
</q-input>
</div>
<div class="col-12 col-sm-6 col-lg-3">
</div>
<div class="row q-col-gutter-md q-mb-md">
<div class="col-12 col-sm-6 col-lg-2">
<q-toggle
type="bool"
v-model="formData.lnbits_default_gradient"
color="primary"
label="Gradient Background"
:label="$t('gradient_background')"
>
</q-toggle>
</div>
<div class="col-12 col-sm-6 col-lg-2">
<q-toggle
type="bool"
v-model="formData.lnbits_default_dark"
color="primary"
:label="$t('toggle_darkmode')"
>
</q-toggle>
</div>
<div class="col-12 col-sm-6 col-lg-2">
<q-toggle
type="bool"
v-model="formData.lnbits_default_card_rounded"
color="primary"
:label="$t('rounded_ui')"
>
</q-toggle>
</div>
<div class="col-12 col-sm-6 col-lg-2">
<q-toggle
type="bool"
v-model="formData.lnbits_default_card_gradient"
color="primary"
:label="$t('card_gradient')"
>
</q-toggle>
</div>
<div class="col-12 col-sm-6 col-lg-2">
<q-toggle
type="bool"
v-model="formData.lnbits_default_card_shadow"
color="primary"
:label="$t('card_shadow')"
>
</q-toggle>
</div>
+64 -3
View File
@@ -465,6 +465,69 @@
</q-toggle>
</div>
</div>
<div class="row q-mb-md">
<div class="col-4">
<span v-text="$t('rounded_ui')"></span>
</div>
<div class="col-8">
<q-toggle
dense
flat
round
icon="rounded_corner"
v-model="g.cardRoundedChoice"
@update:model-value="
siteCustomisationChanged({cardRoundedChoice: $event})
"
>
<q-tooltip
><span v-text="$t('toggle_rounded_ui')"></span
></q-tooltip>
</q-toggle>
</div>
</div>
<div class="row q-mb-md">
<div class="col-4">
<span v-text="$t('card_gradient')"></span>
</div>
<div class="col-8">
<q-toggle
dense
flat
round
icon="gradient"
v-model="g.cardGradientChoice"
@update:model-value="
siteCustomisationChanged({cardGradientChoice: $event})
"
>
<q-tooltip
><span v-text="$t('toggle_card_gradient')"></span
></q-tooltip>
</q-toggle>
</div>
</div>
<div class="row q-mb-md">
<div class="col-4">
<span v-text="$t('card_shadow')"></span>
</div>
<div class="col-8">
<q-toggle
dense
flat
round
icon="blur_on"
v-model="g.cardShadowChoice"
@update:model-value="
siteCustomisationChanged({cardShadowChoice: $event})
"
>
<q-tooltip
><span v-text="$t('toggle_card_shadow')"></span
></q-tooltip>
</q-toggle>
</div>
</div>
<div class="row q-mb-md">
<div class="col-4">
@@ -539,9 +602,7 @@
</div>
<q-card-section>
<q-btn
@click="
siteCustomisationChanged(defaultSiteCustomisation)
"
@click="resetThemeDefaults"
:label="$t('reset_defaults')"
filled
color="primary"