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

visual adjustments

This commit is contained in:
William Buezas 2024-04-05 08:04:34 -03:00
parent cb55115cd2
commit dae08c322d
2 changed files with 13 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/pages/Worker/Card/WorkerCalendar.vue
View File

@ -138,7 +138,7 @@ watch([year, businessFk], () => refreshData());
auto-load auto-load
/> />
<template v-if="stateStore.isHeaderMounted()"> <template v-if="stateStore.isHeaderMounted()">
<!-- <Teleport to="#actions-append"> <Teleport to="#actions-append">
<div class="row q-gutter-x-sm"> <div class="row q-gutter-x-sm">
<QBtn <QBtn
flat flat
@ -152,7 +152,7 @@ watch([year, businessFk], () => refreshData());
</QTooltip> </QTooltip>
</QBtn> </QBtn>
</div> </div>
</Teleport> --> </Teleport>
</template> </template>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
@ -170,13 +170,13 @@ watch([year, businessFk], () => refreshData());
{{ t('Autonomous worker') }} {{ t('Autonomous worker') }}
</QCardSection> </QCardSection>
</QCard> </QCard>
<QCard v-else class="full-width q-pa-xl"> <QCard v-else class="full-width">
<QIcon <QIcon
v-if="isSubordinate" v-if="isSubordinate"
name="info" name="info"
size="sm" size="sm"
class="absolute" class="absolute"
style="top: 16px; right: 16px" style="top: 14px; right: 14px"
> >
<QTooltip max-width="250px"> <QTooltip max-width="250px">
{{ {{
@ -208,18 +208,20 @@ watch([year, businessFk], () => refreshData());
.calendar-container { .calendar-container {
display: grid; display: grid;
gap: 32px; gap: 32px;
grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-columns: repeat(3, minmax(0, 320px));
padding: 40px;
justify-content: center;
} }
@media (max-width: $breakpoint-md) { @media (max-width: $breakpoint-md) {
.calendar-container { .calendar-container {
grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-columns: repeat(2, minmax(0, 320px));
} }
} }
@media (max-width: $breakpoint-xs) { @media (max-width: $breakpoint-xs) {
.calendar-container { .calendar-container {
grid-template-columns: repeat(1, minmax(0, 1fr)); grid-template-columns: repeat(1, minmax(0, 320px));
} }
} }
</style> </style>

8
src/pages/Worker/Card/WorkerCalendarItem.vue
View File

@ -150,7 +150,7 @@ watch(props.year, (newValue) => {
</script> </script>
<template> <template>
<QCalendarMonthWrapper style="height: 200px"> <QCalendarMonthWrapper style="height: 200px" class="outline">
<template #header> <template #header>
<span class="full-width text-center text-body1 q-py-sm">{{ <span class="full-width text-center text-body1 q-py-sm">{{
weekdayStore.getLocaleMonths[$props.month - 1].locale weekdayStore.getLocaleMonths[$props.month - 1].locale
@ -199,7 +199,7 @@ watch(props.year, (newValue) => {
.q-calendar-month__day--content { .q-calendar-month__day--content {
position: absolute; position: absolute;
top: 0; top: 1;
left: 0; left: 0;
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -214,8 +214,8 @@ watch(props.year, (newValue) => {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: 20px; width: 2em;
height: 20px; height: 2em;
font-size: 0.75em; font-size: 0.75em;
line-height: 1.715em; line-height: 1.715em;
border-radius: 50%; border-radius: 50%;