Adds icons contribution for custom GitLens icons

.fantasticonrc.js

@@ -0,0 +1,43 @@
+//@ts-check
+
+/** @type { import('fantasticon').RunnerOptions} } */
+const config = {
+	name: 'glicons',
+	prefix: 'glicons',
+	codepoints: require('./images/icons/template/mapping.json'),
+	inputDir: './images/icons',
+	outputDir: './dist',
+	// @ts-ignore
+	fontTypes: ['woff2'],
+	normalize: true,
+	// @ts-ignore
+	assetTypes: ['html', 'scss', 'json'],
+	templates: {
+		html: './images/icons/template/icons-contribution.hbs',
+		scss: './images/icons/template/styles.hbs',
+	},
+	formatOptions: {
+		json: {
+			indent: 2,
+		},
+	},
+	pathOptions: {
+		woff2: './dist/glicons.woff2',
+		scss: './src/webviews//apps/shared/glicons.scss',
+		html: './icons-contribution.json',
+		json: './images/icons/template/mapping.json',
+	},
+	onComplete: _fontConfig => {
+		const fs = require('fs');
+		// Update the icons contribution point in package.json
+		const package = require('./package.json');
+		package.contributes.icons = require('./icons-contribution.json').icons;
+
+		const packageJSON = `${JSON.stringify(package, undefined, '\t')}\n`;
+
+		fs.writeFileSync('./package.json', packageJSON);
+		fs.rmSync('./icons-contribution.json');
+	},
+};
+
+module.exports = config;

.prettierignore

@@ -1,2 +1,6 @@
 emojis.json
 git.d.ts
+glicons.scss
+images/icons/template/icons-contribution.hbs
+images/icons/template/mapping.json
+images/icons/template/styles.hbs

.prettierrc

@@ -14,6 +14,10 @@
 		{
 			"files": "*.md",
 			"options": { "tabWidth": 2 }
+		},
+		{
+			"files": "*.svg",
+			"options": { "parser": "html" }
 		}
 	]
 }

images/icons/commit-horizontal.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M8 2.75C6.74022 2.75 5.53204 3.25044 4.64124 4.14124C3.89907 4.88342 3.42785 5.84591 3.29128 6.875H0V8.125H3.29128C3.42785 9.15409 3.89907 10.1166 4.64124 10.8588C5.53204 11.7496 6.74022 12.25 8 12.25C9.25978 12.25 10.468 11.7496 11.3588 10.8588C12.1009 10.1166 12.5721 9.15409 12.7087 8.125H16V6.875H12.7087C12.5721 5.84591 12.1009 4.88342 11.3588 4.14124C10.468 3.25044 9.25978 2.75 8 2.75ZM5.7019 5.2019C6.3114 4.59241 7.13805 4.25 8 4.25C8.86195 4.25 9.6886 4.59241 10.2981 5.2019C10.9076 5.8114 11.25 6.63805 11.25 7.5C11.25 8.36195 10.9076 9.1886 10.2981 9.7981C9.6886 10.4076 8.86195 10.75 8 10.75C7.13805 10.75 6.3114 10.4076 5.7019 9.7981C5.09241 9.1886 4.75 8.36195 4.75 7.5C4.75 6.63805 5.09241 5.8114 5.7019 5.2019Z"/></svg>

images/icons/compare-ref-working.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M7.38898 12.99L6.11898 11.72L6.78898 11.02L8.91898 13.15V13.85L6.78898 15.98L6.07898 15.27L7.34898 14H5.49898C5.1703 14.0013 4.84462 13.9376 4.54071 13.8124C4.2368 13.6872 3.96067 13.5031 3.72826 13.2707C3.49585 13.0383 3.31175 12.7622 3.18659 12.4583C3.06142 12.1544 2.99766 11.8287 2.99898 11.5V5.95002C2.51986 5.84801 2.07949 5.61222 1.72898 5.27002C1.38085 4.91827 1.14399 4.47181 1.04796 3.98632C0.951929 3.50083 1.00097 2.99781 1.18898 2.54002C1.37872 2.08377 1.69942 1.69398 2.11056 1.41989C2.5217 1.1458 3.00485 0.999687 3.49898 1.00002C3.84194 0.992644 4.18262 1.05737 4.49898 1.19002C4.80203 1.31469 5.07738 1.49819 5.30909 1.7299C5.54081 1.96162 5.72431 2.23696 5.84898 2.54002C5.98198 2.85702 6.04598 3.19802 6.03898 3.54002C6.0391 4.11634 5.84009 4.67501 5.47563 5.12147C5.11118 5.56793 4.60366 5.87475 4.03898 5.99002V11.49C4.03898 11.8878 4.19701 12.2694 4.47832 12.5507C4.75962 12.832 5.14115 12.99 5.53898 12.99H7.38898ZM13.039 11.04C13.519 11.138 13.961 11.375 14.309 11.72C14.7167 12.1302 14.9702 12.6687 15.0267 13.2443C15.0832 13.8199 14.9392 14.3974 14.619 14.879C14.4133 15.1857 14.1423 15.4429 13.8253 15.6324C13.5084 15.8218 13.1534 15.9387 12.786 15.9746C12.4185 16.0105 12.0476 15.9646 11.7 15.8401C11.3524 15.7157 11.0366 15.5157 10.7755 15.2547C10.5143 14.9937 10.3142 14.6781 10.1896 14.3306C10.0649 13.983 10.0188 13.6122 10.0545 13.2447C10.0902 12.8772 10.2068 12.5221 10.3961 12.2051C10.5853 11.8881 10.8425 11.6169 11.149 11.411C11.418 11.229 11.72 11.103 12.039 11.041V5.49002C12.039 5.09219 11.8809 4.71066 11.5996 4.42936C11.3183 4.14805 10.9368 3.99002 10.539 3.99002H8.68898L9.95898 5.26002L9.24898 5.97002L7.11898 3.84002V3.14002L9.24898 1.01002L9.95898 1.72002L8.68898 2.99002H10.539C10.8677 2.98869 11.1933 3.05246 11.4972 3.17762C11.8012 3.30279 12.0773 3.48689 12.3097 3.7193C12.5421 3.95171 12.7262 4.22783 12.8514 4.53175C12.9765 4.83566 13.0403 5.16134 13.039 5.49002V11.04ZM12.688 14.983C12.9452 14.9572 13.1914 14.8653 13.4027 14.7164C13.6139 14.5674 13.7831 14.3663 13.8938 14.1327C14.0045 13.8991 14.0529 13.6408 14.0343 13.3829C14.0158 13.1251 13.9309 12.8764 13.788 12.661C13.6202 12.4125 13.384 12.218 13.108 12.101C12.8358 11.9902 12.5369 11.9624 12.249 12.021C11.957 12.0775 11.6886 12.22 11.4783 12.4303C11.268 12.6406 11.1254 12.909 11.069 13.201C11.0102 13.4893 11.038 13.7885 11.149 14.061C11.2719 14.36 11.4881 14.6113 11.7654 14.7775C12.0428 14.9436 12.3664 15.0157 12.688 14.983Z"/></svg>

images/icons/graph.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M2.23223 1.23223C2.70107 0.763392 3.33696 0.5 4 0.5C4.66304 0.5 5.29893 0.763392 5.76777 1.23223C6.23661 1.70107 6.5 2.33696 6.5 3C6.5 3.66304 6.23661 4.29893 5.76777 4.76777C5.29893 5.23661 4.66304 5.5 4 5.5C3.33696 5.5 2.70107 5.23661 2.23223 4.76777C1.76339 4.29893 1.5 3.66304 1.5 3C1.5 2.33696 1.76339 1.70107 2.23223 1.23223ZM4 1.5C3.60218 1.5 3.22064 1.65804 2.93934 1.93934C2.65804 2.22064 2.5 2.60218 2.5 3C2.5 3.39782 2.65804 3.77936 2.93934 4.06066C3.22064 4.34196 3.60218 4.5 4 4.5C4.39782 4.5 4.77936 4.34196 5.06066 4.06066C5.34196 3.77936 5.5 3.39782 5.5 3C5.5 2.60218 5.34196 2.22064 5.06066 1.93934C4.77936 1.65804 4.39782 1.5 4 1.5ZM2.23223 11.2322C2.70107 10.7634 3.33696 10.5 4 10.5C4.66304 10.5 5.29893 10.7634 5.76777 11.2322C6.23661 11.7011 6.5 12.337 6.5 13C6.5 13.663 6.23661 14.2989 5.76777 14.7678C5.29893 15.2366 4.66304 15.5 4 15.5C3.33696 15.5 2.70107 15.2366 2.23223 14.7678C1.76339 14.2989 1.5 13.663 1.5 13C1.5 12.337 1.76339 11.7011 2.23223 11.2322ZM4 11.5C3.60218 11.5 3.22064 11.658 2.93934 11.9393C2.65804 12.2206 2.5 12.6022 2.5 13C2.5 13.3978 2.65804 13.7794 2.93934 14.0607C3.22064 14.342 3.60218 14.5 4 14.5C4.39782 14.5 4.77936 14.342 5.06066 14.0607C5.34196 13.7794 5.5 13.3978 5.5 13C5.5 12.6022 5.34196 12.2206 5.06066 11.9393C4.77936 11.658 4.39782 11.5 4 11.5Z"/><path d="M3.5 11.5V4.5H4.5V11.5H3.5ZM3.5 16V14.5H4.5V16H3.5Z"/><path d="M10.2322 3.23223C10.7011 2.76339 11.337 2.5 12 2.5C12.663 2.5 13.2989 2.76339 13.7678 3.23223C14.2366 3.70107 14.5 4.33696 14.5 5C14.5 5.66304 14.2366 6.29893 13.7678 6.76777C13.2989 7.23661 12.663 7.5 12 7.5C11.337 7.5 10.7011 7.23661 10.2322 6.76777C9.76339 6.29893 9.5 5.66304 9.5 5C9.5 4.33696 9.76339 3.70107 10.2322 3.23223ZM12 3.5C11.6022 3.5 11.2206 3.65804 10.9393 3.93934C10.658 4.22064 10.5 4.60218 10.5 5C10.5 5.39782 10.658 5.77936 10.9393 6.06066C11.2206 6.34196 11.6022 6.5 12 6.5C12.3978 6.5 12.7794 6.34196 13.0607 6.06066C13.342 5.77936 13.5 5.39782 13.5 5C13.5 4.60218 13.342 4.22064 13.0607 3.93934C12.7794 3.65804 12.3978 3.5 12 3.5ZM6.23223 7.23223C6.70107 6.76339 7.33696 6.5 8 6.5C8.66304 6.5 9.29893 6.76339 9.76777 7.23223C10.2366 7.70107 10.5 8.33696 10.5 9C10.5 9.66304 10.2366 10.2989 9.76777 10.7678C9.29893 11.2366 8.66304 11.5 8 11.5C7.33696 11.5 6.70107 11.2366 6.23223 10.7678C5.76339 10.2989 5.5 9.66304 5.5 9C5.5 8.33696 5.76339 7.70107 6.23223 7.23223ZM8 7.5C7.60218 7.5 7.22064 7.65804 6.93934 7.93934C6.65804 8.22064 6.5 8.60218 6.5 9C6.5 9.39782 6.65804 9.77935 6.93934 10.0607C7.22064 10.342 7.60218 10.5 8 10.5C8.39782 10.5 8.77936 10.342 9.06066 10.0607C9.34196 9.77935 9.5 9.39782 9.5 9C9.5 8.60218 9.34196 8.22064 9.06066 7.93934C8.77936 7.65804 8.39782 7.5 8 7.5Z"/><path d="M11.5 11V7H12.5V11C12.5 11.663 12.2366 12.2989 11.7678 12.7678C11.2989 13.2366 10.663 13.5 10 13.5H8.5V16H7.5V13.5H5.5V12.5H7.5V10.5H8.5V12.5H10C10.3978 12.5 10.7794 12.342 11.0607 12.0607C11.342 11.7794 11.5 11.3978 11.5 11Z"/></svg>

images/icons/next-commit.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M0 8.125V6.875H2.5V8.125H0Z"/><path d="M13.5 10.35L12.78 9.65002L14.305 8.12106H10L10 6.87894H14.305L12.79 5.35002L13.5 4.65002L16 7.15002V7.85002L13.5 10.35Z"/><path d="M6.5 4.25C4.70507 4.25 3.25 5.70507 3.25 7.5C3.25 9.29493 4.70507 10.75 6.5 10.75C8.29493 10.75 9.75 9.29493 9.75 7.5C9.75 5.70507 8.29493 4.25 6.5 4.25ZM1.75 7.5C1.75 4.87665 3.87665 2.75 6.5 2.75C9.12335 2.75 11.25 4.87665 11.25 7.5C11.25 10.1234 9.12335 12.25 6.5 12.25C3.87665 12.25 1.75 10.1234 1.75 7.5Z"/></svg>

images/icons/prev-commit-menu.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M14 14.5C14 14.6978 13.9414 14.8911 13.8315 15.0556C13.7216 15.22 13.5654 15.3482 13.3827 15.4239C13.2 15.4996 12.9989 15.5194 12.8049 15.4808C12.6109 15.4422 12.4327 15.347 12.2929 15.2071C12.153 15.0673 12.0578 14.8891 12.0192 14.6951C11.9806 14.5011 12.0004 14.3 12.0761 14.1173C12.1518 13.9346 12.28 13.7784 12.4444 13.6685C12.6089 13.5586 12.8022 13.5 13 13.5C13.2652 13.5 13.5196 13.6054 13.7071 13.7929C13.8946 13.9804 14 14.2348 14 14.5Z"/><path d="M10 14.5C10 14.6978 9.94135 14.8911 9.83147 15.0556C9.72159 15.22 9.56541 15.3482 9.38268 15.4239C9.19996 15.4996 8.99889 15.5194 8.80491 15.4808C8.61093 15.4422 8.43275 15.347 8.29289 15.2071C8.15304 15.0673 8.0578 14.8891 8.01922 14.6951C7.98063 14.5011 8.00043 14.3 8.07612 14.1173C8.15181 13.9346 8.27998 13.7784 8.44443 13.6685C8.60888 13.5586 8.80222 13.5 9 13.5C9.26522 13.5 9.51957 13.6054 9.70711 13.7929C9.89464 13.9804 10 14.2348 10 14.5Z"/><path d="M6 14.5C6 14.6978 5.94135 14.8911 5.83147 15.0556C5.72159 15.22 5.56541 15.3482 5.38268 15.4239C5.19996 15.4996 4.99889 15.5194 4.80491 15.4808C4.61093 15.4422 4.43275 15.347 4.29289 15.2071C4.15304 15.0673 4.0578 14.8891 4.01922 14.6951C3.98063 14.5011 4.00043 14.3 4.07612 14.1173C4.15181 13.9346 4.27998 13.7784 4.44443 13.6685C4.60888 13.5586 4.80222 13.5 5 13.5C5.26522 13.5 5.51957 13.6054 5.70711 13.7929C5.89464 13.9804 6 14.2348 6 14.5Z"/><path d="M16 8.125H13.5V6.875H16V8.125Z"/><path d="M2.5 10.35L0 7.85002V7.15002L2.5 4.65002L3.21 5.35002L1.695 6.87902H6V8.12002H1.695L3.22 9.65002L2.5 10.35Z"/><path d="M9.5 4.25C7.70507 4.25 6.25 5.70507 6.25 7.5C6.25 9.29493 7.70507 10.75 9.5 10.75C11.2949 10.75 12.75 9.29493 12.75 7.5C12.75 5.70507 11.2949 4.25 9.5 4.25ZM4.75 7.5C4.75 4.87665 6.87665 2.75 9.5 2.75C12.1234 2.75 14.25 4.87665 14.25 7.5C14.25 10.1234 12.1234 12.25 9.5 12.25C6.87665 12.25 4.75 10.1234 4.75 7.5Z"/></svg>

images/icons/prev-commit.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M16 8.125H13.5V6.875H16V8.125Z"/><path d="M2.5 10.35L0 7.85002V7.15002L2.5 4.65002L3.21 5.35002L1.695 6.87902H6V8.12002H1.695L3.22 9.65002L2.5 10.35Z"/><path d="M9.5 4.25C7.70507 4.25 6.25 5.70507 6.25 7.5C6.25 9.29493 7.70507 10.75 9.5 10.75C11.2949 10.75 12.75 9.29493 12.75 7.5C12.75 5.70507 11.2949 4.25 9.5 4.25ZM4.75 7.5C4.75 4.87665 6.87665 2.75 9.5 2.75C12.1234 2.75 14.25 4.87665 14.25 7.5C14.25 10.1234 12.1234 12.25 9.5 12.25C6.87665 12.25 4.75 10.1234 4.75 7.5Z"/></svg>

images/icons/template/icons-contribution.hbs

@@ -0,0 +1,17 @@
+{
+	"icons": {
+		{{#each codepoints}}
+		"gitlens-{{@key}}": {
+			"description": "{{@key}} icon",
+			"default": {
+				"fontPath": "dist/glicons.woff2",
+				"fontCharacter": "\\\{{codepoint this}}"
+			}
+		{{#if @last}}
+		}
+		{{else}}
+		},
+		{{/if}}
+		{{/each}}
+	}
+}

images/icons/template/mapping.json

@@ -0,0 +1,8 @@
+{
+  "commit-horizontal": 61697,
+  "graph": 61698,
+  "next-commit": 61699,
+  "prev-commit-menu": 61700,
+  "prev-commit": 61701,
+  "compare-ref-working": 61702
+}

images/icons/template/styles.hbs

@@ -0,0 +1,59 @@
+@font-face {
+	font-family: '{{ name }}';
+	font-display: block;
+	src: {{{ fontSrc }}};
+}
+
+.glicon {
+	font: normal normal normal 16px/1 {{ name }};
+	display: inline-block;
+	text-decoration: none;
+	text-rendering: auto;
+	text-align: center;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+	user-select: none;
+	-webkit-user-select: none;
+	-ms-user-select: none;
+}
+
+/*---------------------
+ *  Modifiers
+ *-------------------*/
+
+@keyframes glicon-spin {
+	100% {
+		transform: rotate(360deg);
+	}
+}
+
+.glicon-sync.glicon-modifier-spin,
+.glicon-loading.glicon-modifier-spin,
+.glicon-gear.glicon-modifier-spin {
+	/* Use steps to throttle FPS to reduce CPU usage */
+	animation: glicon-spin 1.5s steps(30) infinite;
+}
+
+.glicon-modifier-disabled {
+	opacity: 0.5;
+}
+
+.glicon-modifier-hidden {
+	opacity: 0;
+}
+
+/* custom speed & easing for loading icon */
+.glicon-loading {
+	animation-duration: 1s !important;
+	animation-timing-function: cubic-bezier(0.53, 0.21, 0.29, 0.67) !important;
+}
+
+/*---------------------
+ *  Icons
+ *-------------------*/
+
+{{#each codepoints}}
+.{{ ../prefix }}-{{ @key }}:before {
+	content: '\\{{ codepoint this }}';
+}
+{{/each}}

package.json

@@ -4034,58 +4034,40 @@
 				"command": "gitlens.diffWithNext",
 				"title": "Open Changes with Next Revision",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-next-commit.svg",
-					"light": "images/light/icon-next-commit.svg"
-				},
+				"icon": "$(gitlens-next-commit)",
 				"enablement": "gitlens:activeFileStatus =~ /revision/"
 			},
 			{
 				"command": "gitlens.diffWithNextInDiffLeft",
 				"title": "Open Changes with Next Revision",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-next-commit.svg",
-					"light": "images/light/icon-next-commit.svg"
-				},
+				"icon": "$(gitlens-next-commit)",
 				"enablement": "gitlens:activeFileStatus =~ /revision/"
 			},
 			{
 				"command": "gitlens.diffWithNextInDiffRight",
 				"title": "Open Changes with Next Revision",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-next-commit.svg",
-					"light": "images/light/icon-next-commit.svg"
-				},
+				"icon": "$(gitlens-next-commit)",
 				"enablement": "gitlens:activeFileStatus =~ /revision/"
 			},
 			{
 				"command": "gitlens.diffWithPrevious",
 				"title": "Open Changes with Previous Revision",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-prev-commit.svg",
-					"light": "images/light/icon-prev-commit.svg"
-				}
+				"icon": "$(gitlens-prev-commit)"
 			},
 			{
 				"command": "gitlens.diffWithPreviousInDiffLeft",
 				"title": "Open Changes with Previous Revision",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-prev-commit.svg",
-					"light": "images/light/icon-prev-commit.svg"
-				}
+				"icon": "$(gitlens-prev-commit)"
 			},
 			{
 				"command": "gitlens.diffWithPreviousInDiffRight",
 				"title": "Open Changes with Previous Revision",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-prev-commit.svg",
-					"light": "images/light/icon-prev-commit.svg"
-				}
+				"icon": "$(gitlens-prev-commit)"
 			},
 			{
 				"command": "gitlens.diffLineWithPrevious",
@@ -4096,10 +4078,7 @@
 				"command": "gitlens.diffWithRevision",
 				"title": "Open Changes with Revision...",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-prev-commit-menu.svg",
-					"light": "images/light/icon-prev-commit-menu.svg"
-				}
+				"icon": "$(gitlens-prev-commit-menu)"
 			},
 			{
 				"command": "gitlens.diffWithRevisionFrom",
@@ -4110,28 +4089,19 @@
 				"command": "gitlens.diffWithWorking",
 				"title": "Open Changes with Working File",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-compare-ref-working.svg",
-					"light": "images/light/icon-compare-ref-working.svg"
-				}
+				"icon": "$(gitlens-compare-ref-working)"
 			},
 			{
 				"command": "gitlens.diffWithWorkingInDiffLeft",
 				"title": "Open Changes with Working File",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-compare-ref-working.svg",
-					"light": "images/light/icon-compare-ref-working.svg"
-				}
+				"icon": "$(gitlens-compare-ref-working)"
 			},
 			{
 				"command": "gitlens.diffWithWorkingInDiffRight",
 				"title": "Open Changes with Working File",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-compare-ref-working.svg",
-					"light": "images/light/icon-compare-ref-working.svg"
-				}
+				"icon": "$(gitlens-compare-ref-working)"
 			},
 			{
 				"command": "gitlens.diffLineWithWorking",
@@ -4373,30 +4343,21 @@
 				"command": "gitlens.showQuickRevisionDetails",
 				"title": "Show Revision Commit",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-commit-horizontal.svg",
-					"light": "images/light/icon-commit-horizontal.svg"
-				},
+				"icon": "$(gitlens-commit-horizontal)",
 				"enablement": "gitlens:activeFileStatus =~ /revision/ && resourceScheme != git"
 			},
 			{
 				"command": "gitlens.showQuickRevisionDetailsInDiffLeft",
 				"title": "Show Revision Commit",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-commit-horizontal.svg",
-					"light": "images/light/icon-commit-horizontal.svg"
-				},
+				"icon": "$(gitlens-commit-horizontal)",
 				"enablement": "gitlens:activeFileStatus =~ /revision/ && resourceScheme != git"
 			},
 			{
 				"command": "gitlens.showQuickRevisionDetailsInDiffRight",
 				"title": "Show Revision Commit",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-commit-horizontal.svg",
-					"light": "images/light/icon-commit-horizontal.svg"
-				},
+				"icon": "$(gitlens-commit-horizontal)",
 				"enablement": "gitlens:activeFileStatus =~ /revision/ && resourceScheme != git"
 			},
 			{
@@ -5016,10 +4977,7 @@
 				"command": "gitlens.views.openChangesWithWorking",
 				"title": "Open Changes with Working File",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-compare-ref-working.svg",
-					"light": "images/light/icon-compare-ref-working.svg"
-				}
+				"icon": "$(gitlens-compare-ref-working)"
 			},
 			{
 				"command": "gitlens.views.openPreviousChangesWithWorking",
@@ -5111,10 +5069,7 @@
 				"command": "gitlens.views.compareWithWorking",
 				"title": "Compare with Working Tree",
 				"category": "GitLens",
-				"icon": {
-					"dark": "images/dark/icon-compare-ref-working.svg",
-					"light": "images/light/icon-compare-ref-working.svg"
-				}
+				"icon": "$(gitlens-compare-ref-working)"
 			},
 			{
 				"command": "gitlens.views.addAuthors",
@@ -6162,6 +6117,50 @@
 				"category": "GitLens"
 			}
 		],
+		"icons": {
+			"gitlens-commit-horizontal": {
+				"description": "commit-horizontal icon",
+				"default": {
+					"fontPath": "dist/glicons.woff2",
+					"fontCharacter": "\\f101"
+				}
+			},
+			"gitlens-graph": {
+				"description": "graph icon",
+				"default": {
+					"fontPath": "dist/glicons.woff2",
+					"fontCharacter": "\\f102"
+				}
+			},
+			"gitlens-next-commit": {
+				"description": "next-commit icon",
+				"default": {
+					"fontPath": "dist/glicons.woff2",
+					"fontCharacter": "\\f103"
+				}
+			},
+			"gitlens-prev-commit-menu": {
+				"description": "prev-commit-menu icon",
+				"default": {
+					"fontPath": "dist/glicons.woff2",
+					"fontCharacter": "\\f104"
+				}
+			},
+			"gitlens-prev-commit": {
+				"description": "prev-commit icon",
+				"default": {
+					"fontPath": "dist/glicons.woff2",
+					"fontCharacter": "\\f105"
+				}
+			},
+			"gitlens-compare-ref-working": {
+				"description": "compare-ref-working icon",
+				"default": {
+					"fontPath": "dist/glicons.woff2",
+					"fontCharacter": "\\f106"
+				}
+			}
+		},
 		"menus": {
 			"commandPalette": [
 				{
@@ -11315,6 +11314,7 @@
 		"build": "webpack --mode development",
 		"build:extension": "webpack --mode development --config-name extension",
 		"build:webviews": "webpack --mode development --config-name webviews",
+		"build:icons": "yarn icons:svgo && yarn fantasticon && yarn icons:apply",
 		"build:tests": "tsc -p tsconfig.test.json && tsc-alias -p tsconfig.test.json",
 		"-build:tests": "webpack -c webpack.config.test.js --mode development",
 		"bundle": "webpack --mode production",
@@ -11322,6 +11322,8 @@
 		"copy:images": "webpack --config webpack.config.images.js",
 		"graph:link": "pushd \"../GitKrakenComponents\" && yarn link && popd && yarn link @gitkraken/gitkraken-components",
 		"graph:unlink": "yarn unlink @gitkraken/gitkraken-components",
+		"icons:apply": "node ./scripts/applyIconsContribution.js",
+		"icons:svgo": "svgo -f ./images/icons/ --config svgo.config.js",
 		"lint": "eslint \"src/**/*.ts?(x)\" --fix",
 		"lint:webviews": "eslint \"src/webviews/apps/**/*.ts?(x)\" --fix",
 		"package": "vsce package --yarn",
@@ -11399,6 +11401,8 @@
 		"eslint-plugin-anti-trojan-source": "1.1.0",
 		"eslint-plugin-import": "2.26.0",
 		"eslint-plugin-lit": "1.6.1",
+		"fantasticon": "1.2.3",
+		"fantasticon-webpack-plugin ": "1.2.3",
 		"fork-ts-checker-webpack-plugin": "6.5.2",
 		"glob": "8.0.3",
 		"html-loader": "4.1.0",
@@ -11411,6 +11415,7 @@
 		"prettier": "2.7.1",
 		"sass": "1.54.4",
 		"sass-loader": "13.0.2",
+		"svgo": "2.8.0",
 		"terser-webpack-plugin": "5.3.4",
 		"ts-loader": "9.3.1",
 		"tsc-alias": "1.7.0",

scripts/applyIconsContribution.js

@@ -0,0 +1,11 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const fs = require('fs');
+
+// Update the icons contribution point in package.json
+const package = require('../package.json');
+package.contributes.icons = require('../icons-contribution.json').icons;
+
+const packageJSON = `${JSON.stringify(package, undefined, '\t')}\n`;
+
+fs.writeFileSync('./package.json', packageJSON);
+fs.rmSync('./icons-contribution.json');

scripts/applyPatchForInsiders.js

@@ -1,4 +1,3 @@
-/* eslint-disable import/order */
 /* eslint-disable @typescript-eslint/no-var-requires */
 const fs = require('fs');
 
@@ -9,16 +8,21 @@ fs.writeFileSync('./README.md', `${insert}\n${data}`);
 
 // Patch package.json
 const date = new Date(new Date().toLocaleString('en-US', { timeZone: 'America/New_York' }));
-let json = require('../package.json');
+let packageJSON = require('../package.json');
 
-json = JSON.stringify({
-	...json,
-	name: `${json.name}-insiders`,
-	displayName: 'GitLens (Insiders)',
-	version: `${String(date.getFullYear())}.${date.getMonth() + 1}.${date.getDate()}${String(date.getHours()).padStart(
-		2,
-		'0',
-	)}`,
-	preview: true,
-});
-fs.writeFileSync('./package.json', json);
+packageJSON = JSON.stringify(
+	{
+		...packageJSON,
+		name: `${packageJSON.name}-insiders`,
+		displayName: 'GitLens (Insiders)',
+		version: `${String(date.getFullYear())}.${date.getMonth() + 1}.${date.getDate()}${String(
+			date.getHours(),
+		).padStart(2, '0')}`,
+		preview: true,
+	},
+	undefined,
+	'\t',
+);
+packageJSON += '\n';
+
+fs.writeFileSync('./package.json', packageJSON);

src/webviews/apps/shared/glicons.scss

@@ -0,0 +1,72 @@
+@font-face {
+	font-family: 'glicons';
+	font-display: block;
+	src: url("./glicons.woff2?7c1fcbaed5f09c54558dcca7d79320a6") format("woff2");
+}
+
+.glicon {
+	font: normal normal normal 16px/1 glicons;
+	display: inline-block;
+	text-decoration: none;
+	text-rendering: auto;
+	text-align: center;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+	user-select: none;
+	-webkit-user-select: none;
+	-ms-user-select: none;
+}
+
+/*---------------------
+ *  Modifiers
+ *-------------------*/
+
+@keyframes glicon-spin {
+	100% {
+		transform: rotate(360deg);
+	}
+}
+
+.glicon-sync.glicon-modifier-spin,
+.glicon-loading.glicon-modifier-spin,
+.glicon-gear.glicon-modifier-spin {
+	/* Use steps to throttle FPS to reduce CPU usage */
+	animation: glicon-spin 1.5s steps(30) infinite;
+}
+
+.glicon-modifier-disabled {
+	opacity: 0.5;
+}
+
+.glicon-modifier-hidden {
+	opacity: 0;
+}
+
+/* custom speed & easing for loading icon */
+.glicon-loading {
+	animation-duration: 1s !important;
+	animation-timing-function: cubic-bezier(0.53, 0.21, 0.29, 0.67) !important;
+}
+
+/*---------------------
+ *  Icons
+ *-------------------*/
+
+.glicons-commit-horizontal:before {
+	content: '\f101';
+}
+.glicons-graph:before {
+	content: '\f102';
+}
+.glicons-next-commit:before {
+	content: '\f103';
+}
+.glicons-prev-commit-menu:before {
+	content: '\f104';
+}
+.glicons-prev-commit:before {
+	content: '\f105';
+}
+.glicons-compare-ref-working:before {
+	content: '\f106';
+}

svgo.config.js

@@ -0,0 +1,20 @@
+module.exports = {
+	plugins: [
+		{
+			name: 'removeAttrs',
+			params: {
+				attrs: 'fill',
+			},
+		},
+		{
+			name: 'addAttributesToSVGElement',
+			params: {
+				attributes: [
+					{
+						fill: 'currentColor',
+					},
+				],
+			},
+		},
+	],
+};

webpack.config.js

@@ -1,6 +1,7 @@
 //@ts-check
 /** @typedef {import('webpack').Configuration} WebpackConfig **/
 
+const fs = require('fs');
 const { spawnSync } = require('child_process');
 const path = require('path');
 const CircularDependencyPlugin = require('circular-dependency-plugin');
@@ -8,6 +9,7 @@ const { CleanWebpackPlugin: CleanPlugin } = require('clean-webpack-plugin');
 const CopyPlugin = require('copy-webpack-plugin');
 const CspHtmlPlugin = require('csp-html-webpack-plugin');
 const esbuild = require('esbuild');
+const FantasticonPlugin = require('fantasticon-webpack-plugin');
 const ForkTsCheckerPlugin = require('fork-ts-checker-webpack-plugin');
 const HtmlPlugin = require('html-webpack-plugin');
 const ImageMinimizerPlugin = require('image-minimizer-webpack-plugin');
@@ -80,6 +82,19 @@ function getExtensionConfig(target, mode, env) {
 
 	if (target === 'webworker') {
 		plugins.push(new optimize.LimitChunkCountPlugin({ maxChunks: 1 }));
+	} else {
+		// Ensure that the dist folder exists otherwise the FantasticonPlugin will fail
+		const dist = path.join(__dirname, 'dist');
+		if (!fs.existsSync(dist)) {
+			fs.mkdirSync(dist);
+		}
+
+		plugins.push(
+			new FantasticonPlugin({
+				runOnComplete: true,
+				configPath: '.fantasticonrc.js',
+			}),
+		);
 	}
 
 	if (env.analyzeDeps) {