107 lines
2.5 KiB
CSS
107 lines
2.5 KiB
CSS
/* ==UserStyle==
|
|
@name Dracula for Pocketbase
|
|
@namespace git.m3.fyi/Marsn3
|
|
@version 1.0.0
|
|
@description A dark Theme for Pocketbase
|
|
@author Marsn3
|
|
@homepageURL https://git.m3.fyi/Marsn3/custom-css
|
|
@updateURL https://git.m3.fyi/projects/22/raw/main/pocketbase.user.css
|
|
@license MIT
|
|
==/UserStyle== */
|
|
|
|
@-moz-document domain("api.m3.fyi") {
|
|
/*~~~~~ Base Colors ~~~~~*/
|
|
:root {
|
|
--monospaceFontFamily: "ComicCodeLigatures Nerd Font", "Ubuntu Mono",
|
|
monospace, emoji;
|
|
--txtPrimaryColor: #f8f8f2;
|
|
--txtHintColor: #7b81a6;
|
|
--txtDisabledColor: #9599b7;
|
|
--primaryColor: #969dca;
|
|
--bodyColor: #282a36;
|
|
--baseColor: #282a36;
|
|
--baseAlt1Color: #585b74;
|
|
--baseAlt2Color: #4d5166;
|
|
--baseAlt3Color: #424457;
|
|
--baseAlt4Color: #373949;
|
|
--infoColor: #8be9fd;
|
|
--infoAltColor: #8be9fd;
|
|
--successColor: #50fa7b;
|
|
--successAltColor: #50fa7b;
|
|
--dangerColor: #ff5555;
|
|
--dangerAltColor: #ff5555;
|
|
--warningColor: #f1fa8c;
|
|
--warningAltColor: #ffffa5;
|
|
--overlayColor: rgba(65, 82, 105, 0.25);
|
|
--tooltipColor: rgba(255, 255, 255, 0.85);
|
|
--shadowColor: rgba(0, 0, 0, 0.05);
|
|
accent-color: var(--primaryColor);
|
|
}
|
|
|
|
/*~~~~~ Buttoms ~~~~~*/
|
|
.btn.btn-secondary,
|
|
.btn.btn-outline {
|
|
color: var(--txtHintColor);
|
|
background: var(--baseAlt4Color);
|
|
}
|
|
|
|
/*~~~~~ Labels ~~~~~*/
|
|
.label.label-warning,
|
|
.label.label-info,
|
|
.label.label-success,
|
|
.alert {
|
|
color: var(--baseColor);
|
|
}
|
|
.alert.alert-warning .icon {
|
|
color: var(--baseColor);
|
|
}
|
|
|
|
/*~~~~~ Syntax Highlighting for Code fields ~~~~~*/
|
|
.prism-light,
|
|
code {
|
|
background: var(--baseAlt4Color) !important;
|
|
}
|
|
.prism-light .token.punctuation {
|
|
color: var(--txtPrimaryColor);
|
|
}
|
|
.prism-light .token.property {
|
|
color: var(--infoColor);
|
|
}
|
|
.prism-light .token.operator {
|
|
color: var(--dangerColor);
|
|
}
|
|
.prism-light .token.keyword {
|
|
color: var(--dangerColor);
|
|
}
|
|
.prism-light .token.string {
|
|
color: var(--successColor);
|
|
}
|
|
.prism-light .token.boolean {
|
|
color: var(--warningColor);
|
|
}
|
|
.prism-light .token.number {
|
|
color: #ffb86c;
|
|
}
|
|
.prism-light .token.class-name {
|
|
color: #8be9fd;
|
|
}
|
|
.prism-light .token.comment {
|
|
color: #9599b7;
|
|
}
|
|
.prism-light .token.function {
|
|
color: #bd93f9;
|
|
}
|
|
|
|
/*~~~~~ Colored Delete Icon ~~~~~*/
|
|
.ri-delete-bin-7-line {
|
|
color: var(--dangerColor);
|
|
}
|
|
|
|
/*~~~~~ Syntax Highlighting for Regex Fields ~~~~~*/
|
|
.ͼb {
|
|
color: #bd93f9;
|
|
}
|
|
.ͼe {
|
|
color: var(--dangerColor);
|
|
}
|
|
}
|