Fixed solaryzed article, minor css change
This commit is contained in:
parent
67ee9e162e
commit
fabd670b4c
3 changed files with 49 additions and 46 deletions
|
@ -17,7 +17,7 @@ code {
|
||||||
}
|
}
|
||||||
pre {
|
pre {
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
font-size: 14px;
|
font-size: 13px;
|
||||||
}
|
}
|
||||||
blockquote pre {
|
blockquote pre {
|
||||||
line-height: var(--lh);
|
line-height: var(--lh);
|
||||||
|
|
29
src/demo.org
29
src/demo.org
|
@ -64,33 +64,30 @@ There should be a forced newline.
|
||||||
:CUSTOM_ID: width
|
:CUSTOM_ID: width
|
||||||
:END:
|
:END:
|
||||||
|
|
||||||
Testing the width: I use a max width of 76
|
Testing the width: I use a max width of 71
|
||||||
|
|
||||||
#+begin_src ascii
|
#+begin_src ascii
|
||||||
--------10--------20--------30--------40--------50--------60--------70-----
|
--------10--------20--------30--------40--------50--------60--------70--
|
||||||
#+end_src
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-1
|
||||||
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-12
|
||||||
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-123
|
||||||
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-1234
|
||||||
123456789-123456789-123456789-123456789-123456789-123456789-123456789-12345
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-12345
|
||||||
|
|
||||||
123456789-123456789-123456789-123456789-123456789-123456789-123456789-123456
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-123456
|
||||||
|
|
||||||
123456789-123456789-123456789-123456789-123456789-123456789-123456789-1234567
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-1234567
|
||||||
|
|
||||||
123456789-123456789-123456789-123456789-123456789-123456789-123456789-12345678
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-12345678
|
||||||
|
|
||||||
123456789-123456789-123456789-123456789-123456789-123456789-123456789-123456789
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-123456789
|
||||||
|
|
||||||
123456789-123456789-123456789-123456789-123456789-123456789-123456789-123456789-
|
123456789-123456789-123456789-123456789-123456789-123456789-123456789-123456789-
|
||||||
|
|
||||||
123456789-123456789-123456789-123456789-123456789-123456789-123456789-123456789-1
|
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J
|
||||||
|
K L M N O P Q R S T U V W X Y Z 0 1 2 3 4 5 6 7 8 9 a b c d e f g h i j
|
||||||
|
k l m n o p q r s t u v w x y z
|
||||||
|
#+end_src
|
||||||
|
|
||||||
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K L
|
a b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J
|
||||||
M N O P Q R S T U V W X Y Z 0 1 2 3 4 5 6 7 8 9 a b c d e f g h i j k l m n
|
K L M N O P Q R S T U V W X Y Z 0 1 2 3 4 5 6 7 8 9 a b c d e f g h i j
|
||||||
o p q r s t u v w x y z
|
k l m n o p q r s t u v w x y z
|
||||||
|
|
||||||
a0 b c d e f g h i j k l m n o p q r s t u v w x y z A B C D E F G H I J K
|
|
||||||
L M N O P Q R S T U V W X Y Z 0 1 2 3 4 5 6 7 8 9 a b c d e f g h i j k l m
|
|
||||||
n o p q r s t u v w x y z
|
|
||||||
|
|
||||||
* Math
|
* Math
|
||||||
:PROPERTIES:
|
:PROPERTIES:
|
||||||
|
|
|
@ -8,22 +8,15 @@
|
||||||
#+OPTIONS: auto-id:t toc:t
|
#+OPTIONS: auto-id:t toc:t
|
||||||
#+STARTUP: overview
|
#+STARTUP: overview
|
||||||
|
|
||||||
The colorscheme of my website is the colorscheme I use for my terminal and
|
After many years using [[https://ethanschoonover.com/solarized/][Solarized]] I changed to a new one.
|
||||||
most of my environment.
|
I use it for my terminal, emacs and most of my tools.
|
||||||
|
|
||||||
This is inspired by both [[https://ethanschoonover.com/solarized/][Solarized]] and [[https://nordtheme.com][Nord]].
|
This is inspired by both [[https://ethanschoonover.com/solarized/][Solarized]] and [[https://nordtheme.com][Nord]].
|
||||||
|
I switched because I wanted a greyer theme.
|
||||||
So I used [[https://ethanschoonover.com/solarized/][Solarized]] for many years.
|
|
||||||
And it was really difficult finding a new one that suits my taste.
|
|
||||||
|
|
||||||
Stil I disliked the blue-green dark background.
|
|
||||||
I wanted to change that background color.
|
|
||||||
Or having a grayer background.
|
|
||||||
|
|
||||||
Ethan Shoovnover the creator of Solarized gave plenty of information about
|
Ethan Shoovnover the creator of Solarized gave plenty of information about
|
||||||
how he created it.
|
the creation of his colorscheme.
|
||||||
|
And I stumbled upon the [[https://nordtheme.com][Nord]] theme.
|
||||||
Also I stumbled upon the [[https://nordtheme.com][Nord]] theme.
|
|
||||||
And I really liked it.
|
And I really liked it.
|
||||||
But while the colors are great, it is not as easy to switch from light to
|
But while the colors are great, it is not as easy to switch from light to
|
||||||
dark theme than with solarized because Solarized has a lot of nice
|
dark theme than with solarized because Solarized has a lot of nice
|
||||||
|
@ -42,25 +35,38 @@ slightly bigger contrast for text.
|
||||||
|
|
||||||
Here is the CSS you could use:
|
Here is the CSS you could use:
|
||||||
|
|
||||||
|
|
||||||
#+begin_export html
|
#+begin_export html
|
||||||
<style>#colors div { display: inline-block; }</style>
|
<style>#colors div {
|
||||||
|
display: inline-block;
|
||||||
|
height: 60.0px;
|
||||||
|
width: 60.0px;
|
||||||
|
margin: 2px 0;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 60.0px;
|
||||||
|
text-align: center; }
|
||||||
|
#colors { padding: 20px; margin: 10px 0; }
|
||||||
|
</style>
|
||||||
<div id="colors">
|
<div id="colors">
|
||||||
<div style="background: hsl(218.82, 20.99%, 15.88%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b03">b03</div>
|
#+end_export
|
||||||
<div style="background: hsl(222.35, 16.5%, 20.2%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b02">b02</div>
|
#+MACRO: colorbox @@html:<div style="background: $3; color:$2" id="$1">$1</div>@@
|
||||||
<div style="background: hsl(222.35, 8.72%, 38.24%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b01">b01</div>
|
{{{colorbox(b03,white,#202631)}}}
|
||||||
<div style="background: hsl(221.25, 6.56%, 47.84%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b00">b00</div>
|
{{{colorbox(b02,white,#2b303c)}}}
|
||||||
<div style="background: hsl(220.0, 6.98%, 57.84%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b0">b0</div>
|
{{{colorbox(b01,white,#595e6a)}}}
|
||||||
<div style="background: hsl(222.86, 8.64%, 68.24%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b1">b1</div>
|
{{{colorbox(b00,white,#727782)}}}
|
||||||
<div style="background: hsl(223.64, 26.83%, 91.96%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b2">b2</div>
|
{{{colorbox(b0,black,#8c919b)}}}
|
||||||
<div style="background: hsl(223.64, 84.62%, 97.45%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b3">b3</div>
|
{{{colorbox(b1,black,#a7abb5)}}}
|
||||||
<div style="background: hsl(38.48, 36.22%, 49.8%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="y">y</div>
|
{{{colorbox(b2,black,#e5e8f0)}}}
|
||||||
<div style="background: hsl(17.23, 38.52%, 47.84%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="o">o</div>
|
{{{colorbox(b3,black,#f3f6fe)}}}
|
||||||
<div style="background: hsl(8.09, 35.74%, 51.18%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="r">r</div>
|
{{{colorbox(y,white,#ad8c51)}}}
|
||||||
<div style="background: hsl(336.75, 33.06%, 52.55%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="m">m</div>
|
{{{colorbox(o,white,#a9664b)}}}
|
||||||
<div style="background: hsl(229.6, 32.75%, 55.1%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="v">v</div>
|
{{{colorbox(r,white,#af6256)}}}
|
||||||
<div style="background: hsl(205.19, 52.19%, 50.78%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="b">b</div>
|
{{{colorbox(m,white,#ae5e7d)}}}
|
||||||
<div style="background: hsl(176.09, 75.0%, 36.08%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="c">c</div>
|
{{{colorbox(v,white,#6774b2)}}}
|
||||||
<div style="background: hsl(60.91, 28.7%, 45.1%); height: 60.0px; width: 60.0px; line-height: 60.0px; text-align: center" id="g">g</div>
|
{{{colorbox(b,white,#408cc3)}}}
|
||||||
|
{{{colorbox(c,white,#17a198)}}}
|
||||||
|
{{{colorbox(g,white,#939452)}}}
|
||||||
|
#+begin_export html
|
||||||
</div>
|
</div>
|
||||||
#+end_export
|
#+end_export
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue