theme: nord

This commit is contained in:
dragonwocky 2021-10-08 13:30:43 +11:00
parent c4e6b6b62a
commit daa8489175
9 changed files with 197 additions and 29 deletions

View File

@ -6,6 +6,8 @@
* (https://notion-enhancer.github.io/) under the MIT license
*/
@import 'https://rsms.me/inter/inter.css';
:root.dark {
--dracula--bg: #282a36;
--dracula--bg_lighter: #424450;
@ -40,6 +42,9 @@
--dracula--bg_pink: #8d4a7c;
--dracula--bg_red: #943844;
--theme--font_sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica,
'Apple Color Emoji', Arial, sans-serif, 'Segoe UI Emoji', 'Segoe UI Symbol';
--theme--accent_blue: var(--dracula--purple);
--theme--accent_blue-selection: #bb8dfd3d;
--theme--accent_blue-hover: #b179ff;

View File

@ -345,13 +345,31 @@ import * as router from './router.mjs';
router.addView('core', async () => {
web.empty($main);
selectNavItem($coreNavItem);
return web.render($main, await generators.modList('core'));
return web.render(
$main,
await generators.modList(
'core',
`The enhancer's core mods provide the basics
required for all other extensions and themes to work.
Core mods can't be disabled, but they can be configured
- just click on a mod to access its options.`
)
);
});
router.addView('extensions', async () => {
web.empty($main);
selectNavItem($extensionsNavItem);
return web.render($main, await generators.modList('extension'));
return web.render(
$main,
await generators.modList(
'extension',
`Extensions modify and extend the
functionality of the Notion client.
They don't extend Notion's data structures,
so you can safely enable or disable them at any time.`
)
);
});
router.addView('themes', async () => {
@ -361,7 +379,8 @@ router.addView('themes', async () => {
$main,
await generators.modList(
'theme',
`Dark themes will only work when Notion is in dark mode,
`Themes change Notion's colour scheme.
Dark themes will only work when Notion is in dark mode,
and light themes will only work when Notion is in light mode.
Only one theme of each mode can be enabled at a time.`
)

View File

@ -19,7 +19,6 @@
/* 1.3 supreme ratio. https://www.modularscale.com/ */
.notion-frame .notion-page-block div[placeholder='Untitled'],
.notion-overlay-container .notion-page-block div[placeholder='Untitled'] {
--neutral--body-font_size: 15px;
font-size: 33px !important;
}
[placeholder='Heading 1'] {

View File

@ -1,17 +0,0 @@
/*
* neutral
* (c) 2020 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
* (c) 2020 Arecsu
* under the MIT license
*/
'use strict';
module.exports = {
id: 'c4435543-4705-4d68-8cf7-d11c342f8089',
tags: ['theme', 'dark'],
name: 'neutral',
desc: 'smoother colours and fonts, designed to be more pleasing to the eye.',
version: '0.1.4',
author: 'arecsu',
};

View File

@ -30,8 +30,8 @@
--theme--scrollbar_thumb: #232425;
--theme--scrollbar_thumb-hover: #373838;
--theme--ui_divider: rgba(78, 78, 78, 0.7);
--theme--ui_shadow: rgba(15, 15, 15, 0.5);
--theme--ui_divider: rgba(78, 78, 78, 0.7);
--theme--ui_interactive-hover: rgb(29, 29, 29);
--theme--ui_interactive-active: rgba(29, 29, 29, 0.7);
--theme--ui_input: #1d1d1d;

27
repo/nord/mod.json Normal file
View File

@ -0,0 +1,27 @@
{
"name": "nord",
"id": "d64ad391-1494-4112-80ae-0a3b6f4b0c3f",
"version": "0.2.0",
"description": "an arctic, north-bluish color palette..",
"tags": ["theme", "dark"],
"authors": [
{
"name": "Artic Ice Studio",
"email": "development@arcticicestudio.com",
"homepage": "https://www.nordtheme.com/",
"avatar": "https://avatars.githubusercontent.com/u/7836623"
},
{
"name": "MANNNNEN",
"homepage": "https://github.com/MANNNNEN",
"avatar": "https://avatars.githubusercontent.com/u/35939149"
}
],
"css": {
"frame": ["variables.css"],
"client": ["variables.css"],
"menu": ["variables.css"]
},
"js": {},
"options": []
}

129
repo/nord/variables.css Normal file
View File

@ -0,0 +1,129 @@
/*
* notion-enhancer: dracula
* (c) 2016 Artic Ice Studio
* (c) 2020 MANNNNEN
* (c) 2021 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
* (https://notion-enhancer.github.io/) under the MIT license
*/
@import 'https://rsms.me/inter/inter.css';
@import url('https://fonts.googleapis.com/css2?family=Fira+Code&display=swap');
:root.dark {
--nord--dark1: #2e3440;
--nord--dark2: #3b4252;
--nord--dark3: #434c5e;
--nord--dark4: #4c566a;
--nord--light1: #d8dee9;
--nord--light2: #e5e9f0;
--nord--light3: #eceff4;
--nord--frost1: #8fbcbb;
--nord--frost2: #88c0d0;
--nord--frost3: #81a1c1;
--nord--frost4: #5e81ac;
--nord--red: #bf616a;
--nord--orange: #d08770;
--nord--yellow: #ebcb8b;
--nord--green: #a3be8c;
--nord--purple: #b48ead;
--theme--font_sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica,
'Apple Color Emoji', Arial, sans-serif, 'Segoe UI Emoji', 'Segoe UI Symbol';
--theme--font_code: 'Fira Code', monospace;
--theme--accent_blue: var(--nord--frost2);
--theme--accent_blue-selection: rgb(136 192 208 / 50%);
--theme--accent_blue-hover: var(--nord--frost1);
--theme--accent_blue-active: var(--nord--frost2);
--theme--accent_red: var(--nord--red);
--theme--accent_red-button: rgba(235, 87, 87, 0.2);
--theme--bg: var(--nord--dark1);
--theme--bg_secondary: var(--nord--dark2);
--theme--bg_popup: var(--nord--dark2);
--theme--scrollbar_track: transparent;
--theme--scrollbar_thumb: var(--nord--dark3);
--theme--scrollbar_thumb-hover: var(--nord--dark4);
--theme--ui_divider: rgba(255, 255, 255, 0.1);
--theme--ui_interactive-hover: var(--nord--dark4);
--theme--ui_interactive-active: #4c566ade;
--theme--ui_toggle-off: var(--nord--dark4);
--theme--ui_toggle-feature: var(--nord--light1);
--theme--icon: var(--nord--light1);
--theme--icon_secondary: var(--nord--light1);
--theme--text: var(--nord--light1);
--theme--text_secondary: var(--nord--light1);
--theme--text_gray: rgba(151, 154, 155, 0.95);
--theme--text_brown: rgb(147, 114, 100);
--theme--text_orange: var(--nord--orange);
--theme--text_yellow: var(--nord--yellow);
--theme--text_green: var(--nord--green);
--theme--text_blue: var(--nord--frost3);
--theme--text_purple: var(--nord--purple);
--theme--text_pink: rgb(193 106 153);
--theme--text_red: var(--nord--red);
--theme--highlight_gray: rgb(69, 75, 78);
--theme--highlight_brown: rgb(67, 64, 64);
--theme--highlight_orange: var(--nord--orange);
--theme--highlight_yellow: var(--nord--yellow);
--theme--highlight_green: var(--nord--green);
--theme--highlight_blue: var(--nord--frost3);
--theme--highlight_purple: var(--nord--purple);
--theme--highlight_pink: rgb(193 106 153);
--theme--highlight_red: var(--nord--red);
--theme--block_gray: rgb(69, 75, 78);
--theme--block_brown: rgb(67, 64, 64);
--theme--block_orange: var(--nord--orange);
--theme--block_yellow: var(--nord--yellow);
--theme--block_green: var(--nord--green);
--theme--block_blue: var(--nord--frost3);
--theme--block_purple: var(--nord--purple);
--theme--block_pink: rgb(193 106 153);
--theme--block_red: var(--nord--red);
--theme--tag_default: rgba(151, 154, 155, 0.5);
--theme--tag_gray: rgba(151, 154, 155, 0.5);
--theme--tag_brown: rgba(147, 114, 100, 0.5);
--theme--tag_orange: rgba(255, 163, 68, 0.5);
--theme--tag_yellow: rgba(255, 220, 73, 0.5);
--theme--tag_green: rgba(77, 171, 154, 0.5);
--theme--tag_blue: rgba(82, 156, 202, 0.5);
--theme--tag_purple: rgba(154, 109, 215, 0.5);
--theme--tag_pink: rgba(226, 85, 161, 0.5);
--theme--tag_red: rgba(255, 115, 105, 0.5);
--theme--callout_gray: rgba(69, 75, 78, 0.3);
--theme--callout_brown: rgba(67, 64, 64, 0.3);
--theme--callout_orange: rgba(89, 74, 58, 0.3);
--theme--callout_yellow: rgba(89, 86, 59, 0.3);
--theme--callout_green: rgba(53, 76, 75, 0.3);
--theme--callout_blue: rgba(54, 73, 84, 0.3);
--theme--callout_purple: rgba(68, 63, 87, 0.3);
--theme--callout_pink: rgba(83, 59, 76, 0.3);
--theme--callout_red: rgba(89, 65, 65, 0.3);
--theme--code_inline: rgba(135, 131, 120, 0.15);
--theme--code_inline-text: var(--nord--red);
--theme--code: var(--theme--bg_popup);
--theme--code_function: var(--theme--text_blue);
--theme--code_keyword: var(--theme--text_pink);
--theme--code_tag: var(--theme--text_pink);
--theme--code_operator: var(--theme--text_yellow);
--theme--code_important: var(--theme--text_yellow);
--theme--code_property: var(--theme--text_pink);
--theme--code_builtin: var(--theme--text_yellow);
--theme--code_attr-name: var(--theme--text_yellow);
--theme--code_comment: var(--theme--text_gray);
--theme--code_punctuation: var(--theme--text_gray);
--theme--code_doctype: var(--theme--text_gray);
--theme--code_number: var(--theme--text_purple);
--theme--code_string: var(--theme--text_orange);
--theme--code_attr-value: var(--theme--text_orange);
}

View File

@ -5,14 +5,11 @@
* under the MIT license
*/
:root.dark {
--theme--bg: #0b0b0b;
--theme--bg_secondary: #0f0f0f;
--theme--bg_popup: #0f0f0f;
@import 'https://rsms.me/inter/inter.css';
--theme--scrollbar_track: transparent;
--theme--scrollbar_thumb: #141414;
--theme--scrollbar_thumb-hover: #1b1b1b;
:root.dark {
--theme--font_sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica,
'Apple Color Emoji', Arial, sans-serif, 'Segoe UI Emoji', 'Segoe UI Symbol';
--theme--accent_blue: #b887f7;
--theme--accent_blue-selection: rgba(184, 135, 247, 0.3);
@ -21,6 +18,14 @@
--theme--accent_red: #08d7c2;
--theme--accent_red-button: #08d7c226;
--theme--bg: #0b0b0b;
--theme--bg_secondary: #0f0f0f;
--theme--bg_popup: #0f0f0f;
--theme--scrollbar_track: transparent;
--theme--scrollbar_thumb: #141414;
--theme--scrollbar_thumb-hover: #1b1b1b;
--theme--ui_divider: rgba(255, 255, 255, 0.1);
--theme--ui_interactive-hover: #1e1e1e5c;
--theme--ui_interactive-active: #1e1e1ea5;

View File

@ -10,6 +10,7 @@
"dracula",
"pastel-dark",
"neutral",
"nord",
"bypass-preview",
"calendar-scroll"