diff --git a/index.html b/index.html
index b77fdd0d..925c5a4d 100644
--- a/index.html
+++ b/index.html
@@ -6,7 +6,12 @@
     <link rel="icon" type="image/png" href="/static/logo.png">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <!-- Verify with https://csp-evaluator.withgoogle.com/ -->
-    <meta http-equiv="Content-Security-Policy" content="default-src 'self' <%= htmlWebpackPlugin.options.templateParameters.cspDefaultSrc %> https://api.github.com/repos/ActivityWatch/activitywatch/releases/latest; img-src 'self' data:; font-src 'self' data:; style-src 'self' 'unsafe-inline'; object-src 'none'; script-src 'self' 'unsafe-eval'">
+    <!-- TODO: fix CSP (should depend on prod/dev mode, as pre-vite )-->
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self' *:5666 ws://*:27180 https://api.github.com/repos/ActivityWatch/activitywatch/releases/latest; img-src 'self' data:; font-src 'self' data:; style-src 'self' 'unsafe-inline'; object-src 'none'; script-src 'self' 'unsafe-eval'">
+    <!-- TODO: is this really the way? imports in main.js doesn't seem to work -->
+    <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
+    <link rel="stylesheet" href="/node_modules/bootstrap-vue/dist/bootstrap-vue.css">
+    <link rel="stylesheet" href="/src/style/style.scss">
   </head>
   <body>
     <noscript>
diff --git a/package-lock.json b/package-lock.json
index 8cf7ef7a..5b288081 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -59,7 +59,7 @@
         "vue-awesome": "^3.5.1",
         "vue-chartjs": "^4.1.0",
         "vue-color": "^2.8.1",
-        "vue-d3-sunburst": "^1.9.0",
+        "vue-d3-sunburst": "git+https://github.com/ErikBjare/Vue.D3.sunburst.git#patch-1",
         "vue-datetime": "^1.0.0-beta.13",
         "vuedraggable": "^2.24.3",
         "weekstart": "^1.0.1",
@@ -25256,8 +25256,8 @@
     },
     "node_modules/vue-d3-sunburst": {
       "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/vue-d3-sunburst/-/vue-d3-sunburst-1.9.1.tgz",
-      "integrity": "sha512-f8W5l++cTiuJxfy2kVp5ZihbRzrmsEMSJkEZ06y/43P8MMIYTTNcUgbT7C6a9tThkv4hG9SOiEoCLaLRE7FU/g==",
+      "resolved": "git+ssh://git@github.com/ErikBjare/Vue.D3.sunburst.git#1fe0f3e00e04109c548f8bac6e6333b735955668",
+      "license": "MIT",
       "dependencies": {
         "d3-hierarchy": "^1.1.6",
         "d3-interpolate": "^1.2.0",
@@ -45607,9 +45607,8 @@
       }
     },
     "vue-d3-sunburst": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/vue-d3-sunburst/-/vue-d3-sunburst-1.9.1.tgz",
-      "integrity": "sha512-f8W5l++cTiuJxfy2kVp5ZihbRzrmsEMSJkEZ06y/43P8MMIYTTNcUgbT7C6a9tThkv4hG9SOiEoCLaLRE7FU/g==",
+      "version": "git+ssh://git@github.com/ErikBjare/Vue.D3.sunburst.git#1fe0f3e00e04109c548f8bac6e6333b735955668",
+      "from": "vue-d3-sunburst@git+https://github.com/ErikBjare/Vue.D3.sunburst.git#patch-1",
       "requires": {
         "d3-hierarchy": "^1.1.6",
         "d3-interpolate": "^1.2.0",
diff --git a/package.json b/package.json
index 33be4dcf..fddd7163 100644
--- a/package.json
+++ b/package.json
@@ -66,7 +66,7 @@
     "vue-awesome": "^3.5.1",
     "vue-chartjs": "^4.1.0",
     "vue-color": "^2.8.1",
-    "vue-d3-sunburst": "^1.9.0",
+    "vue-d3-sunburst": "git+https://github.com/ErikBjare/Vue.D3.sunburst.git#patch-1",
     "vue-datetime": "^1.0.0-beta.13",
     "vuedraggable": "^2.24.3",
     "weekstart": "^1.0.1",
diff --git a/src/main.js b/src/main.js
index ed0a4a9f..cdef3f6d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -28,7 +28,7 @@ import router from './route.js';
 import pinia from './stores';
 
 // Register Font Awesome icon component
-Vue.component('icon', () => import('vue-awesome/components/Icon'));
+Vue.component('icon', () => import('vue-awesome/components/Icon.vue'));
 
 // General components
 Vue.component('error-boundary', () => import('./components/ErrorBoundary.vue'));
@@ -80,7 +80,7 @@ import { createClient, getClient, configureClient } from './util/awclient';
 createClient();
 
 // Setup Vue app
-import App from './App';
+import App from './App.vue';
 new Vue({
   el: '#app',
   router: router,
diff --git a/src/util/timeperiod.ts b/src/util/timeperiod.ts
index 58948290..6d62212f 100644
--- a/src/util/timeperiod.ts
+++ b/src/util/timeperiod.ts
@@ -1,5 +1,5 @@
 import moment from 'moment';
-import { get_day_start_with_offset } from '~/util/time';
+import { get_day_start_with_offset } from './time';
 import { useSettingsStore } from '~/stores/settings';
 
 export interface TimePeriod {
diff --git a/vite.config.js b/vite.config.js
index 742c22f5..c9c0cb45 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -2,10 +2,26 @@ import path from 'node:path';
 import { defineConfig } from 'vite';
 import vue from '@vitejs/plugin-vue2';
 
-export default defineConfig({
-  plugins: [vue()],
-  publicDir: './static',
-  resolve: {
-    alias: { '/src': path.resolve(process.cwd(), 'src') },
-  },
+export default defineConfig(({ mode }) => {
+  const PRODUCTION = mode === 'production';
+
+  return {
+    server: {
+      port: 27180,
+      headers: {
+        'Content-Security-Policy': PRODUCTION ? "default-src 'self'" : "default-src 'self' *:5666",
+      },
+    },
+    plugins: [vue()],
+    publicDir: './static',
+    resolve: {
+      alias: { '~': path.resolve(__dirname, 'src') },
+    },
+    define: {
+      PRODUCTION,
+      AW_SERVER_URL: process.env.AW_SERVER_URL,
+      COMMIT_HASH: process.env.COMMIT_HASH,
+      'process.env.VUE_APP_ON_ANDROID': process.env.VUE_APP_ON_ANDROID,
+    },
+  };
 });
