bump front stack and update favicon

.gitignore

@@ -8,6 +8,7 @@
 /.phpunit.cache
 /.vscode
 /node_modules
+/bootstrap
 /public/build
 /public/cache
 /public/hot
@@ -21,3 +22,17 @@ Homestead.json
 Homestead.yaml
 npm-debug.log
 yarn-error.log
+.npmrc
+
+# Ignore public favicon
+/public/android-chrome-192x192.png
+/public/android-chrome-512x512.png
+/public/apple-touch-icon.png
+/public/browserconfig.xml
+/public/browserconfig.xml
+/public/favicon-16x16.png
+/public/favicon-32x32.png
+/public/favicon.ico
+/public/mstile-150x150.png
+/public/safari-pinned-tab.svg
+/public/site.webmanifest

package.json

@@ -1,6 +1,8 @@
 {
     "private": true,
+    "name": "srcs",
     "scripts": {
+        "vite": "vite --clearScreen false",
         "prod": "vite build --mode production",
         "dev": "NODE_ENV=development vite build -d --mode development",
         "watch": "NODE_ENV=development vite build --mode development --watch",
@@ -12,48 +14,62 @@
         "stylelint-ci": "node ./node_modules/.bin/stylelint --config './.stylelintrc.json' --max-warnings 0 '**/resources/**/*.scss' -f json"
     },
     "devDependencies": {
+        "@babel/core": "^7.22.11",
+        "@babel/types": "^7.21.2",
         "@eastdesire/jscolor": "^2.5.1",
-        "@fortawesome/fontawesome-svg-core": "latest",
+        "@fortawesome/fontawesome-svg-core": "^6.5.1",
-        "@fortawesome/free-brands-svg-icons": "latest",
+        "@fortawesome/free-regular-svg-icons": "^6.5.1",
-        "@fortawesome/free-regular-svg-icons": "latest",
+        "@fortawesome/free-solid-svg-icons": "^6.5.1",
-        "@fortawesome/free-solid-svg-icons": "latest",
+        "@fortawesome/vue-fontawesome": "^3.0.5",
-        "@fortawesome/vue-fontawesome": "^3.0.3",
         "@sipec/vue3-tags-input": "^3.0.4",
         "@types/bootstrap": "^5.2.7",
         "@types/node": "^20.8.2",
         "@types/toastify-js": "^1.12.1",
         "@types/vue-select": "^3.16.5",
-        "@vitejs/plugin-legacy": "latest",
+        "@typescript-eslint/eslint-plugin": "^5.62.0",
-        "@vitejs/plugin-vue": "latest",
+        "@typescript-eslint/parser": "^5.36.2",
+        "@vitejs/plugin-basic-ssl": "^1.0.1",
+        "@vitejs/plugin-vue": "^4.6.2",
         "@vue/compiler-sfc": "latest",
         "@vue/eslint-config-typescript": "latest",
-        "@vue/tsconfig": "latest",
+        "@vue/tsconfig": "^0.4.0",
         "axios": "^1.5.1",
         "bootstrap": "^5.3.2",
         "chart.js": "^4.4.0",
         "cropperjs": "^1.6.1",
         "eslint": "latest",
+        "eslint-import-resolver-alias": "^1.1.2",
         "eslint-plugin-vue": "latest",
         "glightbox": "^3.2.0",
-        "laravel-vite-plugin": "latest",
+        "laravel-vite-plugin": "^0.8.1",
         "moment": "^2.29.4",
         "postcss-discard-comments": "^6.0.0",
         "prettier": "latest",
         "print-js": "^1.6.0",
+        "resolve-url-loader": "^5.0.0",
+        "rollup-plugin-copy": "^3.5.0",
         "sass": "latest",
         "slugify": "^1.6.6",
+        "stylelint": "^15.11.0",
         "stylelint-config-idiomatic-order": "github:ream88/stylelint-config-idiomatic-order",
-        "stylelint-config-sass-guidelines": "latest",
+        "stylelint-config-sass-guidelines": "^10.0.0",
-        "stylelint-config-standard-scss": "latest",
+        "stylelint-config-standard-scss": "^11.1.0",
+        "stylelint-scss": "^5.3.2",
         "sweetalert2": "^11.7.31",
         "terser": "latest",
         "toastify-js": "^1.12.0",
-        "typescript": "latest",
+        "ts-loader": "^9.3.1",
+        "typescript": ">=3.3.1 <5.2.0",
+        "typescript-eslint": "latest",
+        "vite": "^4.5.1",
+        "vite-plugin-babel": "latest",
         "vite-plugin-checker": "latest",
         "vite-plugin-eslint": "latest",
         "vite-plugin-stylelint": "latest",
         "vue": "latest",
+        "vue-eslint-parser": "^9.3.2",
+        "vue-loader": "^17.3.1",
         "vue-select": "^4.0.0-beta.6",
-        "vue-tsc": "1.6.0"
+        "vue-tsc": "1.8.11"
     }
 }

phpstan.neon

@@ -0,0 +1,10 @@
+includes:
+    - vendor/larastan/larastan/extension.neon
+
+parameters:
+
+    paths:
+        - app/
+
+    # Level 9 is the highest level
+    level: 5

public/safari-pinned-tab.svg

@@ -1,18 +0,0 @@
-<?xml version="1.0" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
- "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
-<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
- width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000"
- preserveAspectRatio="xMidYMid meet">
-<metadata>
-Created by potrace 1.14, written by Peter Selinger 2001-2017
-</metadata>
-<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
-fill="#000000" stroke="none">
-<path d="M690 5010 c-276 -72 -493 -290 -572 -575 l-23 -80 -3 -1725 c-2
--1169 0 -1755 8 -1817 12 -109 54 -240 101 -319 48 -80 169 -206 250 -259 82
--55 156 -86 264 -111 76 -18 160 -19 1845 -19 l1765 0 85 22 c290 77 506 293
-583 583 l22 85 0 1770 c0 1690 -1 1774 -19 1850 -39 169 -107 288 -235 407
--94 88 -162 130 -278 172 l-88 31 -1815 2 c-1768 2 -1817 2 -1890 -17z"/>
-</g>
-</svg>

resources/favicon/browserconfig.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#1e2125</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

resources/favicon/safari-pinned-tab.svg

@@ -0,0 +1,60 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M695 5011 c-101 -27 -151 -49 -229 -99 -202 -128 -332 -335 -365
+-575 -8 -53 -11 -624 -11 -1770 0 -1858 -1 -1806 60 -1965 70 -183 249 -364
+429 -437 31 -13 92 -31 136 -41 76 -18 160 -19 1845 -19 l1765 0 85 23 c330
+87 556 345 600 682 8 60 10 596 8 1815 -3 1717 -4 1731 -24 1805 -48 173 -109
+276 -233 392 -92 87 -177 139 -286 176 l-80 27 -1815 2 c-1739 2 -1818 1
+-1885 -16z m3745 -1024 c14 -17 38 -43 54 -57 16 -14 43 -37 60 -52 l31 -26
+-1 -109 c-1 -112 -16 -184 -54 -270 -13 -30 -24 -83 -29 -138 -7 -81 -12 -96
+-44 -145 -29 -44 -39 -71 -48 -135 -6 -44 -25 -115 -41 -159 -24 -63 -29 -87
+-24 -124 6 -48 -17 -169 -56 -287 -11 -33 -24 -104 -29 -158 -8 -87 -18 -119
+-83 -285 -41 -103 -84 -216 -96 -252 -12 -36 -28 -72 -35 -80 -7 -8 -25 -41
+-40 -73 -24 -50 -96 -126 -115 -121 -3 1 -23 -9 -46 -22 -96 -56 -179 -71
+-239 -44 -11 5 -46 19 -77 30 -71 26 -130 88 -178 189 -19 40 -65 133 -102
+207 -37 74 -73 156 -79 182 -7 26 -24 75 -39 109 -51 112 -56 176 -20 243 21
+39 -4 42 -40 5 -26 -27 -35 -46 -41 -90 -4 -31 -26 -98 -49 -148 -81 -178
+-109 -243 -134 -317 -29 -83 -106 -220 -157 -277 -17 -20 -37 -51 -45 -68 -22
+-53 -92 -133 -134 -155 -79 -40 -160 -16 -193 58 -25 58 -34 191 -17 260 17
+73 12 378 -8 457 -5 22 -15 94 -21 160 -6 66 -16 140 -22 165 -18 71 -39 189
+-48 265 -5 39 -23 104 -41 148 -29 68 -31 81 -20 102 10 19 10 37 0 92 -7 37
+-18 75 -26 83 -27 31 -54 106 -53 150 0 25 8 65 18 90 35 88 159 126 261 79
+67 -30 97 -64 121 -138 12 -36 30 -80 40 -97 15 -25 17 -37 8 -67 -5 -20 -17
+-41 -26 -46 -15 -8 -15 -16 -6 -62 6 -30 12 -90 12 -134 1 -81 17 -321 26
+-385 3 -19 10 -66 16 -105 5 -38 12 -124 15 -190 12 -308 18 -326 85 -229 23
+34 137 331 138 360 0 2 15 33 34 67 19 34 37 76 41 92 4 17 29 89 56 162 27
+72 54 162 60 200 19 118 27 139 76 182 59 52 107 61 169 31 25 -12 53 -36 65
+-56 12 -19 26 -34 31 -34 5 0 9 -5 9 -11 0 -6 15 -29 34 -50 38 -44 56 -103
+56 -177 0 -35 6 -57 21 -77 12 -15 32 -63 44 -106 13 -44 35 -97 49 -118 15
+-21 30 -56 33 -77 3 -22 21 -70 39 -109 19 -38 34 -76 34 -82 0 -22 40 -14 66
+12 61 61 94 203 94 414 0 53 6 89 19 118 19 40 94 123 113 123 9 0 3 108 -9
+170 -2 14 -8 54 -12 90 -8 61 -6 69 22 123 17 32 59 90 94 129 35 39 63 78 63
+87 0 39 101 209 187 314 22 28 22 28 5 75 -20 51 -20 55 -8 92 11 32 35 60 61
+70 36 13 98 -8 125 -43z m-2802 -12 c69 -21 107 -55 127 -115 10 -31 27 -57
+45 -70 37 -27 67 -91 85 -181 7 -41 23 -114 34 -163 12 -50 21 -91 21 -92 0
+-7 -80 -94 -80 -87 0 4 -4 2 -9 -6 -11 -17 -111 -28 -111 -12 0 6 -6 11 -13
+11 -7 0 -44 29 -82 65 -38 36 -73 65 -77 65 -4 0 -8 6 -8 13 0 18 -74 77 -109
+87 -67 19 -168 22 -221 6 -30 -9 -71 -16 -92 -16 -54 0 -71 -11 -154 -99 -58
+-60 -75 -86 -84 -124 -27 -107 20 -170 220 -302 69 -46 154 -109 190 -140 36
+-32 90 -76 120 -98 30 -22 82 -65 115 -95 33 -30 70 -59 81 -64 23 -11 64 -83
+64 -112 0 -10 18 -64 39 -121 62 -165 85 -277 78 -393 -5 -92 -8 -102 -54
+-192 -128 -251 -238 -352 -400 -370 -43 -4 -117 -14 -165 -21 -77 -11 -98 -11
+-176 4 -49 9 -99 17 -111 17 -29 0 -88 45 -107 81 -8 15 -14 47 -14 70 0 35 6
+48 39 80 34 34 45 39 84 39 51 0 91 -14 125 -44 16 -14 34 -19 61 -18 22 2 42
+-2 46 -8 9 -14 43 -13 117 6 99 24 119 34 178 88 72 66 83 84 120 195 28 84
+31 101 24 168 -6 64 -15 91 -66 191 -33 64 -66 124 -74 133 -8 8 -14 19 -14
+23 0 35 -185 176 -272 208 -32 11 -58 24 -58 29 0 4 -17 18 -37 30 -20 13 -58
+42 -84 65 -26 23 -81 59 -124 80 -102 52 -197 150 -251 260 -39 78 -39 80 -39
+194 l0 115 53 105 c72 144 187 270 299 328 101 51 131 60 227 67 53 4 100 14
+140 31 73 31 277 103 292 104 6 0 33 -7 62 -15z"/>
+</g>
+</svg>

resources/favicon/site.webmanifest

@@ -1,6 +1,6 @@
 {
-    "name": "Support",
+    "name": "Support Web",
-    "short_name": "Support",
+    "short_name": "Support Web",
     "icons": [
         {
             "src": "/android-chrome-192x192.png",
@@ -13,7 +13,7 @@
             "type": "image/png"
         }
     ],
-    "theme_color": "#ffffff",
+    "theme_color": "#1e2125",
-    "background_color": "#ffffff",
+    "background_color": "#1e2125",
     "display": "standalone"
 }

resources/sass/bo/mail-theme.scss

@@ -0,0 +1,313 @@
+@use "sass:color";
+@import "utilities/variables";
+
+// 1. Include new custom variables
+@import "utilities/bootstrap-variables";
+
+// 2. Include functions first (so you can manipulate colors, SVGs, calc, etc)
+@import "bootstrap/scss/functions";
+
+// 3. Include remainder of required Bootstrap stylesheets
+@import "bootstrap/scss/variables";
+
+// * Laravel mail vendor
+
+/* Base */
+
+body,
+body *:not(html, style, br, tr, code) {
+    position: relative;
+    box-sizing: border-box;
+    font-family:
+        -apple-system,
+        BlinkMacSystemFont,
+        "Segoe UI",
+        Roboto,
+        Helvetica,
+        Arial,
+        sans-serif,
+        "Apple Color Emoji",
+        "Segoe UI Emoji",
+        "Segoe UI Symbol";
+}
+
+body {
+    width: 100% !important;
+    height: 100%;
+    padding: 0;
+    margin: 0;
+    background-color: $body-bg;
+    color: $body-color;
+    line-height: 1.4;
+    text-size-adjust: none;
+}
+
+p,
+ul,
+ol,
+blockquote {
+    line-height: 1.4;
+    text-align: left;
+}
+
+img {
+    max-width: 100%;
+}
+
+a {
+    color: $link-color;
+}
+
+a img {
+    border: 0;
+}
+
+/* Typography */
+
+h1 {
+    margin-top: 0;
+    color: $color-primary;
+    font-size: 18px;
+    font-weight: bold;
+    text-align: left;
+}
+
+h2 {
+    margin-top: 0;
+    font-size: 16px;
+    font-weight: bold;
+    text-align: left;
+}
+
+h3 {
+    margin-top: 0;
+    font-size: 14px;
+    font-weight: bold;
+    text-align: left;
+}
+
+p {
+    margin-top: 0;
+    font-size: 16px;
+    line-height: 1.5em;
+    text-align: left;
+}
+
+.sub {
+    font-size: 12px;
+}
+
+/* Layout */
+
+.wrapper {
+    -premailer-width: 100%;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+    background-color: $bg-lightened;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+}
+
+.content {
+    -premailer-width: 100%;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+}
+
+/* Header */
+
+.header {
+    padding: 25px 0;
+    text-align: center;
+}
+
+.header a {
+    color: $color-primary;
+    font-size: 19px;
+    font-weight: bold;
+    text-decoration: none;
+}
+
+/* Logo */
+
+.logo {
+    width: 75px;
+    height: 75px;
+    max-height: 75px;
+}
+
+/* Body */
+
+.body {
+    -premailer-width: 100%;
+    width: 100%;
+    padding: 0;
+    border-top: 1px solid #{$bg-lightened};
+    border-bottom: 1px solid #{$bg-lightened};
+    margin: 0;
+    background-color: $bg-lightened;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+}
+
+.inner-body {
+    -premailer-width: 570px;
+    width: 570px;
+    padding: 0;
+    border-width: 1px;
+    border-color: color.scale($body-bg, $lightness: -30%);
+    border-radius: 2px;
+    margin: 0 auto;
+    background-color: $body-bg;
+    box-shadow: 0 2px 0 rgb(0 0 150 / 2.5%), 2px 4px 0 rgb(0 0 150 / 1.5%);
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+}
+
+/* Subcopy */
+
+.subcopy {
+    padding-top: 25px;
+    border-top: 1px solid color.scale($body-bg, $lightness: -30%);
+    margin-top: 25px;
+}
+
+.subcopy p {
+    font-size: 14px;
+}
+
+/* Footer */
+
+.footer {
+    -premailer-width: 570px;
+    width: 570px;
+    padding: 0;
+    margin: 0 auto;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+    text-align: center;
+}
+
+.footer p {
+    color: #b0adc5;
+    font-size: 12px;
+    text-align: center;
+}
+
+.footer a {
+    color: #b0adc5;
+    text-decoration: underline;
+}
+
+/* Tables */
+
+.table table {
+    -premailer-width: 100%;
+    width: 100%;
+    margin: 30px auto;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+}
+
+.table th {
+    padding-bottom: 8px;
+    border-bottom: 1px solid #edeff2;
+    margin: 0;
+}
+
+.table td {
+    padding: 10px 0;
+    margin: 0;
+    color: #74787e;
+    font-size: 15px;
+    line-height: 18px;
+}
+
+.content-cell {
+    max-width: 100vw;
+    padding: 32px;
+}
+
+/* Buttons */
+
+.action {
+    -premailer-width: 100%;
+    width: 100%;
+    padding: 0;
+    margin: 30px auto;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+    text-align: center;
+}
+
+.button {
+    display: inline-block;
+    overflow: hidden;
+    border-radius: 4px;
+    color: $body-bg;
+    text-decoration: none;
+    text-size-adjust: none;
+}
+
+.button-blue,
+.button-primary {
+    border-top: 8px solid #{$color-primary};
+    border-right: 18px solid #{$color-primary};
+    border-bottom: 8px solid #{$color-primary};
+    border-left: 18px solid #{$color-primary};
+    background-color: #{$color-primary};
+}
+
+.button-green,
+.button-success {
+    border-top: 8px solid #{$color-success};
+    border-right: 18px solid #{$color-success};
+    border-bottom: 8px solid #{$color-success};
+    border-left: 18px solid #{$color-success};
+    background-color: #{$color-success};
+}
+
+.button-red,
+.button-error {
+    border-top: 8px solid #{$color-danger};
+    border-right: 18px solid #{$color-danger};
+    border-bottom: 8px solid #{$color-danger};
+    border-left: 18px solid #{$color-danger};
+    background-color: #{$color-danger};
+}
+
+/* Panels */
+
+.panel {
+    border-left: $color-primary solid 4px;
+    margin: 21px 0;
+}
+
+.panel-content {
+    padding: 16px;
+    background-color: $bg-lightened;
+    color: $body-color;
+}
+
+.panel-content p {
+    color: $body-color;
+}
+
+.panel-item {
+    padding: 0;
+}
+
+.panel-item p:last-of-type {
+    padding-bottom: 0;
+    margin-bottom: 0;
+}
+
+/* Utilities */
+
+.break-all {
+    word-break: break-all;
+}

resources/sass/bo/utilities/_bootstrap-variables.scss

@@ -0,0 +1,19 @@
+// Override bootstrap colors
+$primary: $color-primary;
+$secondary: $color-secondary;
+$success: $color-success;
+$info: $color-info;
+$warning: $color-warning;
+$danger: $color-danger;
+$light: $color-light;
+$dark: $color-dark;
+$theme-colors: (
+    primary: $primary,
+    secondary: $secondary,
+    success: $success,
+    info: $info,
+    warning: $warning,
+    danger: $danger,
+    light: $light,
+    dark: $dark,
+);

resources/sass/bo/utilities/_variables.scss

@@ -49,6 +49,17 @@ $dark: $gray-900 !default;
 $body-bg: $white;
 $min-contrast-ratio: 1.95 !default;
 
+// Override bootstrap colors
+$color-primary: $primary;
+$color-secondary: $secondary;
+$color-success: $success;
+$color-info: $info;
+$color-warning: $warning;
+$color-danger: $danger;
+$color-light: $light;
+$color-dark: $dark;
+$bg-lightened: $light;
+
 // Fonts
 // stylelint-disable-next-line value-keyword-case
 $font-family-sans-serif: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",

resources/views/layout/app.blade.php

@@ -12,18 +12,15 @@
     <!-- CSRF Token -->
     <meta name="csrf-token" content="{{ csrf_token() }}">
 
-    <!--  Favicon -->
+    {{-- Favicon --}}
-    <link href="/apple-touch-icon.png" rel="apple-touch-icon" sizes="180x180">
+    {{-- GENERER favicon avec un outil https://realfavicongenerator.net/ --}}
-    <link type="image/png" href="/favicon-32x32.png" rel="icon" sizes="32x32">
+    <link href="{{ asset('apple-touch-icon.png') }}" rel="apple-touch-icon" sizes="180x180">
-    <link type="image/png" href="/android-chrome-192x192.png" rel="icon" sizes="192x192">
+    <link type="image/png" href="{{ asset('favicon-32x32.png') }}" rel="icon" sizes="32x32">
-    <link type="image/png" href="/favicon-16x16.png" rel="icon" sizes="16x16">
+    <link type="image/png" href="{{ asset('favicon-16x16.png') }}" rel="icon" sizes="16x16">
-    <link href="/site.webmanifest" rel="manifest">
+    <link href="{{ asset('site.webmanifest') }}" rel="manifest">
-    <link href="/safari-pinned-tab.svg" rel="mask-icon" color="#0040a6">
+    <link href="{{ asset('safari-pinned-tab.svg') }}" rel="mask-icon" color="#003e96">
-    <meta name="apple-mobile-web-app-title" content="Support">
+    <meta name="msapplication-TileColor" content="#1e2125">
-    <meta name="application-name" content="Support">
+    <meta name="theme-color" content="#1e2125">
-    <meta name="msapplication-TileColor" content="#4c272c">
-    <meta name="msapplication-TileImage" content="/mstile-144x144.png">
-    <meta name="theme-color" content="#ffffff">
 
     <!-- Styles -->
     @vite(['resources/sass/bo/bo.scss'])

vite.config.ts

@@ -1,12 +1,17 @@
-import legacy from "@vitejs/plugin-legacy";
+import basicSsl from "@vitejs/plugin-basic-ssl";
 import vue from "@vitejs/plugin-vue";
 import laravel from "laravel-vite-plugin";
 import path from "path";
-import { defineConfig } from "vite";
+import postcssDiscard from "postcss-discard-comments";
+import copy from "rollup-plugin-copy";
+import { defineConfig, loadEnv } from "vite";
+import babel from "vite-plugin-babel";
 import checker from "vite-plugin-checker";
 import eslint from "vite-plugin-eslint";
 import stylelint from "vite-plugin-stylelint";
 
+const env = loadEnv("r", process.cwd(), "");
+
 export default defineConfig({
     build: {
         rollupOptions: {
@@ -17,28 +22,41 @@ export default defineConfig({
                 chunkFileNames: `assets/${
                     process.env.NODE_ENV === "local" ? "[name]-" : ""
                 }[hash].js`,
-                assetFileNames: `assets/${
+                assetFileNames: (chunk) => {
-                    process.env.NODE_ENV === "local" ? "[name]-" : ""
+                    if (
-                }[hash].[ext]`,
+                        String(chunk.name).endsWith("mail-theme.scss") ||
+                        chunk.name === "mail-theme.css"
+                    ) {
+                        return "vendor/mail/html/themes/default.[ext]";
+                    }
+                    return `assets/${process.env.NODE_ENV === "local" ? "[name]-" : ""
+                    }[hash].[ext]`;
+                },
             },
         },
         emptyOutDir: true,
         sourcemap: process.env.NODE_ENV === "local" ? "inline" : false,
     },
     css: {
+        preprocessorOptions: {
+            scss: {
+                quietDeps: true
+            }
+        },
         devSourcemap: process.env.NODE_ENV === "local" ? true : false,
         postcss: {
             map: {
                 inline: true,
             },
             plugins: [
-                require("postcss-discard-comments")({
+                postcssDiscard({
                     removeAll: true,
                 }),
             ],
         },
     },
     plugins: [
+        basicSsl(),
         checker({
             enableBuild: true,
             vueTsc: {
@@ -51,25 +69,49 @@ export default defineConfig({
             },
             eslint: {
                 lintCommand:
-                    "eslint --fix --quiet -c .eslintrc.json \"./resources\"",
+                    "eslint --quiet -c .eslintrc.json \"./resources/ts/*\"",
             },
             stylelint: {
                 lintCommand:
-                    "stylelint -q --config \"./.stylelintrc.json\" --fix \"**/resources/**/*.scss\"",
+                    "stylelint --quiet -c .stylelintrc.json --fix **/resources/**/*.scss",
             },
         }),
         laravel({
             input: [
                 "resources/sass/bo/bo.scss",
                 "resources/ts/bo/bo.ts",
+                "resources/sass/bo/mail-theme.scss",
             ],
+            refresh: true,
+        }),
+        copy({
+            targets: [
+                {
+                    src: [
+                        // * Engine copy (Default favicon)
+                        path.normalize("resources/favicon/android-chrome-192x192.png"),
+                        path.normalize("resources/favicon/android-chrome-512x512.png"),
+                        path.normalize("resources/favicon/apple-touch-icon.png"),
+                        path.normalize("resources/favicon/browserconfig.xml"),
+                        path.normalize("resources/favicon/browserconfig.xml"),
+                        path.normalize("resources/favicon/favicon-16x16.png"),
+                        path.normalize("resources/favicon/favicon-32x32.png"),
+                        path.normalize("resources/favicon/favicon.ico"),
+                        path.normalize("resources/favicon/mstile-150x150.png"),
+                        path.normalize("resources/favicon/safari-pinned-tab.svg"),
+                        path.normalize("resources/favicon/site.webmanifest"),
+                    ],
+                    dest: path.normalize("public")
+                },
+            ],
+            copyOnce: true,
+            verbose: true
         }),
         stylelint({
             dev: false,
             build: true,
             cache: false,
             chokidar: true,
-            quiet: false,
             include: ["**/resources/**/*.scss", "**/resources/**/*.css"],
             exclude: ["node_modules", "vendor"],
             lintOnStart: false,
@@ -89,15 +131,24 @@ export default defineConfig({
             failOnWarning: false,
             failOnError: false,
         }),
+        babel({
+            babelConfig: {
+                targets: "last 3 version, not dead, >0.3%"
+            }
+        }),
         vue({
             isProduction: process.env.NODE_ENV !== "local" ? true : false,
             exclude: ["node_modules", "vendor"],
-        }),
+        })
-        legacy({
-            targets: "last 3 version, not dead, >0.3%",
-            renderLegacyChunks: false,
-        }),
     ],
+    server: {
+        https: true,
+        host: env["APP_URL"] ? new URL(env["APP_URL"]).hostname : "",
+        port: 4443,
+        watch: {
+            usePolling: true,
+        },
+    },
     resolve: {
         extensions: ["*", ".js", ".ts", ".vue"],
         alias: [