-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·99 lines (99 loc) · 6.41 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="./style.css">
<title>HTML-CSS-POPUP</title>
</head>
<body>
<nav class="menu">
<ul class="first-menu">
<li class="first-menu-item"><a href="#">Mail</a></li>
<li class="first-menu-item"><a href="#">Images</a></li>
<li>
<input type="checkbox" id="show" class="show" name="checkbox-1" tabindex="0"/>
<label class="show-label" for="show">
<img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/popup-button.png" alt="popup-button" class="popup-button">
</label>
<ul class="icons-menu" id="content">
<li class="icons-item">
<a href="#"><img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/001-unicorn.svg" alt="unicorn laughing" class="icons-item-img">
<p>Laugh</p>
</a>
</li>
<li class="icons-item">
<a href="#"><img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/002-unicorn.svg" alt="unicorn sleeping" class="icons-item-img">
<p>Sleep</p>
</a>
</li>
<li class="icons-item">
<a href="#"><img src="https://raw.githubusercontent.com/WEremite/html-css-popup/516d8a3f5b12b21a175cf7eab325afd9c040b0fa/icons/svg/003-eye%20mask.svg" alt="unicorn mask" class="icons-item-img">
<p>Mask</p>
</a>
</li>
<li class="icons-item">
<a href="#"><img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/004-unicorn.svg" alt="unicorn winkles" class="icons-item-img">
<p>Winkle</p>
</a>
</li>
<li class="icons-item">
<a href="#"><img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/005-unicorn.svg" alt="unicorn crying" class="icons-item-img">
<p>Cry</p>
</a>
</li>
<li class="icons-item">
<a href="#"><img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/006-unicorn.svg" alt="unicorn mermaid" class="icons-item-img">
<p>Mermaid</p>
</a>
</li>
<li class="second-menu">
<input type="checkbox" id="show2" class="second-show" name="checkbox-2" tabindex="0"/>
<label for="show2" class="second-show-label">
More
</label>
<ul class="more-icons-menu" id="content2">
<li class="icons-item">
<a href="#">
<img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/007-unicorn.svg" alt="unicorn music" class="icons-item-img">
<p>Music</p>
</a>
</li>
<li class="icons-item">
<a href="#">
<img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/008-unicorn.svg" alt="unicorn money" class="icons-item-img">
<p>Money</p>
</a>
</li>
<li class="icons-item">
<a href="#">
<img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/009-cake.svg" alt="unicorn cake" class="icons-item-img">
<p>Cake</p>
</a>
</li>
<li class="icons-item">
<a href="#">
<img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/010-unicorn.svg" alt="unicorn nausea" class="icons-item-img">
<p>Nausea</p>
</a>
</li>
<li class="icons-item">
<a href="#">
<img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/011-unicorn.svg" alt="unicorn in the house" class="icons-item-img">
<p>In Da House</p>
</a>
</li>
<li class="icons-item">
<a href="#">
<img src="https://raw.githubusercontent.com/WEremite/html-css-popup/a910c067cacd328d5e11cad9e339dba80e7e71d3/icons/svg/012-unicorn.svg" alt="unicorn scared" class="icons-item-img">
<p>Scared</p>
</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
</body>
</html>