add art gallery and tweak header

i think that the pictures are just placeholders now. i will try to improve this 'gallery' a bit later. also, header is now fixed with transparent background.
author: la-ninpre <leobrekalini@gmail.com> 2021-02-23 01:46:02 +0300
committer: la-ninpre <leobrekalini@gmail.com> 2021-02-23 01:46:02 +0300
commit: 25843593a10da466a1e769b8fdf17284e24d37e6 (patch)
tree: a25718dc72ff3dbabfc699a792b02e29c645f83a
parent: 2b8adf6d9f919755b18813ceea37b80d6fabc062 (diff)
download: aaoth.xyz-25843593a10da466a1e769b8fdf17284e24d37e6.tar.gz
aaoth.xyz-25843593a10da466a1e769b8fdf17284e24d37e6.zip
11 files changed, 69 insertions, 20 deletions
diff --git a/_config.yml b/_config.yml
index 5f59e82..6cb69dd 100644
--- a/_config.yml
+++ b/_config.yml
@@ -11,13 +11,22 @@ exclude:
 excerpt_separator: <!--more-->
 
 defaults:
-  -
-    scope:
+  - scope:
       path: ""
     values:
       layout: "default"
-  -
-    scope:
+
+  - scope:
       path: "_posts"
     values:
       layout: "post"
+
+  - scope:
+      path: "assets/img"
+    values:
+      image: true
+
+  - scope:
+      path: "assets/img/art"
+    values:
+      art: true
diff --git a/_includes/navigation.html b/_includes/navigation.html
index 349ddc3..0069ec8 100644
--- a/_includes/navigation.html
+++ b/_includes/navigation.html
@@ -4,5 +4,5 @@
 		<li><a href="{{ item.link }}" {% if page.url == item.link %}class="current"{% endif %}>{{ item.name }}</a></li>
 		{% endfor %}
 	</ul>
-	<img src="/assets/img/aaoth-logo.png" alt="aaoth" width="378px" height="102px">
+	<img src="/assets/img/aaoth-logo.png" alt="aaoth" width="376px" height="auto">
 </nav>
diff --git a/_layouts/default.html b/_layouts/default.html
index 0f35f14..b146090 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -11,9 +11,9 @@
 	</head>
 	<body>
 		{% include navigation.html %}
-
+        <div class="content">
 		{{ content }}
-
+        </div>
 		{% include footer.html %}
 	</body>
 </html>
diff --git a/_sass/main.scss b/_sass/main.scss
index 656eb13..9182e59 100644
--- a/_sass/main.scss
+++ b/_sass/main.scss
@@ -9,6 +9,7 @@ $color-darker-grey: #101010;
 $color-link-idle: #707070;
 $color-link-hover: #999999;
 $color-nav-current: #333333;
+$nav-alpha: 0.95;
 $border-main: 5px solid;
 $border-nav: $border-main $color-main-grey;
 $border-dark: $border-main $color-dark-grey;
@@ -23,7 +24,7 @@ html {
 body {
     max-width: 835px;
     min-width: 378px;
-    margin: 20px auto 0 auto;
+    margin: 0 auto;
     padding: 8px;
     color: $color-dark-bg;
     font: 100% $body-font;
@@ -39,12 +40,23 @@ a:hover {
 .current {
     color: $color-nav-current;
     pointer-events: none;
+    font-weight: 500;
 }
 
 nav {
     display: flex;
+    position: fixed;
+    top: 0;
+    width: 100%;
+    max-width: 843px;
+    height: 102px;
     font: 400 1.5em $font-title;
     letter-spacing: -1.2px;
+    background: rgba($color-main-bg, $nav-alpha);
+    
+    img {
+        margin-right: 8px;
+    }
 
     ul {
         display: inline-flex;
@@ -72,8 +84,11 @@ ul {
     }
 }
 
+.content {
+    margin-top: 95px;
+}
+
 .about {
-    padding: 1em 0;
     display: flex;
     flex-direction: row;
     img#avatar {
@@ -122,9 +137,12 @@ ul {
 }
 
 .post-page {
+    margin-bottom: 10px;
     .post-header {
+        height: 4em;
         ul {
             display: flex;
+            float: right;
             flex-direction: row;
             li {
                 margin-right: 0.5em;
@@ -138,7 +156,20 @@ ul {
     }
 
     ul {
-        padding-left: 20px;
+        padding-left: 10px;
+    }
+}
+
+.art {
+    display: flex;
+    flex-flow: row wrap;
+
+    .art-img {
+        img {
+            width: 100%;
+            height: auto;
+            image-orientation: from-image;
+        }
     }
 }
 
@@ -186,18 +217,15 @@ footer {
 }
 
 @media only screen and (max-width: 760px) {
-    body p {
-        padding-top: 1em;
-    }
     footer p {
         padding: 0;
     }
     nav {
         margin-bottom: 5vh;
+        height: 130px;
         ul {
             width: 100%;
-            padding: 0;
-            padding-top: 30px;
+            padding-top: 48px;
             position: relative;
             top: 5vh;
         }
@@ -206,6 +234,9 @@ footer {
             top: 0;
         }
     }
+    .content {
+        margin-top: 140px;
+    }
     .about {
         flex-direction: column-reverse;
         .about-sidebar {
@@ -243,6 +274,7 @@ footer {
         color: $color-main-bg;
     }
     nav {
+        background: rgba($color-dark-bg, $nav-alpha);
         ul {
             border-bottom: $border-dark;
         }
diff --git a/art.md b/art.md
index 6f24a8e..a541b2b 100644
--- a/art.md
+++ b/art.md
@@ -3,4 +3,16 @@ title: art
 permalink: /art/
 ---
 
-here i'll show some graphical stuff
+{% assign image_files = site.static_files | where: "art", true %}
+
+here are some photos and pictures.
+
+feel free to use them if and as you wish (don't forget to attribute).
+
+<div class="art">
+{% for img in image_files %}
+    <div class="art-img">
+        <img src="{{ img.path }}" alt="{{ img.name }}">
+    </div>
+{% endfor %}
+</div>
diff --git a/assets/img/art/20180219_164315-01.jpeg b/assets/img/art/20180219_164315-01.jpeg
new file mode 100644
index 0000000..f2c7889
--- /dev/null
+++ b/assets/img/art/20180219_164315-01.jpeg
diff --git a/assets/img/art/20180422_170414.jpg b/assets/img/art/20180422_170414.jpg
new file mode 100644
index 0000000..4b03ae5
--- /dev/null
+++ b/assets/img/art/20180422_170414.jpg
diff --git a/assets/img/art/20180513_173750-1.jpg b/assets/img/art/20180513_173750-1.jpg
new file mode 100644
index 0000000..56845c7
--- /dev/null
+++ b/assets/img/art/20180513_173750-1.jpg
diff --git a/assets/img/art/20180708_165013.jpg b/assets/img/art/20180708_165013.jpg
new file mode 100644
index 0000000..35b3175
--- /dev/null
+++ b/assets/img/art/20180708_165013.jpg
diff --git a/assets/img/art/20180824_182003.jpg b/assets/img/art/20180824_182003.jpg
new file mode 100644
index 0000000..d439f6f
--- /dev/null
+++ b/assets/img/art/20180824_182003.jpg
diff --git a/blog.md b/blog.md
index 90cac9c..486b88d 100644
--- a/blog.md
+++ b/blog.md
@@ -3,10 +3,6 @@ title: blog
 permalink: /blog/
 ---
 
-# miscellaneous posts
-
-about different things
-
 filter by tag: {% for tag in site.tags %}[{{ tag[0] }}](/tags/{{ tag[0] }})
 {% endfor %}
author	la-ninpre <leobrekalini@gmail.com>	2021-02-23 01:46:02 +0300
committer	la-ninpre <leobrekalini@gmail.com>	2021-02-23 01:46:02 +0300
commit	25843593a10da466a1e769b8fdf17284e24d37e6 (patch)
tree	a25718dc72ff3dbabfc699a792b02e29c645f83a
parent	2b8adf6d9f919755b18813ceea37b80d6fabc062 (diff)
download	aaoth.xyz-25843593a10da466a1e769b8fdf17284e24d37e6.tar.gz aaoth.xyz-25843593a10da466a1e769b8fdf17284e24d37e6.zip