Update version to 2.1.0 and enhance ToolbarComponent with version display. Modified webpack configuration to include alias for easier imports. Updated ToolbarComponent styles for improved layout and alignment.

Author: basiclines

package.json

@@ -1,4 +1,5 @@
 {
+  "version": "2.1.0",
   "scripts": {
     "dev": "NODE_ENV=development npx webpack --mode=development --watch",
     "build": "NODE_ENV=production npx webpack --mode=production",

src/ui/components/toolbar/ToolbarComponent.css

@@ -1,14 +1,16 @@
 c-toolbar {
 	position: relative;
 	z-index: 5;
-	display: block;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
 	padding: 0 16px 0 8px;
 	overflow: hidden;
 	border-bottom: solid 1px var(--color-separator);
 }
 c-toolbar nav, c-toolbar header { overflow: hidden; }
 
-c-toolbar nav ul { display: flex; flex-direction: row; float: left; }
+c-toolbar nav ul { display: flex; flex-direction: row; }
 c-toolbar nav li a {
 	display: block;
 	padding: 12px 8px;
@@ -17,3 +19,8 @@ c-toolbar nav li a {
 	transition: 0.05s ease-in color;
 }
 c-toolbar nav .active a, c-toolbar nav li a:hover { color: var(--color-text-primary); text-decoration: none; }
+
+c-toolbar .version {
+	font: var(--type-medium-normal);
+	color: var(--color-text-tertiary);
+}

src/ui/components/toolbar/ToolbarComponent.js

@@ -2,6 +2,7 @@ import './ToolbarComponent.css'
 import Router from 'src/utils/Router'
 import Tracking from 'src/utils/Tracking'
 import Element from 'src/ui/Element'
+import packageJson from '@/package.json'
 
 class ToolbarComponent extends Element {
 
@@ -32,6 +33,7 @@ class ToolbarComponent extends Element {
 					<li class="${(isLicense) ? 'active' : ''}"><a href="${Router.routes.license}">License</a></li>
 				</ul>
 			</nav>
+			<div class="version">v${packageJson.version}</div>
 		`
 	}
 }

webpack.config.js

@@ -30,6 +30,7 @@ module.exports = (env, argv) => ({
 	resolve: {
 		extensions: ['.js'],
 		alias: {
+			'@': path.resolve(__dirname, './'),
 			src: path.resolve(__dirname, 'src/'),
 			leo: path.resolve(__dirname, 'node_modules/@basiclines/leo/dist/'),
 		}