chore: import upstream snapshot with attribution

guide/src/App.vue

@@ -0,0 +1,168 @@
+<template>
+  <div class="guide-container">
+    <div class="step0" v-show="step === 0">
+      <div class="title">您好，我叫 Rubick</div>
+      <div class="desc">快捷键 <span class="down-line">Alt + R</span> 可以快速打开我</div>
+      <div class="img-container">
+        <img class="img" src="./assets/img.png" />
+        <div class="info">
+          <svg class="top-icon" focusable="false" aria-hidden="true" viewBox="0 0 24 24" data-testid="NorthIcon"><path d="m5 9 1.41 1.41L11 5.83V22h2V5.83l4.59 4.59L19 9l-7-7-7 7z"></path></svg>
+          点击 logo 进入插件市场
+        </div>
+      </div>
+    </div>
+    <div class="step0 step1" v-show="step === 1">
+      <div class="title">选择需要的插件安装</div>
+      <div class="desc">基于 <span class="down-line">npm</span> 的插件包管理，像小程序一样，用完即走</div>
+      <div class="img-container">
+        <img class="img" src="./assets/img_1.png" />
+      </div>
+    </div>
+    <div class="step0" v-show="step === 2">
+      <div class="title"><span class="down-line">关键字</span>搜索应用和插件</div>
+      <div class="desc">搜索框内输入关键字可以搜索安装的应用和插件</div>
+      <div class="img-container">
+        <img class="img" src="./assets/img_2.png" />
+      </div>
+    </div>
+    <div class="step0 step1" v-show="step === 3">
+      <div class="title">完全开源免费，支持内网部署</div>
+      <div class="desc">进入插件市场的 <span class="down-line">账户与设置</span> 菜单，进行内网部署设置</div>
+      <div class="img-container">
+        <img class="img" src="./assets/img_3.png" />
+      </div>
+    </div>
+    <div class="footer">
+      <div></div>
+      <div class="step">
+        <span class="step-num">{{ step + 1 }} / 4</span>
+        <div class="button" @click="netStep">{{ step + 1 === 4 ? '完成' : '下一步' }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const step = ref(0);
+const { ipcRenderer } = window.require('electron');
+
+const netStep = () => {
+  if (step.value >= 3) {
+    return ipcRenderer.send('guide:service', { type: 'close' });
+  }
+  step.value = step.value + 1;
+}
+
+
+</script>
+
+<style lang="less">
+@text-color: #574777; // 全局主色
+@primary-color: #ff4ea4; // 全局主色
+
+* {
+  margin: 0;
+  padding: 0;
+}
+.guide-container {
+  .step0 {
+    padding: 28px;
+    padding-top: 36px;
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    width: 100vw;
+    height: 100vh;
+  }
+  .title {
+    font-size: 28px;
+    font-weight: 600;
+    color: @text-color;
+  }
+  .down-line {
+    line-height: 24px;
+    color: @primary-color;
+  }
+  .desc {
+    padding-top: 10px;
+    box-sizing: border-box;
+    font-size: 24px;
+  }
+  .img-container {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+  .img {
+    width: 680px;
+  }
+  .info {
+    padding-top: 42px;
+    margin-left: 84px;
+    box-sizing: border-box;
+    text-align: left;
+    position: relative;
+    align-self: flex-start;
+    color: @text-color;
+    .top-icon {
+      position: absolute;
+      left: 0;
+      top: 0;
+      user-select: none;
+      width: 1em;
+      height: 1em;
+      display: inline-block;
+      fill: currentcolor;
+      flex-shrink: 0;
+      transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+      font-size: 1.5rem;
+    }
+  }
+}
+.footer {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 20px;
+  box-sizing: border-box;
+  .step {
+    display: flex;
+    align-items: center;
+  }
+  .step-num {
+    margin-right: 20px;
+  }
+  .button {
+    width: 100px;
+    height: 40px;
+    line-height: 40px;
+    background: @primary-color;
+    color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 4px;
+    cursor: pointer;
+    user-select: none;
+  }
+}
+
+.step4 {
+  .img {
+    width: 300px;
+  }
+}
+.step1 {
+  .img {
+    width: 550px;
+  }
+}
+</style>

guide/src/main.js

@@ -0,0 +1,4 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+
+createApp(App).mount('#app')