Merge pull request #872 from stadtnavi/fix/public-poi-icon-alignment

feat(poi-details): align poi icon on details page
stadtnavi · Jan 8, 2025 · b23f450 · b23f450
2 parents 6f1b401 + a417c21
commit b23f450
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 3 deletions.
diff --git a/app/component/CardHeader.js b/app/component/CardHeader.js
@@ -30,6 +30,7 @@ const CardHeader = (
     showHeaderTitle,
     headerPictureUrl,
     showCardSubHeader = true,
+    isMobile,
   },
   { config, intl },
 ) => {
@@ -65,8 +66,13 @@ const CardHeader = (
         <div className="card-header-content">
           {icon || dataURI ? (
             <div
-              className="left"
-              style={{ fontSize: 32, paddingRight: 10, height: 32 }}
+              className="left card-header-icon-container"
+              style={{
+                fontSize: 32,
+                paddingRight: 10,
+                height: 32,
+                transform: !isMobile ? 'translateY(12px)' : 'initial',
+              }}
             >
               <Icon
                 img={icon}
@@ -139,6 +145,7 @@ CardHeader.propTypes = {
   isTerminal: PropTypes.bool,
   showHeaderTitle: PropTypes.bool,
   showCardSubHeader: PropTypes.bool,
+  isMobile: PropTypes.bool,
 };
 
 CardHeader.defaultProps = {

diff --git a/app/component/StopCardHeader.js b/app/component/StopCardHeader.js
@@ -91,19 +91,22 @@ class StopCardHeader extends React.Component {
       return false;
     }
 
+    const isMobile = breakpoint !== 'large';
+
     return (
       <CardHeader
         className={className}
         headingStyle={headingStyle}
         description={this.getDescription()}
         code={this.headerConfig.showStopCode && stop.code ? stop.code : null}
         icons={icons}
-        showBackButton={breakpoint === 'large'}
+        showBackButton={!isMobile}
         stop={stop}
         headerConfig={this.headerConfig}
         isTerminal={isTerminal}
         showHeaderTitle
         showCardSubHeader
+        isMobile={isMobile}
         // TODO: Fix places geocoder api request to reimplement favorite button.
         // https://github.com/stadtnavi/digitransit-ui/issues/481
         /** favouriteContainer={

diff --git a/app/component/map/sidebar/SidebarContainer.js b/app/component/map/sidebar/SidebarContainer.js
@@ -69,6 +69,7 @@ const SidebarContainer = (
           description={description}
           showCardSubHeader={Boolean(description)}
           showBackButton={!isMobile}
+          isMobile={isMobile}
         />
         {children}
         {location && (