/** * Dracula Dark theme for reveal.js. * Based on https://draculatheme.com */ // Default mixins and settings ----------------- @import "../template/mixins"; @import "../template/settings"; // --------------------------------------------- // Include theme-specific fonts $systemFontsSansSerif: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif; $systemFontsMono: Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace; /** * Dracula colors by Zeno Rocha * https://draculatheme.com/contribute */ html * { color-profile: sRGB; rendering-intent: auto; } $background: #282A36; $foreground: #F8F8F2; $selection: #44475A; $comment: #6272A4; $red: #FF5555; $orange: #FFB86C; $yellow: #F1FA8C; $green: #50FA7B; $purple: #BD93F9; $cyan: #8BE9FD; $pink: #FF79C6; // Override theme settings (see ../template/settings.scss) $mainColor: $foreground; $headingColor: $purple; $headingTextShadow: none; $headingTextTransform: none; $backgroundColor: $background; $linkColor: $pink; $linkColorHover: $cyan; $selectionBackgroundColor: $selection; $inlineCodeColor: $green; $listBulletColor: $cyan; $mainFont: $systemFontsSansSerif; $codeFont: "Fira Code", $systemFontsMono; // Change text colors against light slide backgrounds @include light-bg-text-color($background); // Theme template ------------------------------ @import "../template/theme"; // --------------------------------------------- // Define additional color effects based on Dracula spec // https://spec.draculatheme.com/ :root { --r-bold-color: #{$orange}; --r-italic-color: #{$yellow}; --r-inline-code-color: #{$inlineCodeColor}; --r-list-bullet-color: #{$listBulletColor}; } .reveal { strong, b { color: var(--r-bold-color); } em, i, blockquote { color: var(--r-italic-color); } code { color: var(--r-inline-code-color); } // Dracula colored list bullets and numbers ul, ol { li::marker { color: var(--r-list-bullet-color); } } }