Support easier stadtnavi title configuration

stadtnavi · Oct 24, 2024 · 9bd1746 · 9bd1746
1 parent b32ec0c
commit 9bd1746
Show file tree

Hide file tree

Showing 5 changed files with 44 additions and 7 deletions.
diff --git a/app/component/AppBar.js b/app/component/AppBar.js
@@ -60,9 +60,6 @@ const AppBar = (
               logo={logo}
               title={title}
             />
-            {!!config.appBarTitle && (
-              <span className="logo community">{config.appBarTitle}</span>
-            )}
           </button>
         </section>
         <section className="controls">

diff --git a/app/component/TopLevel.js b/app/component/TopLevel.js
@@ -252,7 +252,8 @@ class TopLevel extends React.Component {
         {!this.topBarOptions.hidden && (
           // DT-3375: added style
           <AppBarContainer
-            title={this.context.config.title}
+            // stadtnavi: we only render subTitle, in case logo contains parts of title
+            title={this.context.config.subTitle || this.context.config.title}
             {...this.topBarOptions}
             {...this.state}
             homeUrl={homeUrl}

diff --git a/app/configurations/config.aachen.js b/app/configurations/config.aachen.js
@@ -58,8 +58,10 @@ export default configMerger(parentConfig, {
     },
 
     // -- Style configuration  ----
-    textLogo: true,
-    appBarTitle: '',
+    logo: 'herrenberg/stadtnavi-logo.svg',
+    showTitles: true,
+    subTitle: 'Aachen',
+
     sprites: 'assets/svg-sprite.aachen.svg',
     //logo: 'aachen/logo.svg',
     favicon: './app/configurations/images/aachen/stadt-aachen.png',

diff --git a/app/configurations/images/herrenberg/stadtnavi-logo.svg b/app/configurations/images/herrenberg/stadtnavi-logo.svg
diff --git a/sass/themes/aachen/overrides.scss b/sass/themes/aachen/overrides.scss
@@ -13,6 +13,9 @@ $from-color: #000000;
   .logo {
     font-weight: 300;
     padding-left: 0.25em;
+    display: flex;
+    align-items: center;
+    height: 45px;
   }
 }
 
@@ -30,3 +33,37 @@ $from-color: #000000;
   color: $black;
 }
 
+.logo-title {
+  margin-top: 13px;
+  margin-left: 240px;
+  font-size: 1.6em;
+  font-weight: 500;
+}
+
+.logo-title:after {
+  content: '';
+  position: absolute;
+  left: 236px;
+  top: 10%;
+  height: 100%;
+  border-left: 1px solid #fff;
+}
+
+.mobile .logo-title {
+  margin-top: 10px;
+  margin-left: 160px;
+  font-size: 1.0em;
+}
+
+.mobile .logo-title:after {
+  content: '';
+  position: absolute;
+  left: 158px;
+  top: 10%;
+  height: 100%;
+  border-left: 1px solid #fff;
+}
+
+.mobile.top-bar section.title .logo {
+  height: 30px;
+}