summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorThomas "Cakeisalie5" Touhey <thomas@touhey.fr>2019-01-31 22:26:59 +0100
committerThomas "Cakeisalie5" Touhey <thomas@touhey.fr>2019-01-31 22:26:59 +0100
commitc87cbe1ea2784d723f93dd5a2dc6db117f9e7f35 (patch)
treefce318306230cdeed41123dbdb1cc969218e8c7d
parentcf906516ebf6913871739cbf357361c532b41385 (diff)
Style update (using my blog style)
-rw-r--r--_assets/css/dark.scss9
-rw-r--r--_assets/css/light.scss9
-rw-r--r--_assets/css/main.scss237
-rw-r--r--_assets/css/monokai.scss70
-rw-r--r--_assets/css/skeleton.scss512
-rw-r--r--_assets/css/tango.scss85
-rw-r--r--_includes/gb1
-rw-r--r--_includes/ge1
-rw-r--r--_includes/gi6
-rw-r--r--_layouts/default.html14
-rw-r--r--paintings.md20
11 files changed, 711 insertions, 253 deletions
diff --git a/_assets/css/dark.scss b/_assets/css/dark.scss
new file mode 100644
index 0000000..cece471
--- /dev/null
+++ b/_assets/css/dark.scss
@@ -0,0 +1,9 @@
+$bg : #202020;
+$mainbg : #404040;
+$barbg : #303030;
+
+$bartext : white;
+$text : white;
+
+@import "skeleton";
+@import "monokai";
diff --git a/_assets/css/light.scss b/_assets/css/light.scss
new file mode 100644
index 0000000..618debd
--- /dev/null
+++ b/_assets/css/light.scss
@@ -0,0 +1,9 @@
+$bg : #E0E0E0;
+$mainbg : white;
+$barbg : #E0E0E0;
+
+$bartext : #000000;
+$text : #000000;
+
+@import "skeleton";
+@import "tango";
diff --git a/_assets/css/main.scss b/_assets/css/main.scss
deleted file mode 100644
index b286baf..0000000
--- a/_assets/css/main.scss
+++ /dev/null
@@ -1,237 +0,0 @@
-* {
- box-sizing: border-box;
- font-family: "Helvetica", Times, serif;
-}
-
-@import "normalize";
-
-body {
- margin: 0;
- background-color: #F0F0F0;
- overflow-y: scroll;
-}
-
-.container {
- width: 100%;
- max-width: 840px;
- margin: 10px auto 50px;
- padding: 20px;
- background-color: white;
-}
-.higher {
- background-color: #F5F5F5;
-}
-
-.higher:after, .side:after {
- content: " ";
- visibility: hidden;
- display: block;
- height: 0;
- clear: both;
-}
-
-.side {
- width: 20%;
- float: left;
- vertical-align: top;
- background-color: #F5F5F5;
-}
-
-.side .picture {
- width: 100%;
- max-width: 200px;
- height: auto;
- margin-bottom: 5px;
-}
-
-.side-photo a {
- display: block;
- line-height: 0;
-}
-
-.side-content {
- padding: 2px;
-}
-
-nav ul {
- list-style-type: none;
- padding: 0;
- margin: 0;
- margin-top: 10px;
-}
-nav li:before {
- content: "— ";
-}
-
-.content-wrapper {
- width: 80%;
- float: right;
- vertical-align: top;
- text-align: justify;
- background-color: white;
- padding-left: 10px;
-}
-
-footer {
- text-align: right;
- padding: 0 5px;
-}
-
-footer p {
- font-size: 10px;
- margin-bottom: 0;
- padding-bottom: 0;
-}
-
-@media print, (max-width: 600px) {
-.higher {
- background-color: white;
-}
-.content-wrapper, .side {
- width: 100%;
- float: none;
-}
-
-.side {
- width: 100%;
- background-color: #FAFAFA;
-}
-.content-wrapper, .content-subwrapper {
- padding-left: 0;
-}
-}
-
-@media (max-width: 350px) {
-.side .picture {
- width: 100%;
- max-width: none;
-}
-}
-
-.content-title {
- text-align: left;
-
- h1, p, h2 {
- display: inline;
- font-size: 1.2em;
- }
-}
-
-/* Cool menu. */
-
-@media (min-width: 350px) and (max-width: 600px) {
-.side-photo {
- float: left;
- margin-right: 5px;
- margin-bottom: 0;
-
- .picture {
- max-width: 140px;
- }
-}
-.side-content {
- display: block;
-}
-}
-
-/* Do not display the sidebar while printing. */
-
-@media print {
-.side {
- display: none;
-}
-}
-
-/* ELEMENTS */
-
-h3, h4, h5, h6 {
- line-height: 1;
- margin: 0;
-}
-h3 { font-size: 18px; }
-p {
- margin: 5px 0;
- line-height: 1.2;
- padding-bottom: 0.5em;
-}
-
-.menu-title {
- margin: 0;
- line-height: 1;
- font-weight: bold;
- font-size: 18px;
-}
-
-hr {
- line-height: 1;
- border: none;
- border-top: 1px solid black;
- margin-left: 10px;
-}
-.content-wrapper hr {
- margin-left: 0;
-}
-
-blockquote {
- background-color: #58D3F7;
- margin: 10px 0;
- padding: 10px 5px;
- padding-left: 20px;
-}
-
-.video_wrapper {
- position: relative;
- width: 100%;
- height: 0;
- padding-bottom: 56%;
- margin: 40px 0 10px;
-}
-
-.video_wrapper iframe {
- width: 100%;
- height: 100%;
- border: none;
- background-color: black;
- position: absolute;
- left: 0;
- top: 0;
-}
-
-.content img {
- display: block;
- margin-left: auto;
- margin-right: auto;
- width: auto;
- max-width: 100%;
- max-height: 300px;
-}
-.content .hi {
- max-width: 95%;
- max-height: none;
-}
-
-.content .aside {
- float: right;
- margin: 5px 10px;
- margin-right: 0;
-}
-.content .gallery img {
- display: inline-block;
- margin-left: default;
- margin-right: default;
- max-height: 250px;
-}
-
-@media (max-width: 600px) {
-.content .aside {
- margin: 5px auto;
- float: none;
-}
-}
-
-a, a:visited, a:hover, a:active {
- color: #2E9AFE;
- text-decoration: none;
-}
-a:hover { color: #0040FF; }
-a:active { color: #0431B4; }
diff --git a/_assets/css/monokai.scss b/_assets/css/monokai.scss
new file mode 100644
index 0000000..d8777a8
--- /dev/null
+++ b/_assets/css/monokai.scss
@@ -0,0 +1,70 @@
+.highlight .hll { background-color: #49483e }
+.highlight { background: #272822; color: #f8f8f2 }
+.highlight .c { color: #75715e } /* Comment */
+.highlight .err { color: #960050; background-color: #1e0010 } /* Error */
+.highlight .k { color: #66d9ef } /* Keyword */
+.highlight .l { color: #ae81ff } /* Literal */
+.highlight .n { color: #f8f8f2 } /* Name */
+.highlight .o { color: #f92672 } /* Operator */
+.highlight .p { color: #f8f8f2 } /* Punctuation */
+.highlight .ch { color: #75715e } /* Comment.Hashbang */
+.highlight .cm { color: #75715e } /* Comment.Multiline */
+.highlight .cp { color: #75715e } /* Comment.Preproc */
+.highlight .cpf { color: #75715e } /* Comment.PreprocFile */
+.highlight .c1 { color: #75715e } /* Comment.Single */
+.highlight .cs { color: #75715e } /* Comment.Special */
+.highlight .gd { color: #f92672 } /* Generic.Deleted */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gi { color: #a6e22e } /* Generic.Inserted */
+.highlight .gs { font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: #75715e } /* Generic.Subheading */
+.highlight .kc { color: #66d9ef } /* Keyword.Constant */
+.highlight .kd { color: #66d9ef } /* Keyword.Declaration */
+.highlight .kn { color: #f92672 } /* Keyword.Namespace */
+.highlight .kp { color: #66d9ef } /* Keyword.Pseudo */
+.highlight .kr { color: #66d9ef } /* Keyword.Reserved */
+.highlight .kt { color: #66d9ef } /* Keyword.Type */
+.highlight .ld { color: #e6db74 } /* Literal.Date */
+.highlight .m { color: #ae81ff } /* Literal.Number */
+.highlight .s { color: #e6db74 } /* Literal.String */
+.highlight .na { color: #a6e22e } /* Name.Attribute */
+.highlight .nb { color: #f8f8f2 } /* Name.Builtin */
+.highlight .nc { color: #a6e22e } /* Name.Class */
+.highlight .no { color: #66d9ef } /* Name.Constant */
+.highlight .nd { color: #a6e22e } /* Name.Decorator */
+.highlight .ni { color: #f8f8f2 } /* Name.Entity */
+.highlight .ne { color: #a6e22e } /* Name.Exception */
+.highlight .nf { color: #a6e22e } /* Name.Function */
+.highlight .nl { color: #f8f8f2 } /* Name.Label */
+.highlight .nn { color: #f8f8f2 } /* Name.Namespace */
+.highlight .nx { color: #a6e22e } /* Name.Other */
+.highlight .py { color: #f8f8f2 } /* Name.Property */
+.highlight .nt { color: #f92672 } /* Name.Tag */
+.highlight .nv { color: #f8f8f2 } /* Name.Variable */
+.highlight .ow { color: #f92672 } /* Operator.Word */
+.highlight .w { color: #f8f8f2 } /* Text.Whitespace */
+.highlight .mb { color: #ae81ff } /* Literal.Number.Bin */
+.highlight .mf { color: #ae81ff } /* Literal.Number.Float */
+.highlight .mh { color: #ae81ff } /* Literal.Number.Hex */
+.highlight .mi { color: #ae81ff } /* Literal.Number.Integer */
+.highlight .mo { color: #ae81ff } /* Literal.Number.Oct */
+.highlight .sa { color: #e6db74 } /* Literal.String.Affix */
+.highlight .sb { color: #e6db74 } /* Literal.String.Backtick */
+.highlight .sc { color: #e6db74 } /* Literal.String.Char */
+.highlight .dl { color: #e6db74 } /* Literal.String.Delimiter */
+.highlight .sd { color: #e6db74 } /* Literal.String.Doc */
+.highlight .s2 { color: #e6db74 } /* Literal.String.Double */
+.highlight .se { color: #ae81ff } /* Literal.String.Escape */
+.highlight .sh { color: #e6db74 } /* Literal.String.Heredoc */
+.highlight .si { color: #e6db74 } /* Literal.String.Interpol */
+.highlight .sx { color: #e6db74 } /* Literal.String.Other */
+.highlight .sr { color: #e6db74 } /* Literal.String.Regex */
+.highlight .s1 { color: #e6db74 } /* Literal.String.Single */
+.highlight .ss { color: #e6db74 } /* Literal.String.Symbol */
+.highlight .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
+.highlight .fm { color: #a6e22e } /* Name.Function.Magic */
+.highlight .vc { color: #f8f8f2 } /* Name.Variable.Class */
+.highlight .vg { color: #f8f8f2 } /* Name.Variable.Global */
+.highlight .vi { color: #f8f8f2 } /* Name.Variable.Instance */
+.highlight .vm { color: #f8f8f2 } /* Name.Variable.Magic */
+.highlight .il { color: #ae81ff } /* Literal.Number.Integer.Long */
diff --git a/_assets/css/skeleton.scss b/_assets/css/skeleton.scss
new file mode 100644
index 0000000..e9f0b8d
--- /dev/null
+++ b/_assets/css/skeleton.scss
@@ -0,0 +1,512 @@
+* {
+ box-sizing: border-box;
+}
+
+@import "normalize";
+
+body {
+ margin: 0;
+ background-color: $bg;
+ overflow-y: scroll;
+ font-family: "Helvetica", Times, serif;
+}
+
+.container {
+ width: 100%;
+ max-width: 900px;
+ margin: 10px auto 50px;
+ padding: 20px;
+ background-color: $mainbg;
+}
+.higher {
+ background-color: $barbg;
+ color: $bartext;
+}
+
+.higher:after, .side:after {
+ content: " ";
+ visibility: hidden;
+ display: block;
+ height: 0;
+ clear: both;
+}
+
+p, pre {
+ font-size: 1em;
+ line-height: 1;
+}
+pre {
+ font-family: Courier New, monospace;
+}
+
+.side {
+ width: 20%;
+ float: left;
+ vertical-align: top;
+ background-color: $barbg;
+
+ .menu-title {
+ margin: 0;
+ line-height: 1;
+ font-weight: bold;
+ font-size: 1em;
+ }
+
+ .picture {
+ width: 100%;
+ max-width: 200px;
+ height: auto;
+ margin-bottom: 5px;
+ padding: 10px;
+ }
+
+ .side-photo a {
+ display: block;
+ line-height: 0;
+ }
+
+ .side-content {
+ padding: 5px;
+ }
+
+ .flags img {
+ padding-right: 5px;
+ }
+
+ nav ul {
+ list-style-type: none;
+ padding: 0;
+ margin: 0;
+ margin-top: 10px;
+ }
+ nav li:before {
+ content: "— ";
+ }
+}
+
+.content {
+ width: 80%;
+ float: right;
+ vertical-align: top;
+ text-align: justify;
+ background-color: $mainbg;
+ color: $text;
+}
+
+hr {
+ line-height: 1;
+ border: none;
+ border-top: 1px solid black;
+ margin-left: 10px;
+}
+
+footer {
+ text-align: right;
+ padding: 0 5px;
+
+ p {
+ color: $text;
+ font-size: 0.7em;
+ margin-bottom: 0;
+ padding-bottom: 0;
+ }
+}
+
+@media print, (max-width: 600px) {
+.higher {
+ background-color: $mainbg;
+ color: $text;
+}
+.content, .side {
+ width: 100%;
+ float: none;
+}
+
+.side {
+ width: 100%;
+}
+}
+
+@media (max-width: 350px) {
+.side .picture {
+ width: 100%;
+ max-width: none;
+}
+}
+
+.content-title {
+ text-align: left;
+
+ .int, .sub {
+ padding: 0;
+ }
+ h1, .int, h2 {
+ display: inline;
+ font-size: 1.2em;
+ }
+ .sub {
+ font-style: italic;
+ }
+}
+
+/* Cool menu. */
+
+@media (min-width: 350px) and (max-width: 600px) {
+.side-photo {
+ float: left;
+ margin-right: 5px;
+ margin-bottom: 0;
+
+ .picture {
+ max-width: 140px;
+ }
+}
+.side-content {
+ display: block;
+}
+}
+
+/* Do not display the sidebar while printing. */
+
+@media print {
+.side, .webring {
+ display: none;
+}
+
+a:not([href^="mailto:"]):after {
+ content: " <" attr(href) ">";
+}
+}
+
+/* Content formatting */
+
+a, a:visited, a:hover, a:active {
+ color: #2E9AFE;
+ text-decoration: none;
+}
+a:hover { color: #0040FF; }
+a:active { color: #0431B4; }
+
+.content {
+ .post-list {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+
+ li {
+ display: block;
+ margin-top: 10px;
+ padding: 10px 15px 0 10px;
+ width: 100%;
+ background-color: $barbg;
+ color: $bartext;
+ border-radius: 0 20px 20px 0;
+
+ h3, .post-meta, .post-desc {
+ padding-left: 0;
+ }
+
+ h3, .post-meta {
+ display: inline;
+ }
+ .post-meta {
+ color: #505050;
+ font-size: 14px;
+ }
+ }
+ }
+
+ h3, h4, h5, h6 {
+ line-height: 1;
+ margin: 0;
+ }
+ h3 { font-size: 18px; }
+ p {
+ margin: 5px 0;
+ line-height: 1.2;
+ padding-bottom: 0.5em;
+ }
+ p, h3, h4, h5, h6 {
+ padding-left: 10px;
+ }
+
+ img {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ width: auto;
+ max-width: 100%;
+ max-height: 300px;
+ }
+ .picture {
+ page-break-inside: avoid;
+ }
+
+ .hi {
+ max-width: 95%;
+ max-height: none;
+ }
+
+ .aside {
+ float: right;
+ margin: 5px 10px;
+ margin-right: 0;
+ }
+ .gallery img {
+ display: inline-block;
+ margin-left: default;
+ margin-right: default;
+ max-height: 250px;
+ }
+
+ .picture, .highlight, blockquote, .webring, .warning {
+ margin-left: 0;
+ margin-right: 0;
+ background-color: $barbg;
+ color: $bartext;
+ }
+
+ .picture p {
+ font-size: 0.8em;
+ }
+
+ .warning {
+ padding-top: 10px;
+ padding-bottom: 5px;
+ padding-right: 10px;
+
+ :after {
+ content: " ";
+ visibility: hidden;
+ display: block;
+ height: 0;
+ clear: both;
+ }
+
+ span {
+ content: "!";
+ float: left;
+ padding: 2px 4px;
+ background-color: $barbg;
+ color: $bartext;
+ font-weight: bold;
+ vertical-align: middle;
+ margin-right: 5px;
+ margin-bottom: 5px;
+ }
+
+ p {
+ margin-top: 0;
+ margin-bottom: 0;
+ padding-top: 2px;
+ padding-bottom: 0;
+ vertical-align: middle;
+ }
+ }
+
+ .webring {
+ ul {
+ width: 100%;
+ margin-top: 0;
+ padding-left: 0;
+ list-style-type: none;
+ text-align: center;
+ padding-bottom: 5px;
+
+ font-size: 0.8em;
+ }
+
+ li {
+ display: inline-block;
+ padding: 5px 0 0 15px;
+ }
+ .wr-fst {
+ padding-left: 10px;
+ }
+ }
+
+ .video_wrapper {
+ display: block;
+ position: relative;
+ width: 100%;
+ height: 0;
+ padding-bottom: 56%;
+ margin: 20px 0 10px 10px;
+ clear: both;
+ }
+
+ .video_wrapper iframe {
+ width: 100%;
+ height: 100%;
+ border: none;
+ background-color: black;
+ position: absolute;
+ left: 0;
+ top: 0;
+ }
+
+ .picture {
+ padding-top: 10px;
+ text-align: center;
+ }
+
+ .content-title, hr {
+ margin-left: 10px;
+ }
+
+ blockquote {
+ background-color: $barbg;
+ color: $bartext;
+ margin: 10px 0;
+ padding: 0 10px;
+ }
+ blockquote:before {
+ content: open-quote;
+ color: $bartext;
+ font-size: 4em;
+ line-height: 0;
+ vertical-align: -0.6em;
+ }
+
+ pre, code {
+ margin: 0;
+ padding: 0;
+ color: $text;
+ }
+ code {
+ padding: 10px 0;
+ }
+ pre {
+ border: none;
+ border-radius: 0;
+ color: $bartext;
+ background-color: $barbg;
+ padding-top: 10px;
+ padding-bottom: 10px;
+
+ tab-size: 4;
+ -moz-tab-size: 4;
+ -o-tab-size: 4;
+ }
+ .highlight pre {
+ padding-left: 10px;
+ }
+
+ pre.lineno {
+ padding-left: 0;
+ text-align: right;
+ }
+ td.gutter {
+ border-right: 2px solid #808080;
+ padding-right: 5px;
+ }
+
+ .highlight {
+ padding-left: 10px;
+ overflow-x: auto;
+
+ table {
+ margin: 0;
+ border-collapse: collapse;
+ }
+ .code pre, .gutter pre {
+ padding-top: 0;
+ padding-bottom: 0;
+ }
+ td.gl {
+ width: 0;
+ }
+ }
+
+ .gallery-wrapper {
+ display: block;
+ line-height: 0;
+
+ width: 100%;
+ background-color: $barbg;
+ color: $bartext;
+ margin-top: 10px;
+ margin-bottom: 10px;
+ padding: 0;
+
+ .gallery {
+ width: 100%;
+ margin: 0;
+ padding: 0;
+
+ overflow-x: auto;
+ overflow-y: hidden;
+ white-space: nowrap;
+ text-align: center;
+ }
+
+ img {
+ display: inline;
+ text-align: center;
+ height: 100%;
+ width: auto;
+ }
+
+ .gallery, li, a {
+ display: inline-block;
+ line-height: 0;
+ }
+ }
+
+ .cat-list {
+ padding: 0;
+
+ .list-entry {
+ display: block;
+ margin-top: 10px;
+ width: 100%;
+ background-color: $barbg;
+ color: $bartext;
+ border-radius: 0 20px 20px 0;
+
+ :after {
+ content: " ";
+ visibility: hidden;
+ display: block;
+ height: 0;
+ clear: both;
+ }
+
+ a {
+ color: #111111;
+ }
+ a:hover {
+ text-decoration: none;
+ }
+
+ img {
+ float: left;
+ height: 4.5em;
+ width: auto;
+ margin-right: 10px;
+ margin-bottom: 0;
+ }
+ p {
+ font-size: 1.5em;
+ line-height: 3;
+ padding: 0;
+ }
+ }
+ }
+}
+
+@media (max-width: 600px) {
+.content {
+ .content-title, hr {
+ margin-left: 0;
+ }
+ .highlight, pre, p, h3, h4, h5, h6 {
+ padding-left: 0;
+ }
+
+ .aside {
+ margin: 5px auto;
+ float: none;
+ }
+}
+}
diff --git a/_assets/css/tango.scss b/_assets/css/tango.scss
new file mode 100644
index 0000000..b197149
--- /dev/null
+++ b/_assets/css/tango.scss
@@ -0,0 +1,85 @@
+/* ****************************************************************************
+ * _sass/tango.scss -- highlight rules for pygments.
+ * Written by Richard "richleland" Leland <rich@richleland.com>
+ * Edited by Thomas Touhey <thomas@touhey.fr>
+ * ************************************************************************* */
+.highlight {
+ background: #f8f8f8;
+
+ .hll { background-color: #ffffcc }
+ .c { color: #8f5902; font-style: italic } /* Comment */
+ .err { color: #a40000; border: 1px solid #ef2929 } /* Error */
+ .g { color: #000000 } /* Generic */
+ .k { color: #204a87; font-weight: bold } /* Keyword */
+ .l { color: #000000 } /* Literal */
+ .n { color: #000000 } /* Name */
+ .o { color: #ce5c00; font-weight: bold } /* Operator */
+ .x { color: #000000 } /* Other */
+ .p { color: #000000; font-weight: bold } /* Punctuation */
+ .ch { color: #8f5902; font-style: italic } /* Comment.Hashbang */
+ .cm { color: #8f5902; font-style: italic } /* Comment.Multiline */
+ .cp { color: #8f5902; font-style: italic } /* Comment.Preproc */
+ .cpf { color: #8f5902; font-style: italic } /* Comment.PreprocFile */
+ .c1 { color: #8f5902; font-style: italic } /* Comment.Single */
+ .cs { color: #8f5902; font-style: italic } /* Comment.Special */
+ .gd { color: #a40000 } /* Generic.Deleted */
+ .ge { color: #000000; font-style: italic } /* Generic.Emph */
+ .gr { color: #ef2929 } /* Generic.Error */
+ .gh { color: #000080; font-weight: bold } /* Generic.Heading */
+ .gi { color: #00A000 } /* Generic.Inserted */
+ .go { color: #000000; font-style: italic } /* Generic.Output */
+ .gp { color: #8f5902 } /* Generic.Prompt */
+ .gs { color: #000000; font-weight: bold } /* Generic.Strong */
+ .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
+ .gt { color: #a40000; font-weight: bold } /* Generic.Traceback */
+ .kc { color: #204a87; font-weight: bold } /* Keyword.Constant */
+ .kd { color: #204a87; font-weight: bold } /* Keyword.Declaration */
+ .kn { color: #204a87; font-weight: bold } /* Keyword.Namespace */
+ .kp { color: #204a87; font-weight: bold } /* Keyword.Pseudo */
+ .kr { color: #204a87; font-weight: bold } /* Keyword.Reserved */
+ .kt { color: #204a87; font-weight: bold } /* Keyword.Type */
+ .ld { color: #000000 } /* Literal.Date */
+ .m { color: #0000cf; font-weight: bold } /* Literal.Number */
+ .s { color: #4e9a06 } /* Literal.String */
+ .na { color: #c4a000 } /* Name.Attribute */
+ .nb { color: #204a87 } /* Name.Builtin */
+ .nc { color: #000000 } /* Name.Class */
+ .no { color: #000000 } /* Name.Constant */
+ .nd { color: #5c35cc; font-weight: bold } /* Name.Decorator */
+ .ni { color: #ce5c00 } /* Name.Entity */
+ .ne { color: #cc0000; font-weight: bold } /* Name.Exception */
+ .nf { color: #000000 } /* Name.Function */
+ .nl { color: #f57900 } /* Name.Label */
+ .nn { color: #000000 } /* Name.Namespace */
+ .nx { color: #000000 } /* Name.Other */
+ .py { color: #000000 } /* Name.Property */
+ .nt { color: #204a87; font-weight: bold } /* Name.Tag */
+ .nv { color: #000000 } /* Name.Variable */
+ .ow { color: #204a87; font-weight: bold } /* Operator.Word */
+ .w { color: #f8f8f8; text-decoration: underline } /* Text.Whitespace */
+ .mb { color: #0000cf; font-weight: bold } /* Literal.Number.Bin */
+ .mf { color: #0000cf; font-weight: bold } /* Literal.Number.Float */
+ .mh { color: #0000cf; font-weight: bold } /* Literal.Number.Hex */
+ .mi { color: #0000cf; font-weight: bold } /* Literal.Number.Integer */
+ .mo { color: #0000cf; font-weight: bold } /* Literal.Number.Oct */
+ .sa { color: #4e9a06 } /* Literal.String.Affix */
+ .sb { color: #4e9a06 } /* Literal.String.Backtick */
+ .sc { color: #4e9a06 } /* Literal.String.Char */
+ .dl { color: #4e9a06 } /* Literal.String.Delimiter */
+ .sd { color: #8f5902; font-style: italic } /* Literal.String.Doc */
+ .s2 { color: #4e9a06 } /* Literal.String.Double */
+ .se { color: #4e9a06 } /* Literal.String.Escape */
+ .sh { color: #4e9a06 } /* Literal.String.Heredoc */
+ .si { color: #4e9a06 } /* Literal.String.Interpol */
+ .sx { color: #4e9a06 } /* Literal.String.Other */
+ .sr { color: #4e9a06 } /* Literal.String.Regex */
+ .s1 { color: #4e9a06 } /* Literal.String.Single */
+ .ss { color: #4e9a06 } /* Literal.String.Symbol */
+ .bp { color: #3465a4 } /* Name.Builtin.Pseudo */
+ .fm { color: #000000 } /* Name.Function.Magic */
+ .vc { color: #000000 } /* Name.Variable.Class */
+ .vg { color: #000000 } /* Name.Variable.Global */
+ .vi { color: #000000 } /* Name.Variable.Instance */
+ .vm { color: #000000 } /* Name.Variable.Magic */
+ .il { color: #0000cf; font-weight: bold } /* Literal.Number.Integer.Long */
+}
diff --git a/_includes/gb b/_includes/gb
new file mode 100644
index 0000000..74551d5
--- /dev/null
+++ b/_includes/gb
@@ -0,0 +1 @@
+<div class="gallery-wrapper"><ul class="gallery">
diff --git a/_includes/ge b/_includes/ge
new file mode 100644
index 0000000..d8204f0
--- /dev/null
+++ b/_includes/ge
@@ -0,0 +1 @@
+</ul></div>
diff --git a/_includes/gi b/_includes/gi
new file mode 100644
index 0000000..1bbd1e8
--- /dev/null
+++ b/_includes/gi
@@ -0,0 +1,6 @@
+{% capture link
+%}{% asset "{{ include.src }}" @path
+%}{% endcapture
+%}<li><a href="{{ link }}" target="_blank" rel="noopener">
+ <img src="{{ link }}" alt="{{ include.alt |xml_escape }}" />
+</a></li> \ No newline at end of file
diff --git a/_layouts/default.html b/_layouts/default.html
index 46dcc85..e817bc0 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -52,20 +52,22 @@
%}
<link rel="pavatar" href="{{ site.url }}{{ site.baseurl }}/pavatar.png">
-{% asset css/main.css %}
+{% asset css/light.css title="Light theme" %}
+{% asset css/dark.css title="Dark theme" rel="alternate stylesheet" %}
</head><body><div class="container">
<div class="higher">
<!-- Main content. -->
-<section class="content-wrapper">
+<section class="content">
<div class="content-title">
-<h1>John Touhey</h1><p>: </p><h2>{% if page.layout == "post" %}{{ page.date | date_to_string }}: {% endif %}{% if page.title %}{{ page.title }}{% else %}About myself{% endif %}</h2>
+<h1>John Touhey</h1><p class="int">: </p><h2>{% if page.layout == "post" %}{{ page.date | date_to_string }}: {% endif %}{% if page.title %}{{ page.title }}{% else %}About myself{% endif %}</h2>
</div>
-<hr /><div class="content">
-{{ content }}
-</div></section>
+<hr />
+
+{{ content | strip }}
+</section>
<!-- Sidebar. -->
diff --git a/paintings.md b/paintings.md
index 7af164f..4f08c5e 100644
--- a/paintings.md
+++ b/paintings.md
@@ -3,14 +3,14 @@ layout: default
title: Paintings
description: Paintings by John Touhey.
---
-<div class="gallery">
+{% include gb
+%}{% include gi src="paintings/2015-05-06 22.26.25.jpg" alt=""
+%}{% include gi src="paintings/2015-06-17 21.49.36.jpg" alt=""
+%}{% include gi src="paintings/IMG_20120411_191105.jpg" alt=""
+%}{% include gi src="paintings/IMG_20120411_191148.jpg" alt=""
+%}{% include gi src="paintings/IMG_20120411_191222.jpg" alt=""
+%}{% include gi src="paintings/IMG_20120411_213623.jpg" alt=""
+%}{% include gi src="paintings/IMG_20120619_214117.jpg" alt=""
+%}{% include ge %}
-{% asset "paintings/2015-05-06 22.26.25.jpg" %}
-{% asset "paintings/2015-06-17 21.49.36.jpg" %}
-{% asset paintings/IMG_20120411_191105.jpg %}
-{% asset paintings/IMG_20120411_191148.jpg %}
-{% asset paintings/IMG_20120411_191222.jpg %}
-{% asset paintings/IMG_20120411_213623.jpg %}
-{% asset paintings/IMG_20120619_214117.jpg %}
-
-</div>
+I started painting in 2012. Here are some of my creations.