diff --git a/src/components/AppComponentContent.js b/src/components/AppComponentContent.js
index ce3d521..fa167cc 100644
--- a/src/components/AppComponentContent.js
+++ b/src/components/AppComponentContent.js
@@ -8,7 +8,7 @@ import {
   CoreH5,
   CoreImage,
   CoreLink,
-  CoreTypographyBody1,
+  CoreSpan,
   coreUseNavigate
 } from "@wrappid/core";
 import corePackage from "@wrappid/core/package.json";
@@ -49,7 +49,11 @@ function AppComponentContent() {
         <CoreBox
           gridProps={{ styleClasses: [CoreClasses.ALIGNMENT.JUSTIFY_CONTENT_CENTER] }}
         >
-          <CoreImage width={100} src={logo} alt="logo" />
+          <CoreImage
+            width={96}
+            height={96}
+            src={logo}
+            alt="logo" />
         </CoreBox>
 
         <CoreBox
@@ -68,29 +72,32 @@ function AppComponentContent() {
           <CoreH5>Built with Wrappid. One code, Endless possibilities.</CoreH5>
 
           <CoreBox>
-            <CoreTypographyBody1>
+            <CoreSpan>
               {`Version: ${packageJson.version}`}
+            </CoreSpan>
+          </CoreBox>
 
-              <CoreLink>Release Notes</CoreLink>
+          <CoreBox styleClasses={[CoreClasses.DISPLAY.FLEX, CoreClasses.FLEX.DIRECTION_ROW, CoreClasses.ALIGNMENT.JUSTIFY_CONTENT_CENTER, CoreClasses.ALIGNMENT.ALIGN_CONTENT_CENTER]}>
+              
+            <CoreLink>Release Notes</CoreLink>
 
-              <CoreTypographyBody1>
-                {" | "}
-              </CoreTypographyBody1>
+            <CoreSpan>
+              {" | "}
+            </CoreSpan>
 
-              <CoreLink>Attributions</CoreLink>
+            <CoreLink>Attributions</CoreLink>
 
-              <CoreTypographyBody1>
-                {" | "}
-              </CoreTypographyBody1>
+            <CoreSpan>
+              {" | "}
+            </CoreSpan>
 
-              <CoreLink>Contributors</CoreLink>
+            <CoreLink>Contributors</CoreLink>
 
-              <CoreTypographyBody1>
-                {" | "}
-              </CoreTypographyBody1>
+            <CoreSpan>
+              {" | "}
+            </CoreSpan>
 
-              <CoreLink>Issue Board</CoreLink>
-            </CoreTypographyBody1>
+            <CoreLink>Issue Board</CoreLink>
           </CoreBox>
         </CoreBox>
 
diff --git a/src/components/AppComponentSection.js b/src/components/AppComponentSection.js
index f638efe..82d7b89 100644
--- a/src/components/AppComponentSection.js
+++ b/src/components/AppComponentSection.js
@@ -7,7 +7,7 @@ import {
   CoreH3,
   CoreH5,
   CoreLink,
-  CoreTypographyBody1,
+  CoreSpan,
   CoreTypographyBody2,
   coreUseNavigate
 } from "@wrappid/core";
@@ -37,29 +37,34 @@ export default function AppComponentSection(props) {
       <CoreBox>
         <CoreH5>{props.name}</CoreH5>
 
-        <CoreTypographyBody1>
-          {props.version ? `Version: ${props.version}` : null}
+        <CoreBox>
+          <CoreSpan>
+            {props.version ? `Version: ${props.version}` : null}
+          </CoreSpan>
+        </CoreBox>
+
+        <CoreBox styleClasses={[CoreClasses.DISPLAY.FLEX, CoreClasses.FLEX.DIRECTION_ROW]}>
 
           <CoreLink>Release Notes</CoreLink>
 
-          <CoreTypographyBody1>
+          <CoreSpan>
             {" | "}
-          </CoreTypographyBody1>
+          </CoreSpan>
 
           <CoreLink>Attributions</CoreLink>
 
-          <CoreTypographyBody1>
+          <CoreSpan>
             {" | "}
-          </CoreTypographyBody1>
+          </CoreSpan>
 
           <CoreLink>Contributors</CoreLink>
 
-          <CoreTypographyBody1>
+          <CoreSpan>
             {" | "}
-          </CoreTypographyBody1>
+          </CoreSpan>
 
           <CoreLink>Issue Board</CoreLink>
-        </CoreTypographyBody1>
+        </CoreBox>
       </CoreBox>
 
       <CoreGrid
diff --git a/src/components/layouts/WrappidAppLayout.js b/src/components/layouts/WrappidAppLayout.js
index 0247c83..04eb560 100644
--- a/src/components/layouts/WrappidAppLayout.js
+++ b/src/components/layouts/WrappidAppLayout.js
@@ -11,10 +11,6 @@ import packageData from "../../../package.json";
 import logo from "../../resources/images/logo.png";
 
 export default function WrappidAppLayout() {
-  React.useEffect(() => {
-    // eslint-disable-next-line no-console
-    console.log("WrappidAppLayout::useEffect");
-  }, []);
 
   return (
     <>
@@ -22,7 +18,8 @@ export default function WrappidAppLayout() {
         styleClasses={[CoreClasses.DISPLAY.FLEX, CoreClasses.FLEX.DIRECTION_ROW, CoreClasses.SHADOW.NORMAL]}
       >
         <CoreImage
-          height={50}
+          height={40}
+          width={120}
           src={logo}
           alt="logo"
         />