feat: add new brand logos
Desktop Client Build / Resolve Build Metadata (push) Successful in 26s
Frontend CI / Frontend (push) Successful in 3m23s
Backend CI / Backend (push) Successful in 16m58s
Desktop Client Build / Build Desktop Client (push) Successful in 24m56s
Desktop Client Build / Publish Client Artifacts to NAS (push) Successful in 36s
Desktop Client Build / Resolve Build Metadata (push) Successful in 26s
Frontend CI / Frontend (push) Successful in 3m23s
Backend CI / Backend (push) Successful in 16m58s
Desktop Client Build / Build Desktop Client (push) Successful in 24m56s
Desktop Client Build / Publish Client Artifacts to NAS (push) Successful in 36s
- Introduced icon-color.svg featuring a colorful gradient design. - Added icon-with-title.svg that includes a title and multiple gradient elements.
This commit is contained in:
+6
-1
@@ -1,7 +1,12 @@
|
||||
// Type for the `@brand-logo` alias (electron.vite.config.ts → public/logo.svg).
|
||||
// Types for brand SVG aliases (electron.vite.config.ts → public/*.svg).
|
||||
// Kept in its own ambient (non-module) declaration file so vue-tsc resolves the
|
||||
// alias the same way Vite does at build time.
|
||||
declare module '@brand-logo' {
|
||||
const src: string
|
||||
export default src
|
||||
}
|
||||
|
||||
declare module '@brand-logo-full' {
|
||||
const src: string
|
||||
export default src
|
||||
}
|
||||
|
||||
@@ -14,6 +14,7 @@ import { computed, onMounted, ref, watch } from 'vue'
|
||||
import { RouterLink, RouterView, useRoute } from 'vue-router'
|
||||
|
||||
import brandLogo from '@brand-logo'
|
||||
import iconWithTitle from '@brand-logo-full'
|
||||
import { useClientRelease } from '../composables/useClientRelease'
|
||||
import { useDesktopRuntime } from '../composables/useDesktopRuntime'
|
||||
import { useDesktopSession } from '../composables/useDesktopSession'
|
||||
@@ -276,13 +277,7 @@ watch(
|
||||
<div class="window-drag-bar" aria-hidden="true"></div>
|
||||
<aside class="sidebar">
|
||||
<div class="brand-block">
|
||||
<div class="brand-mark">
|
||||
<img :src="brandLogo" alt="省心推" class="brand-mark-img" />
|
||||
</div>
|
||||
<div>
|
||||
<p class="eyebrow">Workspace Cockpit</p>
|
||||
<h1>省心推</h1>
|
||||
</div>
|
||||
<img :src="iconWithTitle" alt="省心推" class="brand-logo-full" />
|
||||
</div>
|
||||
|
||||
<nav class="nav">
|
||||
@@ -530,6 +525,8 @@ watch(
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 16px;
|
||||
-webkit-app-region: drag;
|
||||
}
|
||||
|
||||
@@ -539,13 +536,20 @@ watch(
|
||||
display: grid;
|
||||
place-items: center;
|
||||
border-radius: 11px;
|
||||
background: linear-gradient(135deg, #1677ff 0%, #4096ff 100%);
|
||||
box-shadow: 0 6px 14px rgba(22, 119, 255, 0.28);
|
||||
background: linear-gradient(135deg, #6e55ff 0%, #00c6ff 100%);
|
||||
box-shadow: 0 6px 14px rgba(110, 85, 255, 0.28);
|
||||
}
|
||||
|
||||
.brand-mark-img {
|
||||
width: 62%;
|
||||
height: 62%;
|
||||
width: 72%;
|
||||
height: 72%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.brand-logo-full {
|
||||
height: 40px;
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
|
||||
@@ -443,15 +443,15 @@ onBeforeUnmount(() => {
|
||||
border-radius: 50%;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: linear-gradient(135deg, #1677ff 0%, #4096ff 100%);
|
||||
background: linear-gradient(135deg, #6e55ff 0%, #00c6ff 100%);
|
||||
box-shadow:
|
||||
0 10px 22px rgba(22, 119, 255, 0.28),
|
||||
0 10px 22px rgba(110, 85, 255, 0.28),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.35);
|
||||
}
|
||||
|
||||
.brand-logo-img {
|
||||
width: 60%;
|
||||
height: 60%;
|
||||
width: 72%;
|
||||
height: 72%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user