Skip to content

Commit

Permalink
themes: add Rosé Pine (Rose Accent) (#84)
Browse files Browse the repository at this point in the history 
* create rose-pine-rose theme

* change selection colour in line with rosé pine spec

* add rosé pine code block

* fix rosé pine author

* italicise constants and functions in rosé pine code blocks

* change base > primary > background colour to overlay
  • Loading branch information
@revsuine
revsuine authored Jul 16, 2024
1 parent b9b1430 commit 2942c7b
Show file tree
Hide file tree
Showing 2 changed files with 348 additions and 0 deletions.
204 changes: 204 additions & 0 deletions themes/rose-pine-rose/v1/code-block.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,204 @@
/**
* Rosé Pine by revsuine
* Licenced under the GPL v3
*/

/* COLOURS: */
pre[class*="language-"] {
--base: #191724;
--surface: #1f1d2e;
--overlay: #26233a;
--muted: #6e6a86;
--subtle: #908caa;
--text: #e0def4;
--love: #eb6f92;
--gold: #f6c177;
--rose: #ebbcba;
--pine: #31748f;
--foam: #9ccfd8;
--iris: #c4a7e7;
--highlight-low: #21202e;
--highlight-med: #403d52;
--highlight-high: #524f67;
}

/* Set the main properties of the code, code blocks, and inline code */
code[class*="language-"],
pre[class*="language-"] {
background: var(--base);
color: var(--text);
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; /* this is the default */
/* The following properties are standard, please leave them as they are */
font-size: 1em;
direction: ltr;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
line-height: 1.5;
/* The default is 4, but you could change it if you really, really want to */
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
/* The following properties are also standard */
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}

/* Optional: What the code looks like when highlighted */
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection,
pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection,
pre[class*="language-"]::selection,
pre[class*="language-"] ::selection {
background: var(--highlight-med);
}

/* Properties specific to code blocks */
pre[class*="language-"] {
padding: 1em; /* this is standard */
margin: 0.5em 0; /* this is the default */
overflow: auto; /* this is standard */
border-radius: unset;
}

/* Properties specific to inline code */
:not(pre) > code[class*="language-"] {
padding: 0.1em; /* this is the default */
border-radius: unset;
white-space: normal; /* this is standard */
}

.token.comment,
.token.prolog,
.token.cdata,
.token.doctype {
color: var(--muted);
}

.token.punctuation {
color: var(--subtle);
}

/* keywords: */
.token.entity /* rosé pine spec doesn't specify this so i've made this decision */ {
color: var(--pine);
}

.token.boolean {
color: var(--rose);
}

.token.attr-name {
color: var(--foam);
}

/* variables: */
.token.class-name {
color: var(--text);
}

.token.constant {
color: var(--love); /* rosé pine spec doesn't specify, my decision */
font-style: italic;
}

.token.number {
color: var(--foam); /* spec doesn't specify */
}

.token.atrule {
color: var(--love);
}

.token.keyword {
color: var(--pine);
}

.token.property {
color: var(--foam);
}

.token.tag {
color: var(--foam);
}

.token.symbol {
color: unset;
}

.token.deleted {
color: var(--love);
}

.token.important {
color: var(--love);
}

.token.selector {
color: var(--rose); /* spec doesn't specify */
}

.token.string {
color: var(--gold);
}

.token.char {
color: var(--gold);
}

.token.builtin {
color: var(--love);
}

.token.inserted {
color: var(--foam);
}

.token.regex {
color: var(--gold);
}

.token.attr-value {
color: var(--gold);
}

.token.variable {
color: var(--text);
}

.token.operator {
color: var(--subtle);
}

.token.function {
color: var(--rose);
font-style: italic;
}

.token.url {
color: var(--iris);
}

/* The following rules are pretty similar across themes, but feel free to adjust them */
.token.bold {
font-weight: bold;
}

.token.italic {
font-style: italic;
}

.token.entity {
cursor: help;
}

.token.namespace {
opacity: 0.7;
}

144 changes: 144 additions & 0 deletions themes/rose-pine-rose/v1/theme.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,144 @@
{
"$schema": "https://raw.githubusercontent.com/streetwriters/notesnook-themes/main/schemas/v1.schema.json",
"name": "Rosé Pine (Rose Accent)",
"id": "rose-pine-rose",
"version": 1,
"license": "GPL-3.0-or-later",
"homepage": "https://notesnook.com",
"description": "Rosé Pine with a rose accent",
"colorScheme": "dark",
"compatibilityVersion": 1,
"authors": [
{
"name": "revsuine"
}
],
"scopes": {
"base": {
"primary": {
"accent": "#ebbcba",
"paragraph": "#e0def4",
"background": "#26233a",
"border": "#26233a",
"heading": "#e0def4",
"icon": "#ebbcba",
"separator": "#1f1d2e",
"placeholder": "#908caa",
"hover": "#26233a",
"accentForeground": "#191724",
"backdrop": "#19172499"
},
"secondary": {
"accent": "#ebbcba",
"paragraph": "#e0def4",
"background": "#191724",
"border": "#6e6a86",
"heading": "#e0def4",
"icon": "#e0def4",
"separator": "#6e6a86",
"placeholder": "#6e6a86",
"hover": "#26233a",
"accentForeground": "#191724",
"backdrop": "#19172499"
},
"disabled": {
"accent": "#ebbcba",
"paragraph": "#e0def4",
"background": "#6e6a86",
"border": "#908caa",
"heading": "#e0def4",
"icon": "#e0def4",
"separator": "#6e6a86",
"placeholder": "#e0def4",
"hover": "#6e6a86",
"accentForeground": "#191724",
"backdrop": "#19172499"
},
"selected": {
"accent": "#ebbcba",
"paragraph": "#e0def4",
"background": "#403d52",
"border": "#ebbcba",
"heading": "#e0def4",
"icon": "#ebbcba",
"separator": "#6e6a86",
"placeholder": "#6e6a86",
"hover": "#26233a",
"accentForeground": "#191724",
"backdrop": "#19172499"
},
"error": {
"accent": "#eb6f92",
"paragraph": "#eb6f92",
"background": "#191724",
"border": "#6e6a86",
"heading": "#eb6f92",
"icon": "#eb6f92",
"separator": "#6e6a86",
"placeholder": "#908caa",
"hover": "#6e6a86",
"accentForeground": "#191724",
"backdrop": "#19172499"
},
"success": {
"accent": "#31748f",
"paragraph": "#31748f",
"background": "#191724",
"border": "#6e6a86",
"heading": "#31748f",
"icon": "#31748f",
"separator": "#6e6a86",
"placeholder": "#908caa",
"hover": "#6e6a86",
"accentForeground": "#191724",
"backdrop": "#19172499"
}
},
"statusBar": {
"primary": {
"paragraph": "#e0def4",
"background": "#26233a",
"separator": "#26233a"
}
},
"list": {
"primary": {
"paragraph": "#e0def4",
"background": "#1f1d2e",
"hover": "#26233a"
},
"secondary": {
"paragraph": "#e0def4"
}
},
"editor": {
"primary": {
"background": "#26233a",
"border": "#6e6a86"
},
"secondary": {
"paragraph": "#908caa",
"border": "#191724"
}
},
"editorToolbar": {
"primary": {
"background": "#1f1d2e",
"hover": "#6e6a8633"
},
"secondary": {
"background": "#6e6a8633"
}
},
"navigationMenu": {
"primary": {
"background": "#191724"
}
},
"sheet": {
"selected": {
"paragraph": "#31748f"
}
}
}
}

0 comments on commit 2942c7b

Please # to comment.