Browse Source

Add Atom One Dark theme

merge-requests/64/head
Ivan Fonseca 6 years ago
committed by Deimos
parent
commit
7ee606a153
  1. 1
      tildes/scss/styles.scss
  2. 39
      tildes/scss/themes/_atom_one_dark.scss
  3. 3
      tildes/tildes/templates/base.jinja2
  4. 1
      tildes/tildes/views/settings.py

1
tildes/scss/styles.scss

@ -40,4 +40,5 @@
@import 'themes/default'; @import 'themes/default';
@import 'themes/black'; @import 'themes/black';
@import 'themes/dracula'; @import 'themes/dracula';
@import 'themes/atom_one_dark';
@import 'themes/solarized'; @import 'themes/solarized';

39
tildes/scss/themes/_atom_one_dark.scss

@ -0,0 +1,39 @@
// Colours from Atom One Dark Syntax: https://github.com/atom/atom/blob/master/packages/one-dark-syntax/styles/colors.less
$background: hsl(220, 13%, 18%);
$background-alt: #21242b;
$foreground-alt: hsl(220, 14%, 71%);
$foreground: lighten($foreground, 10%);
$cyan: hsl(187, 47%, 55%);
$blue: hsl(207, 82%, 66%);
$purple: hsl(286, 60%, 67%);
$green: hsl( 95, 38%, 62%);
$red: hsl(355, 65%, 65%);
$orange: hsl( 29, 54%, 61%);
$theme-atom-one-dark: (
"alert": $orange,
"background-primary": $background,
"background-secondary": $background-alt,
"comment-label-exemplary": $blue,
"comment-label-joke": $green,
"comment-label-noise": $orange,
"comment-label-offtopic": $cyan,
"comment-label-malice": $red,
"error": $red,
"foreground-primary": $foreground,
"foreground-secondary": $foreground-alt,
"foreground-highlight": $foreground,
"link": $blue,
"link-visited": $purple,
"stripe-mine": $purple,
"stripe-target": $orange,
"topic-tag-nsfw": $red,
"topic-tag-spoiler": $orange,
"warning": $orange,
);
body.theme-atom-one-dark {
@include use-theme($theme-atom-one-dark);
}

3
tildes/tildes/templates/base.jinja2

@ -16,6 +16,8 @@
<meta name="theme-color" content="#073642"> <meta name="theme-color" content="#073642">
{% elif request.cookies.get("theme", "") == "dracula" %} {% elif request.cookies.get("theme", "") == "dracula" %}
<meta name="theme-color" content="#282a36"> <meta name="theme-color" content="#282a36">
{% elif request.cookies.get("theme", "") == "atom-one-dark" %}
<meta name="theme-color" content="#282c34">
{% elif request.cookies.get('theme', '') == 'black' %} {% elif request.cookies.get('theme', '') == 'black' %}
<meta name="theme-color" content="#222"> <meta name="theme-color" content="#222">
{% endif %} {% endif %}
@ -102,6 +104,7 @@
("light", "Solarized Light"), ("light", "Solarized Light"),
("dark", "Solarized Dark"), ("dark", "Solarized Dark"),
("dracula", "Dracula"), ("dracula", "Dracula"),
("atom-one-dark", "Atom One Dark"),
("black", "Black")) %} ("black", "Black")) %}
<option value="{{ theme }}" <option value="{{ theme }}"
{{ 'selected' if theme == request.cookies.get("theme", "white") else '' }} {{ 'selected' if theme == request.cookies.get("theme", "white") else '' }}

1
tildes/tildes/views/settings.py

@ -33,6 +33,7 @@ def get_settings(request: Request) -> dict:
"light": "Solarized Light", "light": "Solarized Light",
"dark": "Solarized Dark", "dark": "Solarized Dark",
"dracula": "Dracula", "dracula": "Dracula",
"atom-one-dark": "Atom One Dark",
"black": "Black", "black": "Black",
} }

Loading…
Cancel
Save