Merge pull request #54 from codex-team/demo-workspace

Demo workspace button added
codex-team · Feb 22, 2022 · 7f3fe92 · 7f3fe92
2 parents 0dbc79f + e9f1338
commit 7f3fe92
Show file tree

Hide file tree

Showing 3 changed files with 1,135 additions and 2,284 deletions.
diff --git a/components/ui-button.vue b/components/ui-button.vue
@@ -5,6 +5,7 @@
     :class="{
       'button--primary': primary,
       'button--secondary': !primary,
+      'button--demo': demo,
     }"
     :href="link"
   >
@@ -33,6 +34,14 @@ export default Vue.extend({
       default: false,
     },
 
+    /**
+     * Pass true to make button look for demo version
+     */
+    demo: {
+      type: Boolean,
+      default: false,
+    },
+
     /**
      * Link href attribute
      */
@@ -86,6 +95,18 @@ export default Vue.extend({
     }
   }
 
+  &--demo {
+    background-color: #fff;
+    background-image: linear-gradient(#3ca8ff, #0275ed 98.74%);
+    color: #fff;
+
+    &:hover {
+      background-color: #fff;
+      background-image: linear-gradient(#3ca8ff, #0275ed 99.74%);
+      color: #fff;
+    }
+  }
+
   svg {
     margin-right: 20px;
     flex-shrink: 0;

diff --git a/pages/index.vue b/pages/index.vue
@@ -27,12 +27,20 @@
              <ui-button
               :label="downloadButtonLabel"
               :link="downloadButtonHref"
-
             >
               <template v-slot:icon>
                 <icon-download />
               </template>
             </ui-button>
+            <ui-button
+              label="Join Demo Workspace"
+              link="https://garage.hawk.so/join/6e9fe41c8d6d59b272fda8c43c076ddcb571d3b5b09ad1e95e3a770b6358289c"
+              demo
+            >
+              <template v-slot:icon>
+                <icon-sign-in />
+              </template>
+            </ui-button>
           </div>
         </div>
         <div class="landing__content-preview" :style="`transform: translateY(${Math.max(0, 150 - scroll * 0.35)}px)`">
@@ -455,7 +463,7 @@ export default Vue.extend({
           }
         }
 
-        .button--primary {
+        .button:not(:last-of-type) {
           margin-bottom: 20px;
         }
       }