-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
136 lines (129 loc) · 12 KB
/
index.html
File metadata and controls
136 lines (129 loc) · 12 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Wiktoria Wierzbicka - project</title>
<link rel="stylesheet" href="style/style.css">
<link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@1,300&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap" rel="stylesheet">
<body>
<div id="home"></div>
<button id="hamburger" onclick='toogleNavbar()'></button>
<nav id="nav_menu">
<ul>
<li>
<a href="#home" class="nav_elements" onclick="border(this)" id="home2">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="575.284px" height="575.285px" viewBox="0 0 575.284 575.285" style="enable-background:new 0 0 575.284 575.285;"
xml:space="preserve"><path d="M167.295,287.88c-0.771,0.673-1.224,1.653-1.224,2.693V395.25c0,1.53,0.979,2.876,2.424,3.366l67.883,22.632
c0.367,0.122,0.747,0.184,1.126,0.184c0.734,0,1.469-0.233,2.069-0.674c0.93-0.673,1.481-1.738,1.481-2.876V300.513
c0-1.763-1.285-3.256-3.036-3.514l-67.883-9.939C169.119,286.901,168.079,287.208,167.295,287.88z"/>
<path d="M132.387,281.589l-47.846-6.977c-1.016-0.159-2.057,0.159-2.828,0.82c-0.783,0.673-1.224,1.652-1.224,2.692v88.582
c0,1.53,0.979,2.877,2.424,3.366l47.846,15.948c0.368,0.123,0.747,0.184,1.114,0.184c0.734,0,1.469-0.232,2.081-0.673
c0.918-0.673,1.469-1.738,1.469-2.876V285.09C135.422,283.327,134.137,281.834,132.387,281.589z"/>
<path d="M573.174,203.669L424.678,4.843c0,0-1.419-2.24-4.7-3.55c-3.28-1.322-6.475-0.392-6.475-0.392L180.184,60.694V40.057
c0-4.957-3.415-9.253-8.237-10.379l-19.499-4.504c0,0-1.261-0.343-3.036-0.245c-1.774,0.098-2.913,0.575-2.913,0.575
l-35.166,12.46c-4.247,1.505-7.087,5.52-7.087,10.024v32.179l-36.928,9.449c-2.975,0.771-5.472,2.778-6.867,5.52L1.15,212.666
c-1.653,3.268-1.518,7.148,0.367,10.282c1.885,3.133,5.251,5.08,8.911,5.166l28.103,0.587v208.558
c0,3.978,2.203,7.613,5.728,9.437L287.92,573.489c0,0,2.118,1.176,4.896,1.212c2.778,0.024,4.921-1.212,4.921-1.212
l236.098-122.963c3.513-1.836,5.716-5.459,5.728-9.437l0.416-222.096l23.917,1.652c0,0,6.255,0.71,9.78-5.018
C577.568,209.361,573.174,203.669,573.174,203.669z M282.205,546.512L59.828,430.795V229.141l177.468,3.733c0,0,0,0,0.012,0h0.024
l44.884,0.808v312.831H282.205z M530.102,196.986c-2.95-0.208-5.839,0.82-7.993,2.828c-2.154,2.007-3.378,4.834-3.391,7.772
l-0.416,227.041l-60.942,31.751V269.606c0-1.004-0.417-1.946-1.151-2.62s-1.701-1.003-2.692-0.918l-58.63,4.872
c-1.836,0.159-3.256,1.701-3.256,3.537v226.11L303.478,546.5V223.229c0-5.814-4.651-10.539-10.453-10.649l-32.901-0.6
L415.62,28.307l126.611,169.512L530.102,196.986z"/></svg> home
</a>
</li>
<li>
<a href="#description" class="nav_elements" onclick="border(this)" id="description2">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width=32 height=32 viewBox="0 0 32 32" {...props}>
<path d="M30.938 29.137l-7.363-7.363c1.825-2.225 2.925-5.075 2.925-8.181 0-7.125-5.781-12.906-12.906-12.906-7.131 0-12.906 5.781-12.906 12.906s5.775 12.906 12.906 12.906c3.106 0 5.95-1.094 8.175-2.919l7.363 7.356c0.5 0.5 1.306 0.5 1.806 0 0.5-0.494 0.5-1.306 0-1.8zM13.594 23.931c-5.706 0-10.344-4.637-10.344-10.338s4.638-10.344 10.344-10.344c5.7 0 10.344 4.644 10.344 10.344s-4.644 10.338-10.344 10.338z"></path>
</svg> description
</a>
</li>
<li>
<a href="#gallery" class="nav_elements" onclick="border(this)" id="gallery2">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 496 496" style="enable-background:new 0 0 496 496;" xml:space="preserve">
<path d="M472,48H72c-13.255,0-24,10.745-24,24v8c-13.255,0-24,10.745-24,24v8c-13.255,0-24,10.745-24,24v288
c0,13.255,10.745,24,24,24h400c13.255,0,24-10.745,24-24v-8c13.255,0,24-10.745,24-24v-8c13.255,0,24-10.745,24-24V72
C496,58.745,485.255,48,472,48z M432,424c0,4.418-3.582,8-8,8H24c-4.418,0-8-3.582-8-8V217.6l129.408,186.952
c2.516,3.632,7.5,4.536,11.132,2.02c0.789-0.547,1.473-1.231,2.02-2.02L296,206.056l136,196.448V424z M432,374.4L302.568,187.448
c-2.8-3.632-8.015-4.306-11.647-1.505c-0.564,0.435-1.07,0.941-1.505,1.505L152,385.944L16,189.496V136c0-4.418,3.582-8,8-8h400
c4.418,0,8,3.582,8,8V374.4z M456,392c0,4.418-3.582,8-8,8V136c0-13.255-10.745-24-24-24H40v-8c0-4.418,3.582-8,8-8h400
c4.418,0,8,3.582,8,8V392z M480,360c0,4.418-3.582,8-8,8V104c0-13.255-10.745-24-24-24H64v-8c0-4.418,3.582-8,8-8h400
c4.418,0,8,3.582,8,8V360z"/>
<path d="M64,144c-17.673,0-32,14.327-32,32s14.327,32,32,32s32-14.327,32-32S81.673,144,64,144z M64,192c-8.837,0-16-7.163-16-16
s7.163-16,16-16s16,7.163,16,16S72.837,192,64,192z"/>
</svg> gallery
</a>
</li>
<li>
<a href="#video" class="nav_elements" onclick="border(this)" id="video2">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width=32 height=32 viewBox="0 0 32 32" {...props}>
<path d="M38.123 5.333h-2.908l-1.588-3.159c-0.933-1.401-2.144-2.174-3.404-2.174h-8.889c-1.26 0-2.471 0.773-3.378 2.133l-2.4 3.2h-4.889v-0.889c0-1.42-1.292-2.667-2.766-2.667h-1.678c-1.394 0-2.617 1.246-2.617 2.642l-0.027 0.98c-2.908 0.325-3.579 2.24-3.579 3.886v18.469c0 2.697 1.657 4.245 4.544 4.245h33.58c2.885 0 4.542-1.548 4.542-4.247v-18.468c0-1.803-0.788-3.952-4.544-3.952zM6.222 3.556h1.678c0.491 0 0.988 0.448 0.988 0.889v0.889h-3.531l0.025-0.889c0-0.448 0.416-0.889 0.839-0.889zM40.889 27.753c0 1.707-0.853 2.469-2.766 2.469h-33.579c-1.913 0-2.766-0.763-2.766-2.469v-18.468c0-1.305 0.453-2.174 2.667-2.174h12l2.962-3.952c0.345-0.516 1.052-1.381 1.927-1.381h8.889c0.875 0 1.584 0.866 1.872 1.287l2.023 4.046h4.005c2.553 0 2.766 1.074 2.766 2.174v18.468zM25.778 7.111c-5.883 0-10.667 4.784-10.667 10.667s4.784 10.667 10.667 10.667 10.667-4.784 10.667-10.667-4.784-10.667-10.667-10.667zM25.778 26.667c-4.901 0-8.889-3.988-8.889-8.889s3.988-8.889 8.889-8.889 8.889 3.988 8.889 8.889-3.988 8.889-8.889 8.889zM25.778 11.556c-3.431 0-6.222 2.791-6.222 6.222s2.791 6.222 6.222 6.222 6.222-2.791 6.222-6.222-2.791-6.222-6.222-6.222zM25.778 22.222c-2.452 0-4.444-1.993-4.444-4.444s1.993-4.444 4.444-4.444 4.444 1.993 4.444 4.444-1.993 4.444-4.444 4.444zM7.111 8.889c-1.961 0-3.556 1.595-3.556 3.556s1.595 3.556 3.556 3.556 3.556-1.595 3.556-3.556-1.595-3.556-3.556-3.556zM7.111 14.222c-0.98 0-1.778-0.796-1.778-1.778s0.798-1.778 1.778-1.778 1.778 0.796 1.778 1.778-0.798 1.778-1.778 1.778z"></path>
</svg> video
</a>
</li>
<li>
<a href="#todo" class="nav_elements" onclick="border(this)" id="todo2">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width=32 height=32 viewBox="0 0 32 32" {...props}>
<path d="M26.035 13.976c-0.369 0-0.668 0.299-0.668 0.668v16.021h-24.032v-26.702h20.694c0.369 0 0.668-0.299 0.668-0.668s-0.299-0.668-0.668-0.668h-21.362c-0.368 0-0.668 0.299-0.668 0.668v28.037c0 0.369 0.299 0.668 0.668 0.668h25.367c0.369 0 0.668-0.299 0.668-0.668v-16.689c0-0.368-0.299-0.668-0.668-0.668zM31.895 1.259c-0.529-1.275-2.271-1.713-3.29-0.696l-12.745 12.745c-0.051 0.051-0.093 0.109-0.126 0.174l-1.888 3.777c-0.128 0.256-0.079 0.567 0.126 0.77 0.128 0.13 0.299 0.195 0.473 0.195 0.101 0 0.203-0.023 0.299-0.071l3.777-1.889c0.063-0.031 0.123-0.073 0.172-0.125l12.746-12.745c0.591-0.591 0.762-1.391 0.455-2.135zM17.825 15.12l-1.888 0.944 0.944-1.888 10.308-10.308 0.944 0.945-10.308 10.307zM30.494 2.451l-1.418 1.417-0.944-0.945 1.417-1.417c0.379-0.379 0.929-0.171 1.112 0.264 0.099 0.242 0.043 0.47-0.167 0.681z"></path>
</svg> todo
</a>
</li>
</ul>
</nav>
<header>
<h2>Lorem Ipsum</h2>
</header>
<div id="description">
<div class="empty"></div>
<h2>LOREM IPSUM</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora porro labore perspiciatis esse est aliquid placeat corrupti delectus alias fuga animi a, ipsam sed harum voluptates magni vel provident optio!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Vero temporibus consequatur molestias non eum, optio, ad eligendi vitae nam repellendus, tenetur officiis? Molestias delectus ea quidem nostrum quia et eius!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae, perspiciatis voluptatum incidunt id exercitationem ex, voluptas suscipit minus assumenda ad et? Error qui deleniti, praesentium ducimus nostrum vero laudantium quos?
</p>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora porro labore perspiciatis esse est aliquid placeat corrupti delectus alias fuga animi a, ipsam sed harum voluptates magni vel provident optio!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Vero temporibus consequatur molestias non eum, optio, ad eligendi vitae nam repellendus, tenetur officiis? Molestias delectus ea quidem nostrum quia et eius!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit voluptatum sequi laboriosam, officiis natus id velit, ratione facilis sit tenetur asperiores neque fuga, rem voluptatem culpa sint? Delectus, sed impedit!
</p>
</div>
<div id="gallery">
<div class="empty"></div>
<div class="photos">
<img src="picture/photo_1.jpeg" alt="" srcset="">
</div>
<div class="text">
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora porro labore perspiciatis esse est aliquid placeat corrupti delectus alias fuga animi a, ipsam sed harum voluptates magni vel provident optio!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Vero temporibus consequatur molestias non eum, optio, ad eligendi vitae nam repellendus, tenetur officiis? Molestias delectus ea quidem nostrum quia et eius!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit voluptatum sequi laboriosam, officiis natus id velit, ratione facilis sit tenetur asperiores neque fuga, rem voluptatem culpa sint? Delectus, sed impedit!
</p>
</div>
</div>
<div id="video">
<video controls autoplay="" loop="" muted="" preload="none" class="video_plik">
<source src="picture/video.mp4" type="video/mp4">
</video>
</div>
<div id="todo">
<div class="empty"></div>
<h2>TODO LIST</h2>
<div id="todolistitems">
<div class="input_div">
<input type="text" class="input">
<button class="addButton"><i class="fa fa-plus-circle" aria-hidden="true"></i></button>
</div>
<div class="container">
</div>
<script src="script/main.js"></script>
</div>
</div>
<footer>Wiktoria Wierzbicka - project </footer>
</body>
</html>