-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
136 lines (126 loc) · 6.68 KB
/
index.html
File metadata and controls
136 lines (126 loc) · 6.68 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>ZenTop Offboarding Message Generator</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
text-align: center;
padding: 2rem;
background: linear-gradient(135deg, #f0f0f5 0%, #e1e1f0 100%);
min-height: 100vh;
margin: 0;
display: flex;
flex-direction: column;
align-items: center;
}
.container {
max-width: 1000px;
margin: 0 auto;
padding: 2rem;
}
img {
width: 300px;
margin-bottom: 20px;
transition: transform 0.3s ease;
}
img:hover {
transform: scale(1.05);
}
button {
font-size: 1.2rem;
padding: 15px 30px;
margin-top: 20px;
border: none;
border-radius: 12px;
background: linear-gradient(45deg, #4CAF50, #45a049);
color: white;
cursor: pointer;
transition: all 0.3s ease;
box-shadow: 0 4px 15px rgba(76, 175, 80, 0.2);
}
button:hover {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(76, 175, 80, 0.3);
}
button:active {
transform: translateY(1px);
}
#message {
margin-top: 30px;
font-size: 1.2rem;
color: #333;
max-width: 800px;
margin-left: auto;
margin-right: auto;
padding: 20px;
background: white;
border-radius: 15px;
box-shadow: 0 8px 30px rgba(0,0,0,0.1);
opacity: 0;
transform: translateY(20px);
transition: all 0.5s ease;
}
#message.show {
opacity: 1;
transform: translateY(0);
}
h1 {
color: #2c3e50;
margin-bottom: 1.5rem;
font-size: 2.5rem;
text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
}
</style>
</head>
<body>
<div class="container">
<img src="https://images.squarespace-cdn.com/content/v1/663d025d09b7434f1c953df0/fd820eb7-1862-4b05-853e-c3abecabb6d5/ZenTop_full+logo.png?format=1500w" alt="ZenTop Logo">
<h1>ZenTop Offboarding Message Generator</h1>
<button id="generateButton">Generate Offboarding Message</button>
<div id="message"></div>
</div>
<script>
const messages = [
"[Ticket Note] User has been digitally yeeted into the void. Their access credentials have been sent to /dev/null where they belong. Pour one out for their inbox (all 37GB of it).",
"[Ticket Note] Another one bytes the dust! 🎵 User's digital footprint has been scrubbed cleaner than their browser history. Their laptop is now living its best life as a paperweight.",
"[Ticket Note] Mission accomplished: User's digital presence has been thanos-snapped out of existence. Their 'homework' folder has been deleted with extreme prejudice. No questions asked.",
"[Ticket Note] Breaking up is hard to do, but revoking access is easy! User's credentials have been sent to the great recycling bin in the sky. Their 'urgent' tickets can now urgently go elsewhere.",
"[Ticket Note] User access terminated faster than their excuses about why they needed admin rights. Their custom mechanical keyboard will echo through these halls no more.",
"[Ticket Note] Another successful digital exorcism completed! User's ghost in the machine has been busted. Their 'essential' Chrome extensions will be missed by absolutely no one.",
"[Ticket Note] User's digital presence has been reduced to a mere legend in our logs. Their standing desk has been lowered for the last time. May their next IT department be as patient as we were.",
"[Ticket Note] Access terminated with the precision of a caffeinated sysadmin. Their 'very important' desktop shortcuts have been sent to the great recycle bin in the sky. No regrets, only logs.",
"[Ticket Note] User has been successfully upgraded to version Ex-Employee 2.0. Their monitor setup has been dismantled with all the ceremony of unsubscribing from spam emails.",
"[Ticket Note] Operation Digital Farewell complete! Their Slack status will forever remain on 'Away', their email signature now redirects to the void, and their ergonomic chair has been liberated.",
"[Ticket Note] User access has been yote into the sunset. Their 'mission-critical' cat GIF collection has been archived with all the solemnity it deserves. Another successful digital decluttering.",
"[Ticket Note] Offboarding completed faster than they could say 'but I saved something important on my desktop!' Their legacy lives on in our ticket resolution metrics.",
"[Ticket Note] User's digital presence has been reduced to a footnote in our audit logs. Their standing desk has finally taken a seat. May their next password be stronger than 'Password123!'",
"[Ticket Note] Access terminated with more efficiency than their use of reply-all emails. Their custom desktop background of 'motivational' memes will be archived for posterity (and laughs).",
"[Ticket Note] Another successful digital departure! Their license has been freed from its corporate chains, their bookmarks have been set free, and their keyboard shortcuts have been reset to factory defaults (the horror!)."
];
document.addEventListener('DOMContentLoaded', function() {
const button = document.getElementById('generateButton');
const messageDiv = document.getElementById('message');
button.addEventListener('click', function() {
const randomIndex = Math.floor(Math.random() * messages.length);
messageDiv.innerText = messages[randomIndex];
messageDiv.classList.remove('show');
// Force a reflow
void messageDiv.offsetWidth;
messageDiv.classList.add('show');
// Add some flair to the button
button.style.transform = 'scale(0.95)';
setTimeout(() => {
button.style.transform = 'translateY(-2px)';
}, 150);
});
// Reset button transform on mouse out
button.addEventListener('mouseout', function() {
button.style.transform = '';
});
});
</script>
</body>
</html>