Merge pull request #229 from mattfarina/welcome-general

Updating welcome screen

Author: mattfarina

scripts/dev.mjs

@@ -52,7 +52,7 @@ class DevRunner extends events.EventEmitter {
     // Wait for the renderer to finish, so that the output from nuxt doesn't
     // clobber debugging output.
     while (true) {
-      if ((await fetch('http://localhost:8888/pages/Welcome')).ok) {
+      if ((await fetch('http://localhost:8888/pages/General')).ok) {
         break;
       }
       await util.promisify(setTimeout)(1000);

src/assets/styles/base/_typography.scss

@@ -35,18 +35,14 @@ H6 {
 }
 
 P {
-  font-size: 1.4em;
-  line-height: 1.75em;
   font-weight: 400;
   font-style: normal;
   margin: 0;
 }
 
 //code
 code, samp, kbd, .monospace {
-  font-family: "Courier New", Courier, monospace, sans-serif;
   text-align: left;
-  // color: var(--secondary);
 }
 
 pre {
@@ -58,13 +54,14 @@ pre {
 }
 
 code {
-  background: var(--box-bg);
-  padding: 2.5px 10px;
+  background-color: var(--box-bg);
+  display: inline-block;
+  padding: 5px;
+  border: 1px solid var(--border);
   border-radius: var(--border-radius);
 }
 
 pre code {
   background: transparent;
   padding: 0;
 }
-

src/components/TelemetryOptIn.vue

@@ -36,7 +36,7 @@ export default {
 <style scoped>
 p.fineprint {
   font-size: small;
-  margin-right: 50%;
   margin-top: 2px;
+  color: var(--input-label);
 }
 </style>

src/layouts/default.vue

@@ -18,7 +18,7 @@ export default {
   },
 
   data() {
-    return { routes: ['/Welcome', '/K8s', '/PortForwarding', '/Images', '/Troubleshooting'] };
+    return { routes: ['/General', '/K8s', '/PortForwarding', '/Images', '/Troubleshooting'] };
   },
 
   head() {

src/middleware/indexRedirect.js

@@ -1,10 +1,10 @@
 /**
- * This middleware redirects / to /Welcome
+ * This middleware redirects / to /General
  */
 export default ({ route, next, redirect }) => {
   switch (route.path) {
   case '/':
-    redirect(301, '/Welcome');
+    redirect(301, '/General');
     break;
   default:
     next();

src/pages/Welcome.vue src/pages/General.vuesrc/pages/Welcome.vue renamed to src/pages/General.vue

@@ -1,12 +1,18 @@
 <router lang="yaml">
-  name: Welcome
+  name: General
 </router>
 <template>
   <div>
-    <div class="welcome">
-      <p>
-        Welcome...
-      </p>
+    <div class="general">
+      <h1>
+        Welcome to Rancher Desktop
+      </h1>
+      <p>Rancher Desktop provides Kubernetes and image management through the use of a desktop application.</p>
+      <ul>
+        <li>Project Status: <i>alpha</i></li>
+        <li>Project Discussions: #rancher-desktop in <a href="#" onclick="require('electron').shell.openExternal('https://slack.rancher.io/')">Rancher Users</a> Slack</li>
+        <li>Project Links: <a href="#" onclick="require('electron').shell.openExternal('https://github.com/rancher-sandbox/rd')">Homepage</a> <a href="#" onclick="require('electron').shell.openExternal('https://github.com/rancher-sandbox/rd/issues')">Issues</a></li>
+      </ul>
     </div>
     <hr>
     <telemetry-opt-in
@@ -21,8 +27,8 @@ import TelemetryOptIn from '@/components/TelemetryOptIn.vue';
 const { ipcRenderer } = require('electron');
 
 export default {
-  name:       'Welcome',
-  title:      'Welcome',
+  name:       'General',
+  title:      'General',
   components: { TelemetryOptIn },
   data() {
     return {
@@ -50,4 +56,9 @@ export default {
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped>
+
+.general li {
+  margin-bottom: .5em;
+}
+
 </style>