-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
82 lines (71 loc) · 3.88 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/stylesheets/normalize.css">
<link rel="stylesheet" href="assets/stylesheets/main.css">
<title>Front-End-Business</title>
</head>
<body>
<div class="entrance">
<a href="projects.html" class="entrancelinks">
<h1 class="introSentence">Front End Business</h1>
<p class="introsubSentence"><i>A small project series</i></p>
<svg viewBox="0 0 800 600" xmlns="http://www.w3.org/2000/svg">
<!-- Background -->
<rect width="800" height="600" fill="#f5f5f5"/>
<!-- City Background -->
<rect x="0" y="100" width="800" height="500" fill="#e0e0e0"/>
<rect x="50" y="150" width="100" height="350" fill="#bdbdbd"/>
<rect x="200" y="200" width="120" height="300" fill="#9e9e9e"/>
<rect x="400" y="150" width="150" height="350" fill="#757575"/>
<rect x="600" y="180" width="130" height="320" fill="#616161"/>
<!-- Figure -->
<!-- Business Suit -->
<path d="M380 250 L420 250 L430 400 L370 400 Z" fill="#1a237e"/> <!-- Suit Jacket -->
<path d="M385 250 L415 250 L410 380 L390 380 Z" fill="#ffffff"/> <!-- Shirt -->
<rect x="395" y="250" width="10" height="40" fill="#e91e63"/> <!-- Tie -->
<!-- Head -->
<circle cx="400" cy="220" r="30" fill="#5d4037"/> <!-- Face -->
<path d="M375 210 Q400 180 425 210" fill="#2d2d2d"/> <!-- Hair -->
<!-- Enhanced Facial Features -->
<!-- Wide Eyes -->
<circle cx="390" cy="215" r="8" fill="white"/> <!-- Left Eye White -->
<circle cx="410" cy="215" r="8" fill="white"/> <!-- Right Eye White -->
<circle cx="390" cy="215" r="4" fill="#2d2d2d"/> <!-- Left Eye Pupil -->
<circle cx="410" cy="215" r="4" fill="#2d2d2d"/> <!-- Right Eye Pupil -->
<circle cx="388" cy="213" r="1.5" fill="white"/> <!-- Left Eye Highlight -->
<circle cx="408" cy="213" r="1.5" fill="white"/> <!-- Right Eye Highlight -->
<!-- Nose -->
<path d="M398 218 Q400 225 402 225 Q404 225 402 218" fill="#4a332f"/> <!-- Nose -->
<!-- Mouth -->
<path d="M390 232 Q400 238 410 232" fill="none" stroke="#4a332f" stroke-width="2"/> <!-- Smile -->
<!-- Arms with Laptop -->
<path d="M370 280 L340 320 L350 330 L380 290" fill="#1a237e"/> <!-- Left Arm -->
<path d="M430 280 L460 320 L450 330 L420 290" fill="#1a237e"/> <!-- Right Arm -->
<rect x="330" y="310" width="140" height="80" rx="5" fill="#424242"/> <!-- Laptop -->
<rect x="340" y="320" width="120" height="60" fill="#2196f3"/> <!-- Screen -->
<text x="350" y="350" fill="#ffffff" font-family="monospace" font-size="12">
{code}
while(true) {
coffee();}
</text>
<!-- Legs in Motion -->
<path d="M390 400 L360 500 L370 500 L400 400" fill="#1a237e"/> <!-- Left Leg -->
<path d="M410 400 L440 500 L430 500 L400 400" fill="#1a237e"/> <!-- Right Leg -->
<!-- Shoes -->
<path d="M355 500 L375 500 L380 510 L350 510 Z" fill="#212121"/>
<path d="M425 500 L445 500 L450 510 L420 510 Z" fill="#212121"/>
<!-- Motion Lines -->
<line x1="460" y1="200" x2="480" y2="220" stroke="#000000" stroke-width="2" stroke-dasharray="5,5"/>
<line x1="470" y1="250" x2="490" y2="270" stroke="#000000" stroke-width="2" stroke-dasharray="5,5"/>
<line x1="465" y1="300" x2="485" y2="320" stroke="#000000" stroke-width="2" stroke-dasharray="5,5"/>
<!-- Briefcase -->
<rect x="450" y="380" width="40" height="30" fill="#795548"/>
<rect x="465" y="375" width="10" height="5" fill="#5d4037"/>
</svg>
</a>
</div>
</body>
</html>