yogsototh/her.esy.fun
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

target only theme

Browse source
This commit is contained in:
Yann Esposito (Yogsototh) 2019-08-25 00:32:42 +02:00
parent 09d68f6617
commit 44db4f1d8e
Signed by untrusted user who does not match committer: yogsototh
GPG key ID: 7B19A4C650D59646
3 changed files with 52 additions and 87 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
project.el
View file

@ -159,23 +159,25 @@
(goto-char (point-min)) (goto-char (point-min))
(search-forward "<body>") (search-forward "<body>")
(insert (mapconcat 'identity (insert (mapconcat 'identity
'("<input type=\"radio\" id=\"light\" name=\"theme\"/>" '(
"<input type=\"radio\" id=\"dark\" name=\"theme\"/>" "<input id=\"light\">"
"<input type=\"radio\" id=\"raw\" name=\"theme\"/>" "<input id=\"raw\">"
"<input type=\"radio\" id=\"modern\" name=\"theme\"/>" "<input id=\"modern\">"
"<input type=\"radio\" id=\"darkraw\" name=\"theme\"/>" "<input id=\"dark\">"
"<input id=\"darkraw\">"
"<div id=\"labels\">" "<div id=\"labels\">"
"<div class=\"content\">" "<div class=\"content\">"
"Change theme: " "Change theme: "
"<label for=\"light\">Light</label>" "<a href=\"#light\">light</a>"
"(<label for=\"raw\">raw</label>," "(<a href=\"#raw\">raw</a>,"
" <label for=\"modern\">modern</label>)" "<a href=\"#modern\">modern</a>)"
" / " " / "
"<label for=\"dark\">Dark</label>" "<a href=\"#dark\">dark</a>"
"(<label for=\"darkraw\">raw</label>)" "(<a href=\"#darkraw\">raw</a>)"
"</div>" "</div>"
"</div>" "</div>"
"<div class=\"main\">") "<div class=\"main\">")
"\n")) "\n"))
(goto-char (point-max)) (goto-char (point-max))
(search-backward "</body>") (search-backward "</body>")

BIN
project.el.sig
View file

Binary file not shown.

105
src/css/minimalist.css
View file

@ -323,9 +323,8 @@ navigation > a {
body > input { display:none; } body > input { display:none; }
/* Light theme checked */ /* Light theme selected */
input#light:target ~ .main, input#light:target ~ .main {
input#light:checked ~ .main {
--main-background: #fefaf0; /* 0.5 lighter than #fdf6e3 */ --main-background: #fefaf0; /* 0.5 lighter than #fdf6e3 */
--main-foreground: var(--base01); --main-foreground: var(--base01);
--second-foreground: var(--base00); --second-foreground: var(--base00);
@ -334,15 +333,13 @@ input#light:checked ~ .main {
--border-color: var(--base2); --border-color: var(--base2);
--todo-txt: #FFF; --todo-txt: #FFF;
} }
input#light:target ~ #labels, input#light:target ~ #labels {
input#light:checked ~ #labels {
background: #fefaf0; background: #fefaf0;
color: var(--base00); color: var(--base00);
} }
/* Dark theme checked */ /* Dark theme selected */
input#dark:target ~ .main, input#dark:target ~ .main {
input#dark:checked ~ .main {
--main-background: var(--base03); /* 0.5 darker than #002b36; */ --main-background: var(--base03); /* 0.5 darker than #002b36; */
--main-foreground: var(--base1); --main-foreground: var(--base1);
--second-foreground: var(--base0); --second-foreground: var(--base0);
@ -351,15 +348,13 @@ input#dark:checked ~ .main {
--border-color: var(--base02); --border-color: var(--base02);
--todo-txt: #000; --todo-txt: #000;
} }
input#dark:target ~ #labels, input#dark:target ~ #labels {
input#dark:checked ~ #labels {
background: var(--base03); background: var(--base03);
color: var(--base0); color: var(--base0);
} }
/* Light raw theme checked */ /* Light raw theme selected */
input#raw:target ~ .main, input#raw:target ~ .main {
input#raw:checked ~ .main {
--main-background: #fff; --main-background: #fff;
--main-foreground: #000; --main-foreground: #000;
--second-foreground: #000; --second-foreground: #000;
@ -376,21 +371,17 @@ input#raw:checked ~ .main {
--color-link: var(--magenta); --color-link: var(--magenta);
font-family: monospace; font-family: monospace;
} }
input#raw:target ~ #labels, input#raw:target ~ #labels {
input#raw:checked ~ #labels {
background: #fff; background: #fff;
color: #000; color: #000;
} }
input#raw:target ~ .main code, input#raw:target ~ .main code,
input#raw:target ~ .main pre, input#raw:target ~ .main pre
input#raw:checked ~ .main code,
input#raw:checked ~ .main pre
{ {
font-family: monospace; font-family: monospace;
} }
/* Light modern theme checked */ /* Light modern theme selected */
input#modern:target ~ .main, input#modern:target ~ .main {
input#modern:checked ~ .main {
--main-background: #fff; --main-background: #fff;
--main-foreground: #444; --main-foreground: #444;
--second-foreground: #666; --second-foreground: #666;
@ -404,19 +395,19 @@ input#modern:checked ~ .main {
font-size: 16px; font-size: 16px;
line-height: 1.5em; line-height: 1.5em;
} }
input#modern:target ~ #labels a {
color: #fff;
}
input#modern:target ~ .main .content, input#modern:target ~ .main .content,
input#modern:target ~ .main #content, input#modern:target ~ .main #content {
input#modern:checked ~ .main .content,
input#modern:checked ~ .main #content {
margin: 0 auto; margin: 0 auto;
} }
input#modern:target ~ .main blockquote:after, input#modern:target ~ .main blockquote:after {
input#modern:checked ~ .main blockquote:after {
display: none; display: none;
} }
input#modern:target ~ .main blockquote, input#modern:target ~ .main blockquote {
input#modern:checked ~ .main blockquote {
font-family: "Hoefler Text", Georgia, serif; font-family: "Hoefler Text", Georgia, serif;
font-style: italic; font-style: italic;
font-size: 20px; font-size: 20px;
@ -424,9 +415,7 @@ input#modern:checked ~ .main blockquote {
border-left: solid 10px; border-left: solid 10px;
} }
input#modern:target ~ .main h1, input#modern:target ~ .main h1,
input#modern:target ~ .main h2, input#modern:target ~ .main h2 {
input#modern:checked ~ .main h1,
input#modern:checked ~ .main h2 {
font-family: "Hoefler Text", Georgia, serif; font-family: "Hoefler Text", Georgia, serif;
font-style: italic; font-style: italic;
font-size: 2em; font-size: 2em;
@ -437,18 +426,13 @@ input#modern:checked ~ .main h2 {
input#modern:target ~ .main h3, input#modern:target ~ .main h3,
input#modern:target ~ .main h4, input#modern:target ~ .main h4,
input#modern:target ~ .main h5, input#modern:target ~ .main h5,
input#modern:target ~ .main h6, input#modern:target ~ .main h6 {
input#modern:checked ~ .main h3,
input#modern:checked ~ .main h4,
input#modern:checked ~ .main h5,
input#modern:checked ~ .main h6 {
font-weight: 200; font-weight: 200;
font-size: 1.5em; font-size: 1.5em;
line-height: 1.5em; line-height: 1.5em;
margin: 1em 0; margin: 1em 0;
} }
input#modern:target ~ .main #preamble h1, input#modern:target ~ .main #preamble h1 {
input#modern:checked ~ .main #preamble h1 {
font-size: 4em; font-size: 4em;
line-height: 1.5em; line-height: 1.5em;
} }
@ -457,58 +441,41 @@ input#modern:target ~ .main h2::before,
input#modern:target ~ .main h3::before, input#modern:target ~ .main h3::before,
input#modern:target ~ .main h4::before, input#modern:target ~ .main h4::before,
input#modern:target ~ .main h5::before, input#modern:target ~ .main h5::before,
input#modern:target ~ .main h6::before, input#modern:target ~ .main h6::before {
input#modern:checked ~ .main h1::before,
input#modern:checked ~ .main h2::before,
input#modern:checked ~ .main h3::before,
input#modern:checked ~ .main h4::before,
input#modern:checked ~ .main h5::before,
input#modern:checked ~ .main h6::before {
content: ""; content: "";
} }
input#modern:target ~ .main pre, input#modern:target ~ .main pre {
input#modern:checked ~ .main pre {
font-size: 14px; font-size: 14px;
line-height: 1em; line-height: 1em;
border-left: solid 4px var(--soft-foreground); border-left: solid 4px var(--soft-foreground);
padding-left: 1em; padding-left: 1em;
} }
input#modern:target ~ .main pre::before, input#modern:target ~ .main pre::before,
input#modern:target ~ .main pre::after, input#modern:target ~ .main pre::after {
input#modern:checked ~ .main pre::before,
input#modern:checked ~ .main pre::after {
content: ""; content: "";
} }
input#modern:target ~ .main #preamble, input#modern:target ~ .main #preamble,
input#modern:target ~ .main #postamble, input#modern:target ~ .main #postamble {
input#modern:checked ~ .main #preamble,
input#modern:checked ~ .main #postamble {
background-color: var(--cyan); background-color: var(--cyan);
padding: 2em 0; padding: 2em 0;
} }
input#modern:target ~ .main #postamble code, input#modern:target ~ .main #postamble code {
input#modern:checked ~ .main #postamble code {
background-color: transparent; background-color: transparent;
} }
input#modern:target ~ .main #preamble *, input#modern:target ~ .main #preamble *,
input#modern:target ~ .main #postamble *, input#modern:target ~ .main #postamble * {
input#modern:checked ~ .main #preamble *,
input#modern:checked ~ .main #postamble * {
color: #fff; color: #fff;
} }
input#modern:target ~ #labels, input#modern:target ~ #labels {
input#modern:checked ~ #labels {
background: var(--cyan); background: var(--cyan);
color: #fff; color: #fff;
} }
input#modern:target ~ #labels .content, input#modern:target ~ #labels .content {
input#modern:checked ~ #labels .content {
margin: 0 auto; margin: 0 auto;
} }
/* Dark raw theme checked */ /* Dark raw theme selected */
input#darkraw:target ~ .main, input#darkraw:target ~ .main {
input#darkraw:checked ~ .main {
--main-background: #000; --main-background: #000;
--main-foreground: #fff; --main-foreground: #fff;
--second-foreground: #fff; --second-foreground: #fff;
@ -525,16 +492,12 @@ input#darkraw:checked ~ .main {
--color-link: var(--yellow); --color-link: var(--yellow);
font-family: monospace; font-family: monospace;
} }
input#darkraw:target ~ #labels, input#darkraw:target ~ #labels {
input#darkraw:checked ~ #labels {
background: #000; background: #000;
color: #fff; color: #fff;
} }
input#darkraw:target ~ .main code, input#darkraw:target ~ .main code,
input#darkraw:target ~ .main pre, input#darkraw:target ~ .main pre {
input#darkraw:checked ~ .main code,
input#darkraw:checked ~ .main pre
{
font-family: monospace; font-family: monospace;
} }
/* Default color theme */ /* Default color theme */