diff --git a/frontend/src/views/apps/SkyRideApp.vue b/frontend/src/views/apps/SkyRideApp.vue index d7968d7..9903bac 100644 --- a/frontend/src/views/apps/SkyRideApp.vue +++ b/frontend/src/views/apps/SkyRideApp.vue @@ -733,6 +733,7 @@ onBeforeUnmount(() => { @@ -1810,13 +1811,14 @@ onBeforeUnmount(() => { - + { > - {{ phone.t('Apps.skyride.savedPlaces') }} - + {{ + phone.t('Apps.skyride.savedPlaces') + }} + { color: var(--ride-text); } +.skyride-navbar :deep(.skyride-navbar__title) { + color: var(--ride-text); + font-size: 18px; + font-weight: 700; + line-height: 20px; + letter-spacing: -0.25px; +} + +.skyride-navbar :deep(.skyride-navbar__title > div) { + margin-top: 1px; + color: var(--ride-muted); + font-size: 12px; + font-weight: 600; + line-height: 14px; + opacity: 1; +} + .skyride-mode { z-index: 21; position: relative; @@ -2012,6 +2033,12 @@ onBeforeUnmount(() => { width: 100%; } +.skyride-mode :deep(button) { + min-height: 38px; + font-size: 15px; + font-weight: 600; +} + .skyride-scroll { position: absolute; z-index: 2; @@ -2261,16 +2288,19 @@ onBeforeUnmount(() => { .skyride-ride-status-card p { margin: 0; color: var(--ride-muted); - font-size: 12px; + font-size: 13px; + line-height: 18px; } .skyride-heading h1, .skyride-ride-status-card h1, .skyride-screen-title h1 { margin: 2px 0 0; - font-size: 23px; - line-height: 1.08; - letter-spacing: -0.5px; + color: var(--ride-text); + font-size: 24px; + font-weight: 700; + line-height: 28px; + letter-spacing: -0.55px; } .skyride-heading__icon, @@ -2327,8 +2357,13 @@ onBeforeUnmount(() => { } .skyride-custom-block-title { - margin: 18px 4px 10px !important; + height: auto !important; + margin: 20px 4px 10px !important; padding: 0 !important; + color: var(--ride-muted) !important; + font-size: 15px !important; + font-weight: 650 !important; + line-height: 20px !important; } .skyride-quick-card, @@ -2387,11 +2422,11 @@ onBeforeUnmount(() => { .skyride-quick-card { display: flex; width: 100%; - min-height: 68px; + min-height: 64px; align-items: center; justify-content: flex-start; - gap: 9px; - padding: 12px; + gap: 10px; + padding: 11px 13px; color: inherit; text-align: left; } @@ -2405,9 +2440,9 @@ onBeforeUnmount(() => { display: -webkit-box; min-width: 0; overflow: hidden; - font-size: 12px; + font-size: 12.5px; font-weight: 650; - line-height: 1.18; + line-height: 16px; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; @@ -2415,7 +2450,11 @@ onBeforeUnmount(() => { .skyride-primary { width: calc(100% - 4px); + min-height: 50px; margin: 4px 2px 0; + gap: 5px; + font-size: 16px; + font-weight: 650; } .skyride-primary :deep(svg) { @@ -2749,7 +2788,8 @@ onBeforeUnmount(() => { .skyride-request-card span, .skyride-history-card span { color: var(--ride-muted); - font-size: 11px; + font-size: 12px; + line-height: 16px; } .skyride-driver-metrics :deep(.k-card) { @@ -2790,6 +2830,12 @@ onBeforeUnmount(() => { flex-direction: column; } +.skyride-request-card__top > div > span, +.skyride-history-card__header > div > span { + font-size: 11px; + line-height: 15px; +} + .skyride-request-route, .skyride-history-route { display: grid; @@ -2805,6 +2851,8 @@ onBeforeUnmount(() => { .skyride-request-route span, .skyride-history-route span { overflow: hidden; + font-size: 12px; + line-height: 16px; text-overflow: ellipsis; white-space: nowrap; } @@ -2932,11 +2980,6 @@ onBeforeUnmount(() => { -webkit-backdrop-filter: blur(26px); } -.skyride-tabbar :deep(.k-tabbar-link-label) { - font-size: 9px; - line-height: 1.1; -} - .skyride-tabbar :deep(.skyride-tabbar__inner) { width: 100% !important; max-width: none !important; @@ -2952,11 +2995,26 @@ onBeforeUnmount(() => { .skyride-tab-pane :deep(> .k-link) { flex: 1 1 20%; min-width: 0 !important; - padding-inline: 4px !important; + min-height: 58px; + padding-inline: 3px !important; border-radius: 999px; outline: none; } +.skyride-tab-pane :deep(> .k-link > span > span:last-child) { + max-width: 100%; + overflow: hidden; + font-size: 11px; + font-weight: 600; + line-height: 13px; + text-overflow: ellipsis; +} + +.skyride-tab-pane :deep(> .k-link .k-tabbar-link-icon) { + width: 26px; + height: 26px; +} + .skyride-sheet__content { max-height: 74vh; overflow-y: auto; @@ -2985,15 +3043,61 @@ onBeforeUnmount(() => { .skyride-sheet__title span, .skyride-rating-label { color: var(--ride-muted); - font-size: 10px; + font-size: 11px; + font-weight: 650; + line-height: 14px; text-transform: uppercase; - letter-spacing: 0.5px; + letter-spacing: 0.65px; } .skyride-sheet__title h2, .skyride-rating h2 { - margin: 2px 0 0; - font-size: 21px; + margin: 3px 0 0; + color: var(--ride-text); + font-size: 22px; + font-weight: 700; + line-height: 27px; + letter-spacing: -0.35px; +} + +.skyride-sheet__close { + display: grid; + flex: 0 0 auto; + width: 40px; + height: 40px; + margin-right: -8px; + place-items: center; + border-radius: 50%; +} + +.skyride-sheet-list { + margin-block: 0 !important; +} + +.skyride-sheet-list :deep(.text-\[17px\]) { + color: var(--ride-text); + font-size: 16px; + line-height: 21px; +} + +.skyride-sheet-list :deep(.text-sm) { + color: var(--ride-muted); + font-size: 13px; + line-height: 18px; +} + +.skyride-sheet-section-title { + height: auto !important; + margin: 22px 4px 10px !important; + padding: 0 !important; + color: var(--ride-muted) !important; + font-size: 15px !important; + font-weight: 650 !important; + line-height: 20px !important; +} + +.skyride-saved-list { + margin-bottom: 4px !important; } .skyride-rating {