From ecf51a41650950548566840afff01955d78b8727 Mon Sep 17 00:00:00 2001 From: Simo Partinen Date: Wed, 4 Dec 2024 21:43:43 +0200 Subject: [PATCH 01/18] feat: extracted a common NavigatorModal from NavigatorIntroModal --- .../itinerary/navigator/NavigatorModal.js | 49 +++++++++++++++ .../itinerary/navigator/navigator.scss | 61 +++++++------------ .../navigatorintro/NavigatorIntro.js | 34 +++-------- .../navigatorintro/NavigatorIntroFeature.js | 2 +- .../navigatorintro/NavigatorIntroModal.js | 11 +--- .../navigatorintro/navigator-intro.scss | 48 +++------------ 6 files changed, 92 insertions(+), 113 deletions(-) create mode 100644 app/component/itinerary/navigator/NavigatorModal.js diff --git a/app/component/itinerary/navigator/NavigatorModal.js b/app/component/itinerary/navigator/NavigatorModal.js new file mode 100644 index 0000000000..5c309fbedd --- /dev/null +++ b/app/component/itinerary/navigator/NavigatorModal.js @@ -0,0 +1,49 @@ +import Modal from '@hsl-fi/modal'; +import cx from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; +import { intlShape } from 'react-intl'; +import { isBrowser } from '../../../util/browser'; +import { configShape } from '../../../util/shapes'; + +const NavigatorModal = ({ withBackdrop, isOpen, children, slideUp }) => { + const overlayClass = cx('navigator-modal-container', { + 'navigator-modal-backdrop': withBackdrop, + }); + + const modalClass = cx('navigator-modal', { + 'slide-in': slideUp, + }); + + return ( + +
{children}
+ + ); +}; + +NavigatorModal.propTypes = { + children: PropTypes.node, + withBackdrop: PropTypes.bool, + isOpen: PropTypes.bool, + slideUp: PropTypes.bool, +}; + +NavigatorModal.defaultProps = { + children: undefined, + withBackdrop: false, + isOpen: false, + slideUp: false, +}; + +NavigatorModal.contextTypes = { + intl: intlShape.isRequired, + config: configShape.isRequired, +}; + +export default NavigatorModal; diff --git a/app/component/itinerary/navigator/navigator.scss b/app/component/itinerary/navigator/navigator.scss index e2d87395b3..4813f2998f 100644 --- a/app/component/itinerary/navigator/navigator.scss +++ b/app/component/itinerary/navigator/navigator.scss @@ -310,50 +310,35 @@ } } -@keyframes slideIn { - from { - transform: translateY(-100%); - opacity: 0; - } - - to { - transform: translateY(0); - opacity: 1; - } +.navigator-modal-container { + position: fixed; + width: 100%; + bottom: 0; + left: 0; + z-index: 1000; // higher than navbar + display: flex; + flex-direction: row; + align-items: flex-end; } -@keyframes slideOut { - from { - transform: translateY(0); - opacity: 1; - } - - to { - transform: translateY(-100%); - opacity: 0; - } +.navigator-modal-backdrop { + background-color: rgba(0, 0, 0, 0.2); + z-index: 999; // higher than navbar, below modal body + height: 100%; } -@keyframes slideOutRight { - from { - transform: translateX(0); - opacity: 1; - } - - to { - transform: translateX(-100%); - opacity: 0; - } +.navigator-modal { + position: fixed; + background: white; + width: 100%; + border-radius: var(--radius-xl) var(--radius-xl) 0 0; } -@keyframes fadeOut { - from { - opacity: 1; - } - - to { - opacity: 0; - } +.navigator-modal-content { + display: flex; + flex-direction: column; + padding: var(--space-xl) var(--space-l) var(--space-l) var(--space-l); + gap: var(--space-xl); } .info-stack { diff --git a/app/component/itinerary/navigator/navigatorintro/NavigatorIntro.js b/app/component/itinerary/navigator/navigatorintro/NavigatorIntro.js index 4e7641ba97..6563a54092 100644 --- a/app/component/itinerary/navigator/navigatorintro/NavigatorIntro.js +++ b/app/component/itinerary/navigator/navigatorintro/NavigatorIntro.js @@ -1,27 +1,22 @@ import Button from '@hsl-fi/button'; -import { connectToStores } from 'fluxible-addons-react'; import PropTypes from 'prop-types'; import React from 'react'; import { FormattedMessage, intlShape } from 'react-intl'; import { configShape } from '../../../../util/shapes'; -import Icon from '../../../Icon'; import NavigatorIntroFeature from './NavigatorIntroFeature'; -const NavigatorIntro = ( - { logo, onPrimaryClick, onClose, isLoggedIn }, - context, -) => { +const NavigatorIntro = ({ logo, onPrimaryClick, onClose }, context) => { const { config, intl } = context; const primaryColor = config.colors?.accessiblePrimary || config.colors?.primary || 'black'; return ( -
-
+ <> +
{logo && navigator logo} -
+
- {config.allowLogin && !isLoggedIn && ( -
- - -
- )}
-
+
-
+ ); }; @@ -70,13 +59,11 @@ NavigatorIntro.propTypes = { logo: PropTypes.string, onClose: PropTypes.func.isRequired, onPrimaryClick: PropTypes.func, - isLoggedIn: PropTypes.bool, }; NavigatorIntro.defaultProps = { logo: undefined, onPrimaryClick: undefined, - isLoggedIn: false, }; NavigatorIntro.contextTypes = { @@ -84,11 +71,4 @@ NavigatorIntro.contextTypes = { config: configShape.isRequired, }; -export default connectToStores( - NavigatorIntro, - ['UserStore'], - ({ config, getStore }) => ({ - isLoggedIn: - config?.allowLogin && getStore('UserStore')?.getUser()?.sub !== undefined, - }), -); +export default NavigatorIntro; diff --git a/app/component/itinerary/navigator/navigatorintro/NavigatorIntroFeature.js b/app/component/itinerary/navigator/navigatorintro/NavigatorIntroFeature.js index 26a662de28..4856e9705b 100644 --- a/app/component/itinerary/navigator/navigatorintro/NavigatorIntroFeature.js +++ b/app/component/itinerary/navigator/navigatorintro/NavigatorIntroFeature.js @@ -11,7 +11,7 @@ const NavigatorIntroFeature = ({ body, }) => { return ( -
+
{icon && ( { @@ -30,18 +30,13 @@ const NavigatorIntroModal = ({ onPrimaryClick, onClose }, context) => { }, []); return ( - + - + ); }; diff --git a/app/component/itinerary/navigator/navigatorintro/navigator-intro.scss b/app/component/itinerary/navigator/navigatorintro/navigator-intro.scss index 2e41f20656..eb91922fba 100644 --- a/app/component/itinerary/navigator/navigatorintro/navigator-intro.scss +++ b/app/component/itinerary/navigator/navigatorintro/navigator-intro.scss @@ -1,43 +1,16 @@ -.navigator-intro-modal-overlay { - position: fixed; - height: 100%; - width: 100%; - top: 0; - left: 0; - background-color: rgba(0, 0, 0, 0.2); - z-index: 1000; // higher than navbar - display: flex; - flex-direction: row; - align-items: flex-end; -} - -.navigator-intro-modal { - position: fixed; - background: white; - width: 100%; - border-radius: 30px 30px 0 0; - box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2); -} - -.navigator-intro-modal-content { - display: flex; - flex-direction: column; - padding: 0 var(--space-s); - - .body { +.navigator-modal-content { + .intro-body { display: flex; flex-direction: column; flex-wrap: wrap; align-items: stretch; - padding: var(--space-xl) 0 var(--space-s) 0; + align-content: center; gap: var(--space-m); - h2 { - align-self: center; - } - + h2, p { margin: unset; + align-self: center; } .login-tip { @@ -46,19 +19,17 @@ flex-wrap: nowrap; justify-content: center; gap: var(--space-xs); - padding: var(--space-xxs) var(--space-l); } - .navigation-intro-body { + .content { display: flex; flex-wrap: wrap; flex-direction: column; align-content: center; align-items: stretch; gap: var(--space-m); - padding: 0 var(--space-m); - .content-box { + .feature { display: flex; flex-direction: row; align-items: center; @@ -74,11 +45,10 @@ } } - .buttons { + .intro-buttons { display: flex; flex-direction: column; width: 100%; - gap: var(--space-xs); - padding: var(--space-s) var(--space-s) var(--space-m) var(--space-s); + gap: var(--space-s); } } From c0d1f4dbca92286147938408db0932429ea7932f Mon Sep 17 00:00:00 2001 From: Simo Partinen Date: Wed, 4 Dec 2024 21:44:58 +0200 Subject: [PATCH 02/18] feat: added useLogo hook --- .../itinerary/navigator/hooks/useLogo.js | 29 ++++++++++++++++++ .../navigatorintro/NavigatorIntroModal.js | 30 +++++-------------- 2 files changed, 36 insertions(+), 23 deletions(-) create mode 100644 app/component/itinerary/navigator/hooks/useLogo.js diff --git a/app/component/itinerary/navigator/hooks/useLogo.js b/app/component/itinerary/navigator/hooks/useLogo.js new file mode 100644 index 0000000000..bb8279b067 --- /dev/null +++ b/app/component/itinerary/navigator/hooks/useLogo.js @@ -0,0 +1,29 @@ +import { useState, useEffect, useCallback } from 'react'; + +const useLogo = logoPath => { + const [logo, setLogo] = useState(null); + const [loading, setLoading] = useState(true); + + const fetchLogo = useCallback(async () => { + setLoading(true); + try { + const importedLogo = await import( + /* webpackChunkName: "main" */ `../../../../configurations/images/${logoPath}` + ); + setLogo(importedLogo.default); + } catch (error) { + // eslint-disable-next-line no-console + console.error('Error loading logo:', error); + } finally { + setLoading(false); + } + }, [logoPath]); + + useEffect(() => { + fetchLogo(); + }, [fetchLogo]); + + return { logo, loading }; +}; + +export { useLogo }; diff --git a/app/component/itinerary/navigator/navigatorintro/NavigatorIntroModal.js b/app/component/itinerary/navigator/navigatorintro/NavigatorIntroModal.js index 516030a00c..93ea8afe4d 100644 --- a/app/component/itinerary/navigator/navigatorintro/NavigatorIntroModal.js +++ b/app/component/itinerary/navigator/navigatorintro/NavigatorIntroModal.js @@ -1,33 +1,17 @@ import PropTypes from 'prop-types'; -import React, { useEffect, useState } from 'react'; +import React from 'react'; import { intlShape } from 'react-intl'; import { configShape } from '../../../../util/shapes'; +import { useLogo } from '../hooks/useLogo'; import NavigatorModal from '../NavigatorModal'; import NavigatorIntro from './NavigatorIntro'; -const NavigatorIntroModal = ({ onPrimaryClick, onClose }, context) => { - const { config } = context; - const [logo, setLogo] = useState(); +const NavigatorIntroModal = ({ onPrimaryClick, onClose }, { config }) => { + const { logo, loading } = useLogo(config.navigationLogo); - useEffect(() => { - if (!config.navigationLogo) { - return; - } - - const loadLogo = async () => { - try { - const importedLogo = await import( - /* webpackChunkName: "main" */ `../../../../configurations/images/${config.navigationLogo}` - ); - setLogo(importedLogo.default); - } catch (error) { - // eslint-disable-next-line no-console - console.error('Error loading logo:', error); - } - }; - - loadLogo(); - }, []); + if (loading) { + return null; + } return ( From 65203a2d86990d9b80ab0a984568286c20da456c Mon Sep 17 00:00:00 2001 From: Simo Partinen Date: Wed, 4 Dec 2024 21:47:11 +0200 Subject: [PATCH 03/18] feat: added NavigatorOutro --- .../navigatoroutro/NavigatorOutro.js | 53 ++++++ .../navigatoroutro/NavigatorOutroModal.js | 33 ++++ .../navigatoroutro/navigator-outro.scss | 55 ++++++ app/configurations/config.hsl.js | 1 + app/configurations/images/hsl/thumbs-up.svg | 170 ++++++++++++++++++ sass/_main.scss | 2 + sass/base/_radius.scss | 7 + 7 files changed, 321 insertions(+) create mode 100644 app/component/itinerary/navigator/navigatoroutro/NavigatorOutro.js create mode 100644 app/component/itinerary/navigator/navigatoroutro/NavigatorOutroModal.js create mode 100644 app/component/itinerary/navigator/navigatoroutro/navigator-outro.scss create mode 100644 app/configurations/images/hsl/thumbs-up.svg create mode 100644 sass/base/_radius.scss diff --git a/app/component/itinerary/navigator/navigatoroutro/NavigatorOutro.js b/app/component/itinerary/navigator/navigatoroutro/NavigatorOutro.js new file mode 100644 index 0000000000..5ca14b2376 --- /dev/null +++ b/app/component/itinerary/navigator/navigatoroutro/NavigatorOutro.js @@ -0,0 +1,53 @@ +import Button from '@hsl-fi/button'; +import PropTypes from 'prop-types'; +import React from 'react'; +import { FormattedMessage, intlShape } from 'react-intl'; + +const NavigatorOutro = ({ onClose, destination, logo } /* ,context */) => { + // const { intl } = context; + const [place, address] = destination?.split(/, (.+)/) || []; + return ( + <> +
+ {logo && thumbs up} +
+
+ +
+

{place}

+

{address}

+
+
+
+
+ + ); +}; + +NavigatorOutro.propTypes = { + onClose: PropTypes.func.isRequired, + destination: PropTypes.string.isRequired, + logo: PropTypes.string, +}; + +NavigatorOutro.defaultProps = { + logo: undefined, +}; + +NavigatorOutro.contextTypes = { + intl: intlShape.isRequired, +}; + +export default NavigatorOutro; diff --git a/app/component/itinerary/navigator/navigatoroutro/NavigatorOutroModal.js b/app/component/itinerary/navigator/navigatoroutro/NavigatorOutroModal.js new file mode 100644 index 0000000000..0b74373e9c --- /dev/null +++ b/app/component/itinerary/navigator/navigatoroutro/NavigatorOutroModal.js @@ -0,0 +1,33 @@ +import PropTypes from 'prop-types'; +import React from 'react'; +import { intlShape } from 'react-intl'; +import { configShape } from '../../../../util/shapes'; +import { useLogo } from '../hooks/useLogo'; +import NavigatorModal from '../NavigatorModal'; +import NavigatorOutro from './NavigatorOutro'; + +const NavigatorOutroModal = ({ onClose, destination }, { config }) => { + const { logo, loading } = useLogo(config.thumbsUpGraphic); + + if (loading) { + return null; + } + + return ( + + + + ); +}; + +NavigatorOutroModal.propTypes = { + onClose: PropTypes.func.isRequired, + destination: PropTypes.string.isRequired, +}; + +NavigatorOutroModal.contextTypes = { + intl: intlShape.isRequired, + config: configShape.isRequired, +}; + +export default NavigatorOutroModal; diff --git a/app/component/itinerary/navigator/navigatoroutro/navigator-outro.scss b/app/component/itinerary/navigator/navigatoroutro/navigator-outro.scss new file mode 100644 index 0000000000..0c5cbc53f4 --- /dev/null +++ b/app/component/itinerary/navigator/navigatoroutro/navigator-outro.scss @@ -0,0 +1,55 @@ +.navigator-modal-content { + .outro-logo-container { + position: absolute; + top: 0; + left: 50%; + transform: translate(-50%, -50%); + + img { + background-color: white; /* Just for visualization */ + border-radius: var(--radius-pill); + } + } + + .outro-body { + display: flex; + flex-direction: column; + flex-wrap: wrap; + align-items: stretch; + align-content: center; + padding-top: var(--space-xl); + gap: var(--space-xs); + + h2, + p { + margin: unset; + align-self: center; + } + + .destination { + display: flex; + flex-direction: column; + align-items: center; + gap: calc(var(--space-xxs) / 2); + + .place { + color: $black; + } + + .address { + color: $gray; + } + } + } + + .outro-buttons { + display: flex; + flex-direction: column; + width: 100%; + gap: var(--space-s); + + .close-button { + background-color: $realtime-color; + } + } +} diff --git a/app/configurations/config.hsl.js b/app/configurations/config.hsl.js index 151cba6367..dced04e5f7 100644 --- a/app/configurations/config.hsl.js +++ b/app/configurations/config.hsl.js @@ -751,6 +751,7 @@ export default { startSearchFromUserLocation: true, navigationLogo: 'hsl/navigator-logo.svg', + thumbsUpGraphic: 'hsl/thumbs-up.svg', // features that should not be deployed to production experimental: { diff --git a/app/configurations/images/hsl/thumbs-up.svg b/app/configurations/images/hsl/thumbs-up.svg new file mode 100644 index 0000000000..343bda94d7 --- /dev/null +++ b/app/configurations/images/hsl/thumbs-up.svg @@ -0,0 +1,170 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/sass/_main.scss b/sass/_main.scss index 72407fcc07..c064f8441f 100644 --- a/sass/_main.scss +++ b/sass/_main.scss @@ -13,6 +13,7 @@ $body-font-weight: $font-weight-medium; @import '~zurb-foundation-5/scss/foundation/components/grid'; @import 'base/helper-classes-after-foundations'; @import 'base/spacing'; +@import 'base/radius'; // Some of these files override sass variables Foundation uses, // so they must be loaded before the relevant foundation modules @@ -65,6 +66,7 @@ $body-font-weight: $font-weight-medium; @import 'base/button'; @import '../app/component/itinerary/navigator/navigator'; @import '../app/component/itinerary/navigator/navigatorintro/navigator-intro'; +@import '../app/component/itinerary/navigator/navigatoroutro/navigator-outro'; /* Modal */ @import '~foundation-apps/scss/helpers/breakpoints'; diff --git a/sass/base/_radius.scss b/sass/base/_radius.scss new file mode 100644 index 0000000000..5c1782d634 --- /dev/null +++ b/sass/base/_radius.scss @@ -0,0 +1,7 @@ +:root { + --radius-s: 4px; + --radius-m: 8px; + --radius-l: 16px; + --radius-xl: 24px; + --radius-pill: 999px; +} From 37f012871664f0fb39ea9bced03e54b1fca3af3c Mon Sep 17 00:00:00 2001 From: Simo Partinen Date: Wed, 4 Dec 2024 21:48:40 +0200 Subject: [PATCH 04/18] fix: fixed some UI colors --- app/component/itinerary/navigator/NaviBottom.js | 2 +- app/component/itinerary/navigator/navigator.scss | 7 ++++--- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/app/component/itinerary/navigator/NaviBottom.js b/app/component/itinerary/navigator/NaviBottom.js index adafb6c7e4..097e5adcfa 100644 --- a/app/component/itinerary/navigator/NaviBottom.js +++ b/app/component/itinerary/navigator/NaviBottom.js @@ -10,7 +10,7 @@ export default function NaviBottom( ) { const remainingDuration = Math.ceil((arrival - time) / 60000); // ms to minutes return ( -
+
); } @@ -218,6 +221,8 @@ NaviCardContainer.propTypes = { currentLeg: legShape, nextLeg: legShape, firstLeg: legShape, + isJourneyCompleted: PropTypes.bool, + /* focusToPoint: PropTypes.func.isRequired, */ @@ -229,6 +234,7 @@ NaviCardContainer.defaultProps = { currentLeg: undefined, nextLeg: undefined, firstLeg: undefined, + isJourneyCompleted: false, }; NaviCardContainer.contextTypes = { diff --git a/app/component/itinerary/navigator/navigator.scss b/app/component/itinerary/navigator/navigator.scss index 5f68b8150d..3aeee94f80 100644 --- a/app/component/itinerary/navigator/navigator.scss +++ b/app/component/itinerary/navigator/navigator.scss @@ -41,6 +41,17 @@ font-weight: $font-weight-medium; } +.navi-card-container { + position: fixed; + top: 0; + width: 100vw; + height: 100vh; + + &.slide-out { + animation: slideUpToTop 3s ease-out forwards; + } +} + .navitop { margin-bottom: 5px; position: fixed; @@ -332,6 +343,10 @@ background: white; width: 100%; border-radius: var(--radius-xl) var(--radius-xl) 0 0; + + &.slide-in { + animation: slideUpFromBottom 0.5s ease-in-out; + } } .navigator-modal-content { @@ -357,12 +372,16 @@ } &.slide-out { - animation: slideOut 0.5s ease-out forwards; + animation: + slideUpFromBottom 0.5s ease-out forwards, + fadeOut 0.5s ease-out forwards; pointer-events: none; } &.slide-in { - animation: slideIn 0.5s ease-out forwards; + animation: + slideDownFromTop 0.5s ease-out forwards, + fadeIn 0.5s ease-out forwards; } .info-stack-item { @@ -372,7 +391,9 @@ align-items: center; padding: 16px; box-shadow: 0 2px 4px 0 rgba(51, 51, 51, 0.2); - animation: slideIn 0.5s ease-out forwards; + animation: + slideDownFromTop 0.5s ease-out forwards, + fadeIn 0.5s ease-out forwards; .icon-container { display: flex; @@ -438,7 +459,9 @@ } &.slide-out-right { - animation: slideOutRight 0.5s ease-out forwards; + animation: + slideLeft 0.5s ease-out forwards, + fadeOut 0.5s ease-out forwards; pointer-events: none; } @@ -465,7 +488,9 @@ } &.slide-in { - animation: slideIn 0.5s ease-out forwards; + animation: + slideDownFromTop 0.5s ease-out forwards, + fadeOut 0.5s ease-out forwards; } .navi-info { @@ -559,3 +584,63 @@ } } } + +@keyframes slideDownFromTop { + from { + transform: translateY(-100%); + } + + to { + transform: translateY(0); + } +} + +@keyframes slideUpFromBottom { + from { + transform: translateY(100%); + } + + to { + transform: translateY(0); + } +} + +@keyframes slideUpToTop { + from { + transform: translateY(0); + } + + to { + transform: translateY(-100%); + } +} + +@keyframes slideLeft { + from { + transform: translateX(0); + } + + to { + transform: translateX(-100%); + } +} + +@keyframes fadeOut { + from { + opacity: 1; + } + + to { + opacity: 0; + } +} + +@keyframes fadeIn { + from { + opacity: 0; + } + + to { + opacity: 1; + } +} From b205af952adafd2b4f41980c949c19965aa64c06 Mon Sep 17 00:00:00 2001 From: Simo Partinen Date: Wed, 4 Dec 2024 22:44:51 +0200 Subject: [PATCH 13/18] fix: fixed tests, removed now obsolete test cases --- .../component/NavigatorIntro.test.js | 51 +------------------ 1 file changed, 2 insertions(+), 49 deletions(-) diff --git a/test/unit/views/ItineraryPage/component/NavigatorIntro.test.js b/test/unit/views/ItineraryPage/component/NavigatorIntro.test.js index 5c3ee1cfb9..71585b7bea 100644 --- a/test/unit/views/ItineraryPage/component/NavigatorIntro.test.js +++ b/test/unit/views/ItineraryPage/component/NavigatorIntro.test.js @@ -25,9 +25,7 @@ describe('', () => { }, ); - expect( - wrapper.find('div.navigator-intro-modal-content img'), - ).to.have.lengthOf(1); + expect(wrapper.find('div.intro-body img')).to.have.lengthOf(1); }); it('should not render logo if prop is missing', () => { @@ -38,51 +36,6 @@ describe('', () => { childContextTypes: { ...mockChildContextTypes }, }); - assert(wrapper.find('div.navigator-intro-modal-content img'), undefined); - }); - - it('should render login tip if login is allowed and user is not logged in', () => { - const wrapper = mountWithIntl( - , - { - context: { - ...mockContext, - config: { CONFIG: 'default', allowLogin: true }, - }, - childContextTypes: { ...mockChildContextTypes }, - }, - ); - - expect(wrapper.find('div.login-tip')).to.have.lengthOf(1); - }); - - it('should not render login tip if login is not allowed and user is not logged in', () => { - const wrapper = mountWithIntl( - , - { - context: { - ...mockContext, - config: { CONFIG: 'default', allowLogin: true }, - }, - childContextTypes: { ...mockChildContextTypes }, - }, - ); - - assert(wrapper.find('div.login-tip'), undefined); - }); - - it('should not render login tip if login is allowed and user logged in', () => { - const wrapper = mountWithIntl( - , - { - context: { - ...mockContext, - config: { CONFIG: 'default', allowLogin: true }, - }, - childContextTypes: { ...mockChildContextTypes }, - }, - ); - - assert(wrapper.find('div.login-tip'), undefined); + assert(wrapper.find('div.intro-body img'), undefined); }); }); From d5990c4b2e3baa0bf0e5f34f2e778065d96e6c79 Mon Sep 17 00:00:00 2001 From: Simo Partinen Date: Mon, 9 Dec 2024 15:17:44 +0200 Subject: [PATCH 14/18] fix: less intrusive navi-card-container element --- app/component/itinerary/navigator/NaviCardContainer.js | 4 ++-- app/component/itinerary/navigator/navigator.scss | 7 ++----- 2 files changed, 4 insertions(+), 7 deletions(-) diff --git a/app/component/itinerary/navigator/NaviCardContainer.js b/app/component/itinerary/navigator/NaviCardContainer.js index afd47c9472..9adc031f97 100644 --- a/app/component/itinerary/navigator/NaviCardContainer.js +++ b/app/component/itinerary/navigator/NaviCardContainer.js @@ -167,17 +167,17 @@ function NaviCardContainer( legType = LEGTYPE.WAIT; } - const cardTop = + const containerTopPosition = mapLayerRef.current.getBoundingClientRect().top + TOPBAR_PADDING; return (