Merge branch 'image-click-zoom' into 'master'

Image click zoom

See merge request Syndamia/syndamiadotcom!2

1 files changed, 21 insertions, 6 deletions

diff --git a/src/styles.css b/src/styles.css
index c322f77..7024177 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -58,7 +58,7 @@ img {
   image-rendering: crisp-edges;
 }
 
-img:hover {
+.pixelated-render {
   image-rendering: pixelated;
 }
 
@@ -162,10 +162,6 @@ h2 + p img, h3 + p img, h4 + p img, h5 + p img, h6 + p img {
 }
 
 @media screen and (min-width: 610px) {
-  #index-page {
-    margin-bottom: 10px;
-  }
-
   #index-contents {
     display: flex;
     align-items: center;
@@ -245,7 +241,7 @@ article > table td:first-child {
   width: 60%;
 }
 
-article > table td:nth-child(2) {
+article > table td:nth-child(n+2) {
   line-height: 1.1em;
   padding: 0.3em;
   padding-top: 0.2em;
@@ -364,6 +360,25 @@ code span {
   color: #afaf00;
 }
 
+/* Script specific styling */
+
+.clicked-image {
+  position: absolute;
+  width: 100vw;
+  height: 100vh;
+  max-width: none !important;
+  max-height: none !important;
+  border: none;
+  object-fit: contain;
+  left: 0;
+  top: 0;
+  padding: 1em;
+}
+
+.body-on-clicked-image {
+  overflow: hidden;
+}
+
 /* OpenSans font */
 
 @font-face {