From b42158113a3ced78ff166c61ff40d159384e2a9f Mon Sep 17 00:00:00 2001
From: MrSirDev <blankworldwide@gmail.com>
Date: Thu, 8 Jul 2021 20:44:20 -0700
Subject: [PATCH 01/10] Sidebar UI Changes

---
 src/components/navigation-link.svelte |  27 ++++++++++++++++++++++++--
 src/routes/__layout.svelte            |  27 +++++++++++++++++++++++++-
 static/home.svg                       |   3 +++
 static/logo.png                       | Bin 0 -> 1388 bytes
 4 files changed, 54 insertions(+), 3 deletions(-)
 create mode 100644 static/home.svg
 create mode 100644 static/logo.png

diff --git a/src/components/navigation-link.svelte b/src/components/navigation-link.svelte
index 8a85380526..6ba4a2d799 100644
--- a/src/components/navigation-link.svelte
+++ b/src/components/navigation-link.svelte
@@ -5,10 +5,33 @@
   $: isActive = href === $page.path;
 </script>
 
-<a {href} class:active={isActive}><slot /></a>
+<a {href} class:active={isActive}><img class:active={isActive} src="/home.svg" alt="home"/><slot /></a>
 
 <style>
   a.active {
-    color: red;
+    background-color: #3730A3;
+    color: #FFF;
+  }
+  
+  img.active {
+    filter: sepia() saturate(0%) hue-rotate(30deg);
+  }
+
+  img {
+    margin-bottom: 10px;
+  }
+
+  a {
+    width: 90px;
+    color: #E0E7FF;
+    margin-bottom: 18px;
+    display: flex;
+    flex-flow: column;
+    align-items: center;
+    justify-content: center;
+    width: 96px;
+    height: 72px;
+    text-decoration: none;
+    position: relative;
   }
 </style>
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 924eb65aea..4d4a7c2c9f 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -15,9 +15,34 @@
 </svelte:head>
 
 <main>
-  <nav>
+  <nav id="sidebar">
+    <img id="logo" src="/logo.png" alt="gun" />
+    <p>Namespace: <br/> default </p>
     <NavigationLink href="/">Home</NavigationLink>
     <NavigationLink href="/workflows">Workflows</NavigationLink>
   </nav>
   <slot />
 </main>
+
+<style>
+  main {
+    display: grid;
+    grid-gap: 24px;
+    grid-template-columns: 1fr;
+  }
+  #logo {
+    margin-bottom: 20px;
+  }
+  p {
+    color: #FFF;
+    text-align: center;
+  }
+  #sidebar {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 112px;
+    padding: 24px 0px;
+    background-color: #4338CA;
+  }
+</style>
\ No newline at end of file
diff --git a/static/home.svg b/static/home.svg
new file mode 100644
index 0000000000..264bb31665
--- /dev/null
+++ b/static/home.svg
@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 10L3 8M3 8L10 1L17 8M3 8V18C3 18.5523 3.44772 19 4 19H7M17 8L19 10M17 8V18C17 18.5523 16.5523 19 16 19H13M7 19C7.55228 19 8 18.5523 8 18V14C8 13.4477 8.44772 13 9 13H11C11.5523 13 12 13.4477 12 14V18C12 18.5523 12.4477 19 13 19M7 19H13" stroke="#A5B4FC" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/static/logo.png b/static/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..bcd94f46eef7eef4d95e7db40abc940e5186bdef
GIT binary patch
literal 1388
zcmV-y1(W)TP)<h;3K|Lk000e1NJLTq001Na001Be1^@s6dXd_W00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1p!G!K~#7Ftyft{
zbyXBz&I67)<A9=Afd<Z?7zs`&5@J4xLWW@=n3#cO4@wW}LxqB%;Y%Q*4-P#zp{b>)
z_+XN04&;DCB%(Rwl*4YVt!H!2{m;GU{P+Jq_;jDM_u2cqXRr0GeE{^~6XY(E$(fgz
z$M*O4+4=c7=hV~`3k(cohU1VwB7@;IAQCyRvH&YCE*3)MTwY#gK0ZEbq8^d0NDnX*
zA0SWE#CUsq^Mxf5+uPgh?CeZj*Vosp36l6bnDMs0G%+D-Y;07#5m#4NmXVPm?wy{V
zvXGDvQ=<NQ8Bw2^6656L#Mal>#p3Dd>7uW*vs2u!tE)35h`6msRH()zEH^h-EV{C?
zqUa-WQs3_Gu9hI;FGvfy083fh5jh4LNJvN!?U9iYMc?%FG+-?8wws$9`1$#P2Hu6I
z@K6<0jSSJ40AgcfMZ34RSJ8KUeGS9I!{Qp_3Ur_r`Iey|CuFJClXiA?5EmE6+c!5i
zFgG{%!kC$v8PSf8js_jDMSdk+SU>-#6!+D7GA1SlEG(Y3{OITiii(QB(a{lXY;1rr
z2Di7j;Ns$<7;kND4fpr=T2sG|bVHs>0re{~%5W6LKu%5$Bqt|Be0;o~n0NsX4-c@o
zxCl#2OME*i&aSSm)P{bJ{FVe!X8kGMrC*qzpAT3TASo$Hyph+1lamvk3>_UEitR=G
zj7*``ijW<2CowUR5A^c#(wvxnDVic&TwK82-5nQBF-AYg-`^iRJUk#gJRIEJ-Hp!C
z*VhNt)zxr#cu1Gm$Tz6*4U(0Ymn-a_xVN{*+S}V1#tOqNV>p56D=aM3<1@V2l8aYV
zRIstJG1b}^92_i-f13pT5D*Z+Fh~`(sj8}qmjwCb{r&x73{`qPf(#iN8p_(*+7zO?
zy1JzP_qd>ff&$SwJ3GtJ)Kn)M92^wmFxbr!Brz*1i(x$Rx#(qJHgZASha4On#J=JH
zu(h=XH9S5(ingVtCA<nKxUH<Lc$;iP%u9c8E8z0-lHZ`fo|u>bj1lf3a*)qRpa3=p
zzP`TD(9i&*qoX2&DeEM!q80x^Ky!05)YR1Qn?XTA(AwI{uO}xbVSIcXwzjr-MoEzW
zDpR1WBgdwU%g)Z`RwCa4EW$j~o<W%gCGfnj=s#>@V?*^MXh>68R#sNVdU|?z2H}r2
zItLmh!#5^9_uumi;w3{&h91I7N=n%L{Jcp)WD~{&p)(tO4n2o;cXzXtloZ3~ev-dg
z)pK)1L<Fm>tYiZN1MJ}7KrwMsQ<JI~40e${MDjK|H(>~HKQpuv89$Z_Dgzy<nwpv_
z7Q#SO9TOE5CB|UvF?4J_Ht;XfpM*%cOQqu!G(g7<Dwc%E$Vid4a)gD2iT38^CLA9h
zgANQJ59ER<eVVkMB5R=fMR0a@7H1<lGBYzp8^6;)2j~rbAzjGb?K|X_*3<F|otBoS
z=p$dDw3eWDfK$QO$Q@&yG4S+3XLP^iWri$5-iHE3ANrP_*!j&+fT8~{AU_2Y7#bQ9
z2YGT`a&`%HhLT|T0ic2%cseQSg2@lX+S*!0F}An2XSh`gThRDW{2R>pdi@Z2q&A_a
zrzhLl*%6Dct*!C1lXTtE(qc-?5;73X#GA-Jz({#ebK=$2Rfe@tO$gPg@8Rh%|H}9X
uo<4mQi<Fj@DqMMCVZoS~apXIC7WyBf8-u&LEXF?o0000<MNUMnLSTXfVT2F>

literal 0
HcmV?d00001


From 1f665058428a8065180b1b14d6aeef706dce64ca Mon Sep 17 00:00:00 2001
From: MrSirDev <blankworldwide@gmail.com>
Date: Thu, 8 Jul 2021 20:57:10 -0700
Subject: [PATCH 02/10] Fixed layout of sidebar

---
 src/components/navigation-link.svelte |  4 ++--
 src/routes/__layout.svelte            | 11 +++++++----
 static/workflow.svg                   |  3 +++
 3 files changed, 12 insertions(+), 6 deletions(-)
 create mode 100644 static/workflow.svg

diff --git a/src/components/navigation-link.svelte b/src/components/navigation-link.svelte
index 6ba4a2d799..aff9358fcf 100644
--- a/src/components/navigation-link.svelte
+++ b/src/components/navigation-link.svelte
@@ -1,11 +1,11 @@
 <script>
   import { page } from '$app/stores';
 
-  $: ({ href, ...inputProps } = $$props);
+  $: ({ href, icon, ...inputProps } = $$props);
   $: isActive = href === $page.path;
 </script>
 
-<a {href} class:active={isActive}><img class:active={isActive} src="/home.svg" alt="home"/><slot /></a>
+<a {href} class:active={isActive}><img class:active={isActive} src={icon} alt="home"/><slot /></a>
 
 <style>
   a.active {
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 4d4a7c2c9f..eb407f20b1 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -18,17 +18,19 @@
   <nav id="sidebar">
     <img id="logo" src="/logo.png" alt="gun" />
     <p>Namespace: <br/> default </p>
-    <NavigationLink href="/">Home</NavigationLink>
-    <NavigationLink href="/workflows">Workflows</NavigationLink>
+    <NavigationLink href="/" icon="/home.svg">Dashboard</NavigationLink>
+    <NavigationLink href="/workflows" icon="/workflow.svg">Workflows</NavigationLink>
   </nav>
-  <slot />
+  <div>
+    <slot />
+  </div>
 </main>
 
 <style>
   main {
     display: grid;
     grid-gap: 24px;
-    grid-template-columns: 1fr;
+    grid-template-columns: 0fr 1fr;
   }
   #logo {
     margin-bottom: 20px;
@@ -42,6 +44,7 @@
     flex-direction: column;
     align-items: center;
     width: 112px;
+    height: 100vh;
     padding: 24px 0px;
     background-color: #4338CA;
   }
diff --git a/static/workflow.svg b/static/workflow.svg
new file mode 100644
index 0000000000..2c47920cbd
--- /dev/null
+++ b/static/workflow.svg
@@ -0,0 +1,3 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 13L5.58579 8.41421C6.36683 7.63317 7.63316 7.63316 8.41421 8.41421L13 13M11 11L12.5858 9.41421C13.3668 8.63317 14.6332 8.63316 15.4142 9.41421L17 11M11 5H11.01M3 17H15C16.1046 17 17 16.1046 17 15V3C17 1.89543 16.1046 1 15 1H3C1.89543 1 1 1.89543 1 3V15C1 16.1046 1.89543 17 3 17Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

From afdfd0c89abf5cc62f8c0647ae695a564fb451d1 Mon Sep 17 00:00:00 2001
From: MrSirDev <blankworldwide@gmail.com>
Date: Thu, 8 Jul 2021 20:59:06 -0700
Subject: [PATCH 03/10] Fixed dummy alt tag

---
 src/routes/__layout.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index eb407f20b1..d79bdcca30 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -16,7 +16,7 @@
 
 <main>
   <nav id="sidebar">
-    <img id="logo" src="/logo.png" alt="gun" />
+    <img id="logo" src="/logo.png" alt="Temporal Logo" />
     <p>Namespace: <br/> default </p>
     <NavigationLink href="/" icon="/home.svg">Dashboard</NavigationLink>
     <NavigationLink href="/workflows" icon="/workflow.svg">Workflows</NavigationLink>

From e529941c9472a7f60dff742436923cc961e2face Mon Sep 17 00:00:00 2001
From: MrSirDev <blankworldwide@gmail.com>
Date: Thu, 8 Jul 2021 21:01:32 -0700
Subject: [PATCH 04/10] Added alt tags to icons

---
 src/components/navigation-link.svelte | 4 ++--
 src/routes/__layout.svelte            | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/navigation-link.svelte b/src/components/navigation-link.svelte
index aff9358fcf..5e41ca2720 100644
--- a/src/components/navigation-link.svelte
+++ b/src/components/navigation-link.svelte
@@ -1,11 +1,11 @@
 <script>
   import { page } from '$app/stores';
 
-  $: ({ href, icon, ...inputProps } = $$props);
+  $: ({ href, src, alt, ...inputProps } = $$props);
   $: isActive = href === $page.path;
 </script>
 
-<a {href} class:active={isActive}><img class:active={isActive} src={icon} alt="home"/><slot /></a>
+<a {href} class:active={isActive}><img class:active={isActive} {src} {alt} /><slot /></a>
 
 <style>
   a.active {
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index d79bdcca30..e6498553eb 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -18,8 +18,8 @@
   <nav id="sidebar">
     <img id="logo" src="/logo.png" alt="Temporal Logo" />
     <p>Namespace: <br/> default </p>
-    <NavigationLink href="/" icon="/home.svg">Dashboard</NavigationLink>
-    <NavigationLink href="/workflows" icon="/workflow.svg">Workflows</NavigationLink>
+    <NavigationLink href="/" src="/home.svg" alt="Dashboard Icon">Dashboard</NavigationLink>
+    <NavigationLink href="/workflows" src="/workflow.svg" alt="Workflow Icon">Workflows</NavigationLink>
   </nav>
   <div>
     <slot />

From 422b059174825cdfa7180bc2e827154ab9ac49e2 Mon Sep 17 00:00:00 2001
From: MrSirDev <blankworldwide@gmail.com>
Date: Mon, 12 Jul 2021 10:11:38 -0700
Subject: [PATCH 05/10] prettier lint

---
 src/components/navigation-link.svelte | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/navigation-link.svelte b/src/components/navigation-link.svelte
index 5e41ca2720..16d3e97a8c 100644
--- a/src/components/navigation-link.svelte
+++ b/src/components/navigation-link.svelte
@@ -5,14 +5,16 @@
   $: isActive = href === $page.path;
 </script>
 
-<a {href} class:active={isActive}><img class:active={isActive} {src} {alt} /><slot /></a>
+<a {href} class:active={isActive}
+  ><img class:active={isActive} {src} {alt} /><slot /></a
+>
 
 <style>
   a.active {
-    background-color: #3730A3;
-    color: #FFF;
+    background-color: #3730a3;
+    color: #fff;
   }
-  
+
   img.active {
     filter: sepia() saturate(0%) hue-rotate(30deg);
   }
@@ -23,7 +25,7 @@
 
   a {
     width: 90px;
-    color: #E0E7FF;
+    color: #e0e7ff;
     margin-bottom: 18px;
     display: flex;
     flex-flow: column;

From 5438cd354d12824dddaaf20bc39ba0f4a580611f Mon Sep 17 00:00:00 2001
From: MrSirDev <blankworldwide@gmail.com>
Date: Mon, 12 Jul 2021 10:12:06 -0700
Subject: [PATCH 06/10] lint

---
 src/routes/__layout.svelte | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index e6498553eb..8aeafee2a9 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -17,9 +17,13 @@
 <main>
   <nav id="sidebar">
     <img id="logo" src="/logo.png" alt="Temporal Logo" />
-    <p>Namespace: <br/> default </p>
-    <NavigationLink href="/" src="/home.svg" alt="Dashboard Icon">Dashboard</NavigationLink>
-    <NavigationLink href="/workflows" src="/workflow.svg" alt="Workflow Icon">Workflows</NavigationLink>
+    <p>Namespace: <br /> default</p>
+    <NavigationLink href="/" src="/home.svg" alt="Dashboard Icon"
+      >Dashboard</NavigationLink
+    >
+    <NavigationLink href="/workflows" src="/workflow.svg" alt="Workflow Icon"
+      >Workflows</NavigationLink
+    >
   </nav>
   <div>
     <slot />
@@ -36,7 +40,7 @@
     margin-bottom: 20px;
   }
   p {
-    color: #FFF;
+    color: #fff;
     text-align: center;
   }
   #sidebar {
@@ -46,6 +50,6 @@
     width: 112px;
     height: 100vh;
     padding: 24px 0px;
-    background-color: #4338CA;
+    background-color: #4338ca;
   }
-</style>
\ No newline at end of file
+</style>

From aaf58842beada12e4be09fa2fa9197586b5c7b7b Mon Sep 17 00:00:00 2001
From: MrSirDev <blankworldwide@gmail.com>
Date: Mon, 12 Jul 2021 11:07:22 -0700
Subject: [PATCH 07/10] font change

---
 src/components/navigation-link.svelte | 1 +
 src/routes/__layout.svelte            | 7 +++++++
 2 files changed, 8 insertions(+)

diff --git a/src/components/navigation-link.svelte b/src/components/navigation-link.svelte
index 16d3e97a8c..68286309fa 100644
--- a/src/components/navigation-link.svelte
+++ b/src/components/navigation-link.svelte
@@ -25,6 +25,7 @@
 
   a {
     width: 90px;
+    font-size: 12px;
     color: #e0e7ff;
     margin-bottom: 18px;
     display: flex;
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 8aeafee2a9..416babe8d7 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -31,6 +31,12 @@
 </main>
 
 <style>
+  @import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+
+  :global(body) {
+    font-family: Inter;
+  }
+
   main {
     display: grid;
     grid-gap: 24px;
@@ -42,6 +48,7 @@
   p {
     color: #fff;
     text-align: center;
+    font-size: 12px;
   }
   #sidebar {
     display: flex;

From 1b09f9f8b7d6d2eaca4f32cc6d669112cc05e233 Mon Sep 17 00:00:00 2001
From: Steve Kinney <hello@stevekinney.net>
Date: Wed, 14 Jul 2021 12:47:17 -0400
Subject: [PATCH 08/10] Move global CSS to static file

---
 src/app.html               | 1 +
 src/routes/__layout.svelte | 9 +++------
 2 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/app.html b/src/app.html
index 526fdb8a9f..365ad6737c 100644
--- a/src/app.html
+++ b/src/app.html
@@ -5,6 +5,7 @@
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <link rel="stylesheet" href="/css/normalize.css" />
+    <link rel="stylesheet" href="/css/global.css" />
     %svelte.head%
   </head>
   <body>
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 625dea9e5f..b699bf486f 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -31,25 +31,22 @@
 </main>
 
 <style>
-  @import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
-
-  :global(body) {
-    font-family: Inter;
-  }
-
   main {
     display: grid;
     grid-gap: 24px;
     grid-template-columns: 0fr 1fr;
   }
+
   #logo {
     margin-bottom: 20px;
   }
+
   p {
     color: #fff;
     text-align: center;
     font-size: 12px;
   }
+  
   #sidebar {
     display: flex;
     flex-direction: column;

From a824ed3a5147728210d9dae5701181c1abcc7154 Mon Sep 17 00:00:00 2001
From: Steve Kinney <hello@stevekinney.net>
Date: Wed, 14 Jul 2021 12:47:40 -0400
Subject: [PATCH 09/10] Format files

---
 src/routes/__layout.svelte | 2 +-
 static/css/global.css      | 9 +++++++++
 2 files changed, 10 insertions(+), 1 deletion(-)
 create mode 100644 static/css/global.css

diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index b699bf486f..f854fcca47 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -46,7 +46,7 @@
     text-align: center;
     font-size: 12px;
   }
-  
+
   #sidebar {
     display: flex;
     flex-direction: column;
diff --git a/static/css/global.css b/static/css/global.css
new file mode 100644
index 0000000000..af30bed8b7
--- /dev/null
+++ b/static/css/global.css
@@ -0,0 +1,9 @@
+@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
+
+*, html, body {
+  box-sizing: border-box;
+}
+
+body {
+  font-family: Inter;
+}
\ No newline at end of file

From 69864adc8ba201d6271951915951fe86ce519754 Mon Sep 17 00:00:00 2001
From: Steve Kinney <hello@stevekinney.net>
Date: Wed, 14 Jul 2021 12:51:13 -0400
Subject: [PATCH 10/10] Add trailing new line

---
 static/css/global.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/static/css/global.css b/static/css/global.css
index af30bed8b7..9de9851443 100644
--- a/static/css/global.css
+++ b/static/css/global.css
@@ -6,4 +6,4 @@
 
 body {
   font-family: Inter;
-}
\ No newline at end of file
+}