From f0e80bac7b48e3efb6638e990d3d26ef8fce20a5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ferit=20Yi=C4=9Fit=20BALABAN?= Date: Wed, 27 Jul 2022 17:50:38 +0300 Subject: [PATCH] Update dev server --- resources/styles/main.css | 50 +++++++++++++++++++++++++++++++++++---- 1 file changed, 45 insertions(+), 5 deletions(-) diff --git a/resources/styles/main.css b/resources/styles/main.css index 721a29e..2fbc836 100644 --- a/resources/styles/main.css +++ b/resources/styles/main.css @@ -524,12 +524,26 @@ h1 { } } +@keyframes fullscreen-image-appear { + from { + opacity: 0; + width: 0; + height: 0; + } + to { + width: 100%; + height: 100vh; + } +} #fullscreen { + margin: 0; + padding: 0; display: none; align-items: center; justify-content: center; - width: 99vw; + width: 100%; height: 100vh; + background: black; } #fullscreen #fullscreen-img { max-width: 100%; @@ -538,21 +552,47 @@ h1 { cursor: pointer; } +.gallery-text { + overflow: auto; + background: linear-gradient(to left, #1d60b5, #3b8fff); +} +.gallery-text h1 { + margin: 2.5vh 0; + text-align: center; + font: 600 2.5vw "Montserrat", sans-serif; + color: white; +} + .gallery { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; + overflow: hidden; } -.gallery .photo { +.gallery .photo-container { margin: 1vh 1vw; width: 25%; height: 25%; - cursor: pointer; + overflow: hidden; } -.gallery .photo:hover { - filter: brightness(1.3); +.gallery .photo-container .photo { + width: 100%; + height: 100%; + cursor: pointer; + transition: 750ms all ease-in-out; + filter: brightness(80%); +} +.gallery .photo-container .photo:hover { + filter: brightness(100%); + transform: scale(1.3); +} +@media (hover: hover) and (pointer: fine) { + .gallery .photo-container .photo:active { + filter: brightness(100%); + transform: scale(1.3); + } } #header {