Ha-ha
75
gallery/index.html
Executable file
@ -0,0 +1,75 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Gallery</title>
|
||||
<link rel="stylesheet" href="main.css">
|
||||
<link rel='shortcut icon' type='image/x-icon' href='../fave.ico' />
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<a href="../index.html" id="logo"><img src="../logo.svg" alt="Logotype"></a>
|
||||
<<<<<<< HEAD
|
||||
<button class="nav-toggle" title="Open menu">
|
||||
=======
|
||||
<button class="nav-toggle">
|
||||
>>>>>>> c27a4029688d84a604259109737c953b92088855
|
||||
<span class="bar-top"></span>
|
||||
<span class="bar-mid"></span>
|
||||
<span class="bar-bot"></span>
|
||||
</button>
|
||||
<ul>
|
||||
<li><a href="../index.html">Home</a></li>
|
||||
<li><a href="#">Gallery</a></li>
|
||||
<li id="galactikka"><a href="https://galactikka.com/146568">Galactikka</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<header>
|
||||
<h1>Gallery</h1>
|
||||
</header>
|
||||
<main>
|
||||
<img src="pic/2.jpg" alt="">
|
||||
<img src="pic/1.jpg" alt="">
|
||||
<img src="pic/3.jpeg" alt="">
|
||||
<img src="pic/4.jpeg" alt="">
|
||||
<img src="pic/5.jpg" alt="">
|
||||
<img src="pic/6.jpeg" alt="">
|
||||
<img src="pic/7.jpg" alt="">
|
||||
<img src="pic/8.jpeg" alt="">
|
||||
<img src="pic/9.jpg" alt="">
|
||||
<img src="pic/10.jpg" alt="">
|
||||
<img src="pic/11.jpg" alt="">
|
||||
<img src="pic/12.jpg" alt="">
|
||||
<img src="pic/13.jpg" alt="">
|
||||
<img src="pic/15.jpg" alt="">
|
||||
<img src="pic/14.jpeg" alt="">
|
||||
<img src="pic/16.jpeg" alt="">
|
||||
<img src="pic/17.jpg" alt="">
|
||||
<img src="pic/18.jpg" alt="">
|
||||
</main>
|
||||
<footer>
|
||||
<address>
|
||||
<a href="https://www.google.ru/maps/place/Ulitsa+3+Mikrorayon,+7,+Beloyarsky,+Khanty-Mansiyskiy+avtonomnyy+okrug,+628176/@63.7204133,66.6610309,17z/data=!3m1!4b1!4m5!3m4!1s0x43823c79180321a3:0x7c339f5ac5e57cca!8m2!3d63.7204133!4d66.6632196"><span id="address"><span id="street">Ulitsa 3 Mikrorayon</span>, <span id="house">7</span>, <span id="town">Beloyarsky</span>, <span id="area">Khanty-Mansiysk Autonomous Region</span>, <span id="country">Russia</span> </span></a>
|
||||
<a href="tel:+79044825152" id="phone">+7 904 482 51 52</a>
|
||||
<a href="tel:+375299817785" id="phone">+375 299 81 77 85</a>
|
||||
<a href="mailto:airstudiog@gmail.com" id="email">airstudiog@gmail.com</a>
|
||||
</address>
|
||||
<ul id="social">
|
||||
<li><a href="https://vk.com/dm1tr1y147">VK</a></li>
|
||||
<li><span>Instagram:</span><ul>
|
||||
<li><a href="https://instagram.com/i.have.no.camera/">@i.have.no.camera</a></li>
|
||||
</ul></li>
|
||||
<li><a href="">Telegram</a></li>
|
||||
</ul>
|
||||
<<<<<<< HEAD
|
||||
<a href="#top" id="totop" title="Go to top"><i></i></a>
|
||||
=======
|
||||
<a href="#top" id="totop"><i></i></a>
|
||||
>>>>>>> c27a4029688d84a604259109737c953b92088855
|
||||
</footer>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="../main.js"></script>
|
||||
</body>
|
||||
</html>
|
319
gallery/main.css
Executable file
@ -0,0 +1,319 @@
|
||||
@import url('https://fonts.googleapis.com/css?family=Wire+One|Assistant:300,400|Raleway');
|
||||
@-webkit-keyframes showen {
|
||||
from {
|
||||
opacity: 0;
|
||||
--webkit-backdrop-filter: blur(0);
|
||||
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
--webkit-backdrop-filter: blur(2em);
|
||||
}
|
||||
}
|
||||
@keyframes showen {
|
||||
from {
|
||||
opacity: 0;
|
||||
backdrop-filter: blur(0);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
backdrop-filter: blur(2em);
|
||||
}
|
||||
}
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: #282627;
|
||||
box-sizing: border-box;
|
||||
-ms-overflow-style: none;
|
||||
overflow: -moz-scrollbars-none;
|
||||
-moz-appearance: menuimage;
|
||||
font-style: normal;
|
||||
}
|
||||
*::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
width: 100vw;
|
||||
overflow-x: hidden;
|
||||
scroll-behavior: smooth;
|
||||
|
||||
}
|
||||
a,p,span {
|
||||
font-size: 3vh;
|
||||
font-family: 'Assistant', sans-serif;
|
||||
font-weight: 300;
|
||||
text-decoration: none;
|
||||
}
|
||||
li {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
nav {
|
||||
height: 10vh;
|
||||
width: 100vw;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
padding: 2vh 7.5vh;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
<<<<<<< HEAD
|
||||
transition: box-shadow 0.5s ease-in-out;
|
||||
}
|
||||
nav#shadow {
|
||||
box-shadow: 0 1px 6px 0 rgba(32,33,36,0.28);
|
||||
=======
|
||||
>>>>>>> c27a4029688d84a604259109737c953b92088855
|
||||
}
|
||||
#logo {
|
||||
display: block;
|
||||
height: 6vh;
|
||||
}
|
||||
#logo img {
|
||||
height: 6vh;
|
||||
}
|
||||
.nav-toggle {
|
||||
display: none;
|
||||
}
|
||||
nav ul {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
right: 7.5vh;
|
||||
transition: all .7s ease-in-out;
|
||||
}
|
||||
nav ul li {
|
||||
display: block;
|
||||
}
|
||||
nav li a {
|
||||
padding: 0 2vh;
|
||||
display: block;
|
||||
line-height: 6vh;
|
||||
vertical-align: center;
|
||||
}
|
||||
#galactikka {
|
||||
background-image: url(../galactikka.jpg);
|
||||
border-radius: 200em;
|
||||
background-size: cover;
|
||||
}
|
||||
#galactikka a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
main {
|
||||
min-height: 100vh;
|
||||
padding: 10vh 10vw;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-gap: 3vh;
|
||||
align-items: end;
|
||||
}
|
||||
header {
|
||||
display: flex;
|
||||
width: 100vw;
|
||||
padding: 10vh;
|
||||
justify-content: center;
|
||||
}
|
||||
header h1 {
|
||||
font-size: 15vh;
|
||||
font-family: 'Wire One', sans-serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
main img {
|
||||
width: 100%;
|
||||
transition: all 1s ease;
|
||||
}
|
||||
main img:hover {
|
||||
-webkit-filter: contrast(75%) brightness(120%);
|
||||
filter: contrast(75%) brightness(120%);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
<<<<<<< HEAD
|
||||
#popup, #popupBg {
|
||||
=======
|
||||
#popup, #popup_bg {
|
||||
>>>>>>> c27a4029688d84a604259109737c953b92088855
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
#popup {
|
||||
z-index: 1001;
|
||||
display: none;
|
||||
}
|
||||
<<<<<<< HEAD
|
||||
#popupBg {
|
||||
z-index: 1005;
|
||||
background-color: #fff;
|
||||
}
|
||||
#popupImg {
|
||||
=======
|
||||
#popup_bg {
|
||||
z-index: 1005;
|
||||
background-color: #fff;
|
||||
}
|
||||
#popup_img {
|
||||
>>>>>>> c27a4029688d84a604259109737c953b92088855
|
||||
max-width: 100vw;
|
||||
max-height: 100vh;
|
||||
z-index: 1006;
|
||||
}
|
||||
|
||||
|
||||
footer {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
padding: 10vh;
|
||||
background-color: #f8f8f8;
|
||||
<<<<<<< HEAD
|
||||
box-shadow: inset 0 3px 6px -2px rgba(32,33,36,0.28);
|
||||
=======
|
||||
>>>>>>> c27a4029688d84a604259109737c953b92088855
|
||||
}
|
||||
address, #social {
|
||||
display: grid;
|
||||
}
|
||||
li li {
|
||||
padding-left: 2vh;
|
||||
}
|
||||
#social a {
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
}
|
||||
#totop {
|
||||
position: absolute;
|
||||
bottom: 10vh;
|
||||
right: 10vh;
|
||||
}
|
||||
#totop i {
|
||||
border: solid #282627;
|
||||
border-width: 0 .7vh .7vh 0;
|
||||
display: inline-block;
|
||||
padding: 1.5vh;
|
||||
transform: rotate(-135deg);
|
||||
-webkit-transform: rotate(-135deg);
|
||||
}
|
||||
|
||||
@media screen and (max-device-aspect-ratio: 3/4) {
|
||||
.overflowhidden {
|
||||
overflow: hidden;
|
||||
}
|
||||
nav {
|
||||
padding: 2vh 5vh;
|
||||
}
|
||||
.nav-toggle {
|
||||
display: block;
|
||||
position: absolute;
|
||||
background: transparent;
|
||||
border: transparent;
|
||||
right: 5vh;
|
||||
height: 2.7vh;
|
||||
top: calc(50% - 1.35vh);
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.nav-toggle:focus {
|
||||
outline-width: 0;
|
||||
}
|
||||
|
||||
.nav-toggle [class*='bar-'] {
|
||||
background: #282627;
|
||||
display: block;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
-webkit-transition: .2s ease all;
|
||||
transition: .2s ease all;
|
||||
border-radius: 200em;
|
||||
height: .5vh;
|
||||
width: 4vh;
|
||||
margin-bottom: .6vh;
|
||||
}
|
||||
|
||||
.nav-toggle .bar-bot {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.opened .bar-top {
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
-webkit-transform-origin: 15% 15%;
|
||||
transform-origin: 5% 20%;
|
||||
}
|
||||
.opened .bar-mid {
|
||||
opacity: 0;
|
||||
}
|
||||
.opened .bar-bot {
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(-45deg);
|
||||
-webkit-transform-origin: 15% 95%;
|
||||
transform-origin: 15% 100%;
|
||||
}
|
||||
nav ul {
|
||||
width: 100vw;
|
||||
overflow: hidden;
|
||||
right: 0;
|
||||
top: 0;
|
||||
height: 100vh;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 1;
|
||||
display: none;
|
||||
}
|
||||
nav ul li {
|
||||
padding: 1vh;
|
||||
margin: 1vh;
|
||||
min-width: 50vw;
|
||||
}
|
||||
nav ul li a {
|
||||
width: inherit;
|
||||
text-align: justify;
|
||||
font-size: 5vh;
|
||||
}
|
||||
.showen {
|
||||
display: flex;
|
||||
background-color: rgba(255, 255, 255, .9);
|
||||
}
|
||||
|
||||
main {
|
||||
grid-template-columns: 1fr;
|
||||
padding: 10vh 0;
|
||||
}
|
||||
|
||||
footer {
|
||||
grid-template-columns: 1fr;
|
||||
height: 100vh;
|
||||
align-content: center;
|
||||
grid-gap: 5vh;
|
||||
padding: 7vh;
|
||||
padding-top: 3.5vh;
|
||||
}
|
||||
#totop {
|
||||
right: calc(50% - 1.5vh);
|
||||
bottom: 7vh;
|
||||
}
|
||||
}
|
||||
|
||||
@supports ((-webkit-backdrop-filter: blur(2em)) or (backdrop-filter: blur(2em))) {
|
||||
.showen {
|
||||
background-color: unset;
|
||||
-webkit-backdrop-filter: blur(2em);
|
||||
backdrop-filter: blur(2em);
|
||||
-webkit-animation: showen 1s;
|
||||
animation: showen 1s;
|
||||
}
|
||||
<<<<<<< HEAD
|
||||
}
|
||||
=======
|
||||
}
|
||||
>>>>>>> c27a4029688d84a604259109737c953b92088855
|
BIN
gallery/pic/1.jpg
Executable file
After Width: | Height: | Size: 61 KiB |
BIN
gallery/pic/10.jpg
Executable file
After Width: | Height: | Size: 108 KiB |
BIN
gallery/pic/10b.jpg
Executable file
After Width: | Height: | Size: 1.7 MiB |
BIN
gallery/pic/11.jpg
Executable file
After Width: | Height: | Size: 53 KiB |
BIN
gallery/pic/11b.jpg
Executable file
After Width: | Height: | Size: 820 KiB |
BIN
gallery/pic/12.jpg
Executable file
After Width: | Height: | Size: 120 KiB |
BIN
gallery/pic/12b.jpg
Executable file
After Width: | Height: | Size: 1.0 MiB |
BIN
gallery/pic/13.jpg
Executable file
After Width: | Height: | Size: 312 KiB |
BIN
gallery/pic/13b.jpg
Executable file
After Width: | Height: | Size: 1.2 MiB |
BIN
gallery/pic/14.jpeg
Executable file
After Width: | Height: | Size: 38 KiB |
BIN
gallery/pic/14b.jpeg
Executable file
After Width: | Height: | Size: 769 KiB |
BIN
gallery/pic/15.jpg
Executable file
After Width: | Height: | Size: 49 KiB |
BIN
gallery/pic/15b.jpg
Executable file
After Width: | Height: | Size: 895 KiB |
BIN
gallery/pic/16.jpeg
Executable file
After Width: | Height: | Size: 60 KiB |
BIN
gallery/pic/16b.jpeg
Executable file
After Width: | Height: | Size: 1.0 MiB |
BIN
gallery/pic/17.jpg
Executable file
After Width: | Height: | Size: 77 KiB |
BIN
gallery/pic/17b.jpg
Executable file
After Width: | Height: | Size: 1.1 MiB |
BIN
gallery/pic/18.jpg
Executable file
After Width: | Height: | Size: 174 KiB |
BIN
gallery/pic/18b.jpg
Executable file
After Width: | Height: | Size: 991 KiB |
BIN
gallery/pic/1b.jpg
Executable file
After Width: | Height: | Size: 1.0 MiB |
BIN
gallery/pic/2.jpg
Executable file
After Width: | Height: | Size: 203 KiB |
BIN
gallery/pic/2b.jpg
Executable file
After Width: | Height: | Size: 1.3 MiB |
BIN
gallery/pic/3.jpeg
Executable file
After Width: | Height: | Size: 16 KiB |
BIN
gallery/pic/3b.jpeg
Executable file
After Width: | Height: | Size: 184 KiB |
BIN
gallery/pic/4.jpeg
Executable file
After Width: | Height: | Size: 44 KiB |
BIN
gallery/pic/4b.jpeg
Executable file
After Width: | Height: | Size: 506 KiB |
BIN
gallery/pic/5.jpg
Executable file
After Width: | Height: | Size: 138 KiB |
BIN
gallery/pic/5b.jpg
Executable file
After Width: | Height: | Size: 2.0 MiB |
BIN
gallery/pic/6.jpeg
Executable file
After Width: | Height: | Size: 117 KiB |
BIN
gallery/pic/6b.jpeg
Executable file
After Width: | Height: | Size: 1.0 MiB |
BIN
gallery/pic/7.jpg
Executable file
After Width: | Height: | Size: 134 KiB |
BIN
gallery/pic/7b.jpg
Executable file
After Width: | Height: | Size: 2.1 MiB |
BIN
gallery/pic/8.jpeg
Executable file
After Width: | Height: | Size: 46 KiB |
BIN
gallery/pic/8b.jpeg
Executable file
After Width: | Height: | Size: 667 KiB |
BIN
gallery/pic/9.jpg
Executable file
After Width: | Height: | Size: 52 KiB |
BIN
gallery/pic/9b.jpg
Executable file
After Width: | Height: | Size: 591 KiB |