finalize new layout and content

Author: judell

blog/src/Main.xmlui

@@ -1,6 +1,6 @@
 <App
     layout="vertical"
-    var.showNavPanelThreshold="{0}"
+    var.showNavPanelThreshold="{6}"
     var.posts=`{[
       {
         title: "Welcome to the XMLUI blog!",
@@ -18,14 +18,20 @@
             posts: posts.length
         }}" />
     <AppHeader>
+        <property name="logoTemplate">
+          <CHStack height="$space-6">
+            <Logo />
+            <Text variant="em">Tutorials, tips, best practices</Text>
+          </CHStack>
+        </property>
         <property name="profileMenuTemplate">
+            <SpaceFiller />
             <Link when="{!['/', '/blog'].includes($pathname)}" to="/">
-                <Button label="Home" />
+                <Button height="$space-6" padding="$space-2" label="All Posts" />
             </Link>
-            <Search data="{appGlobals.plainTextContent}" />
         </property>
     </AppHeader>
-    <NavPanel when="{showNav()}">
+    <NavPanel>
        <NavGroup label="Recent posts" to="/blog">
             <NavLink
                 label="Welcome to the XMLUI blog!"

blog/src/Main.xmlui.xs

@@ -0,0 +1,3 @@
+function showNav() {
+    return posts.length > showNavPanelThreshold && mediaSize.sizeIndex > 2;
+}

blog/src/components/BlogOverview.xmlui

@@ -1,8 +1,6 @@
 <Component name="BlogOverview">
   <CVStack>
     <VStack width="100%">
-      <H1>XMLUI Blog</H1>
-      <Text>Latest updates, tutorials, and insights for building with XMLUI</Text>
       <List  data="{
       $props.posts.sort(function(a, b) {
         return new Date(b.date) - new Date(a.date);

blog/src/components/Debug.xmlui

@@ -0,0 +1,6 @@
+<Component name="Debug">
+  <AppState id="navState" />
+  <Text>
+    navState: {JSON.stringify(navState.value)},  sizeIndex {JSON.stringify(mediaSize.sizeIndex)}, path {$pathname}
+  </Text>
+</Component>