Add icon to website and vscode extension (#2829)

fix #2828 Dark <img width="255" alt="image" src="https://github.com/microsoft/typespec/assets/1031227/000dacdd-df83-40b3-b28d-cbf766a00e23"> Light <img width="225" alt="image" src="https://github.com/microsoft/typespec/assets/1031227/fe78ff8b-a794-4f95-be60-258bc09575fa"> Extension logo <img width="562" alt="image" src="https://github.com/microsoft/typespec/assets/1031227/bcf913f7-d73a-4bab-adcc-acfe8a3706b1">
microsoft · Jan 25, 2024 · ba02533 · ba02533
1 parent 9f55600
commit ba02533
Show file tree

Hide file tree

Showing 12 changed files with 53 additions and 1 deletion.
diff --git a/.changeset/fuzzy-pens-live.md b/.changeset/fuzzy-pens-live.md
@@ -0,0 +1,5 @@
+---
+"typespec-vscode": patch
+---
+
+Added icons to the extensions
diff --git a/icons/raw/readme.md b/icons/raw/readme.md
@@ -0,0 +1,3 @@
+# TypeSpec Raw Svg Icons
+
+Those are the raw typespec icons with text still has text. It can be used to easily convert the text to path with different font and different positions.
diff --git a/icons/raw/tsp-logo-inverted.svg b/icons/raw/tsp-logo-inverted.svg
diff --git a/icons/raw/tsp-logo.svg b/icons/raw/tsp-logo.svg
diff --git a/packages/typespec-vscode/.vscodeignore b/packages/typespec-vscode/.vscodeignore
@@ -14,3 +14,4 @@
 !README.md
 !ThirdPartyNotices.txt
 !LICENSE
+!icons/
diff --git a/packages/typespec-vscode/icons/logo.png b/packages/typespec-vscode/icons/logo.png
diff --git a/packages/typespec-vscode/icons/tsp-file.dark.svg b/packages/typespec-vscode/icons/tsp-file.dark.svg
diff --git a/packages/typespec-vscode/icons/tsp-file.light.svg b/packages/typespec-vscode/icons/tsp-file.light.svg
diff --git a/packages/typespec-vscode/package.json b/packages/typespec-vscode/package.json
@@ -34,6 +34,7 @@
     "typespec-vscode-*.vsix",
     "ThirdPartyNotices.txt"
   ],
+  "icon": "./icons/logo.png",
   "contributes": {
     "languages": [
       {
@@ -45,6 +46,10 @@
         "extensions": [
           ".tsp"
         ],
+        "icon": {
+          "light": "./icons/tsp-file.light.svg",
+          "dark": "./icons/tsp-file.dark.svg"
+        },
         "configuration": "./dist/language-configuration.json"
       },
       {

diff --git a/packages/website/docusaurus.config.ts b/packages/website/docusaurus.config.ts
@@ -41,7 +41,7 @@ const config: Config = {
   baseUrl,
   onBrokenLinks: "throw",
   onBrokenMarkdownLinks: "warn",
-  favicon: "img/azure.svg",
+  favicon: "img/favicon.svg",
 
   // GitHub pages deployment config.
   // If you aren't using GitHub pages, you don't need these.

diff --git a/packages/website/package.json b/packages/website/package.json
@@ -2,6 +2,7 @@
   "name": "@typespec/website",
   "version": "1.0.0",
   "description": "",
+  "private": true,
   "main": "index.js",
   "scripts": {
     "docusaurus": "docusaurus",

diff --git a/packages/website/static/img/favicon.svg b/packages/website/static/img/favicon.svg
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		# TypeSpec Raw Svg Icons

		Those are the raw typespec icons with text still has text. It can be used to easily convert the text to path with different font and different positions.