delta
/
Prismite
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

init

This commit is contained in:
delta 2023-01-24 04:35:59 +01:00
parent 638747bd3d
commit 8d42ec624f
19 changed files with 347 additions and 233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
manifest.json
View File

@ -1,18 +1,18 @@
{
"id": "dev.replugged.ThemeTemplate",
"name": "Theme Template",
"description": "A theme template",
"author": {
"name": "replugged",
"discordID": "1000992611840049192",
"github": "replugged-org"
},
"version": "1.0.2",
"updater": {
"type": "github",
"id": "replugged-org/theme-template"
},
"license": "MIT",
"type": "replugged-theme",
"main": "src/main.css"
"id": "dev.delta.Prismite",
"name": "Prismite",
"description": "A minimalistic theme made to be easy on the eyes",
"author": {
"name": "Delta",
"discordID": "1000992611840049192",
"github": "replugged-org"
},
"version": "1.0.2",
"updater": {
"type": "github",
"id": "replugged-org/theme-template"
},
"license": "MIT",
"type": "replugged-theme",
"main": "src/main.scss"
}

2
scripts/build.ts
View File

@ -6,7 +6,7 @@ import { join } from "path";
const manifest: Theme = _manifest;
const main = manifest.main || "src/main.css";
const main = manifest.main;
const splash = manifest.splash || (existsSync("src/splash.css") ? "src/splash.css" : undefined);
const mainBundler = new Parcel({

21
src/_colors.scss Normal file
View File

@ -0,0 +1,21 @@
$bg-dark: #1e232b;
$bg: #222831;
$bg-bright: #242a34;
$bg-brighter: #2c3440;
$fg-dark: #8893a5;
$fg: #dfe2e7;
$fg-bright: #e2e4e9;
$red: #db504a;
$red-bright: #de615c;
$green: #47e2b1;
$green-bright: #59e4b8;
$yellow: #f5ad44;
$yellow-bright: #f6b556;
$blue: #448bf5;
$blue-bright: #5696f6;
$pink: #f786aa;
$pink-bright: #f792b2;
$cyan: #45e1df;
$cyan-bright: #57e3e2;

11
src/_vars.scss Normal file
View File

@ -0,0 +1,11 @@
@use "sass:math";
// tldr as to why this exists: i wanna use the same values as in my awesome config so i want to have a dpi function
$dpi: 120;
@function dpi($power) {
@return math.round(math.div($power, 96) * 120);
}
$roundness: dpi(8px);
$border-width: dpi(1.5px);
$padding: dpi(4px);

216
src/main.css
View File

@ -1,216 +0,0 @@
/* Credit to https://github.com/Overimagine1/old-discord-font */
@font-face {
font-family: Whitney;
font-style: normal;
font-weight: 300;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/46933da896ba96126074286056614542.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: italic;
font-weight: 300;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/1651ce6325c0da043476ace0bec3971b.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: normal;
font-weight: 400;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/24bda95d153a319704c33329f3ab84bb.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: italic;
font-weight: 400;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/7f18f1d5ab6ded7cf71bbc1f907ee3d4.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: normal;
font-weight: 500;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/cf4a8a10bbdf9b775fad41e0b9921c84.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: italic;
font-weight: 500;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/9cfa747e897c772d25efd8e4a42a005e.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: normal;
font-weight: 600;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/f9e7047f6447547781512ec4b977b2ab.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: italic;
font-weight: 600;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/21070f52a8a6a61edef9785eaf303fb8.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: normal;
font-weight: 700;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/f9c8fcfa7dcc5d6a291a6ebbe3bb847e.woff2)
format("woff2");
}
@font-face {
font-family: Whitney;
font-style: italic;
font-weight: 700;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/5e1649183589023fb24667a369af585d.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Normal;
font-style: normal;
font-weight: 300;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/ab688947d482808a0b3347f84ebb17a9.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Normal;
font-style: italic;
font-weight: 300;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/0635f419b122d24f9f60ac4d1066cbc6.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Normal;
font-style: normal;
font-weight: 400;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/91dcabd038a2e07ea6fbe7ddb625ecfb.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Normal;
font-style: italic;
font-weight: 400;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/ea053183733605b24806f222b067b1e1.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Normal;
font-style: normal;
font-weight: 500;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/9491a199bd318f1fc38711fb5067f401.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Normal;
font-style: italic;
font-weight: 500;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/f0cf30536a7fa447f0c45fdb3b2a6f28.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Normal;
font-style: normal;
font-weight: 700;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/7d66dfcf8e39f27f163fba8d79577fd8.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Normal;
font-style: italic;
font-weight: 700;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/9a07cb5ae387a52309b7198543ae5e02.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: normal;
font-weight: 300;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/5e6f352adb4a6b55ed230f2f91769156.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: italic;
font-weight: 300;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/30b475dcfa1e8b74d815946e4c18ee09.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: normal;
font-weight: 400;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/1ace668db419a5014cf75bc116321af3.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: italic;
font-weight: 400;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/50510b66614a2f395530c61b7c9b6827.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: normal;
font-weight: 500;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/9e94673570e295b6fb5d4456c4211015.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: italic;
font-weight: 500;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/6603a2fb4d2bc997e023972a51938144.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: normal;
font-weight: 700;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/87c79174865938aedf188b7344fb0428.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: italic;
font-weight: 700;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/d93311938f51e8608a5d5cb2ea975157.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: normal;
font-weight: 800;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/bc5af8e71e27d363e2eeac75c9628922.woff2)
format("woff2");
}
@font-face {
font-family: ABC Ginto Nord;
font-style: italic;
font-weight: 800;
src: url(https://cdn.jsdelivr.net/gh/Overimagine1/old-discord-font/fonts/dc407fd65057fce34a56bf7b6ebb0b9f.woff2)
format("woff2");
}
:root {
--font-primary: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-display: "ABC Ginto Normal", "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-headline: "ABC Ginto Nord", "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-code: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter",
"DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco,
"Courier New", Courier, monospace;
--font-korean: Whitney, "Apple SD Gothic Neo", NanumBarunGothic, "\B9D1\C740 \ACE0\B515",
"Malgun Gothic", Gulim, 굴림, Dotum, 돋움, "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-japanese: Whitney, "Hiragino Sans", "\30D2\30E9\30AE\30CE\89D2\30B4 ProN W3",
"Hiragino Kaku Gothic ProN", メイリオ, Meiryo, Osaka, "MS PGothic", "Helvetica Neue", Helvetica,
Arial, sans-serif;
--font-chinese-simplified: Whitney, "Microsoft YaHei New", 微软雅黑, "Microsoft Yahei",
"Microsoft JhengHei", 宋体, SimSun, "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-chinese-traditional: Whitney, "Microsoft JhengHei", 微軟正黑體, "Microsoft JhengHei UI",
"Microsoft YaHei", 微軟雅黑, 宋体, SimSun, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

2
src/main.scss Normal file
View File

@ -0,0 +1,2 @@
@use "views";
@use "popups";

1
src/popups/_index.scss Normal file
View File

@ -0,0 +1 @@
@forward "menu";

7
src/popups/_menu.scss Normal file
View File

@ -0,0 +1,7 @@
@use "../vars" as v;
@use "../colors" as c;
.menu-1QACrS {
border-radius: v.$roundness;
border: v.$border-width solid c.$bg-brighter;
}

4
src/views/_index.scss Normal file
View File

@ -0,0 +1,4 @@
@forward "chat";
@forward "global";
@forward "servers";
@forward "sidebar";

1
src/views/chat/_index.scss Normal file
View File

@ -0,0 +1 @@
@forward "message_box"

14
src/views/chat/_message_box.scss Normal file
View File

@ -0,0 +1,14 @@
@use "../../vars" as v;
@use "../../colors" as c;
.channelTextArea-1FufC0 {
margin-bottom: 8;
margin-top: 8;
border-radius: v.$roundness;
border: v.$border-width solid c.$bg-brighter;
box-sizing: border-box;
.scrollableContainer-15eg7h {
}
}

150
src/views/global/_colors.scss Normal file
View File

@ -0,0 +1,150 @@
@use "../../colors" as c;
:root {
--brand-experiment: #{c.$yellow};
}
.theme-dark {
--header-primary: #{c.$fg};
--header-secondary: #{c.$fg-dark};
--text-normal: #{c.$fg};
--text-muted: #{c.$fg-dark};
--text-link: #{c.$yellow};
--text-link-low-saturation: var(--text-link);
--text-positive: #{c.$green};
--text-warning: #{c.$yellow};
--text-danger: #{c.$red};
--text-brand: #{c.$yellow};
--interactive-normal: #{c.$fg};
--interactive-hover: #{c.$fg-bright};
--interactive-active: #{c.$fg-bright};
--interactive-muted: #{c.$fg-dark};
--mention-foreground: #{c.$fg};
--mention-background: #{c.$yellow}#{33};
--background-primary: #{c.$bg};
--background-secondary: #{c.$bg};
--background-secondary-alt: #{c.$bg};
--background-tertiary: #{c.$bg};
--background-accent: #{c.$bg};
--background-floating: #{c.$bg};
--background-nested-floating: #{c.$bg};
--background-mobile-primary: #{c.$bg};
--background-mobile-secondary: #{c.$bg};
--chat-background: #{c.$bg};
--chat-border: #{c.$bg};
--chat-input-container-background: #{c.$bg};
--background-modifier-hover: #{c.$bg};
--background-modifier-active: #{c.$bg};
--background-modifier-selected: #{c.$bg};
--background-modifier-accent: #{c.$bg};
--info-positive-background: #{c.$green}#{33};
--info-positive-foreground: #{c.$green};
--info-positive-text: #{c.$fg};
--info-warning-background: #{c.$yellow}#{33};
--info-warning-foreground: #{c.$yellow};
--info-warning-text: #{c.$fg};
--info-danger-background: #{c.$red}#{33};
--info-danger-foreground: #{c.$red};
--info-danger-text: #{c.$fg};
--info-help-background: #{c.$yellow}#{33};
--info-help-foreground: #{c.$yellow};
--info-help-text: #{c.$fg};
--status-positive-background: #{c.$green};
--status-positive-text: #{c.$fg};
--status-warning-background: #{c.$yellow};
--status-warning-text: #{c.$fg};
--status-danger-background: #{c.$red};
--status-danger-text: #{c.$fg};
--status-positive: #{c.$green};
--status-warning: #{c.$yellow};
--status-danger: #{c.$red};
--button-danger-background: #{c.$red};
--button-danger-background-hover: #{c.$red-bright};
--button-danger-background-active: #{c.$red-bright};
--button-danger-background-disabled: #{c.$bg-dark};
--button-positive-background: #{c.$green};
--button-positive-background-hover: #{c.$green-bright};
--button-positive-background-active: #{c.$green-bright};
--button-positive-background-disabled: #{c.$bg-dark};
--button-secondary-background: #{c.$bg};
--button-secondary-background-hover: #{c.$bg-bright};
--button-secondary-background-active: #{c.$bg-bright};
--button-secondary-background-disabled: #{c.$bg-dark};
--button-outline-danger-text: #{c.$fg};
--button-outline-danger-border: #{c.$red};
--button-outline-danger-background: #{c.$bg}#{00};
--button-outline-danger-background-hover: #{c.$red-bright};
--button-outline-danger-text-hover: #{c.$fg};
--button-outline-danger-border-hover: #{c.$red-bright};
--button-outline-danger-background-active: #{c.$red-bright};
--button-outline-danger-text-active: #{c.$fg};
--button-outline-danger-border-active: #{c.$red-bright};
--button-outline-positive-text: #{c.$fg};
--button-outline-positive-border: #{c.$green};
--button-outline-positive-background: #{c.$bg}#{00};
--button-outline-positive-background-hover: #{c.$green-bright};
--button-outline-positive-text-hover: #{c.$fg};
--button-outline-positive-border-hover: #{c.$green-bright};
--button-outline-positive-background-active: #{c.$green-bright};
--button-outline-positive-text-active: #{c.$fg};
--button-outline-positive-border-active: #{c.$green-bright};
--button-outline-brand-text: #{c.$fg};
--button-outline-brand-border: #{c.$yellow};
--button-outline-brand-background: #{c.$bg}#{00};
--button-outline-brand-background-hover: #{c.$yellow-bright};
--button-outline-brand-text-hover: #{c.$fg};
--button-outline-brand-border-hover: #{c.$yellow-bright};
--button-outline-brand-background-active: #{c.$yellow-bright};
--button-outline-brand-text-active: #{c.$fg};
--button-outline-brand-border-active: #{c.$yellow-bright};
--button-outline-primary-text: #{c.$fg};
--button-outline-primary-border: #{c.$bg-brighter};
--button-outline-primary-background: #{c.$bg}#{00};
--button-outline-primary-background-hover: #{c.$bg-bright};
--button-outline-primary-text-hover: #{c.$fg};
--button-outline-primary-border-hover: #{c.$bg-brighter};
--button-outline-primary-background-active: #{c.$bg-bright};
--button-outline-primary-text-active: #{c.$fg};
--button-outline-primary-border-active: #{c.$bg-brighter};
--modal-background: #{c.$bg};
--modal-footer-background: #{c.$bg};
--scrollbar-thin-thumb: #{c.$yellow};
--scrollbar-thin-track: transparent;
--scrollbar-auto-thumb: #{c.$yellow};
--scrollbar-auto-track: #{c.$bg};
--scrollbar-auto-scrollbar-color-thumb: #{c.$yellow};
--scrollbar-auto-scrollbar-color-track: #{c.$bg};
--input-background: v#{c.$bg};
--input-placeholder-text: #{c.$fg-dark};
--logo-primary: #{c.$fg};
--focus-primary: var(--focus-primary-500);
--control-brand-foreground: var(--brand-360);
--control-brand-foreground-new: var(--brand-new-360);
--background-mentioned: transparent;
--background-mentioned-hover: transparent;
--background-message-hover: transparent;
--background-message-automod: hsl(var(--status-red-500-hsl)/0.05);
--background-message-automod-hover: hsl(var(--status-red-500-hsl)/0.1);
--background-message-highlight: hsl(var(--brand-360-hsl)/0.08);
--background-message-highlight-hover: hsl(var(--brand-360-hsl)/0.06);
--channels-default: var(--primary-dark-345);
--channel-icon: var(--primary-dark-360);
--channel-text-area-placeholder: #{c.$fg-dark};
--channeltextarea-background: #{c.$bg};
--activity-card-background: #{c.$bg};
--textbox-markdown-syntax: var(--primary-dark-360);
--spoiler-revealed-background: var(--primary-dark-660);
--spoiler-hidden-background: var(--primary-dark-700);
--android-navigation-bar-background: var(--primary-dark-830);
--android-ripple: hsl(var(--white-500-hsl)/0.07);
--deprecated-card-bg: hsl(var(--primary-dark-700-hsl)/0.6);
--deprecated-card-editable-bg: hsl(var(--primary-dark-700-hsl)/0.3);
--deprecated-store-bg: var(--primary-dark-600);
--deprecated-quickswitcher-input-background: var(--primary-dark-400);
--deprecated-quickswitcher-input-placeholder: hsl(var(--white-500-hsl)/0.3);
--deprecated-text-input-bg: var(--primary-dark-700);
--deprecated-text-input-border: hsl(var(--black-500-hsl)/0.3);
--deprecated-text-input-border-hover: var(--primary-dark-900);
--deprecated-text-input-border-disabled: var(--primary-dark-700);
--deprecated-text-input-prefix: var(--primary-dark-200);
}

3
src/views/global/_index.scss Normal file
View File

@ -0,0 +1,3 @@
@forward "colors";
@forward "wildcard";
@forward "view";

11
src/views/global/_view.scss Normal file
View File

@ -0,0 +1,11 @@
@use "../../vars" as v;
@use "../../colors" as c;
.container-1eFtFS {
padding: v.$padding;
}
.base-2jDfDU {
overflow: unset;
max-width: calc(100vw - 72px - v.$padding * 2);
}

3
src/views/global/_wildcard.scss Normal file
View File

@ -0,0 +1,3 @@
* {
box-shadow: none !important;
}

1
src/views/servers/_index.scss Normal file
View File

@ -0,0 +1 @@
@forward "view";

9
src/views/servers/_view.scss Normal file
View File

@ -0,0 +1,9 @@
@use "../../vars" as v;
@use "../../colors" as c;
.guilds-2JjMmN {
border-radius: v.$roundness;
border: v.$border-width solid c.$bg-brighter;
height: 75%;
box-sizing: border-box;
}

1
src/views/sidebar/_index.scss Normal file
View File

@ -0,0 +1 @@
@forward "user_panel";

91
src/views/sidebar/_user_panel.scss Normal file
View File

@ -0,0 +1,91 @@
@use "../../vars" as v;
@use "../../colors" as c;
.panels-3wFtMD {
position: absolute;
bottom: 0;
left: -72px;
width: 72px;
// width: calc(32px + v.$padding * 2);
height: calc(25% - v.$padding);
box-sizing: border-box;
border-radius: v.$roundness;
border: v.$border-width solid c.$bg-brighter;
padding: v.$padding;
display: flex;
align-items: center;
justify-content: center;
> .container-YkUktl {
height: fit-content;
margin-bottom: 0;
padding: 0;
flex-direction: column-reverse;
gap: v.$padding;
> .avatarWrapper-1B9FTW {
min-width: unset;
padding: 0;
margin: 0;
height: 44px;
width: 44px;
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
border-radius: v.$roundness;
border: v.$border-width solid c.$bg-brighter;
> .nameTag-sc-gpq {
display: none;
}
.avatar-1EWyVD {
// height: 44px !important;
// width: 44px !important;
// display: flex;
// justify-content: center;
// align-items: center;
> svg {
// display: flex;
// justify-content: center;
// align-items: center;
// height: 52px;
// width: 52px;
// > foreignObject {
// height: 44px !important;
// width: 44px !important;
// }
}
}
// .avatar-1EWyVD {
// transform;
// }
foreignObject {
mask: none;
.avatar-b5OQ1N {
border-radius: v.$roundness;
}
}
}
> :last-child {
flex-direction: column;
gap: v.$padding;
> button {
box-sizing: border-box;
border-radius: v.$roundness;
border: v.$border-width solid c.$bg-brighter;
padding: v.$padding * 2;
height: unset;
width: unset;
}
}
}
}