From c4b526dce53f9ee5d255db77aba93162e6aafdc5 Mon Sep 17 00:00:00 2001 From: bymyself Date: Fri, 25 Apr 2025 16:25:11 -0700 Subject: [PATCH] add custom icon --- entry/entry.js | 5 ++++- ui/src/fonts.css | 32 ++++++++++++++++++++++++++++++++ ui/src/fonts/cc-icon.eot | Bin 0 -> 1616 bytes ui/src/fonts/cc-icon.svg | 14 ++++++++++++++ ui/src/fonts/cc-icon.ttf | Bin 0 -> 1452 bytes ui/src/fonts/cc-icon.woff | Bin 0 -> 1528 bytes ui/src/main.tsx | 3 ++- ui/vite.config.ts | 8 +++++++- 8 files changed, 59 insertions(+), 3 deletions(-) create mode 100644 ui/src/fonts.css create mode 100644 ui/src/fonts/cc-icon.eot create mode 100644 ui/src/fonts/cc-icon.svg create mode 100644 ui/src/fonts/cc-icon.ttf create mode 100644 ui/src/fonts/cc-icon.woff diff --git a/entry/entry.js b/entry/entry.js index c9a9776..4cba5ed 100644 --- a/entry/entry.js +++ b/entry/entry.js @@ -1,4 +1,3 @@ - // Copyright (C) 2025 AIDC-AI // Licensed under the MIT License. @@ -7,4 +6,8 @@ import { api } from "../../scripts/api.js"; setTimeout(() => { import(api.api_base + "/copilot_web/input.js"); + const fontsLink = document.createElement("link"); + fontsLink.rel = "stylesheet"; + fontsLink.href = api.api_base + "/copilot_web/fonts.css"; + document.head.appendChild(fontsLink); }, 500); diff --git a/ui/src/fonts.css b/ui/src/fonts.css new file mode 100644 index 0000000..3576e31 --- /dev/null +++ b/ui/src/fonts.css @@ -0,0 +1,32 @@ +/* Font declarations */ +@font-face { + font-family: "cc-font"; + src: url("./fonts/cc-icon.eot?jbqswq"); + src: + url("./fonts/cc-icon.eot?jbqswq#iefix") format("embedded-opentype"), + url("./fonts/cc-icon.ttf?jbqswq") format("truetype"), + url("./fonts/cc-icon.woff?jbqswq") format("woff"), + url("./fonts/cc-icon.svg?jbqswq#icomoon") format("svg"); + font-weight: normal; + font-style: normal; + font-display: block; +} + +/* Icon classes */ +[class^="cc-icon-"], +[class*=" cc-icon-"] { + font-family: "cc-font" !important; + speak: never; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.cc-icon-logo:before { + content: "\e900"; + color: #5a6e87; +} \ No newline at end of file diff --git a/ui/src/fonts/cc-icon.eot b/ui/src/fonts/cc-icon.eot new file mode 100644 index 0000000000000000000000000000000000000000..6e06f1229faec9e1f689649d5ca01c47b1412f84 GIT binary patch literal 1616 zcmb7E&u<$=6n^7f@7n91_0P(7oelAiCI%;VQZKGZ+>pd2DQQXqLFJNe9M_46y^-To ziNpaegjSSR+P6ex7T4C3kXEe9=ebr7fzFK}}SHS`c_?nd;P_J=!Ln+F&BI z3Z_lF&~lAR1{;^rtH}Z~8t`G^E@Rv40DD%=1>@Q%aHk+M&_d_5Oenb=6 zHflOuWp3EN!ge?H{T-6&3GC;v)t26@KU;AAO(cpK|KlBFw}W+}*gxfd62v+7l(56L zXSScfJn8l9cN%9-t~*y4mfc@&5S@^4+&!in0xF!Ro6mJBZ_L^Fj0yO9y{L`+Q6wN)cvR1dI5RJ5px!Ce&}q*(sOTw zKP6MF36IaA?-v&GF^?zW^Q)0$vYO3~B(KMpMsn`tz-;;RnZTe=4mgxcQeY?` zMMUYUr}$t}zx&>2qj{IZO57bzUmA*DzRWzHQr4OB$6g7^ zVV0DGF=t3oW+tvp&sJ|5gQ_fsgK~<6r&F+b zJ=yBbqs7}3FNb1s&?WjF{(U%a6;@8>wgW zu$~e?p%5kMFEheUkFChlkvVv2-c03-Rw~b9*Uj8^{ + + + Generated by IcoMoon + + + + \ No newline at end of file diff --git a/ui/src/fonts/cc-icon.ttf b/ui/src/fonts/cc-icon.ttf new file mode 100644 index 0000000000000000000000000000000000000000..93dbb19f35ef1ff7087c313a5837e859ad56ae48 GIT binary patch literal 1452 zcmb7EOK%%h6h7B8p0URsk2`)m=OH!o~4Fr`6nP6p}*5I_V*ye&@Jg}?H=9zIPmp4^h3kB5oW0$~FwrlCTQ>E9lwncJDBFABec;SfaaT!=TG72>oa1!M1U@M#$4YBM&+w?Ued|_4{_z0JHut z2_A80^D<&!DV7a8V}C@GUbQLz%O)Hn7VjaKVF`>l7QL*`GK@me8Y6i@3^7r#w0t3N zxhfVj!=`3gjX5+p1kvgi(-lrY5p=}7j5wRRkazi(H*WQcP1d;wK~)OpqT}V#2fBVm zzdI_8`a{*25Rrl@U#ygztIf7@*^m-Z->uEw$jxhVUJ0nelB5I@wV~S^8{aQ47n8Ca zSHfC6lc^U9W0|X|)v@tlW@w@M<-9tqh^kMzAgCj%5a)%xmW~DOuN;;ME`#DcYF4V6-S-Cm=YBVWE0=&W^f|^r> zSRkDCXGeKqXz1SB+UDD87=7)npC7BveyqU$RaL+*b$?5op^2YBJz>!9KQF{90 zKeB&fe^uNq>r~hcarPM{!M-`d@gS4y$7OIbIl2|*FaacrQilGpBfRv`jT~ftnE)U} z-??6f8#t)e1AND|bHEiB^S}o#_TujmbFl#X4Hrw4qzBg7=l!sR;Bl}AxaDFFc*ey% z@P{t;Qk-zR?N|Z!TP~Jpn!ed-m~GSS&<-`oq&B8Wo%LpSf5+@-rQ#&5Q zQ=%eGo*Q+p@m8~SuxoU&X%mGW&@LI&J(pQGJ3Xz{>@>SZueqgd9%)Mra|N{(sc!Gx k!|pAl>DUz+)PvlDZIh0$F4+&T;yeIqbpAAFzsi5`-+0>7BLDyZ literal 0 HcmV?d00001 diff --git a/ui/src/fonts/cc-icon.woff b/ui/src/fonts/cc-icon.woff new file mode 100644 index 0000000000000000000000000000000000000000..7ca98b285c28202841ee0899195f89313103e98f GIT binary patch literal 1528 zcmb7EO>7%g5T0kRckQ*;>#qMQ$8|QuKTQHo?4({?k+>m=OH!qV27<~Z-8ilj5qm4g zDUHO13!xRIh+9up5fT>!7mgfq;K%`S;trPx4qT8bA!NR{yN!a#g||ENzM1)E=Iy?> z`(C47Cq@{)XB4#Oued&IG}b1|M9h!aEiS4iTFs7m2fl6CZ*obl|8&?k_qgvn*qqBH z(%wC|4d3^WKe&7l{Cs`8Wo{99zeT*lrRe|Y!Zw`n{SG_JMP3#g+nxSBA|V1h#wB#0 zXxD0jCvZ;4mWwRZG4G+TFa=w;MWRPtv(tj_b@cp@%j1>6Uw5p%KA!jI6P_2yD=e{3 z$w%aQ?D+xqBWGs6(KHLdK0O#;%D=`HqGR$N4UXuF7lN4mPF;>}&vqA}G-4d5p*br} z0=-THs|#6#qMOq9#8 zB<=*1Q8wln?n05@qj^yZGfCuDzL4jk3TI~6^c<@(hlYSC@ryIv$w?@Jj+~Q>)1?b} zm(QaKepPI;;e8O&LJOL{DTg^+I7hb9tySJ`u_cFIGQW&_+~A^ULQ% zZB!Ezf_PCW-<>sYzVpdsG3Zy6C8M%ZTUxq5KW|)ERKAplLh;k`RwdSr(UGlcVAEcw|x%tFyCjPaB3+sZ70)9?As* zUQbvl)UQ5Sy*~3|EG0#Qg36+zmea&|Fp>^r#{_YB`0m=;<{ORc5385+BcYI*8k$JH z%1^w#!9?XJ#}gasD}Pc@uusIVrKdk~;LL*~dsq4Qhf`q>SNx5Z<7w7m+c2wbshj~#73Xq IlK import("./App.tsx").then(({ default: App }) => ({ @@ -37,7 +38,7 @@ waitForDocumentBody() .then(() => { app.extensionManager.registerSidebarTab({ id: "comfyui-copilot", - icon: "mdi mdi-robot-excited-outline", + icon: "cc-icon-logo", title: "ComfyUI Copilot", tooltip: "ComfyUI Copilot", type: "custom", diff --git a/ui/vite.config.ts b/ui/vite.config.ts index 6e0679d..fd0ba9f 100644 --- a/ui/vite.config.ts +++ b/ui/vite.config.ts @@ -81,6 +81,7 @@ export default defineConfig(({ mode }) => ({ external: ["/scripts/app.js", "/scripts/api.js"], input: { input: "/src/main.tsx", + fonts: "/src/fonts.css" }, output: { // Provide global variables to use in the UMD build for externalized deps @@ -92,7 +93,12 @@ export default defineConfig(({ mode }) => ({ // assetFileNames: "[name]-[hash][extname]", entryFileNames: "copilot_web/[name].js", chunkFileNames: `copilot_web/[name]-[hash].js`, - assetFileNames: `copilot_web/assets/[name]-[hash].[ext]`, + assetFileNames: (assetInfo) => { + if (assetInfo.name === 'fonts.css') { + return 'copilot_web/[name].css'; + } + return `copilot_web/assets/[name]-[hash].[ext]`; + }, manualChunks: { // 只包含实际使用的 React 相关依赖 'vendor-react': ['react', 'react-dom'],