feat(PageChrome): add responsive container

limit width on desktop size screens

__snapshots__/navbar.test.js.snap

@@ -1,7 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Navbar Default test 1`] = `
-<div class="navbar bg-neutral">
+<div class="bg-neutral">
+  <div class="mx-auto lg:container bg-neutral">
+    <div class="navbar">
       <div class="flex-1">
         <h4>
           <span class="primary">
@@ -24,10 +26,14 @@ exports[`Navbar Default test 1`] = `
         </button>
       </div>
     </div>
+  </div>
+</div>
 `;
 
 exports[`Navbar NIP07Exists test 1`] = `
-<div class="navbar bg-neutral">
+<div class="bg-neutral">
+  <div class="mx-auto lg:container bg-neutral">
+    <div class="navbar">
       <div class="flex-1">
         <h4>
           <span class="primary">
@@ -47,10 +53,14 @@ exports[`Navbar NIP07Exists test 1`] = `
         </button>
       </div>
     </div>
+  </div>
+</div>
 `;
 
 exports[`Navbar NoNIP07 test 1`] = `
-<div class="navbar bg-neutral">
+<div class="bg-neutral">
+  <div class="mx-auto lg:container bg-neutral">
+    <div class="navbar">
       <div class="flex-1">
         <h4>
           <span class="primary">
@@ -73,4 +83,6 @@ exports[`Navbar NoNIP07 test 1`] = `
         </button>
       </div>
     </div>
+  </div>
+</div>
 `;

src/lib/components/Navbar.svelte

@@ -2,7 +2,9 @@
   export let nip07plugin: boolean = false;
 </script>
 
-<div class="navbar bg-neutral">
+<div class="bg-neutral">
+  <div class="mx-auto lg:container bg-neutral">
+    <div class="navbar">
       <div class="flex-1">
         <h4>
           <span class="primary">git</span>
@@ -12,10 +14,10 @@
       </div>
       <div class="flex-none gap-4">
         {#if !nip07plugin}
-      <div class="btn btn-primary normal-case">
-        Sign up
-      </div>
+          <div class="btn btn-primary normal-case">Sign up</div>
         {/if}
         <button class="btn btn-outline normal-case">Login</button>
       </div>
     </div>
+  </div>
+</div>

src/routes/+layout.svelte

@@ -5,4 +5,6 @@
 
 <Navbar />
 
+<div class="mx-auto lg:container">
   <slot />
+</div>