initial recommit

astro.config.mjs

@@ -1,6 +1,6 @@
 import { defineConfig } from 'astro/config'
 import tailwind from "@astrojs/tailwind"
-import node from "@astrojs/node"
+import svelte from '@astrojs/svelte'
 import routing from './hooks/routing'
 
 // const faviconHook = {
@@ -14,13 +14,10 @@ import routing from './hooks/routing'
 // 	}
 // }
 
+const isProd = !process.env.TAURI_DEBUG
+
 // https://astro.build/config
 export default defineConfig({
-	// Use the NodeJS adapter
-	adapter: node({
-		mode: "standalone"
-	}),
-
 	// some settings to the build output
 	build: {
 		// the asset path
@@ -31,13 +28,13 @@ export default defineConfig({
 	},
 
 	// Compress the HTML output
-	compressHTML: true,
+	compressHTML: isProd ? true : false,
 
 	// Customizable depending on goal
-	output: 'server',
+	output: 'static',
 
 	// Add TailwindCSS
-	integrations: [tailwind(), routing()],
+	integrations: [svelte(), tailwind(), routing()],
 
 	// prefetch links
 	prefetch: {
@@ -50,7 +47,10 @@ export default defineConfig({
 	// the Output server
 	server: {
 		host: true,
-		port: 3000
+		port: 3000,
+		watch: {
+			ignored: ['**/target/**']
+		}
 	},
 
 	// Remove the trailing slash by default
@@ -58,6 +58,7 @@ export default defineConfig({
 
 	// Dev Server
 	vite: {
+		envPrefix: ['VITE_', 'TAURI_'],
 		server: {
 			watch: {
 				// Ignore some paths
@@ -65,8 +66,15 @@ export default defineConfig({
 				// support polling and WSL
 				usePolling: !!(process.env.USE_POLLING ?? process.env.WSL_DISTRO_NAME)
 			}
+		},
+		build: {
+			target: process.env.TAURI_ENV_PLATFORM == 'windows' ? 'chrome105' : 'safari13',
+			// don't minify for debug builds
+			minify: isProd ? 'esbuild' : false,
+			// produce sourcemaps for debug builds
+			sourcemap: !isProd,
 		}
 	},
 
 
- })
+})

package.json

@@ -3,9 +3,11 @@
 	"type": "module",
 	"private": true,
 	"scripts": {
-		"dev": "astro dev",
+		"dev": "tauri dev",
+		"front:dev": "astro dev",
 		"start": "node ./dist/server/entry.mjs",
-		"build": "astro build",
+		"front:build": "astro build",
+		"build": "tauri build",
 		"check": "npm run check:astro && npm run check:typescript",
 		"check:astro": "astro check",
 		"check:typescript": "tsc --noEmit",
@@ -15,23 +17,26 @@
 		"install:test": "playwright install --with-deps"
 	},
 	"dependencies": {
-		"@astrojs/node": "^7",
+		"@tauri-apps/api": "^2",
-		"@astrojs/tailwind": "^5",
+		"@tauri-apps/plugin-shell": "^2"
-		"@dzeio/logger": "^3",
-		"@dzeio/object-util": "^1",
-		"@dzeio/url-manager": "^1",
-		"astro": "^4",
-		"lucide-astro": "^0",
-		"sharp": "^0",
-		"simple-icons-astro": "^10",
-		"tailwindcss": "^3"
 	},
 	"devDependencies": {
 		"@astrojs/check": "^0",
+		"@astrojs/svelte": "^7",
+		"@astrojs/tailwind": "^6",
+		"@dzeio/logger": "^3",
+		"@dzeio/object-util": "^1",
+		"@dzeio/url-manager": "^1",
 		"@playwright/test": "^1",
-		"@types/node": "^20",
+		"@tauri-apps/cli": "^2",
-		"@vitest/coverage-v8": "^1",
+		"@types/node": "^22",
+		"@vitest/coverage-v8": "^3",
+		"astro": "^5",
+		"lucide-astro": "^0",
+		"sharp": "^0",
+		"simple-icons-astro": "^14",
+		"tailwindcss": "^3",
 		"typescript": "^5",
-		"vitest": "^1"
+		"vitest": "^3"
 	}
 }

src-tauri/.gitignore

@@ -0,0 +1,4 @@
+# Generated by Cargo
+# will have compiled files and executables
+/target/
+

src-tauri/Cargo.toml

@@ -0,0 +1,35 @@
+[package]
+name = "desktop"
+version = "0.0.0"
+description = "A Tauri App"
+authors = ["you"]
+edition = "2021"
+
+# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
+
+[build-dependencies]
+tauri-build = { version = "2", features = [] }
+
+[dependencies]
+tauri = { version = "2", features = [] }
+serde = { version = "1.0", features = ["derive"] }
+serde_json = "1.0"
+tauri-plugin-shell = "2"
+
+[features]
+# this feature is used for production builds or when `devPath` points to the filesystem
+# DO NOT REMOVE!!
+custom-protocol = ["tauri/custom-protocol"]
+
+[profile.release]
+panic = "abort" # Strip expensive panic clean-up logic
+codegen-units = 1 # Compile crates one after another so the compiler can optimize better
+lto = true # Enables link to optimizations
+opt-level = "s" # Optimize for binary size
+# can also use this one if it's smaller
+# opt-level = "z" # Optimize for binary size
+strip = true # Automatically strip symbols from the binary.
+
+[lib]
+name = "app_lib"
+crate-type = ["staticlib", "cdylib", "rlib"]

src-tauri/build.rs

@@ -0,0 +1,3 @@
+fn main() {
+    tauri_build::build()
+}

src-tauri/capabilities/migrated.json

@@ -0,0 +1,13 @@
+{
+  "identifier": "migrated",
+  "description": "permissions that were migrated from v1",
+  "local": true,
+  "windows": [
+    "main"
+  ],
+  "permissions": [
+    "core:default",
+    "shell:allow-open",
+    "shell:default"
+  ]
+}

src-tauri/gen/schemas/capabilities.json

@@ -0,0 +1 @@
+{"migrated":{"identifier":"migrated","description":"permissions that were migrated from v1","local":true,"windows":["main"],"permissions":["core:default","shell:allow-open","shell:default"]}}

src-tauri/src/lib.rs

@@ -0,0 +1,4 @@
+#[cfg_attr(mobile, tauri::mobile_entry_point)]
+pub fn run() {
+    // your code here
+}

src-tauri/src/main.rs

@@ -0,0 +1,82 @@
+// Prevents additional console window on Windows in release, DO NOT REMOVE!!
+#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
+
+use std::fs;
+
+// Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
+#[tauri::command]
+fn greet(name: &str) -> String {
+    format!("Hello, {}! You've been greeted from Rust!", name)
+}
+
+#[derive(serde::Serialize)]
+struct File {
+    filename: String,
+}
+
+#[derive(serde::Serialize)]
+struct FileList {
+    path: String,
+    list: Vec<File>,
+}
+
+#[tauri::command]
+fn list_files(path: &str) -> Result<FileList, String> {
+    let run = || -> Result<Vec<File>, ()> {
+        let paths = fs::read_dir(path).unwrap();
+        let mut final_string: String = String::new();
+        let mut arr = Vec::new();
+        for (idx, path) in paths.enumerate() {
+            if idx > 0 {
+                final_string.push(',');
+            }
+            arr.push(File {
+                filename: path.unwrap().path().display().to_string(),
+            });
+            // final_string.push_str(path.unwrap().path().display().to_string().as_str())
+        }
+        Ok(arr)
+    };
+    let list = run();
+
+    if list.is_err() {
+        Err("Error".to_owned())
+    } else {
+        Ok(FileList {
+            path: fs::canonicalize(path)
+                .unwrap()
+                .display()
+                .to_string()
+                .to_owned(),
+            list: list.unwrap(),
+        })
+    }
+}
+
+#[tauri::command]
+fn get_file(path: &str) -> Result<String, String> {
+    let run = || -> Result<String, String> {
+        let content = fs::read(path);
+        if content.is_err() {
+            return Err("Error".to_owned());
+        }
+        Ok(String::from_utf8(content.unwrap())
+            .unwrap_or("error decoding file content :(".to_owned()))
+    };
+    let res = run();
+
+    if res.is_err() {
+        Err("Error".to_owned())
+    } else {
+        Ok(res.unwrap())
+    }
+}
+
+fn main() {
+    app_lib::run();
+    tauri::Builder::default()
+        .plugin(tauri_plugin_shell::init())
+        .invoke_handler(tauri::generate_handler![greet, list_files, get_file])
+        .run(tauri::generate_context!())
+        .expect("error while running tauri application");
+}

src-tauri/tauri.conf.json

@@ -0,0 +1,38 @@
+{
+  "$schema": "https://raw.githubusercontent.com/tauri-apps/tauri/dev/tooling/cli/schema.json",
+  "build": {
+    "beforeDevCommand": "bun run front:dev",
+    "beforeBuildCommand": "bun run front:build",
+    "frontendDist": "../dist",
+    "devUrl": "http://localhost:3000"
+  },
+  "bundle": {
+    "active": true,
+    "targets": "all",
+    "icon": [
+      "icons/32x32.png",
+      "icons/128x128.png",
+      "icons/128x128@2x.png",
+      "icons/icon.icns",
+      "icons/icon.ico"
+    ]
+  },
+  "productName": "astro-editor",
+  "mainBinaryName": "astro-editor",
+  "version": "0.0.0",
+  "identifier": "com.dzeio.desktop",
+  "plugins": {},
+  "app": {
+    "security": {
+      "csp": null
+    },
+    "windows": [
+      {
+        "title": "astro-editor",
+        "width": 800,
+        "height": 600,
+        "useHttpsScheme": true
+      }
+    ]
+  }
+}

src/components/global/Button.astro

@@ -1,37 +1,15 @@
 ---
-import { objectOmit } from '@dzeio/object-util'
+import Windows from './Button/Windows.astro'
-
+import Default from './Button/Default.astro'
-export interface Props extends astroHTML.JSX.AnchorHTMLAttributes {
+import Linux from './Button/Linux.astro'
-	outline?: boolean
+import Platform from './Platform.astro'
-	ghost?: boolean
+import type ButtonProps from './Button/Props'
-}
-
-const classes = [
-	"button",
-	{outline: Astro.props.outline},
-	{ghost: Astro.props.ghost},
-	Astro.props.class
-]
 
+export interface Props extends ButtonProps {}
 ---
-{'href' in Astro.props && (
-	<a class:list={classes} {...objectOmit(Astro.props, 'type') as any}>
-		<slot />
-	</a>
-) || (
-	<button class:list={classes} {...objectOmit(Astro.props, 'type') as any}>
-		<slot />
-	</button>
-)}
 
-<style>
+<Platform>
-	.button {
+	<Linux slot="linux"><slot /></Linux>
-		@apply outline-none inline-flex px-4 py-2 rounded-lg bg-amber-500 hover:bg-amber-600 active:bg-amber-700 text-white font-medium transition-colors
+	<Windows slot="windows"><slot /></Windows>
-	}
+	<Default><slot /></Default>
-	.button.outline {
+</Platform>
-		@apply bg-transparent border-2 text-amber-500 border-gray-200 hover:bg-gray-100 active:bg-gray-200 active:border-gray-300
-	}
-	.button.ghost {
-		@apply text-black bg-transparent hover:bg-gray-200 active:bg-gray-300
-	}
-</style>

src/components/global/Button/Default.astro

@@ -0,0 +1,35 @@
+---
+import { objectOmit } from '@dzeio/object-util'
+import type ButtonProps from './Props'
+
+export interface Props extends ButtonProps {}
+
+const classes = [
+	"button",
+	{outline: Astro.props.outline},
+	{ghost: Astro.props.ghost},
+	Astro.props.class
+]
+
+---
+{'href' in Astro.props && (
+	<a class:list={classes} {...objectOmit(Astro.props, 'type') as any}>
+		<slot />
+	</a>
+) || (
+	<button class:list={classes} {...objectOmit(Astro.props, 'type') as any}>
+		<slot />
+	</button>
+)}
+
+<style>
+	.button {
+		@apply outline-none inline-flex px-4 py-2 rounded-lg bg-amber-500 hover:bg-amber-600 active:bg-amber-700 text-white font-medium transition-colors
+	}
+	.button.outline {
+		@apply bg-transparent border-2 text-amber-500 border-gray-200 hover:bg-gray-100 active:bg-gray-200 active:border-gray-300
+	}
+	.button.ghost {
+		@apply text-black bg-transparent hover:bg-gray-200 active:bg-gray-300
+	}
+</style>

src/components/global/Button/Linux.astro

@@ -0,0 +1,29 @@
+---
+import { objectOmit } from '@dzeio/object-util'
+import type ButtonProps from './Props'
+
+export interface Props extends ButtonProps {}
+
+const classes = [
+	"button",
+	{outline: Astro.props.outline},
+	{ghost: Astro.props.ghost},
+	Astro.props.class
+]
+
+---
+{'href' in Astro.props && (
+	<a class:list={classes} {...objectOmit(Astro.props, 'type') as any}>
+		<slot />
+	</a>
+) || (
+	<button class:list={classes} {...objectOmit(Astro.props, 'type') as any}>
+		<slot />
+	</button>
+)}
+
+<style>
+	.button {
+		@apply inline-flex px-4 py-2 rounded-lg bg-gtk-neutral-200  hover:bg-gray-300 active:bg-gray-400 focus:outline-2 focus:outline outline-gtk-blue-300 text-black font-medium transition-all
+	}
+</style>

src/components/global/Button/Props.d.ts

@@ -0,0 +1,4 @@
+export default interface Props extends astroHTML.JSX.AnchorHTMLAttributes {
+	outline?: boolean
+	ghost?: boolean
+}

src/components/global/Button/Windows.astro

@@ -0,0 +1,35 @@
+---
+import { objectOmit } from '@dzeio/object-util'
+import type ButtonProps from './Props'
+
+export interface Props extends ButtonProps {}
+
+const classes = [
+	"button",
+	{outline: Astro.props.outline},
+	{ghost: Astro.props.ghost},
+	Astro.props.class
+]
+
+---
+{'href' in Astro.props && (
+	<a class:list={classes} {...objectOmit(Astro.props, 'type') as any}>
+		<slot />
+	</a>
+) || (
+	<button class:list={classes} {...objectOmit(Astro.props, 'type') as any}>
+		<slot />
+	</button>
+)}
+
+<style>
+	.button {
+		@apply outline-none inline-flex px-4 py-2 rounded-lg bg-amber-500 hover:bg-amber-600 active:bg-amber-700 text-white font-medium transition-colors
+	}
+	.button.outline {
+		@apply bg-transparent border-2 text-amber-500 border-gray-200 hover:bg-gray-100 active:bg-gray-200 active:border-gray-300
+	}
+	.button.ghost {
+		@apply text-black bg-transparent hover:bg-gray-200 active:bg-gray-300
+	}
+</style>

src/components/global/Platform.astro

@@ -0,0 +1,30 @@
+---
+type Platform = 'linux' | 'windows' | 'default'
+
+const current = import.meta.env.TAURI_PLATFORM
+
+let platform: Platform = 'default'
+
+switch (current) {
+	case 'linux':
+		platform = 'linux'
+		break;
+	case 'windows':
+		platform = 'windows'
+		break;
+	default:
+		break;
+}
+---
+
+{platform === 'linux' && (
+	<slot name="linux"><slot /></slot>
+)}
+
+{platform === 'windows' && (
+	<slot name="windows"><slot /></slot>
+)}
+
+{platform === 'default' && (
+	<slot />
+)}

src/layouts/Base.astro

@@ -1,5 +1,7 @@
 ---
+import { tauri } from '@tauri-apps/api'
 import Head, { type Props as HeadProps } from './Head.astro'
+import { getCurrentPlatform } from 'libs/TauriUtils'
 
 export interface Props extends HeadProps {
 	class?: string
@@ -7,7 +9,7 @@ export interface Props extends HeadProps {
 ---
 
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class={getCurrentPlatform()}>
 	<head>
 		<Head {...Astro.props} />
 		<slot name="head" />

src/layouts/Head.astro

@@ -57,10 +57,6 @@ const canonical = typeof Astro.props.canonical === 'string' ? Astro.props.canoni
 <!-- Viewport -->
 <meta name="viewport" content="width=device-width" />
 
-
-<!-- Analytics -->
-<script defer data-domain="avior.me" src="/js/script.js"></script>
-
 <!-- Favicon -->
 <Favicon svg={IconSVG} png={IconPNG} icoPath="/favicon.ico" />
 

src/layouts/MainLayout.astro

@@ -3,7 +3,7 @@ import Footer from 'components/layouts/Footer.astro'
 import Base, { type Props as BaseProps } from './Base.astro'
 import Header from 'components/layouts/Header.astro'
 import { Mail, Phone } from 'lucide-astro'
-import { Github, Linkedin } from 'simple-icons-astro'
+import { Github } from 'simple-icons-astro'
 
 export interface Props extends BaseProps {
 	/**
@@ -22,7 +22,6 @@ export interface Props extends BaseProps {
 	<Footer links={[
 		{href: 'https://www.avior.me', display: 'About'}
 	]} socials={[
-		{href: 'https://linkedin.com', icon: Linkedin},
 		{href: 'mailto:contact@example.com', target: '', icon: Mail},
 		{href: 'tel:+33601020304', target: '', icon: Phone},
 		{href: 'https://github.com/dzeiocom', icon: Github},

src/libs/TauriUtils.ts

@@ -0,0 +1,18 @@
+export function getPlatformStyle() {
+
+}
+type Platform = 'linux' | 'windows' | 'default'
+
+export function getCurrentPlatform(): Platform {
+	const current = import.meta.env.TAURI_ENV_PLATFORM
+	console.log(import.meta.env)
+
+	switch (current) {
+		case 'linux':
+			return 'linux'
+		case 'windows':
+			return 'windows'
+		default:
+			return 'default'
+	}
+}

src/middleware/README.md

@@ -1,9 +0,0 @@
-# Middlewares
-
-This folder contains middlewares for the SSR pages/endpoints
-
-They are run for every paths independent of the middleware and in the specified order of the `index.ts`
-
-## locals
-
-You can pass variables to other middlewares and endpoints by adding a variable in `locals` and in `App.Locals` in `env.d.ts`

src/middleware/index.ts

@@ -1,5 +0,0 @@
-import { sequence } from "astro/middleware"
-
-import logger from './logger'
-
-export const onRequest = sequence(logger)

src/middleware/logger.ts

@@ -1,53 +0,0 @@
-import { defineMiddleware } from "astro/middleware"
-import ResponseBuilder from 'libs/ResponseBuilder'
-
-/**
- * Simple Middleware that handle the logging of requests and handling processing errors
- */
-export default defineMiddleware(async ({ request, url }, next) => {
-	const now = new Date()
-	//                   Date of request              User-Agent 32 first chars                                     request Method
-	let prefix = `\x1b[2m${now.toISOString()}\x1b[22m ${request.headers.get('user-agent')?.slice(0, 32).padEnd(32)} ${request.method.padEnd(7)}`
-
-	const fullURL = url.toString()
-	const path = fullURL.slice(fullURL.indexOf(url.pathname, fullURL.indexOf(url.host)))
-
-	if (!import.meta.env.PROD) {
-		//                time of request
-		prefix = `\x1b[2m${new Date().toLocaleTimeString('fr')}\x1b[22m`
-	}
-
-	//                        HTTP Status Code     Time to run request   path of request
-	console.log(`${prefix} ${''.padStart(5, ' ')} ${''.padStart(7, ' ')} ${path}`)
-
-	// Handle if the request die
-	try {
-		const res = await next()
-
-		if (import.meta.env.PROD) {
-			//                              HTTP Status                  time to execute                                                                 path of request
-			console.log(`${prefix} \x1b[34m[${res.status}]\x1b[0m \x1b[2m${(new Date().getTime() - now.getTime()).toFixed(0).padStart(5, ' ')}ms\x1b[22m ${path}`)
-		}
-
-		return res
-	} catch (e) {
-		if (import.meta.env.PROD) {
-			//                                                 time to execute                                                                 path of request
-			console.log(`${prefix} \x1b[34m[500]\x1b[0m \x1b[2m${(new Date().getTime() - now.getTime()).toFixed(0).padStart(5, ' ')}ms\x1b[22m ${path}`)
-		}
-
-		// add a full line dash to not miss it
-		const columns = (process?.stdout?.columns ?? 32) - 7
-		const dashes = ''.padEnd(columns / 2, '-')
-
-		// colorize the lines to make sur to not miss it
-		console.error(`\x1b[91m${dashes} ERROR ${dashes}\x1b[0m`)
-		console.error(e)
-		console.error(`\x1b[91m${dashes} ERROR ${dashes}\x1b[0m`)
-
-		return new ResponseBuilder()
-			.status(500)
-			.body('An error occured while processing your request')
-			.build()
-	}
-})

src/pages/api/event.ts

@@ -1,23 +0,0 @@
-import type { APIRoute } from 'astro'
-import ResponseBuilder from '../../libs/ResponseBuilder'
-
-/**
- * Plausible proxy
- */
-export const POST: APIRoute = async ({ request, clientAddress }) => {
-	// const body = await request.json()
-	// console.log(body, clientAddress)
-	const res = await fetch('https://plausible.io/api/event', {
-		method: 'POST',
-		headers: {
-			'User-Agent': request.headers.get('User-Agent') as string,
-			'X-Forwarded-For': clientAddress,
-			'Content-Type': 'application/json'
-		},
-		body: await request.text()
-	})
-	return new ResponseBuilder()
-		.status(res.status)
-		.body(await res.text())
-		.build()
-}

src/pages/index.astro

@@ -1,10 +1,11 @@
 ---
+import Button from 'components/global/Button.astro'
 import MainLayout from 'layouts/MainLayout.astro'
 ---
 
 <MainLayout title="Dzeio - Website Template">
 	<main class="container flex flex-col justify-center items-center h-screen gap-6">
 		<h1 class="text-8xl text-center">Dzeio Astro Template</h1>
-		<h2 class="text-2xl text-center">Start editing src/pages/index.astro to see your changes!</h2>
+		<Button>Pouet</Button>
 	</main>
 </MainLayout>

src/pages/js/script.js.ts

@@ -1,13 +0,0 @@
-import type { APIRoute } from 'astro'
-import ResponseBuilder from '../../libs/ResponseBuilder'
-
-/**
- * Plausible proxy
- */
-export const GET: APIRoute = async () => {
-	const res = await fetch('https://plausible.io/js/script.outbound-links.tagged-events.js')
-	return new ResponseBuilder()
-		.status(200)
-		.body(await res.text())
-		.build()
-}

tailwind.config.cjs

@@ -6,13 +6,71 @@ module.exports = {
 	content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
 	theme: {
 		fontFamily: {
-			// add your default font below
+			'sans': ['-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Helvetica', 'Arial', 'sans-serif', 'Apple Color Emoji', 'Segoe UI Emoji'],
-			'sans': ['Font Name', ...defaultTheme.fontFamily.sans]
 		},
 		extend: {
 			colors: {
 				// primary color used by the projet, easily swappable
-				primary: colors.amber
+				primary: colors.amber,
+				'gtk-neutral': { // https://blog.gtk.org/files/2019/01/color-palette.png
+					100: '#F6F5F4',
+					200: '#DEDDDA',
+					300: '#C0BFBC',
+					400: '#9A9996',
+					500: '#77767B',
+					600: '#5E5C64',
+					700: '#3D3846',
+					800: '#241F31',
+				},
+				'gtk-blue': {
+					100: '#99C1F1',
+					200: '#62A0EA',
+					300: '#3584E4',
+					400: '#1C71D8',
+					500: '#1C71D8',
+				},
+				'gtk-green': {
+					100: '#8FF0A4',
+					200: '#57E389',
+					300: '#57E389',
+					400: '#2EC27E',
+					500: '#26A269',
+				},
+				'gtk-yellow': {
+					100: '#F9F06B',
+					200: '#F8E45C',
+					300: '#F6D32D',
+					400: '#F5C211',
+					500: '#E5A50A',
+				},
+				'gtk-orange': {
+					100: '#99C1F1',
+					200: '#62A0EA',
+					300: '#3584E4',
+					400: '#1C71D8',
+					500: '#1C71D8',
+				},
+				'gtk-red': {
+					100: '#99C1F1',
+					200: '#62A0EA',
+					300: '#3584E4',
+					400: '#1C71D8',
+					500: '#1C71D8',
+				},
+				'gtk-purple': {
+					100: '#99C1F1',
+					200: '#62A0EA',
+					300: '#3584E4',
+					400: '#1C71D8',
+					500: '#1C71D8',
+				},
+				'gtk-brown': {
+					100: '#99C1F1',
+					200: '#62A0EA',
+					300: '#3584E4',
+					400: '#1C71D8',
+					500: '#1C71D8',
+				},
 			},
 			container: {
 				// default the container to center the content

tsconfig.json

@@ -2,6 +2,7 @@
 	"extends": "./node_modules/astro/tsconfigs/strictest.json",
 	"exclude": ["cypress"],
 	"compilerOptions": {
-		"baseUrl": "src"
+		"baseUrl": "src",
+		"allowJs": true
 	}
 }