wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

feat(light theme): refs #7001 add light theme

This commit is contained in:
Pablo Natek 2024-03-19 11:15:54 +01:00
parent 2386090c15
commit 22eef14bb3
26 changed files with 64 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/LeftMenu.vue
View File

@ -234,6 +234,6 @@ async function togglePinned(item, event) {
max-width: 256px;
}
.header {
color: #999999;
color: var(--vn-label-color);
}
</style>

2
src/components/UserPanel.vue
View File

@ -87,7 +87,7 @@ function copyUserToken() {
</script>
<template>
<QMenu anchor="bottom left">
<QMenu anchor="bottom left" class="bg-vn-section-color">
<div class="row no-wrap q-pa-md">
<div class="column panel">
<div class="text-h6 q-mb-md">

2
src/components/common/VnLog.vue
View File

@ -837,7 +837,7 @@ setLogTree();
max-width: 400px;
& > .header {
color: $dark;
color: var(--vn-section-color);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

6
src/components/common/VnTitle.vue
View File

@ -8,7 +8,7 @@ const $props = defineProps({
<template>
<div class="titleBox">
<div class="header-link">
<a :href="$props.url" :class="$props.url ? 'link' : 'normalTitle'">
<a :href="$props.url" :class="$props.url ? 'link' : 'color-vn-text'">
{{ $props.text }}
<QIcon v-if="url" :name="$props.icon" />
</a>
@ -16,10 +16,6 @@ const $props = defineProps({
</div>
</template>
<style scoped lang="scss">
.normalTitle {
color: whitesmoke;
cursor: auto;
}
a {
font-size: large;
}

7
src/components/ui/VnSearchbar.vue
View File

@ -163,7 +163,12 @@ async function search() {
}
#searchbar {
.q-field--standout.q-field--highlighted .q-field__control {
background-color: var(--vn-text-color);
background-color: white;
color: black;
.q-field__native,
.q-icon {
color: black !important;
}
}
}
</style>

2
src/components/ui/VnSubToolbar.vue
View File

@ -14,7 +14,7 @@ onUnmounted(() => {
</script>
<template>
<QToolbar class="bg-vn-dark justify-end sticky">
<QToolbar class="justify-end sticky">
<slot name="st-data">
<div id="st-data"></div>
</slot>

30
src/css/app.scss
View File

@ -5,21 +5,30 @@ body.body--light {
--font-color: black;
--vn-section-color: #e0e0e0;
--vn-page-color: #ffffff;
background-color: #ffffff;
.q-header .q-toolbar {
color: var(--font-color);
}
--vn-text-color: var(--font-color);
--vn-label-color: #5f5f5f;
--vn-accent-color: #e7e3e3;
background-color: var(--vn-page-color);
.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;
background-color: #222;
--vn-text-color: white;
--vn-label-color: #a8a8a8;
--vn-accent-color: #424242;
background-color: #222;
}
a {
@ -34,6 +43,9 @@ a {
.tx-color-link {
color: $color-link !important;
}
.tx-color-font {
color: $color-link !important;
}
.header-link {
color: $color-link !important;
@ -61,11 +73,7 @@ select:-webkit-autofill {
background-clip: text !important;
}
.bg-vn-dark {
background-color: var(--vn-section-color);
}
.bg-vn-dark {
.bg-vn-section-color {
background-color: var(--vn-section-color);
}
@ -98,7 +106,7 @@ select:-webkit-autofill {
.vn-table-separation-row {
height: 16px !important;
background-color: var(--vn-gray) !important;
background-color: var(--vn-section-color) !important;
}
/* Estilo para el asterisco en campos requeridos */

2
src/layouts/MainLayout.vue
View File

@ -11,5 +11,3 @@ const quasar = useQuasar();
<QFooter v-if="quasar.platform.is.mobile"></QFooter>
</QLayout>
</template>
<style lang="scss" scoped></style>

2
src/layouts/OutLayout.vue
View File

@ -40,7 +40,7 @@ const langs = ['en', 'es'];
<template>
<QLayout view="hHh LpR fFf">
<QHeader reveal class="bg-vn-dark">
<QHeader reveal class="bg-vn-section-color">
<QToolbar class="justify-end">
<QBtn
id="switchLanguage"

1
src/pages/Claim/ClaimList.vue
View File

@ -122,7 +122,6 @@ function navigate(event, id) {
<QBtn
:label="t('globals.description')"
@click.stop
class="bg-vn-dark"
outline
style="margin-top: 15px"
>

1
src/pages/Customer/CustomerList.vue
View File

@ -84,7 +84,6 @@ const redirectToCreateView = () => {
<QBtn
:label="t('components.smartCard.openCard')"
@click.stop="navigate(row.id)"
class="bg-vn-dark"
outline
/>
<QBtn

2
src/pages/Customer/Defaulter/CustomerDefaulter.vue
View File

@ -207,7 +207,7 @@ const refreshData = () => {
</QScrollArea>
</QDrawer>
<VnSubToolbar class="bg-vn-dark">
<VnSubToolbar>
<template #st-data>
<CustomerBalanceDueTotal :amount="balanceDueTotal" />
<div class="flex items-center q-ml-lg">

6
src/pages/Dashboard/DashboardMain.vue
View File

@ -21,7 +21,7 @@ const pinnedModules = computed(() => navigation.getPinnedModules());
:width="256"
:breakpoint="1000"
>
<QScrollArea class="fit text-grey-8">
<QScrollArea class="fit">
<LeftMenu />
</QScrollArea>
</QDrawer>
@ -67,6 +67,10 @@ const pinnedModules = computed(() => navigation.getPinnedModules());
</template>
<style lang="scss" scoped>
.left-menu {
color: var(--vn-font-color);
}
.flex-container {
display: flex;
flex-wrap: wrap;

2
src/pages/Entry/EntryLatestBuys.vue
View File

@ -636,7 +636,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
auto-load
@on-fetch="(data) => (intrastatOptions = data)"
/>
<QToolbar class="bg-vn-dark justify-end">
<QToolbar class="justify-end">
<div id="st-data">
<TableVisibleColumns
:all-columns="allColumnNames"

1
src/pages/InvoiceIn/InvoiceInList.vue
View File

@ -112,7 +112,6 @@ function navigate(id) {
<QBtn
:label="t('components.smartCard.openCard')"
@click.stop="navigate(row.id)"
class="bg-vn-dark"
outline
type="reset"
/>

36
src/pages/InvoiceOut/InvoiceOutList.vue
View File

@ -123,7 +123,7 @@ const downloadCsv = () => {
url="InvoiceOuts/filter"
>
<template #body="{ rows }">
<VnSubToolbar class="bg-vn-dark justify-end">
<VnSubToolbar class="justify-end">
<template #st-actions>
<QBtn
@click="downloadCsv()"
@ -132,39 +132,6 @@ const downloadCsv = () => {
:disable="selectedCards.size === 0"
:label="t('globals.download')"
/>
<!-- <QBtnDropdown
class="q-mr-xl"
color="primary"
:disable="!manageCheckboxes && arrayElements.length < 1"
:label="t('globals.download')"
v-else
>
<QList>
<QItem clickable v-close-popup @click="downloadCsv(rows)">
<QItemSection>
<QItemLabel>
{{
t('globals.allRows', {
numberRows: rows.length,
})
}}
</QItemLabel>
</QItemSection>
</QItem>
<QItem clickable v-close-popup @click="downloadCsv(rows)">
<QItemSection>
<QItemLabel>
{{
t('globals.selectRows', {
numberRows: rows.length,
})
}}
</QItemLabel>
</QItemSection>
</QItem>
</QList>
</QBtnDropdown> -->
<QCheckbox
left-label
:label="t('globals.markAll')"
@ -220,7 +187,6 @@ const downloadCsv = () => {
<QBtn
:label="t('components.smartCard.openCard')"
@click.stop="navigate(row.id)"
class="bg-vn-dark"
outline
type="reset"
/>

2
src/pages/Order/Card/OrderCatalogItem.vue
View File

@ -163,7 +163,7 @@ const dialog = ref(null);
position: absolute;
bottom: 12px;
right: 12px;
background: linear-gradient($dark, $primary);
background: linear-gradient(var(--vn-section-color), $primary);
border-radius: 50%;
width: 40px;
height: 40px;

2
src/pages/Route/RouteList.vue
View File

@ -224,7 +224,7 @@ const openTicketsDialog = (id) => {
<FetchData url="AgencyModes" @on-fetch="(data) => (agencyList = data)" auto-load />
<FetchData url="Vehicles" @on-fetch="(data) => (vehicleList = data)" auto-load />
<QPage class="column items-center">
<VnSubToolbar class="bg-vn-dark justify-end">
<VnSubToolbar class="justify-end">
<template #st-actions>
<QBtn
icon="vn:clone"

17
src/pages/Route/RouteRoadmap.vue
View File

@ -13,9 +13,9 @@ import RoadmapFilter from 'pages/Route/Roadmap/RoadmapFilter.vue';
import VnConfirm from 'components/ui/VnConfirm.vue';
import axios from 'axios';
import VnInputDate from 'components/common/VnInputDate.vue';
import {useSummaryDialog} from "composables/useSummaryDialog";
import RoadmapSummary from "pages/Route/Roadmap/RoadmapSummary.vue";
import {useRouter} from "vue-router";
import { useSummaryDialog } from 'composables/useSummaryDialog';
import RoadmapSummary from 'pages/Route/Roadmap/RoadmapSummary.vue';
import { useRouter } from 'vue-router';
const stateStore = useStateStore();
const { t } = useI18n();
@ -128,7 +128,7 @@ function confirmRemove() {
}
function navigateToRoadmapSummary(event, row) {
router.push({ name: 'RoadmapSummary', params: { id: row.id } })
router.push({ name: 'RoadmapSummary', params: { id: row.id } });
}
</script>
@ -182,7 +182,7 @@ function navigateToRoadmapSummary(event, row) {
</QCard>
</QDialog>
<QPage class="column items-center">
<VnSubToolbar class="bg-vn-dark justify-end">
<VnSubToolbar class="justify-end">
<template #st-actions>
<QBtn
icon="vn:clone"
@ -244,7 +244,12 @@ function navigateToRoadmapSummary(event, row) {
name="preview"
size="xs"
color="primary"
@click.stop="viewSummary(props?.row?.id, RoadmapSummary)"
@click.stop="
viewSummary(
props?.row?.id,
RoadmapSummary
)
"
class="cursor-pointer"
>
<QTooltip>{{ t('Preview') }}</QTooltip>

6
src/pages/Route/RouteTickets.vue
View File

@ -15,8 +15,8 @@ import VnConfirm from 'components/ui/VnConfirm.vue';
import FetchData from 'components/FetchData.vue';
import { openBuscaman } from 'src/utils/buscaman';
import SendSmsDialog from 'components/common/SendSmsDialog.vue';
import RouteSearchbar from "pages/Route/Card/RouteSearchbar.vue";
import {useStateStore} from "stores/useStateStore";
import RouteSearchbar from 'pages/Route/Card/RouteSearchbar.vue';
import { useStateStore } from 'stores/useStateStore';
const { t } = useI18n();
const quasar = useQuasar();
@ -257,7 +257,7 @@ const openSmsDialog = async () => {
</QCard>
</QDialog>
<QPage class="column items-center">
<QToolbar class="bg-vn-dark justify-end">
<QToolbar class="justify-end">
<div id="st-actions" class="q-pa-sm">
<QBtn icon="vn:wand" color="primary" class="q-mr-sm" @click="sortRoutes">
<QTooltip>{{ t('Sort routes') }}</QTooltip>

7
src/pages/Shelving/Card/ShelvingDescriptorMenu.vue
View File

@ -17,15 +17,14 @@ const quasar = useQuasar();
const { t } = useI18n();
function confirmRemove() {
quasar
.dialog({
quasar.dialog({
component: VnConfirm,
componentProps: {
title: t('Confirm deletion'),
message: t('Are you sure you want to delete this shelving?'),
promise: remove
promise: remove,
},
})
});
}
async function remove() {

2
src/pages/Travel/ExtraCommunity.vue
View File

@ -430,7 +430,7 @@ const handleDragScroll = (event) => {
/>
</Teleport>
</template>
<VnSubToolbar class="bg-vn-dark justify-end">
<VnSubToolbar class="justify-end">
<template #st-actions>
<QBtn
color="primary"

2
src/pages/Travel/TravelList.vue
View File

@ -141,13 +141,11 @@ onMounted(async () => {
<QBtn
:label="t('components.smartCard.clone')"
@click.stop="cloneTravel(row)"
class="bg-vn-dark"
outline
/>
<QBtn
:label="t('addEntry')"
@click.stop="redirectCreateEntryView(row)"
class="bg-vn-dark"
outline
style="margin-top: 15px"
/>

1
src/pages/Wagon/Type/WagonTypeList.vue
View File

@ -61,7 +61,6 @@ async function remove(row) {
<QBtn
:label="t('components.smartCard.openCard')"
@click.stop="navigate(row.id)"
class="bg-vn-dark"
outline
/>
<QBtn

1
src/pages/Wagon/WagonList.vue
View File

@ -80,7 +80,6 @@ async function remove(row) {
<QBtn
:label="t('components.smartCard.openCard')"
@click.stop="navigate(row.id)"
class="bg-vn-dark"
outline
/>
<QBtn

1
src/pages/Worker/WorkerList.vue
View File

@ -82,7 +82,6 @@ const redirectToCreateView = () => {
<QBtn
:label="t('components.smartCard.openCard')"
@click.stop="navigate(row.id)"
class="bg-vn-dark"
outline
/>
<QBtn