feat(ui): rebuild homepage with new sections and i18n
This commit introduces a complete overhaul of the homepage, rebuilding it from the ground up with Nuxt UI and full internationalization support. The new design better showcases the studio's capabilities and projects. - Re-architected the index page with multiple new sections: Capabilities, Featured Projects, Tech Stack, and Why Choose Us. - Implemented full i18n for English (en-US) and Chinese (zh-CN) across all new content. - Centralized the page structure into a `default.vue` layout with a global header (including color mode and locale selectors) and footer. - Replaced placeholder logos with a dynamic `UMarquee` of technology icons using Iconify.
This commit is contained in:
xiaomai
8
.vscode/settings.json
vendored
8
.vscode/settings.json
vendored
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"i18n-ally.localesPaths": ["i18n/locales"],
|
"i18n-ally.localesPaths": ["i18n/locales"],
|
||||||
"i18n-ally.enabledFrameworks": [
|
"i18n-ally.enabledFrameworks": ["vue"],
|
||||||
"vue"
|
"i18n-ally.sourceLanguage": "en-US",
|
||||||
],
|
"i18n-ally.displayLanguage": "en-US",
|
||||||
"i18n-ally.keystyle": "nested"
|
"i18n-ally.keystyle": "nested"
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,13 +1,31 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<UPage>
|
||||||
<slot />
|
<UHeader>
|
||||||
</div>
|
<template #title> Tootaio Studio </template>
|
||||||
|
<template #right>
|
||||||
|
<UColorModeButton />
|
||||||
|
<ULocaleSelect
|
||||||
|
:model-value="locale"
|
||||||
|
:locales="[en, zh_cn]"
|
||||||
|
@update:model-value="(v) => setLocale(v as 'en' | 'zh-CN')"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</UHeader>
|
||||||
|
<UMain>
|
||||||
|
<slot />
|
||||||
|
</UMain>
|
||||||
|
<UFooter>
|
||||||
|
<template #left>
|
||||||
|
© {{ new Date().getFullYear() }} Tootaio Studio. All rights
|
||||||
|
reserved.
|
||||||
|
</template>
|
||||||
|
</UFooter>
|
||||||
|
</UPage>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
import { en, zh_cn } from "@nuxt/ui/locale";
|
||||||
|
const { locale, setLocale } = useI18n();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style></style>
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|||||||
@@ -1,44 +1,236 @@
|
|||||||
<template>
|
<template>
|
||||||
<UPage>
|
<div>
|
||||||
<UHeader>
|
<!-- 全幅 Hero - 在 Page 布局之外 -->
|
||||||
<template #title> Tootaio Studio </template>
|
<UPageHero
|
||||||
<template #right>
|
title="Tootaio Studio"
|
||||||
<ULocaleSelect
|
:description="$t('index.heroDescription')"
|
||||||
:model-value="locale"
|
/>
|
||||||
:locales="[en, zh_cn]"
|
|
||||||
@update:model-value="(v) => setLocale(v as 'en' | 'zh-CN')"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</UHeader>
|
|
||||||
<UPageSection
|
<UPageSection
|
||||||
title="Trusted by"
|
:title="$t('index.capabilities.title')"
|
||||||
:description="$t('index.trustedBy', { count: 10000 })"
|
:features="capabilitiesFeatures"
|
||||||
>
|
/>
|
||||||
|
|
||||||
|
<UPageSection :title="$t('index.featuredProjects.title')">
|
||||||
|
<UCarousel
|
||||||
|
v-slot="{ item }"
|
||||||
|
:items="featuredProjects"
|
||||||
|
:ui="{ item: 'basis-full sm:basis-1/2 lg:basis-1/3' }"
|
||||||
|
>
|
||||||
|
<UCard class="my-2">
|
||||||
|
<template #header>
|
||||||
|
<h3 class="text-2xl font-bold">{{ item.title }}</h3>
|
||||||
|
</template>
|
||||||
|
<template #default>
|
||||||
|
<img :src="item.image" :alt="item.title" />
|
||||||
|
<p class="mt-2 line-clamp-3">{{ item.description }}</p>
|
||||||
|
</template>
|
||||||
|
<template #footer>
|
||||||
|
<UButton
|
||||||
|
v-if="item.demoLink"
|
||||||
|
:href="item.demoLink"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener"
|
||||||
|
size="sm"
|
||||||
|
>
|
||||||
|
{{ $t("index.featuredProjects.viewDemo") }}
|
||||||
|
</UButton>
|
||||||
|
</template>
|
||||||
|
</UCard>
|
||||||
|
</UCarousel>
|
||||||
|
</UPageSection>
|
||||||
|
|
||||||
|
<UPageSection :title="$t('index.techStack.title')">
|
||||||
<UMarquee>
|
<UMarquee>
|
||||||
<img
|
<UIcon
|
||||||
v-for="logo in trustedBy"
|
v-for="icon in techIcons"
|
||||||
:key="logo.src"
|
:key="icon"
|
||||||
:src="logo.src"
|
:name="icon"
|
||||||
:alt="logo.alt"
|
class="size-16"
|
||||||
class="h-12 mx-8 grayscale opacity-60"
|
/>
|
||||||
|
</UMarquee>
|
||||||
|
<UMarquee reverse>
|
||||||
|
<UIcon
|
||||||
|
v-for="icon in toolsIcons"
|
||||||
|
:key="icon"
|
||||||
|
:name="icon"
|
||||||
|
class="size-16"
|
||||||
/>
|
/>
|
||||||
</UMarquee>
|
</UMarquee>
|
||||||
</UPageSection>
|
</UPageSection>
|
||||||
</UPage>
|
|
||||||
|
<UPageSection
|
||||||
|
:title="$t('index.whyChooseUs.title')"
|
||||||
|
:features="whyChooseUsFeatures"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { en, zh_cn } from "@nuxt/ui/locale";
|
import type { PageFeatureProps } from "@nuxt/ui";
|
||||||
const { locale, setLocale } = useI18n();
|
|
||||||
|
|
||||||
const trustedBy = ref([
|
useSeoMeta({
|
||||||
{ src: "/index/trusted-by/logoipsum-284.svg", alt: "Logo Ipsum" },
|
title: $t("index.seo.title"),
|
||||||
{ src: "/index/trusted-by/logoipsum-338.svg", alt: "Logo Ipsum" },
|
});
|
||||||
{ src: "/index/trusted-by/logoipsum-353.svg", alt: "Logo Ipsum" },
|
|
||||||
{ src: "/index/trusted-by/logoipsum-378.svg", alt: "Logo Ipsum" },
|
const colorMode = useColorMode();
|
||||||
{ src: "/index/trusted-by/logoipsum-392.svg", alt: "Logo Ipsum" },
|
|
||||||
{ src: "/index/trusted-by/logoipsum-403.svg", alt: "Logo Ipsum" },
|
const capabilitiesFeatures = computed<PageFeatureProps[]>(() => [
|
||||||
{ src: "/index/trusted-by/logoipsum-409.svg", alt: "Logo Ipsum" },
|
{
|
||||||
|
title: $t("index.capabilities.features[0].title"),
|
||||||
|
description: $t("index.capabilities.features[0].description"),
|
||||||
|
icon: "mdi:web",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.capabilities.features[1].title"),
|
||||||
|
description: $t("index.capabilities.features[1].description"),
|
||||||
|
icon: "mdi:cog-outline",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.capabilities.features[2].title"),
|
||||||
|
description: $t("index.capabilities.features[2].description"),
|
||||||
|
icon: "mdi:gamepad-variant-outline",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.capabilities.features[3].title"),
|
||||||
|
description: $t("index.capabilities.features[3].description"),
|
||||||
|
icon: "mdi:monitor-dashboard",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.capabilities.features[4].title"),
|
||||||
|
description: $t("index.capabilities.features[4].description"),
|
||||||
|
icon: "mdi:flask-outline",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.capabilities.features[5].title"),
|
||||||
|
description: $t("index.capabilities.features[5].description"),
|
||||||
|
icon: "mdi:lightbulb-outline",
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
const featuredProjects = ref([
|
||||||
|
{
|
||||||
|
title: "永中校友会官方网站",
|
||||||
|
description:
|
||||||
|
"永平中学校友会官方网站的设计与开发项目，整体价值 RM28,000，由本工作室创办人无偿捐赠予校友会永久使用。",
|
||||||
|
image: "/images/project-showcases/yphs-alumni-website.png",
|
||||||
|
demoLink: "https://yphsalumni.org",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "留华生来华资料汇总",
|
||||||
|
description:
|
||||||
|
"2022 年疫情期间，为马来西亚留学生开发的返校攻略网站。帮助 5000+ 名留学生顺利返校。并获得马来西亚外交部推荐。",
|
||||||
|
image: "/images/project-showcases/malaysia-student-return.png",
|
||||||
|
demoLink: "https://tootaio.github.io",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "光追",
|
||||||
|
description: "基于 Godot 引擎的 2023 年吉比特高校挑战赛参赛作品。",
|
||||||
|
image: "https://img.tootaio.com/i/2025/09/26/j2swgq.png",
|
||||||
|
// demoLink: "https://tootaio.com/projects/ray-tracing",
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
const techIcons = computed(() => [
|
||||||
|
"skill-icons:html",
|
||||||
|
"skill-icons:css",
|
||||||
|
"skill-icons:javascript",
|
||||||
|
"skill-icons:typescript",
|
||||||
|
"skill-icons:docker",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:vuejs-dark"
|
||||||
|
: "skill-icons:vuejs-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:nuxtjs-dark"
|
||||||
|
: "skill-icons:nuxtjs-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:tailwindcss-dark"
|
||||||
|
: "skill-icons:tailwindcss-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:nodejs-dark"
|
||||||
|
: "skill-icons:nodejs-light",
|
||||||
|
"skill-icons:cs",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:python-dark"
|
||||||
|
: "skill-icons:python-light",
|
||||||
|
]);
|
||||||
|
|
||||||
|
const toolsIcons = ref([
|
||||||
|
"skill-icons:photoshop",
|
||||||
|
"skill-icons:illustrator",
|
||||||
|
"skill-icons:git",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:vscode-dark"
|
||||||
|
: "skill-icons:vscode-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:visualstudio-dark"
|
||||||
|
: "skill-icons:visualstudio-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:github-dark"
|
||||||
|
: "skill-icons:github-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:godot-dark"
|
||||||
|
: "skill-icons:godot-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:unity-dark"
|
||||||
|
: "skill-icons:unity-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:blender-dark"
|
||||||
|
: "skill-icons:blender-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:androidstudio-dark"
|
||||||
|
: "skill-icons:androidstudio-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:windows-dark"
|
||||||
|
: "skill-icons:windows-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:linux-dark"
|
||||||
|
: "skill-icons:linux-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:apple-dark"
|
||||||
|
: "skill-icons:apple-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:idea-dark"
|
||||||
|
: "skill-icons:idea-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:pycharm-dark"
|
||||||
|
: "skill-icons:pycharm-light",
|
||||||
|
colorMode.value === "dark"
|
||||||
|
? "skill-icons:rider-dark"
|
||||||
|
: "skill-icons:rider-light",
|
||||||
|
]);
|
||||||
|
|
||||||
|
const whyChooseUsFeatures = computed<PageFeatureProps[]>(() => [
|
||||||
|
{
|
||||||
|
title: $t("index.whyChooseUs.features[0].title"),
|
||||||
|
description: $t("index.whyChooseUs.features[0].description"),
|
||||||
|
icon: "mdi:brush-variant", // Fully Custom-Built
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.whyChooseUs.features[1].title"),
|
||||||
|
description: $t("index.whyChooseUs.features[1].description"),
|
||||||
|
icon: "mdi:cog-sync-outline", // Tech-Driven
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.whyChooseUs.features[2].title"),
|
||||||
|
description: $t("index.whyChooseUs.features[2].description"),
|
||||||
|
icon: "mdi:gamepad-variant-outline", // Cross-Domain
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.whyChooseUs.features[3].title"),
|
||||||
|
description: $t("index.whyChooseUs.features[3].description"),
|
||||||
|
icon: "mdi:rocket-launch-outline", // End-to-End Service
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.whyChooseUs.features[4].title"),
|
||||||
|
description: $t("index.whyChooseUs.features[4].description"),
|
||||||
|
icon: "mdi:chart-timeline-variant", // Proven Project Value
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: $t("index.whyChooseUs.features[5].title"),
|
||||||
|
description: $t("index.whyChooseUs.features[5].description"),
|
||||||
|
icon: "mdi:lightbulb-on-outline", // Future-Oriented
|
||||||
|
},
|
||||||
]);
|
]);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
24
docs/Company Overview.md
Normal file
24
docs/Company Overview.md
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
我的工作室侧重于：定制开发，科技公司
|
||||||
|
|
||||||
|
涉及业务包括但不限于：
|
||||||
|
|
||||||
|
1. 网站 / 网页开发（高级定制，包括客制化后台系统等）
|
||||||
|
2. 程序开发
|
||||||
|
3. 游戏开发（曾经有一两款单机小游戏，目前暂停，未来会重新启动）
|
||||||
|
4. 工具开发
|
||||||
|
5. 软硬件测评（未来加入）
|
||||||
|
6. 额外服务：宴会大屏幕内容定制
|
||||||
|
7. 小网页开发（普通定制，用于简单展示）
|
||||||
|
|
||||||
|
目前线上可访问（大学做的，基于 Nuxt3）游戏介绍为主。现在想把涉猎面广一些
|
||||||
|
|
||||||
|
目前我们已落地的产品：
|
||||||
|
|
||||||
|
- GameJam 游戏一个（地牢探险生存类）
|
||||||
|
- 业余开发的手机游戏一个（速降类）
|
||||||
|
- 永平中学校友会官方网站与管理系统（价值 RM32,000）
|
||||||
|
- 宴会大屏竞标系统（价值：RM 500 / 次）
|
||||||
|
|
||||||
|
正在开发的产品：
|
||||||
|
|
||||||
|
- 室内设计公司高定官网（价值 RM 8,000）
|
||||||
63
docs/Index Our Capabilities.md
Normal file
63
docs/Index Our Capabilities.md
Normal file
@@ -0,0 +1,63 @@
|
|||||||
|
## 🧩 Our Capabilities（建议结构）
|
||||||
|
|
||||||
|
### 1️⃣ Custom Web Development
|
||||||
|
|
||||||
|
> 从企业官网到复杂后台系统，提供端到端的定制化开发。
|
||||||
|
> **关键词**：Nuxt / Next / Tailwind / CMS / API Integration
|
||||||
|
|
||||||
|
可加一句扩展：
|
||||||
|
|
||||||
|
> 我们专注于速度、可维护性与美学并重的前端体验。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 2️⃣ Software & Tool Engineering
|
||||||
|
|
||||||
|
> 为企业或个人定制内部工具与业务流程系统。
|
||||||
|
> **关键词**：Automation / Dashboard / Data Visualization / Desktop Apps
|
||||||
|
|
||||||
|
> 你可以展示如「宴会大屏幕竞标系统」或「管理系统」作为例子。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 3️⃣ Game Design & Development
|
||||||
|
|
||||||
|
> 将创意化为可交互的世界。独立游戏、原型、游戏化体验一站式实现。
|
||||||
|
> **关键词**：Godot / Unity / WebGL / Procedural Design
|
||||||
|
|
||||||
|
> 可以提及 Game Jam 作品、速降手游、未来的重启计划。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 4️⃣ Interactive Media & Event Systems
|
||||||
|
|
||||||
|
> 为活动、展会、宴会提供沉浸式视觉与互动内容。
|
||||||
|
> **关键词**：Large Screen Content / Real-time Animation / Custom Interaction
|
||||||
|
|
||||||
|
> 这块是你独有的“宴会大屏幕定制服务”，建议配视频或动效展示。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 5️⃣ Tech Exploration & Evaluation (Lab)
|
||||||
|
|
||||||
|
> 研究前沿软硬件，测试并分享最新技术成果。
|
||||||
|
> **关键词**：Experimental / Hardware Review / Prototype / Innovation
|
||||||
|
|
||||||
|
> 可作为未来内容板块，让网站保持“持续成长感”。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 6️⃣ Creative Consulting & Digital Strategy *(可选)*
|
||||||
|
|
||||||
|
> 为品牌或团队提供技术方向规划与产品实现建议。
|
||||||
|
> **关键词**：Digital Transformation / UX Consulting / Architecture Design
|
||||||
|
|
||||||
|
> 如果你常为客户做「网站+系统整体方案」，就适合加上这项。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## ✨ 展示形式建议
|
||||||
|
|
||||||
|
* 六宫格布局，每项配一个动效图标（iconify /lucide）
|
||||||
|
* hover 时显示一句“我们的价值主张”
|
||||||
|
* 用对比色或霓虹描边营造科技氛围
|
||||||
122
docs/design-doc-v1-en.md
Normal file
122
docs/design-doc-v1-en.md
Normal file
@@ -0,0 +1,122 @@
|
|||||||
|
# 🧭 1. Brand Positioning
|
||||||
|
|
||||||
|
### 🔹 Core Brand Statement
|
||||||
|
|
||||||
|
> “A creative technology studio offering custom development services, specializing in full‑stack solutions for websites, software, games, and interactive experiences.”
|
||||||
|
|
||||||
|
**A creative technology studio offering *custom development services*, specializing in full‑stack solutions for websites, software, games, and interactive experiences.**
|
||||||
|
|
||||||
|
### 🔹 Brand Keywords
|
||||||
|
|
||||||
|
Tech‑forward, Professional, Creative, Reliable, Cross‑disciplinary.
|
||||||
|
|
||||||
|
### 🔹 Suggested Slogans
|
||||||
|
|
||||||
|
* “Crafted Code, Custom Experience.”
|
||||||
|
* “Technology Meets Imagination.”
|
||||||
|
* (Chinese original translated) “Tailored digital products for brands that want unique experiences.”
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 🧩 2. Site Map (Information Architecture)
|
||||||
|
|
||||||
|
Because your business covers a wide range of services, we should present them in a structured way while keeping clear pathways to featured projects.
|
||||||
|
|
||||||
|
**Recommended structure:**
|
||||||
|
|
||||||
|
```
|
||||||
|
Home
|
||||||
|
├── About (brand story + tech stack + team / contact)
|
||||||
|
├── Services
|
||||||
|
│ ├── Website Development (highly customized + CMS)
|
||||||
|
│ ├── Software & Tools (automation / utilities / desktop apps)
|
||||||
|
│ ├── Game Development (indie titles + future roadmap)
|
||||||
|
│ ├── Event Displays (custom banquet/event screen systems)
|
||||||
|
│ └── Lab & Testing (experiments / future features)
|
||||||
|
├── Projects
|
||||||
|
│ ├── Corporate Sites
|
||||||
|
│ ├── Games
|
||||||
|
│ ├── Tools & Systems
|
||||||
|
│ └── Special Projects (e.g., event systems)
|
||||||
|
├── Insights / Blog
|
||||||
|
│ ├── Technical Articles
|
||||||
|
│ ├── Dev Logs
|
||||||
|
│ ├── Game Dev Journal
|
||||||
|
│ └── Test Reports (future)
|
||||||
|
└── Contact
|
||||||
|
```
|
||||||
|
|
||||||
|
✅ Use a **tagging system** (e.g., website / game / tool / event) to let visitors quickly filter projects.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 🧱 3. Visual & Interaction Style Recommendations
|
||||||
|
|
||||||
|
### 🔹 Overall Aesthetic
|
||||||
|
|
||||||
|
| Element | Recommendation |
|
||||||
|
| ---------- | ------------------------------------------------------------------------------------------- |
|
||||||
|
| Tone | Monochrome base (black & white) + accent color (neon blue / electric purple / amber orange) |
|
||||||
|
| Typography | Inter / JetBrains Mono / Noto Sans |
|
||||||
|
| Motion | Scroll‑reveal, micro‑interactions, concise GSAP transitions |
|
||||||
|
| Layout | Generous white space + modular components (each text block paired with a visual panel) |
|
||||||
|
|
||||||
|
### 🔹 Homepage Layout Suggestions
|
||||||
|
|
||||||
|
1. **Hero Section** — One‑line mission statement + dynamic logo / particle animation demo.
|
||||||
|
2. **Our Capabilities** — Display 3–5 core services with subtle motion.
|
||||||
|
3. **Featured Works** — Select 3–6 highlighted projects.
|
||||||
|
4. **Tech Stack / Tools** — Visual badges for frameworks, languages, engines.
|
||||||
|
5. **Why Choose Us** — Differentiators (customization, speed, delivery standards).
|
||||||
|
6. **Call to Action** — Contact / Collaboration / Proposal button.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# ⚙️ 4. Technology Stack Recommendations (Nuxt 3 rebuild)
|
||||||
|
|
||||||
|
| Module | Recommended Implementation |
|
||||||
|
| ------------ | --------------------------------------------------- |
|
||||||
|
| UI Framework | Tailwind CSS + shadcn/ui |
|
||||||
|
| Animation | GSAP / Framer Motion (Vue compatible) |
|
||||||
|
| Content Mgmt | `@nuxt/content` (manage projects/blog via Markdown) |
|
||||||
|
| Image Optim | Nuxt Image Module |
|
||||||
|
| Deployment | Vercel / Cloudflare Pages |
|
||||||
|
| SEO | Nuxt SEO module + automatic sitemap generation |
|
||||||
|
| Analytics | Umami (lightweight, self‑hosted) |
|
||||||
|
|
||||||
|
> 💡 To showcase technical capability, consider exposing an API surface, visualizing project metadata, or integrating a CMS backend (Directus or a custom Nuxt Admin module).
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 🎨 5. Content Strategy
|
||||||
|
|
||||||
|
| Section | Content Direction |
|
||||||
|
| --------------- | -------------------------------------------------------------------------- |
|
||||||
|
| Home | Who we are + representative works + what we can deliver |
|
||||||
|
| Services | Detailed explanation for each service + links to real examples |
|
||||||
|
| Projects | Story‑driven case studies (Client Problem → Solution → Outcome) |
|
||||||
|
| Blog / Insights | More than technical posts: behind‑the‑scenes, lessons learned, dev stories |
|
||||||
|
| About | Emphasize team philosophy and future direction (mention game revival plan) |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 📈 6. Phased Rebuild Roadmap (Execution Plan)
|
||||||
|
|
||||||
|
| Phase | Duration | Tasks |
|
||||||
|
| ----------------- | --------- | ---------------------------------------------- |
|
||||||
|
| 1️⃣ Brand Refresh | 3–5 days | Copywriting, visual direction, finalize slogan |
|
||||||
|
| 2️⃣ Architecture | 5–7 days | Sitemap, wireframes, content structure |
|
||||||
|
| 3️⃣ Development | 2–3 weeks | Nuxt 3 + Tailwind skeleton, build pages |
|
||||||
|
| 4️⃣ Content Import | 1 week | Integrate Markdown / CMS, upload projects |
|
||||||
|
| 5️⃣ Motion & Polish | 3–5 days | Animations, SEO tuning, performance testing |
|
||||||
|
| 6️⃣ Deploy & Launch | 1 day | One‑click deploy to Vercel / Cloudflare Pages |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 🔮 7. Future Expansion Opportunities
|
||||||
|
|
||||||
|
* Add a **Lab** section to showcase experimental tools and prototypes.
|
||||||
|
* Build a **custom CMS** (a lightweight Nuxt Admin is feasible).
|
||||||
|
* Add **multilingual support (i18n)** to reach international clients.
|
||||||
|
* For game projects, enable **WebGL / Godot Web Export** for in‑browser demos.
|
||||||
|
* Modularize project data as JSON / Markdown for easier maintenance.
|
||||||
@@ -120,13 +120,3 @@
|
|||||||
* 集成 **多语言支持（i18n）**，面向海外客户。
|
* 集成 **多语言支持（i18n）**，面向海外客户。
|
||||||
* 游戏项目可接入 **WebGL / Godot Web Export**，直接可试玩。
|
* 游戏项目可接入 **WebGL / Godot Web Export**，直接可试玩。
|
||||||
* 将案例模块化为 JSON / Markdown 文件，可持续维护。
|
* 将案例模块化为 JSON / Markdown 文件，可持续维护。
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
要不我直接帮你整理成一个完整的：
|
|
||||||
|
|
||||||
> 🧾《工作室网站重构计划书（v1）》——包括结构图、推荐技术栈、视觉方向与页面草稿说明。
|
|
||||||
|
|
||||||
格式我可以生成成 Word / PDF，你可以直接交给团队或自己用来开发。
|
|
||||||
|
|
||||||
是否要我现在帮你生成？（如果要，请告诉我希望输出哪种格式：**Word** 还是 **PDF**）
|
|
||||||
|
|||||||
@@ -1,5 +1,75 @@
|
|||||||
{
|
{
|
||||||
"index": {
|
"index": {
|
||||||
"trustedBy": "Trusted by over {count} users worldwide"
|
"trustedBy": "Trusted by over {count} users worldwide",
|
||||||
|
"heroDescription": "Technology Meets Imagination.",
|
||||||
|
"capabilities": {
|
||||||
|
"title": "Our Capabilities",
|
||||||
|
"features": [
|
||||||
|
{
|
||||||
|
"title": "Custom Website Development",
|
||||||
|
"description": "Tailored websites and backend systems built with modern frameworks like Nuxt and Next, delivering performance, scalability, and visual impact."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Software & Tool Engineering",
|
||||||
|
"description": "Custom-built applications, internal dashboards, and automation tools that streamline workflows and enhance productivity."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Game Design & Development",
|
||||||
|
"description": "From Game Jam prototypes to commercial releases — we design and develop immersive, creative, and technically robust gaming experiences."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Interactive Media & Event Systems",
|
||||||
|
"description": "Creating dynamic, large-screen visuals and real-time interactive systems for events, exhibitions, and banquets."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Tech Exploration & Evaluation",
|
||||||
|
"description": "Experimenting with emerging technologies and evaluating software and hardware to stay ahead of the innovation curve."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Creative Consulting & Digital Strategy",
|
||||||
|
"description": "Providing expert guidance on product architecture, digital transformation, and long-term technology strategy for brands and startups."
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"techStack": {
|
||||||
|
"title": "Tech Stacks"
|
||||||
|
},
|
||||||
|
"featuredProjects": {
|
||||||
|
"title": "Featured Projects",
|
||||||
|
"viewDemo": "Visit Site"
|
||||||
|
},
|
||||||
|
"whyChooseUs": {
|
||||||
|
"title": "Why Choose Us",
|
||||||
|
"subtitle": "We don’t just build code — we craft digital experiences.",
|
||||||
|
"features": [
|
||||||
|
{
|
||||||
|
"title": "Fully Custom-Built",
|
||||||
|
"description": "Every website, system, and game is built from scratch to match your unique brand identity and performance needs."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Tech-Driven, Not Just Design",
|
||||||
|
"description": "Our engineers lead every project, optimizing architecture, performance, and security at every level."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Cross-Domain Expertise",
|
||||||
|
"description": "From web systems to games and interactive tools — we merge creativity and engineering to deliver seamless experiences."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "End-to-End Service",
|
||||||
|
"description": "From concept, prototyping, and frontend to deployment and long-term support — we handle everything in-house."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Proven Project Value",
|
||||||
|
"description": "We’ve delivered projects for educational institutions, brands, and game developers — with real impact and measurable value."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Future-Oriented",
|
||||||
|
"description": "Beyond client work, we’re building our own products and experiments, pushing the boundaries of what’s possible."
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"seo": {
|
||||||
|
"title": "Homepage"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,75 @@
|
|||||||
{
|
{
|
||||||
"index": {
|
"index": {
|
||||||
"trustedBy": "全球有超过 {count} 用户信赖"
|
"trustedBy": "全球有超过 {count} 用户信赖",
|
||||||
|
"heroDescription": "专为想要独特体验的品牌打造量身定制的数字产品。",
|
||||||
|
"capabilities": {
|
||||||
|
"title": "我们的核心能力",
|
||||||
|
"features": [
|
||||||
|
{
|
||||||
|
"title": "网站定制开发",
|
||||||
|
"description": "基于 Nuxt / Next 等现代框架，为企业打造高性能、可扩展且视觉出众的专属网站与后台系统。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "软件与工具工程",
|
||||||
|
"description": "为企业定制自动化工具、数据面板与业务流程系统，提高工作效率与可靠性。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "游戏设计与开发",
|
||||||
|
"description": "从 Game Jam 原型到商业发行，打造富有创意与技术深度的互动体验。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "互动媒体与宴会系统",
|
||||||
|
"description": "为展会、活动与宴会定制实时交互内容与大型屏幕视觉展示。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "技术探索与评测",
|
||||||
|
"description": "研究与评估前沿软硬件技术，保持创新优势与研发热情。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "创意咨询与数字策略",
|
||||||
|
"description": "为品牌与团队提供产品架构、数字化转型与长期技术规划咨询。"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"techStack": {
|
||||||
|
"title": "我们的技术栈"
|
||||||
|
},
|
||||||
|
"featuredProjects": {
|
||||||
|
"title": "特色项目",
|
||||||
|
"viewDemo": "访问页面"
|
||||||
|
},
|
||||||
|
"whyChooseUs": {
|
||||||
|
"title": "为什么选择我们",
|
||||||
|
"subtitle": "我们不仅编写代码——我们打造数字体验。",
|
||||||
|
"features": [
|
||||||
|
{
|
||||||
|
"title": "Fully Custom-Built",
|
||||||
|
"description": "我们从不使用模板。每一个网站、系统、游戏都从零设计与开发，确保风格、性能与体验完全符合品牌个性。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Tech-Driven, Not Just Design",
|
||||||
|
"description": "作为开发导向的团队，我们理解底层逻辑。从架构、性能、安全到交互动画，所有细节都由工程师主导优化。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Cross-Domain Expertise",
|
||||||
|
"description": "我们横跨网站、游戏、工具与交互内容开发，让每个项目都能获得更广阔的技术整合思路。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "End-to-End Service",
|
||||||
|
"description": "从概念、原型、前端到部署与长期维护，我们全程负责，让客户专注业务，而非技术问题。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Proven Project Value",
|
||||||
|
"description": "我们曾为教育机构、品牌活动、独立游戏等开发高价值系统，实力可见。"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Future-Oriented",
|
||||||
|
"description": "我们在研发自己的产品与工具，不止接案，也在打造未来生态。这代表我们具备持续创新与自我进化的能力。"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"seo": {
|
||||||
|
"title": "首页"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -20,6 +20,15 @@ export default defineNuxtConfig({
|
|||||||
"@nuxtjs/seo",
|
"@nuxtjs/seo",
|
||||||
],
|
],
|
||||||
css: ["@/assets/css/main.css"],
|
css: ["@/assets/css/main.css"],
|
||||||
|
app: {
|
||||||
|
head: {
|
||||||
|
titleTemplate: "%s - Tootaio Studio",
|
||||||
|
meta: [
|
||||||
|
{ name: "viewport", content: "width=device-width, initial-scale=1" },
|
||||||
|
{ charset: "utf-8" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
i18n: {
|
i18n: {
|
||||||
defaultLocale: "en",
|
defaultLocale: "en",
|
||||||
locales: [
|
locales: [
|
||||||
@@ -52,4 +61,7 @@ export default defineNuxtConfig({
|
|||||||
twitterImage: DEFAULT_SEO.image,
|
twitterImage: DEFAULT_SEO.image,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
site: {
|
||||||
|
url: "https://tootaio.com",
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -10,6 +10,7 @@
|
|||||||
"postinstall": "nuxt prepare"
|
"postinstall": "nuxt prepare"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@iconify-json/mdi": "^1.2.3",
|
||||||
"@nuxt/content": "3.8.0",
|
"@nuxt/content": "3.8.0",
|
||||||
"@nuxt/eslint": "1.10.0",
|
"@nuxt/eslint": "1.10.0",
|
||||||
"@nuxt/ui": "4.1.0",
|
"@nuxt/ui": "4.1.0",
|
||||||
|
|||||||
BIN
public/images/project-showcases/malaysia-student-return.png
Normal file
BIN
public/images/project-showcases/malaysia-student-return.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 245 KiB |
BIN
public/images/project-showcases/yphs-alumni-website.png
Normal file
BIN
public/images/project-showcases/yphs-alumni-website.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 17 KiB |
@@ -1,3 +0,0 @@
|
|||||||
<svg width="67" height="41" viewBox="0 0 67 41" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M45.0353 4.66312C45.8331 3.77669 46.7195 3.04539 47.6281 2.46921C49.2236 1.47198 50.9079 0.940125 52.6364 0.940125V15.411C51.3732 11.0232 48.6475 7.25591 45.0353 4.66312ZM66.5533 40.9401H15.2957C6.87461 40.9401 0.0712891 34.1146 0.0712891 25.7157C0.0712891 17.6714 6.3206 11.0675 14.232 10.5135V0.940125C16.0048 0.940125 17.7555 1.44982 19.3954 2.46921C20.304 3.02323 21.1904 3.75453 21.9882 4.59663C25.2458 2.31409 29.1904 0.984446 33.4674 0.984446C33.4674 10.2254 30.1433 20.9734 19.3289 20.9955H33.3566C32.9577 19.2005 31.3178 17.8709 29.3677 17.8487H37.5228C35.5727 17.8487 33.9328 19.2005 33.5339 21.0177H46.6087C49.2236 21.0177 51.8164 21.5274 54.2541 22.5468C56.6696 23.544 58.8857 25.0288 60.725 26.8681C62.5865 28.7296 64.0491 30.9235 65.0464 33.339C66.0436 35.7324 66.5533 38.3252 66.5533 40.9401ZM22.8525 10.7795C23.1849 11.6437 24.0713 12.6188 25.3123 13.3279C26.5533 14.0371 27.8386 14.3252 28.7472 14.1922C28.4148 13.3279 27.5284 12.3529 26.2874 11.6437C25.0464 10.9346 23.761 10.6465 22.8525 10.7795ZM41.5117 13.3279C40.2707 14.0371 38.9854 14.3252 38.0768 14.1922C38.4092 13.3279 39.2957 12.3529 40.5367 11.6437C41.7777 10.9346 43.063 10.6465 43.9716 10.7795C43.6613 11.6437 42.7527 12.6188 41.5117 13.3279Z" fill="#283841"></path>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.3 KiB |
@@ -1,3 +0,0 @@
|
|||||||
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M29.4554 2.43478V0H35V22.4348C35 32.1358 27.165 40 17.5 40C8.24271 40 0.664262 32.7853 0.0413736 23.6522H0V0H5.54455V2.43478L14.901 2.43478V0H20.4455V2.43478L29.4554 2.43478ZM29.4554 22.4348V19.0202C28.8318 19.6656 28.1633 20.2785 27.4539 20.8558C25.1121 22.7615 22.3612 24.2503 19.369 25.2589C16.3764 26.2677 13.1833 26.7826 9.96797 26.7826H6.35343C8.08848 31.2608 12.425 34.4348 17.5 34.4348C24.1028 34.4348 29.4554 29.0622 29.4554 22.4348ZM15.4269 18.2435C14.3706 19.3674 13.18 20.3419 11.8852 21.1425C13.8545 20.9882 15.7827 20.5971 17.6038 19.9833C20.013 19.1712 22.1698 17.9913 23.9621 16.5329C25.7535 15.075 27.136 13.3757 28.0645 11.5515C28.6507 10.3998 29.0518 9.20727 29.2674 8H20.2671C20.0641 9.47968 19.6891 10.9319 19.1475 12.3231C18.2893 14.5274 17.0275 16.5405 15.4269 18.2435ZM5.54455 17.8146V8H14.6483C14.4948 8.78546 14.2724 9.55482 13.9832 10.2975C13.3786 11.8506 12.4962 13.2517 11.3938 14.4246C10.2918 15.5971 8.99228 16.518 7.57404 17.143C6.91535 17.4333 6.23601 17.6576 5.54455 17.8146Z" fill="#1D3AA7"></path>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.2 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 25 KiB |
@@ -1,4 +0,0 @@
|
|||||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M0 20C0 12.5231 0 8.78461 1.60769 6C2.66091 4.17577 4.17577 2.66091 6 1.60769C8.78461 0 12.5231 0 20 0C27.4769 0 31.2154 0 34 1.60769C35.8242 2.66091 37.3391 4.17577 38.3923 6C40 8.78461 40 12.5231 40 20C40 27.4769 40 31.2154 38.3923 34C37.3391 35.8242 35.8242 37.3391 34 38.3923C31.2154 40 27.4769 40 20 40C12.5231 40 8.78461 40 6 38.3923C4.17577 37.3391 2.66091 35.8242 1.60769 34C0 31.2154 0 27.4769 0 20Z" fill="#00DC33"></path>
|
|
||||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M28.0441 7.60927C28.8868 6.80331 30.2152 6.79965 31.0622 7.58229L31.1425 7.66005L31.4164 7.94729C34.1911 10.9318 35.2251 14.4098 34.9599 17.8065C34.6908 21.2511 33.1012 24.4994 30.8836 27.0664C28.6673 29.6316 25.7084 31.6519 22.51 32.5287C19.2714 33.4164 15.7294 33.1334 12.6547 30.9629C10.0469 29.1218 9.05406 26.1465 8.98661 23.2561C7.52323 22.5384 5.98346 21.6463 4.36789 20.5615L3.941 20.2716L3.85006 20.206C2.93285 19.5053 2.72313 18.2084 3.39161 17.2564C4.06029 16.3043 5.36233 16.046 6.34665 16.6512L6.44134 16.7126L6.83024 16.9771C7.79805 17.6269 8.72153 18.1903 9.59966 18.6767C10.1661 16.6889 11.1047 14.7802 12.3413 13.207C14.1938 10.8501 16.9713 8.96525 20.374 9.24647C23.439 9.49995 25.7036 11.081 26.8725 13.3122C28.0044 15.4728 28.0211 18.0719 27.0319 20.307C26.0234 22.5857 23.976 24.484 21.0309 25.2662C18.9114 25.8291 16.4284 25.7905 13.6267 25.0367V25.0377C12.5115 24.7375 11.3427 24.323 10.1212 23.7846C9.8472 23.6638 9.60873 23.8483 10.1212 24.1686C11.5636 25.1924 13.5956 26.0505 14.1836 26.3385C14.4615 26.788 14.8061 27.1568 15.2011 27.4356C17.0188 28.7188 19.1451 28.9539 21.3396 28.3523C23.5743 27.7397 25.8141 26.2625 27.5514 24.2516C29.2873 22.2423 30.4065 19.8348 30.5909 17.4727C30.765 15.2439 30.1218 12.9543 28.1842 10.8736L27.9927 10.6731L27.9162 10.5906C27.1538 9.72748 27.2018 8.41516 28.0441 7.60927ZM20.0092 13.5651C18.6033 13.4489 17.1196 14.189 15.8013 15.8662C14.7973 17.1436 14.0376 18.8033 13.6503 20.5112C16.4093 21.4544 18.4655 21.4608 19.8942 21.0814C21.5481 20.6422 22.5399 19.6477 23.0172 18.5693C23.5137 17.4472 23.4628 16.2245 22.9813 15.3055C22.5369 14.4571 21.6422 13.7002 20.0092 13.5651Z" fill="#ffffff"></path>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.2 KiB |
@@ -1,4 +0,0 @@
|
|||||||
<svg width="55" height="41" viewBox="0 0 55 41" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M35.5 0.5C45.9934 0.5 54.5 9.00659 54.5 19.5V40.5C50.0817 40.5 46.5 36.9183 46.5 32.5V19.5C46.5 13.4249 41.5751 8.5 35.5 8.5H30.2988C27.6467 8.50004 25.1029 9.55339 23.2275 11.4287L9.67188 24.9854C8.92179 25.7354 8.50006 26.7527 8.5 27.8135V28.5C8.5 30.7091 10.2909 32.5 12.5 32.5H30.5C30.5 36.7801 27.1389 40.2748 22.9121 40.4893L22.5 40.5H12.5C5.87259 40.5 0.5 35.1274 0.5 28.5V27.8135C0.500062 24.631 1.76427 21.5785 4.01465 19.3281L17.5713 5.77246C20.9469 2.39685 25.525 0.500044 30.2988 0.5H35.5Z" fill="#FF500B"></path>
|
|
||||||
<path d="M37.5 12.5C40.2614 12.5 42.5 14.7386 42.5 17.5V40.5C38.0817 40.5 34.5 36.9183 34.5 32.5V20.5H31.1562L24.6207 27.0355C23.683 27.9732 22.4113 28.5 21.0852 28.5H12.9775C12.5588 28.5 12.3491 27.9937 12.6452 27.6976L26.3789 13.9648C27.3165 13.0272 28.588 12.5 29.9141 12.5H37.5Z" fill="#FF500B"></path>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 944 B |
@@ -1,4 +0,0 @@
|
|||||||
<svg width="100%" height="100%" viewBox="0 0 56 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M43 0C50.1797 6.44277e-07 56 5.8203 56 13C56 20.1797 50.1797 26 43 26H34.4844L48.4844 40H31.5156L15.7578 24.2422C14.672 23.1564 14 21.6569 14 20C14 16.6863 16.6863 14 20 14H43C43.5523 14 44 13.5523 44 13C44 12.4477 43.5523 12 43 12H20C15.5817 12 12 15.5817 12 20C12 22.3901 13.0482 24.5347 14.71 26H14.6875L28.6875 40H20C8.95431 40 0 31.0457 0 20C0 8.95431 8.9543 0 20 0H43Z" fill="#3902FF"></path>
|
|
||||||
<path d="M56 28V40H51.3125L39.3125 28H56Z" fill="#3902FF"></path>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 580 B |
Reference in New Issue
Block a user