/* ==UserStyle== @name Pocketbase Dracula @namespace git.m3.fyi/Marsn3 @version 1.0.0 @description Dracula Theme for Pocketbase @author Marsn3 @homepageURL https://git.m3.fyi/Marsn3/custom-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); } }