-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathportfolio.html
125 lines (89 loc) · 5.42 KB
/
portfolio.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
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
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GAWW V13 - PORTFOLIO</title>
<link rel="icon" href="images/favicon.ico">
<link rel="stylesheet" href="common.css">
<link rel="stylesheet" href="portfolio.css">
</head>
<body>
<menu>
<div class="overlay invisible">
<a class="menulink opaque" href="news.html">news</a>
<a class="menulink opaque" href="portfolio.html">portfolio</a>
<a class="menulink opaque" href="webdev.html">web dev.</a>
<a class="menulink opaque" href="gamedev.html">game dev.</a>
<a class="menulink opaque" href="writing.html">writing</a>
<a class="menulink opaque" href="video.html">video</a>
<a class="menulink opaque" href="music.html">music</a>
<a class="menulink opaque" href="photo.html">photo</a>
<a class="menulink opaque" href="d3.html">3d</a>
<a class="menulink opaque" href="blog.html">blog</a>
<a class="menulink opaque" href="infos.html">infos</a>
</div>
<nav>
<a href="#" class="btn">
<span class="btn-line btn-line-short"></span>
<span class="btn-line "></span>
<span class="btn-line btn-line-short"></span>
</a>
<a href="index.html" class="logo">
<svg class="large" height="" width="" version="1.1" id="" viewBox="250 250 3500 700">
<style type="text/css">
.st0{fill:none;stroke:#ffffff;stroke-width:30;stroke-miterlimit:10;}
</style>
<path class="st0" d="M971.08,297.15H679.44c0,0-294.7,0.97-294.7,291.8s293.17,291.8,293.17,291.8l293.18-0.06V588.96 l-293.18,291.8"/>
<polyline class="st0" points="1263.9,880.76 1263.9,588.96 1263.9,297.15 1555.69,588.96 1847.47,880.76"/>
<polyline class="st0" points="2141.25,296.82 2141.25,880.39 2433.73,587.91 2726.91,881.09 2726.91,296.82"/>
<polyline class="st0" points="3020.42,296.82 3020.42,881.09 3312.38,589.13 3604.16,880.91 3604.16,296.82"/>
<line class="st0" x1="1263.9" y1="588.96" x2="1555.69" y2="588.96"/>
<line class="st0" x1="3312.38" y1="589.13" x2="3603.99" y2="589.13"/>
<line class="st0" x1="2433.73" y1="587.91" x2="2141.25" y2="587.91"/>
<circle class="st0" cx="1897.06" cy="587.91" r="50.54"/>
</svg>
<svg class="square" width="" version="1.1" id="Calque_1" x="0px" y="0px" viewBox="250 250 2500 2500" xml:space="preserve">
<style type="text/css">
.st1{fill:none;stroke:#ffffff;stroke-width:50;stroke-miterlimit:10;}
</style>
<path class="st1" d="M1293.71,450.75H850.78c0,0-420.54,1.39-420.54,416.4s418.36,416.4,418.36,416.4l418.36-0.08V867.15 l-418.36,416.4"/>
<polyline class="st1" points="1733.64,1306.82 1733.64,902.13 1733.64,485.73 2150.01,902.13 2550.14,1290.57 "/>
<polyline class="st1" points="431.91,1715.51 431.91,2548.25 849.27,2130.89 1267.63,2549.25 1267.63,1715.51 "/>
<polyline class="st1" points="1733.73,1715.51 1733.73,2549.25 2149.31,2132.63 2565.68,2549 2565.68,1715.51 "/>
<line class="st1" x1="1733.64" y1="890.41" x2="2150.01" y2="890.41"/>
<line class="st1" x1="2149.3" y1="2122.29" x2="2565.43" y2="2122.29"/>
<line class="st1" x1="849.35" y1="2120.59" x2="431.98" y2="2120.59"/>
</svg>
</a>
</nav>
</menu>
<div class="gridcontainer">
<div class="grid">
<div class="item">
<h2 class="h">Project 1</h2>
<p class="txt hidetxt">Lorem ipsum dolor sit amet consectetur adipisicing elit. Sunt tempore quis, ipsa nostrum ad ipsum sed odit harum vitae!</p>
<img class="bg" src="images/img3.jpg" alt="">
</div>
<div class="item locked">
<div class="lockedcover">
<img class="lock" src="images/lock.png" alt="">
</div>
<h2 class="h">Project 2 🔒</h2>
<p class="txt hidetxt">Lorem ipsum dolor sit amet consectetur adipisicing elit. Sunt tempore quis, ipsa nostrum ad ipsum sed odit harum vitae!</p>
<img class="bg" src="images/img4.jpg" alt="">
</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
<div class="item">7</div>
<div class="item">8</div>
<div class="item">9</div>
<div class="item">10</div>
<div class="item">11</div>
<div class="item">12</div>
</div>
</div>
<script src="script.js"></script>
</body>
</html>