From dadcbf3277e3ae6cdc4215bb4ae1e009aeee6a3c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ferit=20Yi=C4=9Fit=20BALABAN?= <fyb@duck.com>
Date: Tue, 26 Jul 2022 01:36:40 +0300
Subject: [PATCH] Stylize galeri.html

---
 resources/css/main.scss         | 34 ++++++++++++++++++++++++---------
 resources/css/views/galeri.scss | 33 ++++++++++++++++++++++++++++++++
 2 files changed, 58 insertions(+), 9 deletions(-)
 create mode 100644 resources/css/views/galeri.scss

diff --git a/resources/css/main.scss b/resources/css/main.scss
index d4f5761..2122c56 100644
--- a/resources/css/main.scss
+++ b/resources/css/main.scss
@@ -5,6 +5,7 @@
 @use "views/iletisim.scss";
 @use "views/hakkimizda.scss";
 @use "views/kamera.scss";
+@use "views/galeri.scss";
 @use "partials/header.scss";
 @use "partials/footer.scss";
 @use "sass:math";
@@ -19,6 +20,19 @@ html, body {
   font-family: sans-serif;
 }
 
+a {
+  text-decoration: none;
+  color: variables.$clr_nav_sleep;
+
+  &:hover {
+    color: variables.$clr_nav_active;
+  }
+
+  &:active {
+    font-style: italic;
+  }
+}
+
 .content-spacing {
   padding: math.div(variables.$px_horizontalPadding, 2) variables.$px_horizontalPadding;
 
@@ -271,16 +285,18 @@ html, body {
     filter: invert(100%);
   }
 
-  &:hover {
-    width: $px_scroll-to-top_size + 10;
-    height: $px_scroll-to-top_size + 10;
-    right: 20px;
-    bottom: 50px;
-    transition: 250ms cubic-bezier(0.51, 1.27, 0.18, 0.96);
-
-    img {
-      transform: translateY(-5px);
+  @media (hover: hover) and (pointer: fine) {
+    &:hover {
+      width: $px_scroll-to-top_size + 10;
+      height: $px_scroll-to-top_size + 10;
+      right: 20px;
+      bottom: 50px;
       transition: 250ms cubic-bezier(0.51, 1.27, 0.18, 0.96);
+
+      img {
+        transform: translateY(-5px);
+        transition: 250ms cubic-bezier(0.51, 1.27, 0.18, 0.96);
+      }
     }
   }
 }
diff --git a/resources/css/views/galeri.scss b/resources/css/views/galeri.scss
new file mode 100644
index 0000000..6d523c9
--- /dev/null
+++ b/resources/css/views/galeri.scss
@@ -0,0 +1,33 @@
+#fullscreen {
+  display: none;
+  align-items: center;
+  justify-content: center;
+  width: 99vw;
+  height: 100vh;
+
+  #fullscreen-img {
+    max-width: 100%;
+    max-height: 100vh;
+    object-fit: cover;
+    cursor: pointer;
+  }
+}
+
+.gallery {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
+
+  .photo {
+    margin: 1vh 1vw;
+    width: 25%;
+    height: 25%;
+    cursor: pointer;
+
+    &:hover {
+      filter: brightness(1.3);
+    }
+  }
+}
\ No newline at end of file