Merge pull request '7128-copyStyles' (!265) from 7128-copyStyles into dev
gitea/salix-front/pipeline/head This commit looks good Details

Reviewed-on: #265
Reviewed-by: Javi Gallego <jgallego@verdnatura.es>
This commit is contained in:
Pablo Natek 2024-04-03 19:12:23 +00:00
commit ef489b74df
9 changed files with 59 additions and 30 deletions

View File

@ -284,6 +284,9 @@ defineExpose({
/>
</template>
<style lang="scss" scoped>
.q-notifications {
color: black;
}
#formModel {
max-width: 800px;
width: 100%;

View File

@ -20,12 +20,7 @@ const itemComputed = computed(() => {
});
</script>
<template>
<QItem
active-class="text-primary"
:to="{ name: itemComputed.name }"
clickable
v-ripple
>
<QItem active-class="bg-hover" :to="{ name: itemComputed.name }" clickable v-ripple>
<QItemSection avatar v-if="itemComputed.icon">
<QIcon :name="itemComputed.icon" />
</QItemSection>

View File

@ -157,7 +157,7 @@ const emit = defineEmits(['onFetch']);
<div class="icons">
<slot name="icons" :entity="entity" />
</div>
<div class="actions">
<div class="actions justify-center">
<slot name="actions" :entity="entity" />
</div>
<slot name="after" />
@ -176,22 +176,23 @@ const emit = defineEmits(['onFetch']);
.body {
background-color: var(--vn-section-color);
.text-h5 {
font-size: 20px;
padding-top: 5px;
padding-bottom: 5px;
padding-bottom: 0px;
}
.q-item {
min-height: 20px;
.link {
margin-left: 5px;
margin-left: 10px;
}
}
.vn-label-value {
display: flex;
padding: 2px 16px;
padding: 0px 16px;
.label {
color: var(--vn-label-color);
font-size: 12px;
font-size: 14px;
&:not(:has(a))::after {
content: ':';
@ -200,7 +201,7 @@ const emit = defineEmits(['onFetch']);
.value {
color: var(--vn-text-color);
font-size: 14px;
margin-left: 12px;
margin-left: 4px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@ -218,18 +219,19 @@ const emit = defineEmits(['onFetch']);
overflow: hidden;
text-overflow: ellipsis;
span {
color: $primary;
color: var(--vn-text-color);
font-weight: bold;
}
}
.subtitle {
color: var(--vn-text-color);
font-size: 16px;
margin-bottom: 15px;
margin-bottom: 2px;
}
.list-box {
.q-item__label {
color: var(--vn-label-color);
padding-bottom: 0%;
}
}
.descriptor {
@ -247,6 +249,7 @@ const emit = defineEmits(['onFetch']);
}
.actions {
margin: 0 5px;
justify-content: center !important;
}
}
</style>

View File

@ -74,7 +74,7 @@ async function fetch() {
</router-link>
<span v-else></span>
</slot>
<slot name="header" :entity="entity">
<slot name="header" :entity="entity" dense>
<VnLv :label="`${entity.id} -`" :value="entity.name" />
</slot>
<slot name="header-right">
@ -97,7 +97,6 @@ async function fetch() {
.cardSummary {
width: 100%;
.summaryHeader {
text-align: center;
font-size: 20px;
@ -132,6 +131,7 @@ async function fetch() {
padding: 7px;
font-size: 16px;
min-width: 275px;
box-shadow: none;
.vn-label-value {
display: flex;

View File

@ -14,7 +14,7 @@ onUnmounted(() => {
</script>
<template>
<QToolbar class="justify-end sticky">
<QToolbar class="bg-vn-section-color justify-end sticky">
<slot name="st-data">
<div id="st-data"></div>
</slot>
@ -24,6 +24,11 @@ onUnmounted(() => {
</slot>
</QToolbar>
</template>
<style lang="scss">
.q-toolbar {
background: var(--vn-section-color);
}
</style>
<style lang="scss" scoped>
.sticky {
position: sticky;

View File

@ -14,21 +14,15 @@ body.body--light {
.q-header .q-toolbar {
color: var(--font-color);
}
.q-card,
.q-table,
.q-table__bottom,
.q-drawer {
background-color: var(--vn-section-color);
}
}
body.body--dark {
--vn-section-color: #403c3c;
--vn-page-color: #222;
--vn-section-color: #3d3d3d;
--vn-text-color: white;
--vn-label-color: #a8a8a8;
--vn-accent-color: #424242;
background-color: #222;
background-color: var(--vn-page-color);
}
a {
@ -76,6 +70,9 @@ select:-webkit-autofill {
.bg-vn-section-color {
background-color: var(--vn-section-color);
}
.bg-hover {
background-color: #666666;
}
.color-vn-text {
color: var(--vn-text-color);
@ -118,9 +115,36 @@ select:-webkit-autofill {
content: ' *';
}
.q-chip {
.q-card,
.q-table,
.q-table__bottom,
.q-drawer {
background-color: var(--vn-section-color);
}
.q-chip,
.q-notification__message,
.q-notification__icon {
color: black;
}
.q-notification--standard.bg-negative {
background-color: #fa3939 !important;
}
.q-notification--standard.bg-positive {
background-color: #a3d131 !important;
}
.q-tooltip {
background-color: var(--vn-page-color);
color: var(--font-color);
font-size: medium;
}
.q-card__actions {
justify-content: center;
}
/* q-notification row items-stretch q-notification--standard bg-negative text-white */
input[type='number'] {
-moz-appearance: textfield;

View File

@ -22,7 +22,7 @@ $warning: #f4b974;
$success: $positive;
$alert: $negative;
$white: #fff;
$dark: #3c3b3b;
$dark: #403c3c;
// custom
$color-link: #66bfff;
$color-spacer-light: #a3a3a31f;

View File

@ -55,7 +55,7 @@ async function onSubmit() {
if (res.response?.data?.error?.code === 'REQUIRES_2FA') {
Notify.create({
message: t('login.twoFactorRequired'),
icon: 'phonelink_lock',
icon: 'phoneLink_lock',
type: 'warning',
});
params.keepLogin = keepLogin.value;

View File

@ -277,7 +277,6 @@ function navigateToRoadmapSummary(event, row) {
.route-list {
width: 100%;
}
.table-actions {
gap: 12px;
}