From 8a2acacc37ee9b1e7dcc03acec25a00fac7db934 Mon Sep 17 00:00:00 2001
From: Lea Anthony <lea.anthony@gmail.com>
Date: Thu, 8 Oct 2020 21:03:45 +1100
Subject: [PATCH] Start Events. List styling moved to global scope.

---
 v2/test/kitchensink/frontend/src/App.svelte   | 10 +++++++
 .../kitchensink/frontend/src/MainPage.svelte  |  2 +-
 .../frontend/src/components/CodeBlock.svelte  |  2 +-
 .../frontend/src/pages/Events.svelte          | 26 ------------------
 .../frontend/src/pages/events/Events.svelte   | 27 +++++++++++++++++++
 .../frontend/src/pages/logging/Logging.svelte | 13 ---------
 6 files changed, 39 insertions(+), 41 deletions(-)
 delete mode 100644 v2/test/kitchensink/frontend/src/pages/Events.svelte
 create mode 100644 v2/test/kitchensink/frontend/src/pages/events/Events.svelte

diff --git a/v2/test/kitchensink/frontend/src/App.svelte b/v2/test/kitchensink/frontend/src/App.svelte
index 866ac69a..716ed00b 100644
--- a/v2/test/kitchensink/frontend/src/App.svelte
+++ b/v2/test/kitchensink/frontend/src/App.svelte
@@ -173,4 +173,14 @@
               user-select: initial; /* Non-prefixed version, currently
                                     supported by Chrome, Edge, Opera and Firefox */
   }
+
+  .list {
+      margin-top: 2rem;
+      margin-left: 2rem;
+  }
+
+  .list li {
+      margin-bottom: 0.5rem;
+  }
+
 </style>
diff --git a/v2/test/kitchensink/frontend/src/MainPage.svelte b/v2/test/kitchensink/frontend/src/MainPage.svelte
index 53807fbb..66f494f2 100644
--- a/v2/test/kitchensink/frontend/src/MainPage.svelte
+++ b/v2/test/kitchensink/frontend/src/MainPage.svelte
@@ -3,7 +3,7 @@
     import {selectedPage} from './Store';
     import TitlePage from './pages/TitlePage.svelte';
     import Logging from './pages/logging/Logging.svelte';
-    import Events from './pages/Events.svelte';
+    import Events from './pages/events/Events.svelte';
 
 </script>
 
diff --git a/v2/test/kitchensink/frontend/src/components/CodeBlock.svelte b/v2/test/kitchensink/frontend/src/components/CodeBlock.svelte
index 9465f1c5..2935711c 100644
--- a/v2/test/kitchensink/frontend/src/components/CodeBlock.svelte
+++ b/v2/test/kitchensink/frontend/src/components/CodeBlock.svelte
@@ -154,7 +154,7 @@
         border-top: 1px solid #5555;
         margin-top: 10px;
         padding-top: 5px;
-        /* margin-bottom: 15px; */
+        width: 100%;
     }
 
 </style>
\ No newline at end of file
diff --git a/v2/test/kitchensink/frontend/src/pages/Events.svelte b/v2/test/kitchensink/frontend/src/pages/Events.svelte
deleted file mode 100644
index f7ccdf9d..00000000
--- a/v2/test/kitchensink/frontend/src/pages/Events.svelte
+++ /dev/null
@@ -1,26 +0,0 @@
-<script>
-
-    import CodeBlock from '../components/CodeBlock.svelte';
-
-</script>
-
-<div>
-    <h4>Events</h4>
-
-    Wails includes a unified events system which allows you to do the following in either Go or Javascript:
-
-    <ul>
-        <li>On</li>
-        <li>Once</li>
-        <li>OnMultiple</li>
-        <li>Emit</li>
-    </ul>
-
-    <CodeBlock title="Events.On(eventName, callback)" description="etc etc etc "></CodeBlock>
-</div>
-
-<style>
-    h5 {
-        margin-top: 3rem;
-    }
-</style>
\ No newline at end of file
diff --git a/v2/test/kitchensink/frontend/src/pages/events/Events.svelte b/v2/test/kitchensink/frontend/src/pages/events/Events.svelte
new file mode 100644
index 00000000..dab7d4b3
--- /dev/null
+++ b/v2/test/kitchensink/frontend/src/pages/events/Events.svelte
@@ -0,0 +1,27 @@
+<script>
+
+    import CodeBlock from '../../components/CodeBlock.svelte';
+
+</script>
+
+<div>
+    <h4>Events</h4>
+
+    Wails includes a unified events system which allows you to send events in either Go or Javascript and receive them in either Go or Javascript. The events methods may be accessed through the <code>runtime.Events</code> object. Available methods are:
+
+    <ul class="list">
+        <li>On</li>
+        <li>Once</li>
+        <li>OnMultiple</li>
+        <li>Emit</li>
+    </ul>
+
+    Events are intraoperable and data sent in events is translated between Go and Javascript automatically.
+
+    <div style="padding: 15px"></div>
+     
+    <CodeBlock title="Events.On(eventName, callback)" description="etc etc etc "></CodeBlock>
+</div>
+
+<style>
+</style>
\ No newline at end of file
diff --git a/v2/test/kitchensink/frontend/src/pages/logging/Logging.svelte b/v2/test/kitchensink/frontend/src/pages/logging/Logging.svelte
index 6620eba7..bc44f64d 100644
--- a/v2/test/kitchensink/frontend/src/pages/logging/Logging.svelte
+++ b/v2/test/kitchensink/frontend/src/pages/logging/Logging.svelte
@@ -67,16 +67,3 @@
         </div>
     </CodeBlock>
 </div>
-
-<style>
-
-    .list {
-        margin-top: 2rem;
-        margin-left: 2rem;
-    }
-
-    .list li {
-        margin-bottom: 0.5rem;
-    }
-
-</style>
\ No newline at end of file