(feat) O3-2732: Added logic to allow dynamic adjustment of Logo in Na…

…vBar (#907)
openmrs · Apr 17, 2024 · fec3cbc · fec3cbc
1 parent 4ef4c28
commit fec3cbc
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/packages/apps/esm-primary-navigation-app/src/components/logo/logo.component.tsx b/packages/apps/esm-primary-navigation-app/src/components/logo/logo.component.tsx
@@ -4,11 +4,14 @@ import styles from './logo.scss';
 
 const Logo: React.FC = () => {
   const { logo } = useConfig();
-
   return (
     <>
       {logo?.src ? (
-        <img className={styles.logo} src={interpolateUrl(logo.src)} alt={logo.alt} width={110} height={40} />
+        <img
+          className={styles.logo}
+          src={interpolateUrl(logo.src)}
+          alt={logo.alt}
+        />
       ) : logo?.name ? (
         logo.name
       ) : (

diff --git a/packages/apps/esm-primary-navigation-app/src/components/logo/logo.scss b/packages/apps/esm-primary-navigation-app/src/components/logo/logo.scss
@@ -1,4 +1,11 @@
 .logo {
   display: flex;
   align-items: center;
+  width: auto;
+  max-width: 300px;
+  height: 40px;
+  overflow: hidden;
+  position: relative;
+  object-fit: cover;
+  object-position: left;
 }