Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2024-12-21 16:38:23 +01:00
Code Issues Packages Projects Releases Wiki Activity

Make default workspace icon the Wave logo (#1470)

Browse Source 
I made our logo a custom icon in Font Awesome so we can add it to our
workspace switcher as the default icon
This commit is contained in:
Evan Simkowitz 2024-12-10 13:54:11 -08:00 committed by GitHub
parent 8957e0405a
commit c2312f1c7f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 40 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.storybook/main.ts
View File

@ -58,6 +58,7 @@ const config: StorybookConfig = {
<link rel="stylesheet" href="./fontawesome/css/solid.min.css" />
<link rel="stylesheet" href="./fontawesome/css/sharp-solid.min.css" />
<link rel="stylesheet" href="./fontawesome/css/sharp-regular.min.css" />
<link rel="stylesheet" href="./fontawesome/css/custom-icons.min.css" />
<style>
#storybook-docs {
[id^="anchor--"],

28
assets/wave-logo_icon-black.svg Normal file
View File

@ -0,0 +1,28 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 27.8.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 600 400" style="enable-background:new 0 0 600 400;" xml:space="preserve">
<style type="text/css">
.st0{fill:url(#SVGID_1_);}
.st1{fill:url(#SVGID_00000123405442604648655120000000636425700907447225_);}
.st2{fill:#FFFFFF;}
.st3{fill:#58C142;}
.st4{fill:url(#SVGID_00000100361222533905006500000012948355425597525920_);}
.st5{fill:url(#SVGID_00000039098984540155201650000005728924474174226367_);}
.st6{fill:url(#SVGID_00000065066116668922763670000009055193333651929737_);}
.st7{fill:url(#SVGID_00000046310373342220590360000000833566212213317053_);}
.st8{fill:url(#SVGID_00000067914870925445215340000010520730682335284873_);}
.st9{fill:url(#SVGID_00000139972009352615321800000011748188400644384138_);}
.st10{fill:url(#SVGID_00000137813723102203423940000002281677718566419372_);}
.st11{fill:url(#SVGID_00000117658585713214366330000001759073570098750902_);}
.st12{fill:url(#SVGID_00000075146307645666362690000001517567647835044244_);}
.st13{fill:url(#SVGID_00000169553343881037582000000012883033354483876241_);}
</style>
<g>
<path d="M218.2,133.2c51,0,99.3,21.9,138.2,39.5c21.2,9.6,43.1,19.5,53.4,19.5c8,0,21.5,0,30.5-42.1l4.6-21.3l21.6,3.1l66.7,9.6
c11.2-27.9,18.8-61.6,22.9-101.2L426.4,21.7c-8.6,40.3-24.5,60.5-53.3,60.5c-37.4,0-113.8-59.1-191.6-59.1
C76.4,23.1,23.2,89.4,7.3,226.2l46,6.7c7.6-15.6,16.4-29.3,26.4-41.2C112.6,152.9,159.2,133.2,218.2,133.2z"/>
<path d="M409.8,215.6c-37.4,0-113.8-59.1-191.6-59.1c-105.1,0-158.4,66.3-174.3,203.1l129.6,18.7c8.7-41.8,24.5-60.5,53.3-60.5
c38.9,0,112.3,59.1,191.6,59.1c105.1,0,159.9-66.3,174.3-203.1l-129.6-18.7C454.4,195.4,438.6,215.6,409.8,215.6z"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

4
frontend/app/tab/workspaceswitcher.tsx
View File

@ -43,7 +43,7 @@ const colors = [
];
const icons = [
"circle",
"custom@wave-logo-solid",
"triangle",
"star",
"heart",
@ -93,7 +93,7 @@ const IconSelector = memo(({ icons, selectedIcon, onSelect, className }: IconSel
return (
<div className={clsx("icon-selector", className)}>
{icons.map((icon) => {
const iconClass = makeIconClass(icon, false);
const iconClass = makeIconClass(icon, true);
return (
<i
key={icon}

5
frontend/util/util.ts
View File

@ -103,6 +103,11 @@ function makeIconClass(icon: string, fw: boolean, opts?: { spin?: boolean; defau
icon = icon.replace(/^brands@/, "");
return clsx(`fa fa-brands fa-${icon}`, fw ? "fa-fw" : null, opts?.spin ? "fa-spin" : null);
}
if (icon.match(/^custom@[a-z0-9-]+$/)) {
// strip off the "custom@" prefix if it exists
icon = icon.replace(/^custom@/, "");
return clsx(`fa fa-kit fa-${icon}`, fw ? "fa-fw" : null, opts?.spin ? "fa-spin" : null);
}
if (opts?.defaultIcon != null) {
return makeIconClass(opts.defaultIcon, fw, { spin: opts?.spin });
}

1
index.html
View File

@ -10,6 +10,7 @@
<link rel="stylesheet" href="/fontawesome/css/solid.min.css" />
<link rel="stylesheet" href="/fontawesome/css/sharp-solid.min.css" />
<link rel="stylesheet" href="/fontawesome/css/sharp-regular.min.css" />
<link rel="stylesheet" href="/fontawesome/css/custom-icons.min.css" />
<script type="module" src="frontend/wave.ts"></script>
</head>
<body class="init">

2
pkg/wcore/wcore.go
View File

@ -54,7 +54,7 @@ func EnsureInitialData() error {
return nil
}
log.Println("client has no windows, creating starter workspace")
starterWs, err := CreateWorkspace(ctx, "Starter workspace", "circle", "#58C142", true)
starterWs, err := CreateWorkspace(ctx, "Starter workspace", "custom@wave-logo-solid", "#58C142", true)
if err != nil {
return fmt.Errorf("error creating starter workspace: %w", err)
}

1
public/fontawesome/css/custom-icons.min.css vendored Normal file
View File

@ -0,0 +1 @@
@charset "utf-8";.fak.fa-wave-logo-solid,.fa-kit.fa-wave-logo-solid{--fa:"";--fa--fa:""}.fak,.fa-kit{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:var(--fa-display,inline-block);font-variant:normal;text-rendering:auto;font-family:Font Awesome Kit;font-style:normal;font-weight:400;line-height:1}.fak:before,.fa-kit:before{content:var(--fa)}@font-face{font-family:Font Awesome Kit;font-style:normal;font-display:block;src:url(../webfonts/custom-icons.woff2)format("woff2"),url(../webfonts/custom-icons.ttf)format("truetype")}

10
public/fontawesome/css/fontawesome.min.css vendored
View File

File diff suppressed because one or more lines are too long

BIN
public/fontawesome/webfonts/custom-icons.woff2 Normal file
View File

Binary file not shown.