From a510cdecd533d1b1ddd57a8d9fb923ad844ecd67 Mon Sep 17 00:00:00 2001 From: Zhang Minghan Date: Fri, 4 Aug 2023 09:57:15 +0800 Subject: [PATCH] update tool box --- public/tool/cloudflare.svg | 1 + public/tool/codepen.svg | 1 + public/tool/convert.svg | 1 + public/tool/github.svg | 1 + public/tool/jsdelivr.svg | 1 + public/tool/kaggle.svg | 1 + public/tool/lightnotes.ico | Bin 0 -> 10187 bytes public/tool/openai.svg | 1 + public/tool/readthedocs.svg | 1 + public/tool/replit.svg | 1 + public/tool/stackoverflow.svg | 1 + public/tool/twitter.svg | 1 + public/tool/vercel.svg | 1 + src/assets/script/service.ts | 2 +- src/assets/script/tool.ts | 15 ++++++ src/components/ToolBox.vue | 90 +++++++++++++++++++++------------- 16 files changed, 83 insertions(+), 36 deletions(-) create mode 100644 public/tool/cloudflare.svg create mode 100644 public/tool/codepen.svg create mode 100644 public/tool/convert.svg create mode 100644 public/tool/github.svg create mode 100644 public/tool/jsdelivr.svg create mode 100644 public/tool/kaggle.svg create mode 100644 public/tool/lightnotes.ico create mode 100644 public/tool/openai.svg create mode 100644 public/tool/readthedocs.svg create mode 100644 public/tool/replit.svg create mode 100644 public/tool/stackoverflow.svg create mode 100644 public/tool/twitter.svg create mode 100644 public/tool/vercel.svg create mode 100644 src/assets/script/tool.ts diff --git a/public/tool/cloudflare.svg b/public/tool/cloudflare.svg new file mode 100644 index 0000000..10e5e71 --- /dev/null +++ b/public/tool/cloudflare.svg @@ -0,0 +1 @@ + diff --git a/public/tool/codepen.svg b/public/tool/codepen.svg new file mode 100644 index 0000000..27605cc --- /dev/null +++ b/public/tool/codepen.svg @@ -0,0 +1 @@ +Codepen diff --git a/public/tool/convert.svg b/public/tool/convert.svg new file mode 100644 index 0000000..884e639 --- /dev/null +++ b/public/tool/convert.svg @@ -0,0 +1 @@ + diff --git a/public/tool/github.svg b/public/tool/github.svg new file mode 100644 index 0000000..11920a4 --- /dev/null +++ b/public/tool/github.svg @@ -0,0 +1 @@ + diff --git a/public/tool/jsdelivr.svg b/public/tool/jsdelivr.svg new file mode 100644 index 0000000..2864f27 --- /dev/null +++ b/public/tool/jsdelivr.svg @@ -0,0 +1 @@ + diff --git a/public/tool/kaggle.svg b/public/tool/kaggle.svg new file mode 100644 index 0000000..dc75f80 --- /dev/null +++ b/public/tool/kaggle.svg @@ -0,0 +1 @@ +Kaggle diff --git a/public/tool/lightnotes.ico b/public/tool/lightnotes.ico new file mode 100644 index 0000000000000000000000000000000000000000..d231ad06b80a12c7708bdbd2d3cb1155bbb78310 GIT binary patch literal 10187 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 diff --git a/public/tool/readthedocs.svg b/public/tool/readthedocs.svg new file mode 100644 index 0000000..39052c5 --- /dev/null +++ b/public/tool/readthedocs.svg @@ -0,0 +1 @@ +Read the Docs diff --git a/public/tool/replit.svg b/public/tool/replit.svg new file mode 100644 index 0000000..9fc2f89 --- /dev/null +++ b/public/tool/replit.svg @@ -0,0 +1 @@ +replit diff --git a/public/tool/stackoverflow.svg b/public/tool/stackoverflow.svg new file mode 100644 index 0000000..96aab7c --- /dev/null +++ b/public/tool/stackoverflow.svg @@ -0,0 +1 @@ + diff --git a/public/tool/twitter.svg b/public/tool/twitter.svg new file mode 100644 index 0000000..e4fc167 --- /dev/null +++ b/public/tool/twitter.svg @@ -0,0 +1 @@ + diff --git a/public/tool/vercel.svg b/public/tool/vercel.svg new file mode 100644 index 0000000..3cd28a7 --- /dev/null +++ b/public/tool/vercel.svg @@ -0,0 +1 @@ +Vercel diff --git a/src/assets/script/service.ts b/src/assets/script/service.ts index 9c8d20e..73ebfaa 100644 --- a/src/assets/script/service.ts +++ b/src/assets/script/service.ts @@ -2,7 +2,7 @@ import { useRegisterSW } from "virtual:pwa-register/vue"; import { ref, watch } from "vue"; -export const version = "1.8.2"; +export const version = "1.9.0"; export const updater = ref(false); diff --git a/src/assets/script/tool.ts b/src/assets/script/tool.ts new file mode 100644 index 0000000..1d95eed --- /dev/null +++ b/src/assets/script/tool.ts @@ -0,0 +1,15 @@ +export type Tool = { + type: ToolType, + name: string, + icon: string, + link: string, +} + +export type ToolList = Tool[]; +export type ToolMap = { [key: string]: Tool }; + +export enum ToolTypes { + BUILTIN, + CUSTOM, +} +export type ToolType = ToolTypes.BUILTIN | ToolTypes.CUSTOM; diff --git a/src/components/ToolBox.vue b/src/components/ToolBox.vue index b6d92f7..5135a1f 100644 --- a/src/components/ToolBox.vue +++ b/src/components/ToolBox.vue @@ -3,6 +3,8 @@ import {onMounted, ref} from "vue"; import {context} from "@/assets/script/shared"; import DateCard from "@/components/cards/DateCard.vue"; import WeatherCard from "@/components/cards/WeatherCard.vue"; +import type {ToolList} from "@/assets/script/tool"; +import {ToolTypes} from "@/assets/script/tool"; const props = defineProps<{ focus: boolean, @@ -33,20 +35,19 @@ window.addEventListener('contextmenu', (e) => { } }); -let tools = [ - { link: "github.com", icon: `Github` }, - { link: "chat.openai.com", icon: `chatGPT` }, - { link: "stackoverflow.com", icon: `Stack Overflow` }, - { link: "twitter.com", icon: `Twitter` }, - { link: "dash.cloudflare.com", icon: `Cloudflare` }, - { link: "vercel.com", icon: `Vercel` }, - { link: "codepen.io", icon: `Codepen` }, - { link: "kaggle.com", icon: `Kaggle` }, - { link: "replit.com", icon: `Replit` }, - { link: "readthedocs.io", icon: `Read the Docs` }, - { link: "shields.io", icon: `Shields.io` }, - { link: "jsdelivr.com", icon: `jsDelivr` }, -], renderer = ref(tools); +let tools: ToolList = [ + { "type": ToolTypes.BUILTIN, "name": "GitHub", "link": "https://github.com", "icon": "/tool/github.svg" }, + { "type": ToolTypes.BUILTIN, "name": "OpenAI", "link": "https://chat.openai.com", "icon": "/tool/openai.svg" }, + { "type": ToolTypes.BUILTIN, "name": "Stack Overflow", "link": "https://stackoverflow.com", "icon": "/tool/stackoverflow.svg" }, + { "type": ToolTypes.BUILTIN, "name": "ConvertIO", link: "https://convertio.co", "icon": "/tool/convert.svg" }, + { "type": ToolTypes.BUILTIN, "name": "Light Notes", "link": "https://notes.lightxi.com", "icon": "/tool/lightnotes.ico" }, + { "type": ToolTypes.BUILTIN, "name": "Twitter", "link": "https://twitter.com", "icon": "/tool/twitter.svg" }, + { "type": ToolTypes.BUILTIN, "name": "Cloudflare", "link": "https://dash.cloudflare.com", "icon": "/tool/cloudflare.svg" }, + { "type": ToolTypes.BUILTIN, "name": "Vercel", "link": "https://vercel.com", "icon": "/tool/vercel.svg" }, + { "type": ToolTypes.BUILTIN, "name": "Codepen", "link": "https://codepen.io", "icon": "/tool/codepen.svg" }, + { "type": ToolTypes.BUILTIN, "name": "Kaggle", "link": "https://kaggle.com", "icon": "/tool/kaggle.svg" }, + { "type": ToolTypes.BUILTIN, "name": "Replit", "link": "https://replit.com", "icon": "/tool/replit.svg" }, +]; function redirect(uri: string) { window.location.href = uri; @@ -60,12 +61,10 @@ function redirect(uri: string) { @@ -111,7 +110,7 @@ function redirect(uri: string) { display: flex; flex-wrap: wrap; width: max-content; - max-width: min(90%, 600px); + max-width: min(90%, 820px); height: max-content; transition: .25s; justify-content: center; @@ -132,25 +131,46 @@ function redirect(uri: string) { .tool { position: relative; - backdrop-filter: blur(6px); - display: inline-block; - background: rgba(0,0,0,0.4); - width: 60px; - height: 60px; + display: flex; + flex-direction: column; + width: max-content; + height: max-content; margin: 15px 15px 30px 15px; - transition: .3s; - border-radius: 6px; - overflow: hidden; + transition: .25s; cursor: pointer; } -.tool svg { - width: 40px; - height: 40px; - padding: 4px; - margin: 10px; +.tool img { + border-radius: 6px; + background: rgba(0,0,0,0.8); + box-shadow: 0 0 2px 2px rgba(0,0,0,0.2); + width: 80px; + height: 80px; + padding: 20px; fill: rgba(255,255,255,0.85); - transition: .25s; + transition: .2s; +} + +.tool div { + width: max-content; + white-space: nowrap; + position: absolute; + bottom: -24px; + left: 50%; + transform: translateX(-50%); + color: rgba(255,255,255,0.95); + font-family: var(--fonts-cn); + font-size: 14px; + transition: .2s; +} + +.tool:hover img { + background: rgba(0,0,0,0.95); + transform: scale(1.1); +} + +.tool:hover div { + bottom: -30px; } .tool:hover svg {