-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
166 lines (153 loc) · 4.67 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
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
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
<!DOCTYPE html>
<html lang="en">
<head>
<title>Personal Site</title>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-HKB2GM7D7R"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-HKB2GM7D7R');
</script>
<style>
/* Base font size for all devices */
body {
font-size: 18px; /* Base font size */
line-height: 1.6; /* Improve readability with appropriate line height */
padding: 20px;
margin: 0;
font-family: Inter, sans-serif;
}
/* Increase font size on larger screens */
@media (min-width: 600px) {
body {
font-size: 20px;
}
}
@media (min-width: 768px) {
body {
font-size: 22px;
}
}
@media (min-width: 1024px) {
body {
font-size: 24px;
}
}
#emoji-link {
text-decoration: none;
color: inherit;
transition: color 0.3s ease;
}
#emoji-link:hover {
cursor: pointer;
color: #3c9600; /* Change the color on hover */
}
h1 {
font-size: 1.5em; /* Adjust the size of the header */
margin-bottom: 20px;
}
p, ul, li {
margin-bottom: 15px; /* Add space between paragraphs and list items */
}
ul {
padding-left: 20px; /* Add padding to the left of list items */
}
</style>
</head>
<body>
<main>
<h1>
<a id="emoji-link" href="https://example.com" target="_blank">
🦧 Levi Adissi
</a>
</h1>
<section>
<p id="greeting">Hey! 👋 Thanks for stopping by. This is my personal website.</p>
<h3>🔨 Projects:</h3>
<ul>
<li><a href="https://onwordle.netlify.app">On Wordle</a> - a tool for players of Wordle</li>
<li>TCAI (in progress)</li>
</ul>
<h3>💭 Interests:</h3>
<ul>
<li>building products</li>
<li>LLM's</li>
<li>music production</li>
</ul>
<h3>➕ You can get in touch with me here:</h3>
<ul>
<li><a href="https://twitter.com/LeviAdissi">Twitter</a></li>
<li><a href="https://www.linkedin.com/in/levi-adissi">LinkedIn</a></li>
</ul>
</section>
</main>
<footer>
<p>No Copyright</p>
</footer>
<script>
const animalEmojis = {
"🐵": "swinging by",
"🐒": "monkeying around",
"🦍": "gorilla-ing through",
"🦧": "hanging out",
"🐶": "wagging by",
"🐕": "barking by",
"🦮": "guiding by",
"🐩": "prancing by",
"🐺": "howling by",
"🦊": "sneaking by",
"🦝": "raccooning by",
"🐱": "meowing by",
"🐈": "purring by",
"🦁": "roaring by",
"🐯": "prowling by",
"🐅": "stalking by",
"🐆": "leaping by",
"🐴": "trotting by",
"🦄": "galloping by",
"🦓": "zebra-ing by",
"🐘": "stomping by",
"🦏": "charging by",
"🐢": "slowly walking by",
"🐇": "hopping by",
"🐿️": "scurrying by",
"🦔": "rolling by",
"🐸": "hopping by",
"🐍": "slithering by",
"🐉": "flying by",
"🦕": "lumbering by",
"🦖": "stomping by",
"🐙": "swimming by",
"🦈": "sharking by",
"🐋": "whale-ing by",
"🐟": "swimming by",
"🐠": "floating by",
"🐡": "puffing by",
"🦋": "fluttering by",
"🐝": "buzzing by",
"🪲": "crawling by",
"🦗": "hopping by",
"🪰": "flying by",
"🦨": "skunking by",
"🦫": "beavering by",
"🦘": "jumping by",
"🦥": "slowly moving by",
"🐨": "koala-ing by",
"🐼": "panda-ing by",
"🦩": "flamingo-ing by"
};
const emojiElement = document.getElementById('emoji-link');
const greetingElement = document.getElementById('greeting');
emojiElement.addEventListener('click', function(event) {
event.preventDefault(); // Prevent the default link behavior
const emojis = Object.keys(animalEmojis);
const randomIndex = Math.floor(Math.random() * emojis.length);
const selectedEmoji = emojis[randomIndex];
const verb = animalEmojis[selectedEmoji];
emojiElement.textContent = selectedEmoji + " Levi Adissi";
greetingElement.innerHTML = `Hey! 👋 Thanks for ${verb}. This is my personal website.`;
});
</script>
</body>
</html>