jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #2466 from Safelite/CASH-556-calendar-style-updates

Browse source 
CASH-313 calendar style updates.
This commit is contained in:
bmauger 2025-04-29 16:09:47 -04:00 committed by GitHub
commit 1a773c680c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 48 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
src/digital-components/date-picker/date-picker.vue
View file

@ -851,7 +851,7 @@ export default {
} }
.calendar-grid-container { .calendar-grid-container {
margin: 0 auto 2rem auto; margin: 0 auto 2rem auto;
max-width: 414px; max-width: 400px;
position: relative; position: relative;
transition: transition:
height ease 2s, height ease 2s,
@ -860,7 +860,10 @@ export default {
grid-template-columns: repeat(7, 1fr); grid-template-columns: repeat(7, 1fr);
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 0 0.75rem; padding: 0;
@include media-breakpoint-up(md) {
padding: 0 0.75rem;
}
opacity: 1; opacity: 1;
.grid-item { .grid-item {
@ -1028,10 +1031,14 @@ export default {
&.selectable-day { &.selectable-day {
label { label {
background-color: $blue-100; background-color: $blue-100;
min-width: 2.5rem; min-width: 2.75rem;
width: 2.5rem; width: 2.75rem;
border-radius: 50%; border-radius: 50%;
cursor: pointer; cursor: pointer;
@include media-breakpoint-up(md) {
min-width: 3rem;
width: 3rem;
}
} }
} }
&.unavailable-day { &.unavailable-day {
@ -1208,16 +1215,20 @@ export default {
label { label {
color: $black; color: $black;
background-color: $blue-100; background-color: $blue-100;
min-width: 2.5rem; min-width: 2.75rem;
width: 2.5rem; width: 2.75rem;
border-radius: 0.25rem; border-radius: 0.25rem;
@include media-breakpoint-up(md) {
min-width: 3rem;
width: 3rem;
}
} }
} }
&.current-day { &.current-day {
label:after { label:after {
margin-top: 0.2rem; margin-top: -0.25rem;
position: relative; position: relative;
top: 0; top: 0.5rem;
} }
} }
} }

52
src/layouts/schedule/schedule.vue
View file

@ -727,32 +727,38 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
.page-schedule { .container-fluid {
.text-link-small { &.page-schedule {
a, padding: 0 1rem;
.btn-link { .text-link-small {
width: auto; a,
margin: 0 auto; .btn-link {
height: auto; width: auto;
font-size: 0.875rem; margin: 0 auto;
line-height: 1.75; height: auto;
padding: 0; font-size: 0.875rem;
border-radius: 0; line-height: 1.75;
&:focus { padding: 0;
outline: 1px solid $blue; border-radius: 0;
} &:focus {
@include media-breakpoint-up(md) { outline: 1px solid $blue;
font-size: 1rem; }
@include media-breakpoint-up(md) {
font-size: 1rem;
}
} }
} }
} .funnel-sub-header {
.funnel-sub-header { h5.dark-header {
h5.dark-header { margin-bottom: 0.25rem;
margin-bottom: 0.25rem; }
}
.change-location a {
font-family: AvertaSemibold;
}
.time-slots-question {
padding: 0 0.75rem;
} }
}
.change-location a {
font-family: AvertaSemibold;
} }
} }
</style> </style>