Add /photography/ page
Xevion
@@ -36,10 +36,16 @@ layout: compress
|
||||
<meta name="twitter:card" content="summary">
|
||||
{%- endif -%}
|
||||
{%- endif %}
|
||||
<!-- Hide site using inline styling until CSS loads -->
|
||||
<style>
|
||||
html, body {
|
||||
visibility: hidden;
|
||||
}
|
||||
{% if page.wide or layout.wide %}
|
||||
body {
|
||||
max-width: 60em !important;
|
||||
}
|
||||
{% endif %}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -78,10 +84,20 @@ layout: compress
|
||||
</i>
|
||||
{% endif %}
|
||||
<article>
|
||||
|
||||
{{ content }}
|
||||
|
||||
</article>
|
||||
<p>
|
||||
{% if page.custom_js %}
|
||||
{% for file in page.custom_js %}
|
||||
<script type="text/javascript" src="{{ site.baseurl }}/assets/js/{{ file }}"></script>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% if layout.medium_zoom %}
|
||||
<script src="https://cdn.jsdelivr.net/npm/medium-zoom@1.0.6/dist/medium-zoom.min.js"
|
||||
integrity="sha256-EdPgYcPk/IIrw7FYeuJQexva49pVRZNmt3LculEr7zM=" crossorigin="anonymous"></script>
|
||||
<script type="text/javascript">
|
||||
mediumZoom('[data-zoomable]', {background: "#0e0e0e"})
|
||||
</script>
|
||||
{% endif %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
19
_layouts/photos.html
Normal file
@@ -0,0 +1,19 @@
|
||||
---
|
||||
layout: default
|
||||
medium_zoom: true
|
||||
wide: true
|
||||
---
|
||||
|
||||
{{ content }}
|
||||
|
||||
<div class="media-grid">
|
||||
{% for photo in page.photos %}
|
||||
<figure class="photo">
|
||||
<img
|
||||
data-zoomable
|
||||
loading="lazy"
|
||||
src="{{ site.baseurl }}/assets/img/{{ photo }}.jpg"
|
||||
alt="..."/>
|
||||
</figure>
|
||||
{% endfor %}
|
||||
</div>
|
||||
@@ -28,6 +28,8 @@ body {
|
||||
padding: 0 1em;
|
||||
font-family: CMU Serif, serif;
|
||||
line-height: 1.5;
|
||||
background: #0e0e0e;
|
||||
color: white;
|
||||
}
|
||||
|
||||
p, table {
|
||||
@@ -118,7 +120,7 @@ pre code {
|
||||
}
|
||||
|
||||
a, hr {
|
||||
color: black;
|
||||
color: white;
|
||||
}
|
||||
|
||||
hr {
|
||||
@@ -182,7 +184,7 @@ nav {
|
||||
}
|
||||
|
||||
nav a {
|
||||
color: black;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.post_summary {
|
||||
@@ -231,6 +233,7 @@ nav a {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// Show site with proper CSS styling
|
||||
html, body {
|
||||
visibility: visible !important;
|
||||
}
|
||||
26
_sass/photos.scss
Normal file
@@ -0,0 +1,26 @@
|
||||
.media-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));
|
||||
grid-column-gap: 20px;
|
||||
grid-row-gap: 60px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.photo {
|
||||
position: relative;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.photo img {
|
||||
display:block;
|
||||
width:100%;
|
||||
height:auto;
|
||||
border-radius:12px
|
||||
}
|
||||
|
||||
//.photo img[data-zoomable]:hover {
|
||||
// transition:transform 60ms linear;
|
||||
// transform:scale(1.01);
|
||||
// box-shadow:0 6px 12px rgba(0,0,0,.14)
|
||||
//}
|
||||
BIN
assets/img/photography/1.jpg
Normal file
|
After Width: | Height: | Size: 13 MiB |
BIN
assets/img/photography/10.jpg
Normal file
|
After Width: | Height: | Size: 15 MiB |
BIN
assets/img/photography/11.jpg
Normal file
|
After Width: | Height: | Size: 12 MiB |
BIN
assets/img/photography/12.jpg
Normal file
|
After Width: | Height: | Size: 6.8 MiB |
BIN
assets/img/photography/13.jpg
Normal file
|
After Width: | Height: | Size: 12 MiB |
BIN
assets/img/photography/14.jpg
Normal file
|
After Width: | Height: | Size: 16 MiB |
BIN
assets/img/photography/15.jpg
Normal file
|
After Width: | Height: | Size: 15 MiB |
BIN
assets/img/photography/2.jpg
Normal file
|
After Width: | Height: | Size: 12 MiB |
BIN
assets/img/photography/3.jpg
Normal file
|
After Width: | Height: | Size: 16 MiB |
BIN
assets/img/photography/4.jpg
Normal file
|
After Width: | Height: | Size: 18 MiB |
BIN
assets/img/photography/5.jpg
Normal file
|
After Width: | Height: | Size: 13 MiB |
BIN
assets/img/photography/6.jpg
Normal file
|
After Width: | Height: | Size: 24 MiB |
BIN
assets/img/photography/7.jpg
Normal file
|
After Width: | Height: | Size: 1.1 MiB |
BIN
assets/img/photography/8.jpg
Normal file
|
After Width: | Height: | Size: 5.7 MiB |
BIN
assets/img/photography/9.jpg
Normal file
|
After Width: | Height: | Size: 1.4 MiB |
@@ -3,3 +3,4 @@
|
||||
|
||||
@import "main";
|
||||
@import "fonts";
|
||||
@import "photos";
|
||||
28
photography.md
Normal file
@@ -0,0 +1,28 @@
|
||||
---
|
||||
layout: photos
|
||||
title: Photography
|
||||
permalink: /photography/
|
||||
photos:
|
||||
- photography/1
|
||||
- photography/2
|
||||
- photography/3
|
||||
- photography/4
|
||||
- photography/5
|
||||
- photography/6
|
||||
- photography/7
|
||||
- photography/9
|
||||
- photography/8
|
||||
- photography/10
|
||||
- photography/11
|
||||
- photography/12
|
||||
- photography/13
|
||||
- photography/14
|
||||
- photography/15
|
||||
---
|
||||
From a young age I accepted that I was a technically inclined person and art was not in my blood...
|
||||
Pens, pencils and paints all failed to reflect my vision for art, and I became disinterested in dedicating myself further to it.
|
||||
|
||||
From then on art was a world I was not privy to - this all changed when I picked up <abbr title="a Nikon D3300, also my first camera">my sister's camera</abbr>.
|
||||
|
||||
Since then, I've slowly been dedicating myself more and more to photography as a way of artistic expression and out of technical curiosity.
|
||||
|
||||