Initial commit
This commit is contained in:
Dm1tr1y147
commit
91bf9e3183
24
arrow.svg
Normal file
24
arrow.svg
Normal file
@ -0,0 +1,24 @@
|
||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 612.004 612.004" style="enable-background:new 0 0 612.004 612.004;" xml:space="preserve" width="32px" height="32px">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M499.147,160.094L330.222,329.019c-6.472,6.472-15.075,10.035-24.223,10.035c-9.146,0-17.749-3.561-24.218-10.035 L112.854,160.094c-25.822-25.817-67.674-25.817-93.491,0c-25.817,25.819-25.817,67.674,0,93.491L188.29,422.508 c31.443,31.445,73.245,48.764,117.712,48.764s86.269-17.319,117.714-48.761l168.925-168.925c25.817-25.817,25.817-67.674,0-93.491 C566.822,134.277,524.962,134.277,499.147,160.094z" fill="#415a6b" />
|
||||
</g>
|
||||
</g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 994 B |
25
circle.svg
Normal file
25
circle.svg
Normal file
@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="32px" height="32px" viewBox="0 0 453.689 453.689" style="enable-background:new 0 0 453.689 453.689;" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M231.245,16.365c-9.744,0-19.646,0.582-29.551,1.737c-4.649,0.592-9.272,1.285-13.729,2.049 c-2.869,0.442-5.512,1.29-7.894,2.511c-93.32,12.423-164.763,82.37-178.08,174.695C-14.323,310.471,71.365,417.058,193,434.952 c10.694,1.574,21.703,2.372,32.717,2.372c0.005,0,0,0,0.01,0c111.657,0,208.656-75.921,225.617-176.597 c9.78-58.016-11.34-121.679-57.93-174.67C353.899,41.115,296.299,16.365,231.245,16.365z M244.331,68.285 c43.407,3.062,81.091,21.048,112.071,53.506c36.444,38.182,52.704,91.861,42.432,140.084 c-13.065,61.383-77.612,123.521-175.675,123.521c-11.382,0-22.589-0.99-33.299-2.96c-90.146-16.539-151.098-99.701-135.874-185.4 c13.062-73.488,77.733-124.812,157.285-124.812c5.367,0,10.821,0.241,16.204,0.718C234.099,73.525,239.776,71.847,244.331,68.285z " fill="#415a6b" />
|
||||
</g>
|
||||
</g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
30
house.svg
Normal file
30
house.svg
Normal file
@ -0,0 +1,30 @@
|
||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve" width="512px" height="512px">
|
||||
<rect x="382.933" y="73.6" style="fill:#F05540;" width="58.667" height="102.4" />
|
||||
<rect x="360.533" y="21.333" style="fill:#F3705A;" width="103.467" height="55.467" />
|
||||
<path style="fill:#FFD15C;" d="M44.8,276.267V512h418.133V276.267c-82.133-82.133-128-128-209.067-209.067l0,0 C172.8,149.333,126.933,195.2,44.8,276.267z" />
|
||||
<path style="fill:#F7B64C;" d="M464,276.267c-82.133-82.133-128-128-209.067-209.067c-41.6,40.533-73.6,72.533-105.6,104.533 s-64,64-104.533,104.533v48c82.133-82.133,128-128,209.067-209.067c82.133,82.133,128,128,209.067,209.067v6.4l0,0v-54.4H464z" />
|
||||
<path style="fill:#415A6B;" d="M216.533,512H90.667V388.267c0-35.2,28.8-62.933,62.933-62.933l0,0c35.2,0,62.933,28.8,62.933,62.933 V512z" />
|
||||
<rect x="253.867" y="325.333" style="fill:#344A5E;" width="164.267" height="144" />
|
||||
<g>
|
||||
<rect x="270.933" y="342.4" style="fill:#8AD7F8;" width="56.533" height="109.867" />
|
||||
<rect x="344.533" y="342.4" style="fill:#8AD7F8;" width="56.533" height="109.867" />
|
||||
</g>
|
||||
<path style="fill:#F3705A;" d="M502.4,232.533L279.467,9.6c-12.8-12.8-35.2-12.8-48,0L9.6,232.533c-12.8,12.8-12.8,35.2,0,48 c12.8,12.8,35.2,12.8,48,0L256,82.133l198.4,198.4c12.8,12.8,35.2,12.8,48,0C515.2,266.667,515.2,245.333,502.4,232.533z" />
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
<g></g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
92
index.html
Normal file
92
index.html
Normal file
@ -0,0 +1,92 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Not free houses, be ready to buy!</title>
|
||||
<link href="https://fonts.googleapis.com/css?family=Concert+One|Lato" rel="stylesheet">
|
||||
<link rel="stylesheet" href="main.css">
|
||||
<link href="house.ico" rel="icon" type="image/x-icon" />
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li id="logo"><button><img src="house.svg"></button></li>
|
||||
<li><a href="#intro" class="link">Intro</a></li>
|
||||
<li><a href="#articles" class="link">Articles</a></li>
|
||||
<li><a href="#pricing" class="link">Pricing</a></li>
|
||||
<li><a href="#contacts" class="link">Contacts</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<header id="intro">
|
||||
<div><h1>Hello, do you wanna have your own flat?</h1>
|
||||
<h2>We know, you do. You're lucky, because here we can sell you the house of your dreams</h2></div>
|
||||
<a href="#articles" class="link"><img src="arrow.svg" alt="scroll down to see more"></a>
|
||||
</header>
|
||||
<main id="articles">
|
||||
<article>
|
||||
<h1>Are you ready?</h1>
|
||||
<p>Hello. Nice to see you here. Most likely, you live with your parents or rent a small flat in underbelly. It's time to change it. Have you ever dreamed to have your own large, spacious apartment in the center of your city? We can help you to realize your dream. Just look at our catalog and find your best place for living. We have the best price-quality ratio for every budget. After you chose, just call one of our operators and we will we will start processing of all documents.</p>
|
||||
</article>
|
||||
<article>
|
||||
<h1>New Year — New Discounts</h1>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
</article>
|
||||
<article>
|
||||
<h1>We have been opened</h1>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
</article>
|
||||
<article id="pricing">
|
||||
<ul>
|
||||
<li>
|
||||
<img src="triangle.svg" />
|
||||
<h2>Lite</h2>
|
||||
<h3>$30000</h3>
|
||||
<ul>
|
||||
<li>Little flat</li>
|
||||
<li>Necessary amenities</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<img src="square.svg" />
|
||||
<h2>Medium</h2>
|
||||
<h3>$500000</h3>
|
||||
<ul>
|
||||
<li>Nice houce</li>
|
||||
<li>Garage</li>
|
||||
<li>Little garden</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<img src="circle.svg" />
|
||||
<h2>Prime</h2>
|
||||
<h3>$1000000</h3>
|
||||
<ul>
|
||||
<li>Big cottage</li>
|
||||
<li>Two grounds</li>
|
||||
<li>Jacuzzi</li>
|
||||
<li>Two garages</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</article>
|
||||
</main>
|
||||
<footer id="contacts">
|
||||
<address><a href="https://www.google.ru/maps/place/Wyandotte,+MI+48192/@42.203647,-83.1901824,13z/data=!3m1!4b1!4m8!1m2!2m1!1s82+Oak+Meadow+Lane+Wyandotte,+MI+48192!3m4!1s0x883b30ca764d1d3d:0x2e0d7dd45fc6683b!8m2!3d42.204837!4d-83.15954">82 Oak Meadow Lane Wyandotte, MI 48192</a></address>
|
||||
<a href="tel:14686058205">+1 (468) 605-8205</a>
|
||||
<a href="mailto:meder@sbcglobal.net">meder@sbcglobal.net</a>
|
||||
</footer>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="main.js"></script>
|
||||
<!-- <script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script> -->
|
||||
</body>
|
||||
</html>
|
||||
225
main.css
Normal file
225
main.css
Normal file
@ -0,0 +1,225 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
color: #415a6b;
|
||||
font-family: 'Lato', sans-serif;
|
||||
font-size: 3vmin;
|
||||
transition: all .5s ease;
|
||||
}
|
||||
*::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
nav ul {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 4vh;
|
||||
position: fixed;
|
||||
top: 2vh;
|
||||
left: 2vh;
|
||||
height: 8vh;
|
||||
background-color: #8ad7f8;
|
||||
z-index: 1000;
|
||||
border-radius: 200em;
|
||||
max-width: calc(100vw - 4vh);
|
||||
}
|
||||
li {
|
||||
list-style-type: none;
|
||||
}
|
||||
nav li {
|
||||
padding: 2vh;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
button {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
#logo img {
|
||||
height: 6vh;
|
||||
}
|
||||
header {
|
||||
background-color: #8ad7f8;
|
||||
height: 100vh;
|
||||
padding-top: 10vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-size: auto 80vh;
|
||||
background-position: right 7.5vh bottom;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiPgo8cmVjdCB4PSIzODIuOTMzIiB5PSI3My42IiBzdHlsZT0iZmlsbDojRjA1NTQwOyIgd2lkdGg9IjU4LjY2NyIgaGVpZ2h0PSIxMDIuNCIvPgo8cmVjdCB4PSIzNjAuNTMzIiB5PSIyMS4zMzMiIHN0eWxlPSJmaWxsOiNGMzcwNUE7IiB3aWR0aD0iMTAzLjQ2NyIgaGVpZ2h0PSI1NS40NjciLz4KPHBhdGggc3R5bGU9ImZpbGw6I0ZGRDE1QzsiIGQ9Ik00NC44LDI3Ni4yNjdWNTEyaDQxOC4xMzNWMjc2LjI2N2MtODIuMTMzLTgyLjEzMy0xMjgtMTI4LTIwOS4wNjctMjA5LjA2N2wwLDAgIEMxNzIuOCwxNDkuMzMzLDEyNi45MzMsMTk1LjIsNDQuOCwyNzYuMjY3eiIvPgo8cGF0aCBzdHlsZT0iZmlsbDojRjdCNjRDOyIgZD0iTTQ2NCwyNzYuMjY3Yy04Mi4xMzMtODIuMTMzLTEyOC0xMjgtMjA5LjA2Ny0yMDkuMDY3Yy00MS42LDQwLjUzMy03My42LDcyLjUzMy0xMDUuNiwxMDQuNTMzICBzLTY0LDY0LTEwNC41MzMsMTA0LjUzM3Y0OGM4Mi4xMzMtODIuMTMzLDEyOC0xMjgsMjA5LjA2Ny0yMDkuMDY3YzgyLjEzMyw4Mi4xMzMsMTI4LDEyOCwyMDkuMDY3LDIwOS4wNjd2Ni40bDAsMHYtNTQuNEg0NjR6Ii8+CjxwYXRoIHN0eWxlPSJmaWxsOiM0MTVBNkI7IiBkPSJNMjE2LjUzMyw1MTJIOTAuNjY3VjM4OC4yNjdjMC0zNS4yLDI4LjgtNjIuOTMzLDYyLjkzMy02Mi45MzNsMCwwYzM1LjIsMCw2Mi45MzMsMjguOCw2Mi45MzMsNjIuOTMzICBWNTEyeiIvPgo8cmVjdCB4PSIyNTMuODY3IiB5PSIzMjUuMzMzIiBzdHlsZT0iZmlsbDojMzQ0QTVFOyIgd2lkdGg9IjE2NC4yNjciIGhlaWdodD0iMTQ0Ii8+CjxnPgoJPHJlY3QgeD0iMjcwLjkzMyIgeT0iMzQyLjQiIHN0eWxlPSJmaWxsOiM4QUQ3Rjg7IiB3aWR0aD0iNTYuNTMzIiBoZWlnaHQ9IjEwOS44NjciLz4KCTxyZWN0IHg9IjM0NC41MzMiIHk9IjM0Mi40IiBzdHlsZT0iZmlsbDojOEFEN0Y4OyIgd2lkdGg9IjU2LjUzMyIgaGVpZ2h0PSIxMDkuODY3Ii8+CjwvZz4KPHBhdGggc3R5bGU9ImZpbGw6I0YzNzA1QTsiIGQ9Ik01MDIuNCwyMzIuNTMzTDI3OS40NjcsOS42Yy0xMi44LTEyLjgtMzUuMi0xMi44LTQ4LDBMOS42LDIzMi41MzNjLTEyLjgsMTIuOC0xMi44LDM1LjIsMCw0OCAgYzEyLjgsMTIuOCwzNS4yLDEyLjgsNDgsMEwyNTYsODIuMTMzbDE5OC40LDE5OC40YzEyLjgsMTIuOCwzNS4yLDEyLjgsNDgsMEM1MTUuMiwyNjYuNjY3LDUxNS4yLDI0NS4zMzMsNTAyLjQsMjMyLjUzM3oiLz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPC9zdmc+Cg==)
|
||||
}
|
||||
header div {
|
||||
width: 75vw;
|
||||
padding: calc(13vw - 10vh) 18vw 13vw 6vw;
|
||||
}
|
||||
h1,h2 {
|
||||
font-family: 'Concert One', cursive;
|
||||
}
|
||||
header h1 {
|
||||
font-size: 10vmin;
|
||||
}
|
||||
header h2 {
|
||||
font-size: 6vmin;
|
||||
max-width: 40vw;
|
||||
}
|
||||
header img {
|
||||
position: absolute;
|
||||
top: 87.5vh;
|
||||
left: 46.25vw;
|
||||
height: 7.5vh;
|
||||
width: 7.5vw;
|
||||
}
|
||||
|
||||
main {
|
||||
background-color: #ffd15c;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-gap: 10vh;
|
||||
padding: 10vh;
|
||||
min-height: 100vh;
|
||||
align-items: end;
|
||||
}
|
||||
article h1 {
|
||||
font-size: 8vmin;
|
||||
margin-bottom: 5vh;
|
||||
}
|
||||
|
||||
#pricing {
|
||||
grid-column: 1 / span 3;
|
||||
margin-top: -10vh;
|
||||
padding-top: 10vh;
|
||||
min-height: 90vh;
|
||||
}
|
||||
#pricing > ul {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-gap: 10vh;
|
||||
}
|
||||
#pricing > ul > li {
|
||||
border-radius: 5vh;
|
||||
background-color: #f7b64c;
|
||||
min-height: 75vh;
|
||||
display: grid;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
max-width: 50vw;
|
||||
}
|
||||
#pricing h2, #pricing img, #pricing h3 {
|
||||
text-align: center;
|
||||
padding: 1vh;
|
||||
}
|
||||
#pricing h2 {
|
||||
font-size: 8vmin;
|
||||
}
|
||||
#pricing img {
|
||||
height: 10vh;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#pricing h3 {
|
||||
font-size: 5vmin;
|
||||
}
|
||||
#pricing ul ul {
|
||||
margin: 1vh;
|
||||
}
|
||||
#pricing ul ul li {
|
||||
list-style-type: circle;
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: #f3705a;
|
||||
padding: 10vh;
|
||||
display: grid;
|
||||
grid-gap: 1vh;
|
||||
grid-template-columns: auto auto auto;
|
||||
}
|
||||
footer * {
|
||||
color: #344a5e;
|
||||
}
|
||||
@media screen and (max-device-aspect-ratio: 8/5) {
|
||||
header img {
|
||||
left: 6vw;
|
||||
width: auto;
|
||||
}
|
||||
footer {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
#pricing > ul {
|
||||
grid-template-columns: 1fr;
|
||||
justify-items: center;
|
||||
}
|
||||
#pricing > ul > li {
|
||||
width: 50vw;
|
||||
}
|
||||
}
|
||||
@media screen and (max-device-aspect-ratio: 4/3) {
|
||||
header div {
|
||||
width: 100vw;
|
||||
padding-left: 5vh;
|
||||
padding-right: 5vh;
|
||||
}
|
||||
header h2 {
|
||||
max-width: 100%;
|
||||
}
|
||||
header img {
|
||||
left: 13vw;
|
||||
}
|
||||
main {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
#pricing {
|
||||
grid-column: 1 / span 1;
|
||||
}
|
||||
}
|
||||
@media screen and (orientation: portrait) {
|
||||
header img {
|
||||
left: auto;
|
||||
right: 13vw;
|
||||
}
|
||||
#pricing > ul > li {
|
||||
width: calc(100vw - 10vh);
|
||||
max-width: calc(100vw - 10vh);
|
||||
}
|
||||
nav ul {
|
||||
width: calc(100vw - 4vh);
|
||||
justify-content: space-between;
|
||||
}
|
||||
main {
|
||||
padding: 5vh;
|
||||
}
|
||||
footer * {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
@media screen and (max-device-aspect-ratio: 2/3) {
|
||||
* {
|
||||
font-size: 3vmax;
|
||||
}
|
||||
nav ul {
|
||||
flex-direction: column;
|
||||
}
|
||||
.opened ul {
|
||||
height: auto;
|
||||
border-radius: 5vh;
|
||||
}
|
||||
nav li {
|
||||
padding: 3.5vh;
|
||||
}
|
||||
#logo {
|
||||
padding: 1vh;
|
||||
height: 8vh !important;
|
||||
}
|
||||
nav .link {
|
||||
display: block;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.opened .link {
|
||||
height: auto;
|
||||
}
|
||||
nav a {
|
||||
font-size: 3vmax;
|
||||
}
|
||||
}
|
||||
15
main.js
Normal file
15
main.js
Normal file
@ -0,0 +1,15 @@
|
||||
$(function() {
|
||||
$('#logo').click(function() {
|
||||
$('nav').toggleClass('opened')
|
||||
});
|
||||
$(".link").click(function (event) {
|
||||
event.preventDefault();
|
||||
var id = $(this).attr('href'),
|
||||
top = $(id).offset().top,
|
||||
time = Math.abs(window.pageYOffset - top) * 2;
|
||||
if(window.innerHeight > window.innerWidth){
|
||||
time = 1500;
|
||||
}
|
||||
$('body,html').animate({scrollTop: top}, time);
|
||||
});
|
||||
});
|
||||
40
square.svg
Normal file
40
square.svg
Normal file
@ -0,0 +1,40 @@
|
||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="32px" height="32px" viewBox="0 0 414.951 414.951" style="enable-background:new 0 0 414.951 414.951;" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M409.275,40.212l-0.015-3.093c-0.016-1.727-0.219-3.433-0.609-5.18c-1.387-11.913-10.71-20.913-22.628-21.617 c-10.115-0.597-63.378-1.158-130.818-1.866C164.814,7.499,41.021,6.194,27.091,4.526c-4.331-0.531-8.097,0.051-11.669,1.559 C4.992,9.31-1.101,18.711,0.166,29.901C2.74,52.587,4.342,356.907,3.037,383.013c-0.261,5.099,0.973,9.877,3.567,13.894 c4.004,7.216,11.298,11.766,19.712,12.223c25.766,1.401,348.164,1.483,361.875,1.488h0.005c6.129,0,11.725-2.144,15.985-6.073 c8.146-5.505,12.177-15,10.323-24.74C412.312,368.008,410.255,234.711,409.275,40.212z M49.737,54.12 c29.879,0.724,99.939,1.333,190.549,2.062c50.606,0.409,99.025,0.795,121.282,1.148c0.076,9.666,0.173,24.128,0.289,41.469 c0.899,134.201,1.742,228.112,2.92,263.78l-7.713-0.01c-168.45-0.173-270.928-0.422-305.689-0.736 C51.524,307.555,50.928,111.085,49.737,54.12z" fill="#415a6b"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
40
triangle.svg
Normal file
40
triangle.svg
Normal file
@ -0,0 +1,40 @@
|
||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="32px" height="32px" viewBox="0 0 415.155 415.154" style="enable-background:new 0 0 415.155 415.154;" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M414.505,357.34c-30.336-118.434-94.689-225.955-169.777-321.316c-4.22-5.36-9.369-6.889-14.208-6.025 c-2.575-0.37-5.149-0.599-7.76-0.604c-5.859-0.005-11.1,2.927-14.444,7.343c-0.785,0.576-1.572,1.145-2.326,1.886 C119.701,124.187,42.602,223.84,1.117,339.141c-1.346,3.747-1.384,7.089-0.602,10.019c0.109,6.87,0.632,13.66,1.902,20.47 c1.597,8.576,10.786,13.786,19.058,13.243c0.376,0.021,0.704,0.111,1.092,0.111c109.187,0,218.297,5.81,327.454,0.625 c7.322-0.351,20.245,1.493,32.661,1.447c16.696-0.062,32.474-3.524,32.474-20.271c0-0.482-0.111-0.944-0.147-1.411 C415.129,361.474,415.053,359.493,414.505,357.34z M37.044,346.666C75.563,241.055,146.995,149.501,225.706,70.452 c63.749,82.471,118.327,175.07,147.871,275.422C261.496,353.217,149.247,347.347,37.044,346.666z" fill="#415a6b"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
<g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
Loading…
x
Reference in New Issue
Block a user