diff --git a/config.ts.example b/config.ts.example index 3b78dde..70caf9c 100644 --- a/config.ts.example +++ b/config.ts.example @@ -8,12 +8,6 @@ export class Config { */ static readonly PDS_URL: string = ""; - /** - * Theme css file to be used - * @default "theme.css" - */ - static readonly THEME: string = "themes/theme.css"; - /** * The base URL of the frontend service for linking to replies/quotes/accounts etc. * @default "https://deer.social" // or https://bsky.app if you're boring diff --git a/src/app.css b/src/app.css index 88cb00c..50da734 100644 --- a/src/app.css +++ b/src/app.css @@ -1,3 +1,88 @@ +@font-face { + font-family: "ProggyClean"; + src: url(https://witchcraft.systems/ProggyCleanNerdFont-Regular.ttf); +} + +:root { + --link-color: #646cff; + --link-hover-color: #535bf2; + --background-color: #12082b; + --header-background-color: #1f1145; + --content-background-color: #0d0620; + --text-color: white; + --border-color: #8054f0; + --indicator-inactive-color: #4a4a4a; + --indicator-active-color: #8054f0; +} + +::-webkit-scrollbar { + width: 0px; + background: transparent; + padding: 0; + margin: 0; +} +::-webkit-scrollbar-thumb { + background: transparent; + border-radius: 0; +} +::-webkit-scrollbar-track { + background: transparent; + border-radius: 0; +} +::-webkit-scrollbar-corner { + background: transparent; + border-radius: 0; +} +::-webkit-scrollbar-button { + background: transparent; + border-radius: 0; +} +* { + scrollbar-width: none; + scrollbar-color: transparent transparent; + -ms-overflow-style: none; /* IE and Edge */ + -webkit-overflow-scrolling: touch; + -webkit-scrollbar: none; /* Safari */ +} + +a { + font-weight: 500; + color: var(--link-color); + text-decoration: inherit; +} +a:hover { + color: var(--link-hover-color); + text-decoration: underline; +} + body { - background-color: red; -} \ No newline at end of file + margin: 0; + display: flex; + place-items: center; + min-width: 320px; + min-height: 100vh; + background-color: var(--background-color); + font-family: "ProggyClean", monospace; + font-size: 24px; + color: var(--text-color); + border-color: var(--border-color); + overflow-wrap: break-word; + word-wrap: normal; + word-break: break-word; + hyphens: none; +} + +h1 { + font-size: 3.2em; + line-height: 1.1; +} + +#app { + max-width: 1400px; + width: 100%; + margin: 0; + padding: 0; + margin-left: auto; + margin-right: auto; + text-align: center; +} diff --git a/src/themes/theme.css b/src/themes/theme.css deleted file mode 100644 index 35739c0..0000000 --- a/src/themes/theme.css +++ /dev/null @@ -1,89 +0,0 @@ -@font-face { - font-family: "ProggyClean"; - src: url(https://witchcraft.systems/ProggyCleanNerdFont-Regular.ttf); -} - -:root { - --link-color: #646cff; - --link-hover-color: #535bf2; - --background-color: #12082b; - --header-background-color: #1f1145; - --content-background-color: #0d0620; - --text-color: white; - --border-color: #8054f0; - --indicator-inactive-color: #4a4a4a; - --indicator-active-color: #8054f0; -} - - -::-webkit-scrollbar { - width: 0px; - background: transparent; - padding: 0; - margin: 0; -} -::-webkit-scrollbar-thumb { - background: transparent; - border-radius: 0; -} -::-webkit-scrollbar-track { - background: transparent; - border-radius: 0; -} -::-webkit-scrollbar-corner { - background: transparent; - border-radius: 0; -} -::-webkit-scrollbar-button { - background: transparent; - border-radius: 0; -} -* { - scrollbar-width: none; - scrollbar-color: transparent transparent; - -ms-overflow-style: none; /* IE and Edge */ - -webkit-overflow-scrolling: touch; - -webkit-scrollbar: none; /* Safari */ -} - -a { - font-weight: 500; - color: var(--link-color); - text-decoration: inherit; -} -a:hover { - color: var(--link-hover-color); - text-decoration: underline; -} - -body { - margin: 0; - display: flex; - place-items: center; - min-width: 320px; - min-height: 100vh; - background-color: var(--background-color); - font-family: "ProggyClean", monospace; - font-size: 24px; - color: var(--text-color); - border-color: var(--border-color); - overflow-wrap: break-word; - word-wrap: normal; - word-break: break-word; - hyphens: none; -} - -h1 { - font-size: 3.2em; - line-height: 1.1; -} - -#app { - max-width: 1400px; - width: 100%; - margin: 0; - padding: 0; - margin-left: auto; - margin-right: auto; - text-align: center; -} diff --git a/theming.ts b/theming.ts deleted file mode 100644 index 60117fd..0000000 --- a/theming.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { Plugin } from 'vite'; -import { Config } from './config'; -// Replaces app.css with the contents of the file specified in the -// config file. - -export const themePlugin = (): Plugin => { - const themeFile = Config.THEME; - console.log(`Using theme file: ${themeFile}`); - return { - name: 'theme-generator', - transform(code, id) { - if (id.endsWith('app.css')) { - // Read the theme file and replace the contents of app.css with it - // Needs full path to the file - const themeCode = Deno.readTextFileSync(Deno.cwd() + '/src/themes/' + themeFile); - // Replace the contents of app.css with the theme code - - // and add a comment at the top - const themeComment = `/* Generated from ${themeFile} */\n`; - const themeCodeWithComment = themeComment + themeCode; - // Return the theme code as the new contents of app.css - return { - code: themeCodeWithComment, - map: null, - }; - } - return null; - } - }; -}; \ No newline at end of file diff --git a/vite.config.ts b/vite.config.ts index 96d3c8c..20d2272 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,11 +1,7 @@ import { defineConfig } from "vite"; import { svelte } from "@sveltejs/vite-plugin-svelte"; -import { themePlugin } from "./theming"; // https://vite.dev/config/ export default defineConfig({ - plugins: [ - themePlugin(), - svelte(), - ], + plugins: [svelte()], });