feat(dashboard): change primary color to pluralkit orange
This commit is contained in:
@@ -17,11 +17,6 @@ import BulkGroupPrivacy from "./pages/BulkGroupPrivacy.svelte";
|
||||
import BulkMemberPrivacy from "./pages/BulkMemberPrivacy.svelte";
|
||||
|
||||
// theme cdns (I might make some myself too)
|
||||
let light = "https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css";
|
||||
let dark = "https://cdn.jsdelivr.net/npm/bootstrap-dark-5@1.1.3/dist/css/bootstrap-night.min.css";
|
||||
|
||||
let styleSrc = dark;
|
||||
|
||||
// if there's a style already set, retrieve it
|
||||
let style = localStorage.getItem("pk-style") && localStorage.getItem("pk-style");
|
||||
|
||||
@@ -31,17 +26,15 @@ import BulkMemberPrivacy from "./pages/BulkMemberPrivacy.svelte";
|
||||
// not sure if there's a better way to handle this
|
||||
function setStyle(style) {
|
||||
switch (style) {
|
||||
case "light": document.getElementById("app").className = "light";
|
||||
styleSrc = light;
|
||||
case "light": document.documentElement.className = "light";
|
||||
localStorage.setItem("pk-style", "light");
|
||||
break;
|
||||
case "dark": document.getElementById("app").className = "dark";
|
||||
styleSrc = dark;
|
||||
case "dark": document.documentElement.className = "dark";
|
||||
localStorage.setItem("pk-style", "dark");
|
||||
break;
|
||||
default: document.getElementById("app").className = "dark";
|
||||
styleSrc = dark;
|
||||
default: document.documentElement.className = "dark";
|
||||
localStorage.setItem("pk-style", "dark");
|
||||
break;
|
||||
};
|
||||
};
|
||||
|
||||
@@ -57,10 +50,6 @@ import BulkMemberPrivacy from "./pages/BulkMemberPrivacy.svelte";
|
||||
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<link rel="stylesheet" href={styleSrc}>
|
||||
</svelte:head>
|
||||
|
||||
<Router>
|
||||
<Navigation bind:style={style}/>
|
||||
<Route path="/"><Home /></Route>
|
||||
|
@@ -59,19 +59,19 @@
|
||||
<hr/>
|
||||
<Row class="mb-3">
|
||||
<Col xs={12} lg={4} class="mb-2">
|
||||
<span id="s-bannertop">Show banners in the background?</span> <Toggle hideLabel style="display: inline" label="Show banners in the background of pages" toggled={settings.appearance.banner_top} on:toggle={() => {settings.appearance.banner_top = !settings.appearance.banner_top; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<span id="s-bannertop">Show banners in the background?</span> <Toggle toggledColor="#da9317" hideLabel style="display: inline" label="Show banners in the background of pages" toggled={settings.appearance.banner_top} on:toggle={() => {settings.appearance.banner_top = !settings.appearance.banner_top; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<Tooltip target="s-bannertop" placement="bottom">If enabled, shows banners from the top of the system, member and group pages.</Tooltip>
|
||||
</Col>
|
||||
<Col xs={12} lg={4} class="mb-2">
|
||||
<span id="s-bannerbottom">Show banners at the bottom of cards?</span> <Toggle hideLabel style="display: inline" label="Remove banner from bottom of cards and pages" toggled={settings.appearance.banner_bottom} on:toggle={() => {settings.appearance.banner_bottom = !settings.appearance.banner_bottom; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<span id="s-bannerbottom">Show banners at the bottom of cards?</span> <Toggle toggledColor="#da9317" hideLabel style="display: inline" label="Remove banner from bottom of cards and pages" toggled={settings.appearance.banner_bottom} on:toggle={() => {settings.appearance.banner_bottom = !settings.appearance.banner_bottom; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<Tooltip target="s-bannerbottom" placement="bottom">If enabled, shows banners at the bottom of the system, member and group cards.</Tooltip>
|
||||
</Col>
|
||||
<Col xs={12} lg={4} class="mb-2">
|
||||
<span id="s-twemoji">Use twemoji?</span> <Toggle hideLabel style="display: inline" label="Convert all emojis to twemoji" toggled={settings.appearance.twemoji} on:toggle={() => {settings.appearance.twemoji = !settings.appearance.twemoji; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<span id="s-twemoji">Use twemoji?</span> <Toggle toggledColor="#da9317" hideLabel style="display: inline" label="Convert all emojis to twemoji" toggled={settings.appearance.twemoji} on:toggle={() => {settings.appearance.twemoji = !settings.appearance.twemoji; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<Tooltip target="s-twemoji" placement="bottom">If enabled, converts all emojis into twemoji.</Tooltip>
|
||||
</Col>
|
||||
<Col xs={12} lg={4} class="mb-2">
|
||||
<span id="s-colorbackground">Colored background?</span> <Toggle hideLabel style="display: inline" label="Use member colors as background on pages" toggled={settings.appearance.color_background} on:toggle={() => {settings.appearance.color_background = !settings.appearance.color_background; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<span id="s-colorbackground">Colored background?</span> <Toggle toggledColor="#da9317" hideLabel style="display: inline" label="Use member colors as background on pages" toggled={settings.appearance.color_background} on:toggle={() => {settings.appearance.color_background = !settings.appearance.color_background; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<Tooltip target="s-colorbackground" placement="bottom">If enabled, turns the background on member pages into the member's color.</Tooltip>
|
||||
</Col>
|
||||
</Row>
|
||||
@@ -79,15 +79,15 @@
|
||||
<hr/>
|
||||
<Row>
|
||||
<!-- <Col xs={12} lg={4} class="mb-2">
|
||||
<span id="s-opendyslexic">Use the opendyslexic font?</span> <Toggle hideLabel style="display: inline" label="Use the opendyslexic font" toggled={settings.accessibility.opendyslexic} on:toggle={() => {settings.accessibility.opendyslexic = !settings.accessibility.opendyslexic; localStorage.setItem("pk-settings", JSON.stringify(settings)); toggleOpenDyslexic();}}/>
|
||||
<span id="s-opendyslexic">Use the opendyslexic font?</span> <Toggle toggledColor="#da9317" hideLabel style="display: inline" label="Use the opendyslexic font" toggled={settings.accessibility.opendyslexic} on:toggle={() => {settings.accessibility.opendyslexic = !settings.accessibility.opendyslexic; localStorage.setItem("pk-settings", JSON.stringify(settings)); toggleOpenDyslexic();}}/>
|
||||
<Tooltip target="s-opendyslexic" placement="bottom">If enabled, uses the opendyslexic font as it's main font.</Tooltip>
|
||||
</Col> -->
|
||||
<Col xs={12} lg={4} class="mb-2">
|
||||
<span id="s-expandedcards">Expand cards by default?</span> <Toggle hideLabel style="display: inline" label="Expand cards by default in list" toggled={settings.accessibility.expandedcards} on:toggle={() => {settings.accessibility.expandedcards = !settings.accessibility.expandedcards; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<span id="s-expandedcards">Expand cards by default?</span> <Toggle toggledColor="#da9317" hideLabel style="display: inline" label="Expand cards by default in list" toggled={settings.accessibility.expandedcards} on:toggle={() => {settings.accessibility.expandedcards = !settings.accessibility.expandedcards; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<Tooltip target="s-expandedcards" placement="bottom">If enabled, lists will be expanded by default (overrides page links).</Tooltip>
|
||||
</Col>
|
||||
<Col xs={12} lg={4} class="mb-2">
|
||||
<span id="s-pagelinks">Use page links instead of cards?</span> <Toggle hideLabel style="display: inline" label="Use page links instead of expandable cards" toggled={settings.accessibility.pagelinks} on:toggle={() => {settings.accessibility.pagelinks= !settings.accessibility.pagelinks; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<span id="s-pagelinks">Use page links instead of cards?</span> <Toggle toggledColor="#da9317" hideLabel style="display: inline" label="Use page links instead of expandable cards" toggled={settings.accessibility.pagelinks} on:toggle={() => {settings.accessibility.pagelinks= !settings.accessibility.pagelinks; localStorage.setItem("pk-settings", JSON.stringify(settings));}}/>
|
||||
<Tooltip target="s-pagelinks" placement="bottom">If enabled, the list items will not expand, but instead link to the corresponding page.</Tooltip>
|
||||
</Col>
|
||||
</Row>
|
||||
|
Reference in New Issue
Block a user