Add icons

package.json

@@ -4,7 +4,7 @@
   "description": "@relative-ci/agent webpack plugin setup example for Github Action",
   "main": "index.js",
   "scripts": {
-    "start": "webpack-dev-server",
+    "start": "webpack serve",
     "build": "webpack --mode production --json artifacts/webpack-stats.json",
     "test": "echo \"Error: no test specified\" && exit 0"
   },
@@ -41,6 +41,7 @@
   },
   "dependencies": {
     "antd": "^4.6.5",
+    "lucide-react": "^0.188.0",
     "react": "^16.13.1",
     "react-dom": "^16.13.1"
   }

src/components/layout.jsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { Typography } from 'antd'
+import { Factory } from 'lucide-react';
 
 import logoUrl from '../assets/relative-ci--logo.png';
 import css from './layout.module.css';
@@ -20,6 +21,12 @@ export const Layout = (props) => {
       <main className={css.main}>
         {children}
       </main>
+      <footer className={css.footer}>
+        <Factory width="32" />
+        <Typography.Paragraph>
+            Made by <a href="https://relative-ci.com">RelativeCI</a>
+        </Typography.Paragraph>
+      </footer>
     </div>
   );
 };

src/components/layout.module.css

@@ -21,3 +21,9 @@
 .main {
   padding: 16px 24px;
 }
+
+.footer {
+  padding: 16px 24px;
+  color: lightgray;
+  text-align: center;
+}

webpack.config.js

@@ -95,6 +95,7 @@ module.exports = (_, { mode }) => {
       }),
     ],
     devServer: {
+      port: 9000,
       hot: true,
       inline: true
     }