From 9e851e0f3b0a42fb1300f42df69e2b03125eddfb Mon Sep 17 00:00:00 2001 From: Damian Korcz Date: Sun, 26 May 2024 20:13:58 +0100 Subject: [PATCH] Added Solarized Color Pallete Port for Prism as CSS Snippet --- .../Prism Custom Color Scheme - Solarized.css | 135 ++++++++++++++++++ 1 file changed, 135 insertions(+) create mode 100644 src/snippets/Prism Custom Ported Color Schemes/Prism Custom Color Scheme - Solarized.css diff --git a/src/snippets/Prism Custom Ported Color Schemes/Prism Custom Color Scheme - Solarized.css b/src/snippets/Prism Custom Ported Color Schemes/Prism Custom Color Scheme - Solarized.css new file mode 100644 index 00000000..68a7b3aa --- /dev/null +++ b/src/snippets/Prism Custom Ported Color Schemes/Prism Custom Color Scheme - Solarized.css @@ -0,0 +1,135 @@ +/* + Solarized Color Pallete Port to the Prism Theme for Obsidian.md (Version: 1.0.0) + + Port of the Solarized color pallete by Ethan Schoonover (https://ethanschoonover.com/solarized/) + Solarized is distributed under the MIT License: https://github.com/altercation/solarized/blob/master/LICENSE + + The original colors have been converted to HSL. Inline comments refer to the color names used by Solarized + that have been used as-is. Anything else has been made from scratch trying to match them well since Prism + uses 3 shades per colour and has grey and mint colors. + + Guide to use this Colour Scheme: https://github.com/damiankorcz/Prism-Theme/wiki/Creating-a-Custom-Colour-Scheme-CSS-Snippet + + Theme Code is distributed under the MIT License. + See https://github.com/damiankorcz/Obsidian-Prism/blob/main/LICENSE for more information. + + Copyright (c) 2021-2024 Damian Korcz +*/ + +.theme-light.pt-color-scheme-custom-lt { + /* The color variables below are comma separated HSL values. This format is necessary for using these + variables down the line in the theme and being able to create variants with varying alpha values (HSLA). */ + + /* Base colours are used for the backgrounds in the accented color areas. */ + --color-grey-base-hsl: 0, 0%, 90%; + --color-red-base-hsl: 1.04, 71.19%, 90.35%; + --color-orange-base-hsl: 17.57, 73.44%, 89.12%; + --color-yellow-base-hsl: 45.41, 55%, 85.49%; + --color-green-base-hsl: 67.84, 45%, 85%; + --color-mint-base-hsl: 155.84, 41%, 87%; + --color-cyan-base-hsl: 175.46, 50.62%, 85.8%; + --color-blue-base-hsl: 204.77, 62.35%, 90.63%; + --color-purple-base-hsl: 236.59, 48.72%, 92.61%; + --color-pink-base-hsl: 330.96, 64.08%, 90.96%; + + /* Tint colours are used for the borders in the accented color areas. */ + --color-grey-tint-hsl: 0, 0%, 68%; + --color-red-tint-hsl: 1.04, 71.19%, 72.35%; + --color-orange-tint-hsl: 17.57, 73.44%, 64.12%; + --color-yellow-tint-hsl: 45.41, 55%, 52.49%; + --color-green-tint-hsl: 67.84, 40%, 50%; + --color-mint-tint-hsl: 155.84, 41%, 55%; + --color-cyan-tint-hsl: 175.46, 50.62%, 48.8%; + --color-blue-tint-hsl: 204.77, 62.35%, 65.63%; + --color-purple-tint-hsl: 236.59, 48.72%, 75.61%; + --color-pink-tint-hsl: 330.96, 64.08%, 71.96%; + + /* Text colours are used for the Text in the accented color areas and other Text areas which use the theme colours. + e.g. Syntax Highlighting, Mark Highlight System, etc. */ + --color-grey-text-hsl: 0, 0%, 46%; + --color-red-text-hsl: 1.04, 71.19%, 52.35%; /* red */ + --color-orange-text-hsl: 17.57, 80.44%, 44.12%; /* orange */ + --color-yellow-text-hsl: 45.41, 100%, 35.49%; /* yellow */ + --color-green-text-hsl: 67.84, 100%, 30%; /* green */ + --color-mint-text-hsl: 155.84, 100%, 30%; + --color-cyan-text-hsl: 175.46, 58.62%, 39.8%; /* cyan */ + --color-blue-text-hsl: 204.77, 69.35%, 48.63%; /* blue */ + --color-purple-text-hsl: 236.59, 42.72%, 59.61%; /* violet */ + --color-pink-text-hsl: 330.96, 64.08%, 51.96%; /* magenta */ + + /* Default theme variable overwrites for different shades of text used in the editor and around the UI. */ + --text-normal-hsl: 192.2, 80.82%, 14.31%; /* base02 */ + --text-muted-hsl: 194.48, 14.15%, 40.2%; /* base01 */ + --text-faint-hsl: 196, 12.93%, 45.49%; /* base01 */ + + /* Default theme variable overwrites for the UI background colours. */ + --background-primary-hsl: 43.85, 86.67%, 94.12%; /* base3 */ + --background-primary-alt-hsl: 45.6, 42.37%, 88.43%; /* base2 */ + --background-secondary-hsl: 45.6, 42.37%, 88.43%; /* base2 */ + --background-secondary-blur-hsl: 45.6, 42.37%, 89.43%; /* base2 but 1% darker to better match blur to normal background-secondary */ + --background-secondary-alt-hsl: 180, 6.93%, 60.39%; /* base1 */ + + /* Default theme variable overwrites for shadows used on modals and popups. */ + --shadow-color-hsl: 0, 0%, 0%; + --shadow-s: hsla(var(--shadow-color-hsl), 10%) 0 1px 2px 0; + --shadow-l: hsla(var(--shadow-color-hsl), 3%) 0 1px 2px, hsla(var(--shadow-color-hsl), 3%) 0 2px 4px, hsla(var(--shadow-color-hsl), 3%) 0 4px 8px, hsla(var(--shadow-color-hsl), 3%) 0 6px 12px; +} + +.theme-dark.pt-color-scheme-custom-dt { + /* The color variables below are comma separated HSL values. This format is necessary for using these + variables down the line in the theme and being able to create variants with varying alpha values (HSLA). */ + + /* Base colours are used for the backgrounds in the accented color areas. */ + --color-grey-base-hsl: 0, 0%, 18%; + --color-red-base-hsl: 1.04, 62.19%, 16.35%; + --color-orange-base-hsl: 17.57, 80.44%, 13.12%; + --color-yellow-base-hsl: 45.41, 100%, 10.49%; + --color-green-base-hsl: 67.84, 92%, 9%; + --color-mint-base-hsl: 155.84, 68%, 11%; + --color-cyan-base-hsl: 175.46, 58.62%, 11.8%; + --color-blue-base-hsl: 204.77, 60.35%, 13.63%; + --color-purple-base-hsl: 236.59, 31.72%, 15.61%; + --color-pink-base-hsl: 330.96, 53.08%, 13.96%; + + /* Tint colours are used for the borders in the accented color areas. */ + --color-grey-tint-hsl: 0, 0%, 39%; + --color-red-tint-hsl: 1.04, 62.19%, 37.35%; + --color-orange-tint-hsl: 17.57, 80.44%, 31.12%; + --color-yellow-tint-hsl: 45.41, 100%, 22.49%; + --color-green-tint-hsl: 67.84, 92%, 22%; + --color-mint-tint-hsl: 155.84, 88%, 24%; + --color-cyan-tint-hsl: 175.46, 58.62%, 26.8%; + --color-blue-tint-hsl: 204.77, 60.35%, 34.63%; + --color-purple-tint-hsl: 236.59, 33.72%, 44.61%; + --color-pink-tint-hsl: 330.96, 55.08%, 33.96%; + + /* Text colours are used for the Text in the accented color areas and other Text areas which use the theme colours. + e.g. Syntax Highlighting, Mark Highlight System, etc. */ + --color-grey-text-hsl: 0, 0%, 60%; + --color-red-text-hsl: 1.04, 71.19%, 52.35%; /* red */ + --color-orange-text-hsl: 17.57, 80.44%, 44.12%; /* orange */ + --color-yellow-text-hsl: 45.41, 100%, 35.49%; /* yellow */ + --color-green-text-hsl: 67.84, 100%, 30%; /* green */ + --color-mint-text-hsl: 155.84, 100%, 30%; + --color-cyan-text-hsl: 175.46, 58.62%, 39.8%; /* cyan */ + --color-blue-text-hsl: 204.77, 69.35%, 48.63%; /* blue */ + --color-purple-text-hsl: 236.59, 42.72%, 59.61%; /* violet */ + --color-pink-text-hsl: 330.96, 64.08%, 51.96%; /* magenta */ + + /* Default theme variable overwrites for different shades of text used in the editor and around the UI. */ + --text-normal-hsl: 43.85, 86.67%, 94.12%; /* base3 */ + --text-muted-hsl: 45.6, 42.37%, 88.43%; /* base2 */ + --text-faint-hsl: 180, 6.93%, 60.39%; /* base1 */ + + /* Default theme variable overwrites for the UI background colours. */ + --background-primary-hsl: 192.2, 80.82%, 14.31%; /* base02 */ + --background-primary-alt-hsl: 194.48, 14.15%, 40.2%; /* base01 */ + --background-secondary-hsl: 192.2, 80.82%, 14.31%; /* base02 */ + --background-secondary-blur-hsl: 192.2, 80.82%, 15.31%; /* base02 but 1% darker to better match blur to normal background-secondary */ + --background-secondary-alt-hsl: 192.22, 100%, 10.59%; /* base03 */ + + /* Default theme variable overwrites for shadows used on modals and popups. */ + --shadow-color-hsl: 0, 0%, 0%; + --shadow-s: hsla(var(--shadow-color-hsl), 10%) 0 1px 2px 0; + --shadow-l: hsla(var(--shadow-color-hsl), 5%) 0 1px 2px, hsla(var(--shadow-color-hsl), 5%) 0 2px 4px, hsla(var(--shadow-color-hsl), 5%) 0 4px 8px, hsla(var(--shadow-color-hsl), 5%) 0 6px 12px; +} \ No newline at end of file