madebydanny.uk written in html, css, and a lot of JavaScript I don't understand
madebydanny.uk
html
css
javascript
new layout
+884
-961
.DS_Store
.DS_Store
This is a binary file and will not be displayed.
+71
-31
404.html
+71
-31
404.html
···
1
1
<!DOCTYPE html>
2
-
<html>
2
+
<html lang="en">
3
3
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6
-
<title>Error 404 Page not found</title>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+
<title>Page Not Found</title>
7
7
8
8
<meta name="robots" content="noindex, nofollow">
9
-
9
+
10
+
<!-- Google Fonts for a clean font -->
11
+
<link rel="preconnect" href="https://fonts.googleapis.com">
12
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
13
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
14
+
15
+
<!-- Tailwind CSS CDN -->
10
16
<script src="https://cdn.tailwindcss.com"></script>
17
+
18
+
<!-- Font Awesome CDN -->
19
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" xintegrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
20
+
21
+
<style>
22
+
body {
23
+
font-family: 'Inter', sans-serif;
24
+
}
25
+
</style>
11
26
</head>
12
-
<body>
13
-
<div id="__next">
14
-
<div>
15
-
<header class="flex flex-col items-center py-12 md:py-16">
16
-
<div class="mb-8">
17
-
<a href="#" class="flex flex-row items-center">
18
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/server-solid-full.svg" alt="Profile Picture" class="w-16 h-16 mb-2"/>
19
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/magnifying-glass-solid-full.svg" alt="Profile Picture" class="w-16 h-16 mb-2"/>
20
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/question-solid-full.svg" alt="Profile Picture" class="w-16 h-16 mb-2"/>
21
-
</a>
27
+
<body class="bg-gray-100 text-gray-800 antialiased leading-relaxed">
28
+
29
+
<!-- Main Container -->
30
+
<div class="min-h-screen flex items-center justify-center p-4">
31
+
32
+
<!-- Card-like container for the content -->
33
+
<div class="bg-white rounded-3xl shadow-xl p-8 md:p-12 w-full max-w-4xl text-center">
34
+
35
+
<!-- Header with icons -->
36
+
<header class="mb-8">
37
+
<div class="flex flex-row items-center justify-center space-x-4 mb-4">
38
+
<i class="fa-solid fa-server text-4xl text-gray-400"></i>
39
+
<i class="fa-solid fa-magnifying-glass text-4xl text-gray-400"></i>
40
+
<i class="fa-solid fa-circle-question text-4xl text-gray-400"></i>
22
41
</div>
42
+
<h1 class="text-3xl font-bold text-gray-900">Page Not Found</h1>
23
43
</header>
24
-
<div class="w-9/10 max-w-md mx-auto">
25
-
<h3 id="what-is-tsnet" class="mb-2 mt-5 text-xl font-medium first:mt-0">That Page cant be found</h3>
44
+
45
+
<hr class="border-gray-200 my-8">
46
+
47
+
<!-- Error Message Content -->
48
+
<div class="prose mx-auto max-w-none prose-indigo">
49
+
<p class="text-xl font-medium text-gray-700">The page can't be found on the server.</p>
50
+
<p id="url" class="text-gray-600 mt-4"></p>
51
+
<p class="mt-8 text-lg">
52
+
You can try going back to the <a href="/index.html" class="text-indigo-600 hover:text-indigo-800 transition duration-300 font-semibold">Home Page</a>.
53
+
</p>
54
+
</div>
55
+
56
+
<!-- Footer -->
57
+
<footer class="mt-12 pt-4 text-center text-gray-500 border-t border-gray-200">
58
+
<div class="flex justify-center space-x-6 mb-4 text-lg">
59
+
<a href="javascript:history.back()" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-arrow-left"></i> Back</a>
60
+
<a href="/index.html" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-house"></i> Home</a>
61
+
</div>
62
+
<!-- Centered Iframe -->
63
+
<div class="flex justify-center mt-8">
64
+
<iframe src="https://status.madebydanny.uk/badge?theme=light" width="200" height="30" frameborder="0" scrolling="no" style="color-scheme: normal"></iframe>
65
+
</div>
26
66
<p>
27
-
The page was not found on the server,
28
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm">danielmorrisey.com</code></p>
29
-
<p id="url"></p><p>
30
-
<br><br>
31
-
You can try going back to the
32
-
<a href="/index.html" class="text-blue-600 transition-colors hover:text-blue-800">Home Page</a>
67
+
© 2024-<span id="currentYear"></span>
68
+
<a href="https://madebydanny.uk" class="hover:text-indigo-600 transition duration-300 font-medium">Made by Danny UK</a>
69
+
</p>
70
+
<p class="text-sm mt-1">
71
+
by Daniel Morrisey
33
72
</p>
34
-
</div>
35
-
<div class="w-9/10 max-w-md mx-auto">
36
-
<br><br>
37
-
<p>© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
38
-
</div>
73
+
</footer>
74
+
39
75
</div>
40
76
</div>
77
+
41
78
<script>
42
-
document.getElementById("url").innerHTML = "Cloudflare Pages returned \"404 error\" when looking for <code class=\"rounded-lg border bg-gray-50 px-1 py-0.5 text-sm\">" + window.location.href + "</code>.";
79
+
// Display the URL of the page that was not found
80
+
document.getElementById("url").innerHTML = `Cloudflare Pages returned "404 error" when looking for <code class="bg-gray-200 rounded px-1 text-sm font-mono">${window.location.href}</code>.`;
81
+
82
+
// Set the current year for the copyright notice
83
+
document.getElementById('currentYear').textContent = new Date().getFullYear();
43
84
</script>
44
-
<script src="/script/main.js"></script>
45
85
</body>
46
-
</html>
86
+
</html>
-53
domaintakendmcom.html
-53
domaintakendmcom.html
···
1
-
<!DOCTYPE html>
2
-
<html>
3
-
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6
-
<title>Whoops, That Domain is taken!</title>
7
-
8
-
<meta name="robots" content="noindex, nofollow">
9
-
10
-
<script src="https://cdn.tailwindcss.com"></script>
11
-
</head>
12
-
</head>
13
-
<body>
14
-
<div id="__next">
15
-
<div>
16
-
<header class="flex flex-col items-center py-12 md:py-16">
17
-
<div class="mb-8">
18
-
<a href="#" class="flex flex-row items-center">
19
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/cloudflare-brands-solid-full.svg" alt="Profile Picture" class="w-32 h-32 mb-2"/>
20
-
</a>
21
-
</div>
22
-
</header>
23
-
24
-
<div class="w-9/10 max-w-md mx-auto">
25
-
<h3 id="what-is-tsnet" class="mb-2 mt-5 text-xl font-medium first:mt-0">Whoops, That Domain is taken!</h3>
26
-
<p>
27
-
The website you are trying to access is already registered in Cloudflare. The Domain is not for sale.
28
-
<hr>
29
-
<b>Domain Info</b>
30
-
<br>
31
-
<b>Domain</b>: *.danielmorrisey.com
32
-
<br>
33
-
<b>Registrar</b>: Cloudflare
34
-
<br>
35
-
<b>Registrar URL</b>: <a href="https://www.cloudflare.com/domains/" class="text-blue-600 transition-colors hover:text-blue-800">https://www.cloudflare.com/domains/</a>
36
-
<br>
37
-
<b>Created</b>: on 2024-05-10
38
-
<br>
39
-
<b>Updated</b>: on 2025-05-03
40
-
<br>
41
-
<b>Expires</b>: on 2029-05-10
42
-
43
-
</p>
44
-
</div>
45
-
<div class="w-9/10 max-w-md mx-auto">
46
-
<br><br>
47
-
<p>© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
48
-
</div>
49
-
</div>
50
-
</div>
51
-
<script src="/script/main.js"></script>
52
-
</body>
53
-
</html>
-52
domaintakenmbd.html
-52
domaintakenmbd.html
···
1
-
<!DOCTYPE html>
2
-
<html>
3
-
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6
-
<title>Whoops, That Domain is taken!</title>
7
-
8
-
<meta name="robots" content="noindex, nofollow">
9
-
10
-
<script src="https://cdn.tailwindcss.com"></script>
11
-
</head>
12
-
</head>
13
-
<body>
14
-
<div id="__next">
15
-
<div>
16
-
<header class="flex flex-col items-center py-12 md:py-16">
17
-
<div class="mb-8">
18
-
<a href="#" class="flex flex-row items-center">
19
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/cloudflare-brands-solid-full.svg" alt="Profile Picture" class="w-32 h-32 mb-2"/>
20
-
</a>
21
-
</div>
22
-
</header>
23
-
24
-
<div class="w-9/10 max-w-md mx-auto">
25
-
<h3 id="what-is-tsnet" class="mb-2 mt-5 text-xl font-medium first:mt-0">Whoops, That Domain is taken!</h3>
26
-
<p>
27
-
The website you are trying to access is already registered in Cloudflare. The Domain is not for sale.
28
-
<hr>
29
-
<b>Domain Info</b>
30
-
<br>
31
-
<b>Domain</b>: *.madebydanny.uk
32
-
<br>
33
-
<b>Registrar</b>: Cloudflare
34
-
<br>
35
-
<b>Registrar URL</b>: <a href="https://www.cloudflare.com/domains/" class="text-blue-600 transition-colors hover:text-blue-800">https://www.cloudflare.com/domains/</a>
36
-
<br>
37
-
<b>Created</b>: on 2024-05-10
38
-
<br>
39
-
<b>Updated</b>: on 2025-05-03
40
-
<br>
41
-
<b>Expires</b>: on 2029-05-10
42
-
</p>
43
-
</div>
44
-
<div class="w-9/10 max-w-md mx-auto">
45
-
<br><br>
46
-
<p>© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
47
-
</div>
48
-
</div>
49
-
</div>
50
-
<script src="/script/main.js"></script>
51
-
</body>
52
-
</html>
+150
-45
index.html
+150
-45
index.html
···
1
-
<!DOCTYPE html>
2
-
<html>
1
+
<!DOCTYPE html>
2
+
<html lang="en">
3
3
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
6
<title>Daniel Morrisey</title>
7
-
8
-
<meta name="description" content="Daniel Morrisey, Writer @ MBD & pygame user."/>
9
-
<meta name="keywords" content="Danile Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
7
+
<meta name="description" content="Writer @ MBD News & HTML, CSS, Javascript & Python developer">
8
+
9
+
<!-- Google Fonts for a clean font -->
10
+
<link rel="preconnect" href="https://fonts.googleapis.com">
11
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
12
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
13
+
14
+
<meta name="keywords" content="Daniel Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
10
15
<meta name="author" content="Daniel Morrisey"/>
11
16
12
17
<meta property="og:type" content="website"/>
13
18
<meta property="og:url" content="https://danielmorrisey.com/"/>
14
19
<meta property="og:title" content="Daniel Morrisey"/>
15
-
<meta property="og:description" content="Daniel Morrisey, Writer @ MBD & pygame user"/>
20
+
<meta property="og:description" content="Writer @ MBD News & HTML, CSS, Javascript & Python developer"/>
16
21
<meta property="og:image" content="https://public-danielmorrisey-com.danielmorrisey.com/media/banner.jpg"/>
17
22
18
23
<link rel="me" href="https://mastodon.social/@danielmorrisey"/>
19
24
<link rel="icon" type="image/x-icon" href="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg">
25
+
26
+
<!-- Status Banner -->
27
+
<script src="https://uptime.betterstack.com/widgets/announcement.js" data-id="223534" async="async" type="text/javascript"></script>
28
+
29
+
<!-- Tailwind CSS CDN -->
20
30
<script src="https://cdn.tailwindcss.com"></script>
31
+
32
+
<!-- Font Awesome CDN -->
33
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" xintegrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
21
34
35
+
<style>
36
+
body {
37
+
font-family: 'Inter', sans-serif;
38
+
}
39
+
</style>
40
+
</head>
41
+
<body class="bg-gray-100 text-gray-800 antialiased leading-relaxed">
22
42
23
-
</head>
24
-
<body>
25
-
<div id="__next">
26
-
<div>
27
-
<header class="flex flex-col items-center py-12 md:py-16">
28
-
<div class="mb-8">
29
-
<a href="/index.html" class="flex flex-col items-center">
30
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-16 h-16 mb-2"/>
31
-
<h1 class="text-3xl font-bold">Daniel Morrisey</h1>
43
+
<!-- Main Container -->
44
+
<div class="min-h-screen flex items-center justify-center p-4">
45
+
46
+
<!-- Card-like container for the content -->
47
+
<div class="bg-white rounded-3xl shadow-xl p-8 md:p-12 w-full max-w-4xl">
48
+
49
+
<!-- Profile Section -->
50
+
<header class="flex flex-col md:flex-row items-center md:items-start text-center md:text-left mb-8">
51
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Daniel Morrisey's Profile" class="w-32 h-32 rounded-full object-cover shadow-lg mb-6 md:mb-0 md:mr-8">
52
+
<div>
53
+
<h1 class="text-4xl font-bold text-gray-900 mb-2">Daniel Morrisey</h1>
54
+
<p class="text-xl text-gray-600 font-medium">Writer @ MBD & <i class="fa-brands fa-html5"></i> <i class="fa-brands fa-css3"></i> <i class="fa-brands fa-js"></i> <i class="fa-brands fa-python"></i> developer</p>
55
+
<div class="mt-4 flex justify-center md:justify-start">
56
+
<!-- Bluesky Link -->
57
+
<a href="https://bsky.app/profile/danielmorrisey.com" class="bg-blue-600 text-white py-2 px-6 rounded-full font-semibold hover:bg-indigo-700 transition duration-300 shadow-md">
58
+
Follow on Bluesky
59
+
</a>
60
+
</div>
61
+
</div>
62
+
</header>
63
+
64
+
<hr class="border-gray-200 my-8">
65
+
66
+
<!-- About Section -->
67
+
<section class="mb-8">
68
+
<h2 class="text-2xl font-bold text-gray-900 mb-4">About</h2>
69
+
<p class="text-lg text-gray-700 mb-4">
70
+
Welcome to
71
+
<code class="bg-gray-100 text-gray-900 px-2 py-1 rounded-lg">danielmorrisey.com</code>, I use this site as a place to share & store my
72
+
<a href="/projects/index.html" class="text-indigo-600 hover:text-indigo-800 font-medium transition duration-300">projects</a> & <a href="/textbites/index.html" class="text-indigo-600 hover:text-indigo-800 font-medium transition duration-300">text bites</a>.
73
+
</p>
74
+
<p class="text-lg text-gray-700">
75
+
I also use <code class="bg-gray-100 text-gray-900 px-2 py-1 rounded-lg">danielmorrisey.com</code> to host some backend services and as a content delivery network (CDN) for my other sites & projects.
76
+
<br><br>
77
+
I also own the domain <code class="bg-gray-100 text-gray-900 px-2 py-1 rounded-lg">madebydanny.uk</code> I use it for more "professional" projects & sites like <a href="https://news.madebydanny.uk" class="text-indigo-600 hover:text-indigo-800 font-medium transition duration-300">MBD News</a>.
78
+
</p>
79
+
</section>
80
+
81
+
<hr class="border-gray-200 my-8">
82
+
83
+
<!-- Links Section -->
84
+
<section>
85
+
<h2 class="text-2xl font-bold text-gray-900 mb-4">Where to find me & my work</h2>
86
+
<div class="flex flex-wrap gap-4">
87
+
<!-- Projects -->
88
+
<a href="/projects/index.html" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
89
+
<i class="fa-solid fa-folder-open text-lg"></i>
90
+
<span>My Projects</span>
91
+
</a>
92
+
<!-- Text Bites -->
93
+
<a href="/textbites/index.html" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
94
+
<i class="fa-solid fa-book text-lg"></i>
95
+
<span>Text Bites</span>
96
+
</a>
97
+
<!-- Uptime -->
98
+
<a href="https://status.madebydanny.uk" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
99
+
<i class="fa-solid fa-server"></i></i>
100
+
<span>Status</span>
101
+
</a>
102
+
<!-- Bluesky -->
103
+
<a href="https://bsky.app/profile/danielmorrisey.com" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
104
+
<i class="fa-brands fa-bluesky"></i>
105
+
<span>Bluesky</span>
106
+
</a>
107
+
<!-- Bluesky -->
108
+
<a href="https://bsky.app/profile/alt.danielmorrisey.com" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
109
+
<i class="fa-brands fa-bluesky"></i>
110
+
<span>Bluesky (alt)</span>
111
+
</a>
112
+
<!-- Threads -->
113
+
<a href="https://threads.com/madebydanny.uk" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
114
+
<i class="fa-brands fa-threads"></i>
115
+
<span>Threads</span>
116
+
</a>
117
+
<!-- Mastodon -->
118
+
<a href="https://mastodon.social/@danielmorrisey" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
119
+
<i class="fa-brands fa-mastodon"></i>
120
+
<span>Mastodon</span>
121
+
</a>
122
+
<!-- Linkedin -->
123
+
<a href="https://linkedin.com/in/danielemorrisey" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
124
+
<i class="fa-brands fa-linkedin"></i>
125
+
<span>Linkedin</span>
126
+
</a>
127
+
<!-- GitHub -->
128
+
<a href="https://github.com/therealfuntimeswithdanny" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
129
+
<i class="fa-brands fa-github"></i>
130
+
<span>GitHub</span>
131
+
</a>
132
+
<!-- MBD News -->
133
+
<a href="https://news.madebydanny.uk/" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
134
+
<i class="fa-solid fa-newspaper text-lg"></i>
135
+
<span>MBD News</span>
136
+
</a>
137
+
<!-- Image Scope -->
138
+
<a href="https://imagescope.madebydanny.uk/" class="flex items-center space-x-2 bg-gray-100 px-4 py-2 rounded-xl text-gray-700 hover:bg-gray-200 transition duration-300">
139
+
<i class="fa-solid fa-microscope"></i>
140
+
<span>Image Scope</span>
32
141
</a>
33
142
</div>
34
-
</header>
35
-
<div class="w-9/10 max-w-md mx-auto">
36
-
<h3 id="#" class="mb-2 mt-5 text-xl font-medium first:mt-0">Hello World!</h3>
143
+
</section>
144
+
145
+
<!-- Footer -->
146
+
<footer class="mt-12 pt-4 text-center text-gray-500 border-t border-gray-200">
147
+
<div class="flex justify-center space-x-6 mb-4 text-lg">
148
+
<a href="javascript:history.back()" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-arrow-left"></i> Back</a>
149
+
<a href="/index.html" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-house"></i> Home</a>
150
+
</div>
151
+
<!-- Centered Iframe -->
152
+
<div class="flex justify-center mt-8">
153
+
<iframe src="https://status.madebydanny.uk/badge?theme=light" width="200" height="30" frameborder="0" scrolling="no" style="color-scheme: normal"></iframe>
154
+
</div>
37
155
<p>
38
-
You have found my website
39
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm">danielmorrisey.com</code>
40
-
I maily use this site to publish updates for my
41
-
<a href="/projects/index.html" class="text-blue-600 transition-colors hover:text-blue-800">Projects</a>
42
-
I also use
43
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm">danielmorrisey.com</code>
44
-
to host some backend sevreices and use it as a CDN for my orther sites.
156
+
© 2024-<span id="currentYear"></span>
157
+
<a href="https://madebydanny.uk" class="hover:text-indigo-600 transition duration-300 font-medium">Made by Danny UK</a>
45
158
</p>
46
-
<h3 id="#" class="mb-2 mt-5 text-xl font-medium first:mt-0">What to do?</h3>
47
-
<p>
48
-
While you are here, you can check out my
49
-
<a href="/projects/index.html" class="text-blue-600 transition-colors hover:text-blue-800">Projects</a>,
50
-
follow me on
51
-
<a href="/leaving.html?link=https://mastodon.social/@danielmorrisey" class="text-blue-600 transition-colors hover:text-blue-800">Mastodon</a>
52
-
&
53
-
<a href="/leaving.html?link=https://bsky.app/profile/danielmorrisey.com" class="text-blue-600 transition-colors hover:text-blue-800">Bluesky</a>,
54
-
check out
55
-
<a href="/leaving.html?link=https://madebydanny.uk/" class="text-blue-600 transition-colors hover:text-blue-800">MBD News</a>, a News website that I own for all things <i><a href="https://mastodon.social/tags/tech" class="text-blue-600 transition-colors hover:text-blue-800">#Tech</a></i>
56
-
or read my <a href="/textbites/index.html" class="text-blue-600 transition-colors hover:text-blue-800"> Text Bites</a>.
159
+
<p class="text-sm mt-1">
160
+
by Daniel Morrisey
57
161
</p>
58
-
</div>
59
-
<div class="w-9/10 max-w-md mx-auto">
60
-
<br><br>
61
-
<p>© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
62
-
</div>
162
+
</footer>
163
+
63
164
</div>
64
165
</div>
65
-
<script src="/script/main.js"></script>
166
+
167
+
<script>
168
+
// Set the current year for the copyright notice
169
+
document.getElementById('currentYear').textContent = new Date().getFullYear();
170
+
</script>
66
171
</body>
67
-
</html>
172
+
</html>
-58
leaving.html
-58
leaving.html
···
1
-
<!DOCTYPE html>
2
-
<html lang="en">
3
-
<head>
4
-
<meta charset="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6
-
<title>Leaving danielmorrisey.com</title>
7
-
8
-
<!-- SEO: No-index this page as it's transitional content -->
9
-
<meta name="robots" content="noindex, nofollow">
10
-
11
-
<!-- External CSS -->
12
-
<!-- Tailwind CSS CDN -->
13
-
<script src="https://cdn.tailwindcss.com"></script>
14
-
15
-
</head>
16
-
<body class="bg-white text-gray-800">
17
-
<div id="__next">
18
-
<div>
19
-
<!-- Header: Consistent with the main page design -->
20
-
<header class="flex flex-col items-center py-12 md:py-16">
21
-
<div class="mb-8">
22
-
<a href="#" class="flex flex-col items-center">
23
-
<img src="/media/user-shield-solid-full.svg" alt="Profile Picture" class="w-16 h-16 mb-2"/>
24
-
<h1>Wait one second!</h1>
25
-
</a>
26
-
</div>
27
-
</header>
28
-
29
-
30
-
<!-- Content -->
31
-
<main class="w-9/10 max-w-md mx-auto text-center">
32
-
<div id="redirect-container">
33
-
<h3 class="mb-4 text-2xl font-medium">You are now leaving danielmorrisey.com</h3>
34
-
<p class="mb-2">
35
-
You will be automatically redirected in <strong id="countdown" class="text-xl">5</strong> seconds.
36
-
</p>
37
-
<p class="text-sm text-gray-600 mb-6">
38
-
Destination: <a id="destination-link" href="#" class="text-blue-600 break-all hover:underline"></a>
39
-
</p>
40
-
<button id="go-now-button" class="bg-blue-600 text-white font-bold py-2 px-4 rounded-lg hover:bg-blue-700 transition-colors">
41
-
Go Now
42
-
</button>
43
-
</div>
44
-
<div id="error-container" class="hidden">
45
-
<h3 class="mb-4 text-2xl font-medium text-red-600">Invalid Link</h3>
46
-
<p>A valid destination link was not provided. Please check the URL and try again.</p>
47
-
</div>
48
-
</main>
49
-
<div class="w-9/10 max-w-md mx-auto">
50
-
<br><br>
51
-
<p>© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
52
-
</div>
53
-
</div>
54
-
</div>
55
-
<script src="/script/leaving.js"></script>
56
-
<script src="/script/main.js"></script>
57
-
</body>
58
-
</html>
+158
-45
projects/index.html
+158
-45
projects/index.html
···
1
1
<!DOCTYPE html>
2
-
<html>
2
+
<html lang="en">
3
3
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
6
<title>Projects - Daniel Morrisey</title>
7
-
8
7
<meta name="description" content="From HTML to Python view all of Daniel Morriey's projects"/>
9
-
<meta name="keywords" content="Danile Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
8
+
9
+
<!-- Google Fonts for a clean font -->
10
+
<link rel="preconnect" href="https://fonts.googleapis.com">
11
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
12
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
13
+
14
+
<meta name="keywords" content="Daniel Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
10
15
<meta name="author" content="Daniel Morrisey"/>
11
16
12
17
<meta property="og:type" content="website"/>
···
17
22
18
23
<link rel="me" href="https://mastodon.social/@danielmorrisey"/>
19
24
<link rel="icon" type="image/x-icon" href="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg">
20
-
<script src="https://kit.fontawesome.com/0ca27f8db1.js" crossorigin="anonymous"></script>
25
+
26
+
<!-- Status Banner -->
27
+
<script src="https://uptime.betterstack.com/widgets/announcement.js" data-id="223534" async="async" type="text/javascript"></script>
28
+
29
+
<!-- Tailwind CSS CDN -->
21
30
<script src="https://cdn.tailwindcss.com"></script>
31
+
32
+
<!-- Font Awesome CDN -->
33
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" xintegrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
34
+
35
+
<style>
36
+
body {
37
+
font-family: 'Inter', sans-serif;
38
+
}
39
+
</style>
22
40
</head>
23
-
<body>
24
-
<div id="__next">
25
-
<div>
26
-
<header class="flex flex-col items-center py-12 md:py-16">
27
-
<div class="mb-8">
28
-
<a href="/index.html" class="flex flex-col items-center">
29
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-16 h-16 mb-2"/>
30
-
<h1 class="text-3xl font-bold">Daniel Morrisey</h1>
31
-
</a>
32
-
</div>
41
+
<body class="bg-gray-100 text-gray-800 antialiased leading-relaxed">
42
+
43
+
<!-- Main Container -->
44
+
<div class="min-h-screen flex items-center justify-center p-4">
45
+
46
+
<!-- Card-like container for the content -->
47
+
<div class="bg-white rounded-3xl shadow-xl p-8 md:p-12 w-full max-w-4xl">
48
+
49
+
<!-- Header Section -->
50
+
<header class="flex flex-col items-center mb-8 text-center">
51
+
<a href="/index.html" class="flex flex-col items-center">
52
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-24 h-24 mb-4 rounded-full shadow-lg"/>
53
+
<h1 class="text-3xl font-bold text-gray-900">Projects</h1>
54
+
<p class="text-lg text-gray-600 font-medium mt-1">From HTML to Python</p>
55
+
</a>
33
56
</header>
34
-
<div class="w-9/10 max-w-md mx-auto">
35
-
<!-- Search Bar -->
36
-
<div class="mb-5">
37
-
<input type="text" id="projectSearch" placeholder="Search projects..." class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
57
+
58
+
<hr class="border-gray-200 my-8">
59
+
60
+
<!-- Search Bar -->
61
+
<div class="mb-6">
62
+
<input type="text" id="projectSearch" placeholder="Search projects..." class="w-full px-4 py-2 border border-gray-300 rounded-full focus:outline-none focus:ring-2 focus:ring-indigo-500 transition duration-300">
63
+
</div>
64
+
65
+
<!-- Projects List Container -->
66
+
<div id="projectsList" class="space-y-6">
67
+
<div class="project-card bg-gray-50 p-6 rounded-2xl shadow-md">
68
+
<h4 class="text-xl font-semibold mb-2 text-gray-900 project-title-text">Image Scope</h4>
69
+
<div class="mb-4">
70
+
<code class="rounded-lg border bg-gray-100 px-2 py-1 text-sm block md:inline-block">
71
+
<a href="https://github.com/therealfuntimeswithdanny/imagescope" class="text-indigo-600 hover:text-indigo-800 transition-colors">
72
+
<i class="fa-brands fa-github"></i>/therealfuntimeswithdanny/imagescope
73
+
</a>
74
+
</code>
75
+
</div>
76
+
<p class="project-description mt-2 text-gray-700 leading-relaxed">
77
+
View random objects under a microscope. In a Tik Tok stye format.
78
+
</p>
79
+
<div class="mt-4 flex flex-wrap gap-4">
80
+
<a href="https://imagescope.madebydanny.uk" class="inline-flex items-center justify-center bg-gray-200 text-gray-800 py-2 px-4 rounded-full font-semibold hover:bg-gray-300 transition duration-300">
81
+
<i class="fa-solid fa-globe"></i>
82
+
</a>
83
+
</div>
38
84
</div>
39
-
40
-
<!-- Main Projects Heading -->
41
-
<h3 class="mb-2 mt-5 text-xl font-medium first:mt-0">Projects</h3>
42
-
43
-
<!-- Projects List Container -->
44
-
<div id="projectsList">
45
-
<!-- Project Card 1: Space Shooter -->
46
-
<div class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
47
-
<h4 class="mb-2 text-xl font-small project-title-text">Space Shooter (v1.3)</h4>
48
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><a href="/leaving.html?link=https://github.com/therealfuntimeswithdanny/space-shooter" class="text-blue-600 hover:underline"><i class="fa-brands fa-apple"></i>/therealfuntimeswithdanny/space-shooter</a></code><br><code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><a href="/leaving.html?link=https://github.com/therealfuntimeswithdanny/spaceshooter-windows" class="text-blue-600 hover:underline"><i class="fa-brands fa-windows"></i>/therealfuntimeswith.../spaceshooter-windows</a></code></p>
49
-
<p class="project-description mt-2 text-gray-700">
50
-
Space Shooter is a simple Space Invaders clone written in Python using Pygame. The game can run on MacOS & Windows.
51
-
</p>
52
-
<a href="/projects/space-shooter/index.html" class="text-blue-600 transition-colors hover:text-blue-800"> Download & Install</a> <a href="/projects/space-shooter/macos.html" class="text-blue-600 transition-colors hover:text-blue-800"><i class="fa-brands fa-apple"></i> <a href="/projects/space-shooter/windows.html" class="text-blue-600 transition-colors hover:text-blue-800"><i class="fa-brands fa-windows"></i></a>
85
+
<!-- Project Card 1: Space Shooter -->
86
+
<div class="project-card bg-gray-50 p-6 rounded-2xl shadow-md">
87
+
<h4 class="text-xl font-semibold mb-2 text-gray-900 project-title-text">Space Shooter (v1.3)</h4>
88
+
<div class="mb-4">
89
+
<code class="rounded-lg border bg-gray-100 px-2 py-1 text-sm block md:inline-block md:mb-0 mb-2">
90
+
<a href="https://github.com/therealfuntimeswithdanny/space-shooter" class="text-indigo-600 hover:text-indigo-800 transition-colors">
91
+
<i class="fa-brands fa-apple"></i>/therealfuntimeswithdanny/space-shooter
92
+
</a>
93
+
</code>
94
+
<code class="rounded-lg border bg-gray-100 px-2 py-1 text-sm block md:inline-block">
95
+
<a href="https://github.com/therealfuntimeswithdanny/spaceshooter-windows" class="text-indigo-600 hover:text-indigo-800 transition-colors">
96
+
<i class="fa-brands fa-windows"></i>/therealfuntimeswithdanny/spaceshooter-windows
97
+
</a>
98
+
</code>
99
+
</div>
100
+
<p class="project-description mt-2 text-gray-700 leading-relaxed">
101
+
Space Shooter is a simple Space Invaders clone written in Python using Pygame. The game can run on MacOS & Windows.
102
+
</p>
103
+
<div class="mt-4 flex flex-wrap gap-4">
104
+
<a href="/projects/space-shooter/index.html" class="inline-flex items-center justify-center bg-indigo-600 text-white py-2 px-4 rounded-full font-semibold hover:bg-indigo-700 transition duration-300 shadow-md">
105
+
Download & Install
106
+
</a>
107
+
<a href="/projects/space-shooter/macos.html" class="inline-flex items-center justify-center bg-gray-200 text-gray-800 py-2 px-4 rounded-full font-semibold hover:bg-gray-300 transition duration-300">
108
+
<i class="fa-brands fa-apple"></i>
109
+
</a>
110
+
<a href="/projects/space-shooter/windows.html" class="inline-flex items-center justify-center bg-gray-200 text-gray-800 py-2 px-4 rounded-full font-semibold hover:bg-gray-300 transition duration-300">
111
+
<i class="fa-brands fa-windows"></i>
112
+
</a>
53
113
</div>
114
+
</div>
54
115
55
-
<!-- Project Card 2: Ball Shooter -->
56
-
<div class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
57
-
<h4 class="mb-2 text-xl font-small project-title-text">Ball Shooter (v0.0.1)</h4>
58
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><a href="/leaving.html?link=https://github.com/therealfuntimeswithdanny/ball-shooter" class="text-blue-600 hover:underline"><i class="fa-brands fa-github"></i>/therealfuntimeswithdanny/ball-shooter</a></code></p>
59
-
<p class="project-description mt-2 text-gray-700">Ball Shooter is a simple game, where your goal is to destroy all blocks using a paddle and ball. The game is in development.</p>
116
+
<!-- Project Card 2: Ball Shooter -->
117
+
<div class="project-card bg-gray-50 p-6 rounded-2xl shadow-md">
118
+
<h4 class="text-xl font-semibold mb-2 text-gray-900 project-title-text">Ball Shooter (v0.0.1)</h4>
119
+
<div class="mb-4">
120
+
<code class="rounded-lg border bg-gray-100 px-2 py-1 text-sm block md:inline-block">
121
+
<a href="https://github.com/therealfuntimeswithdanny/ball-shooter" class="text-indigo-600 hover:text-indigo-800 transition-colors">
122
+
<i class="fa-brands fa-github"></i>/therealfuntimeswithdanny/ball-shooter
123
+
</a>
124
+
</code>
60
125
</div>
126
+
<p class="project-description mt-2 text-gray-700 leading-relaxed">
127
+
Ball Shooter is a simple game, where your goal is to destroy all blocks using a paddle and ball. The game is in development.
128
+
</p>
61
129
</div>
62
130
</div>
63
-
<div class="w-9/10 max-w-md mx-auto">
64
-
<br><br>
65
-
<p class="text-center text-gray-500">© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
66
-
</div>
131
+
132
+
<!-- Footer -->
133
+
<footer class="mt-12 pt-4 text-center text-gray-500 border-t border-gray-200">
134
+
<div class="flex justify-center space-x-6 mb-4 text-lg">
135
+
<a href="javascript:history.back()" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-arrow-left"></i> Back</a>
136
+
<a href="/index.html" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-house"></i> Home</a>
137
+
</div>
138
+
<!-- Centered Iframe -->
139
+
<div class="flex justify-center mt-8">
140
+
<iframe src="https://status.madebydanny.uk/badge?theme=light" width="200" height="30" frameborder="0" scrolling="no" style="color-scheme: normal"></iframe>
141
+
</div>
142
+
<p>
143
+
© 2024-<span id="currentYear"></span>
144
+
<a href="https://madebydanny.uk" class="hover:text-indigo-600 transition duration-300 font-medium">Made by Danny UK</a>
145
+
</p>
146
+
<p class="text-sm mt-1">
147
+
by Daniel Morrisey
148
+
</p>
149
+
</footer>
150
+
67
151
</div>
68
152
</div>
69
-
<script src="/script/main.js"></script>
70
-
<script src="/script/search.js"></script>
153
+
154
+
<script>
155
+
// Set the current year for the copyright notice
156
+
document.getElementById('currentYear').textContent = new Date().getFullYear();
157
+
158
+
// Get the search input and all project cards
159
+
const searchInput = document.getElementById('projectSearch');
160
+
const projectCards = document.querySelectorAll('.project-card');
161
+
162
+
// Add a 'keyup' event listener to the search input
163
+
searchInput.addEventListener('keyup', (e) => {
164
+
// Get the value from the search input and convert it to lowercase
165
+
const searchValue = e.target.value.toLowerCase();
166
+
167
+
// Loop through each project card to check for a match
168
+
projectCards.forEach(card => {
169
+
// Get the title and description text from the current card
170
+
const title = card.querySelector('.project-title-text').textContent.toLowerCase();
171
+
const description = card.querySelector('.project-description').textContent.toLowerCase();
172
+
173
+
// Check if the search value is found in either the title or description
174
+
if (title.includes(searchValue) || description.includes(searchValue)) {
175
+
// If it's a match, show the card
176
+
card.style.display = 'block';
177
+
} else {
178
+
// If it's not a match, hide the card
179
+
card.style.display = 'none';
180
+
}
181
+
});
182
+
});
183
+
</script>
71
184
</body>
72
185
</html>
+125
-57
projects/space-shooter/macos.html
+125
-57
projects/space-shooter/macos.html
···
1
1
<!DOCTYPE html>
2
-
<html>
2
+
<html lang="en">
3
3
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
6
<title>Space Shooter (MacOS) - Daniel Morrisey</title>
7
7
8
8
<meta name="description" content="Space Shooter is a simple Space Invaders clone written in Python using Pygame. The game can run on MacOS in 5 simple steps, Windows support coming soon."/>
···
15
15
<meta property="og:description" content="Space Shooter is a simple Space Invaders clone written in Python using Pygame. The game can run on MacOS in 5 simple steps, Windows support coming soon. "/>
16
16
<meta property="og:image" content="https://public-danielmorrisey-com.danielmorrisey.com/media/banner.jpg"/>
17
17
18
-
<link rel="me" href="https://mastodon.social/@danielmorrisey"/>
19
-
<link rel="icon" type="image/x-icon" href="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg">
20
-
<script src="https://kit.fontawesome.com/0ca27f8db1.js" crossorigin="anonymous"></script>
18
+
<!-- Google Fonts for a clean font -->
19
+
<link rel="preconnect" href="https://fonts.googleapis.com">
20
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
21
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
22
+
23
+
<!-- Tailwind CSS CDN -->
21
24
<script src="https://cdn.tailwindcss.com"></script>
25
+
26
+
<!-- Font Awesome CDN -->
27
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" xintegrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
22
28
29
+
<style>
30
+
body {
31
+
font-family: 'Inter', sans-serif;
32
+
}
33
+
</style>
23
34
</head>
24
-
<body>
25
-
<div id="__next">
26
-
<div>
27
-
<header class="flex flex-col items-center py-12 md:py-16">
28
-
<div class="mb-8">
29
-
<a href="/index.html" class="flex flex-col items-center">
30
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-16 h-16 mb-2"/>
31
-
<h1 class="text-3xl font-bold">Daniel Morrisey</h1>
32
-
</a>
33
-
</div>
35
+
<body class="bg-gray-100 text-gray-800 antialiased leading-relaxed">
36
+
37
+
<!-- Main Container -->
38
+
<div class="min-h-screen flex items-center justify-center p-4">
39
+
40
+
<!-- Card-like container for the content -->
41
+
<div class="bg-white rounded-3xl shadow-xl p-8 md:p-12 w-full max-w-4xl">
42
+
43
+
<!-- Header Section -->
44
+
<header class="flex flex-col items-center mb-8 text-center">
45
+
<a href="/index.html" class="flex flex-col items-center">
46
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-24 h-24 mb-4 rounded-full shadow-lg"/>
47
+
<h1 class="text-3xl font-bold text-gray-900">Projects</h1>
48
+
<p class="text-lg text-gray-600 font-medium mt-1">From HTML to Python</p>
49
+
</a>
34
50
</header>
35
-
<div class="w-9/10 max-w-md mx-auto">
36
-
37
-
<!-- Main Projects Heading -->
38
-
<h3 class="mb-2 mt-5 text-xl font-medium first:mt-0">Space Shooter</h3>
51
+
52
+
<hr class="border-gray-200 my-8">
53
+
54
+
<!-- Post Content -->
55
+
<article class="prose max-w-none prose-indigo">
56
+
<h1 class="text-3xl font-bold text-gray-900 mt-0">Space Shooter (MacOS)</h1>
57
+
<p class="text-lg text-gray-700">
58
+
Space Shooter is a simple Space Invaders clone written in Python using Pygame. The game can run on MacOS in five simple steps. Windows support coming soon.
59
+
</p>
39
60
40
-
<!-- Projects List Container -->
41
-
<div id="projectsList">
42
-
<!-- Project Card 1: Space Shooter -->
43
-
<div class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
44
-
<h4 class="mb-2 text-xl font-small project-title-text">Space Shooter (v1.2.3)</h4>
45
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><a href="/leaving.html?link=https://github.com/therealfuntimeswithdanny/space-shooter" class="text-blue-600 hover:underline"><i class="fa-brands fa-github"></i>/therealfuntimeswithdanny/space-shooter</a></code></p>
46
-
<p class="project-description mt-2 text-gray-700">
47
-
Space Shooter is a simple Space Invaders clone written in Python using Pygame. The game can run on MacOS in five simple steps, Windows support coming soon.
48
-
</p>
49
-
<br>
50
-
<h4 class="mb-2 text-xl font-small project-title-text">Install</h4>
51
-
<h3 class="mb-2 text-xl font-small project-title-text">Step 1</h3>
52
-
<p id="macos" class="project-description mt-2 text-gray-700"> Download for <i class="fa-brands fa-apple"></i> MacOS</p>
53
-
<p><code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><a href="/leaving.html?link=https://github.com/therealfuntimeswithdanny/space-shooter/releases/download/v1.3/Space.Shooter.app.zip">.app (Best Option)</a></code> <code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><a href="/leaving.html?link=https://github.com/therealfuntimeswithdanny/space-shooter/archive/refs/tags/v1.3.tar.gz">.tar</a></code> <code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><a href="/leaving.html?link=https://github.com/therealfuntimeswithdanny/space-shooter/archive/refs/tags/v1.3.zip">.zip</a></code></p>
54
-
<h3 class="mb-2 text-xl font-small project-title-text"><br>Step 2</h3>
55
-
<p class="project-description mt-2 text-gray-700">Look for <code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm">Space Shooter</code> click it once.</p>
56
-
<br>
57
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/Screenshot%202025-08-07%20at%2016.57.55.png" alt="Space Shooter MacOS" class="w-full h-auto mb-4 rounded-lg shadow-sm"/>
58
-
<h3 class="mb-2 text-xl font-small project-title-text"><br>Step 3</h3>
59
-
Once you open the app you will get a pop-up saying that the app is from an unidentified developer, this is because I am not a registered Apple Developer, just click <code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm">Done</code>.
60
-
<br>
61
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/Screenshot%202025-08-07%20at%2017.02.56.png" alt="Space Shooter MacOS" class="w-full h-auto mb-4 rounded-lg shadow-sm"/>
62
-
<h3 class="mb-2 text-xl font-small project-title-text"><br>Step 4</h3>
63
-
<p class="project-description mt-2 text-gray-700">I don't feel like paying $100/year so apple can let people use my apps so in the mean time we need to do this.</p>
64
-
<p class="project-description mt-2 text-gray-700"><br>Open system settings witch can be done by pressing <code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm">CMD + SPACE</code> on your keyboard, then type in settings and hit enter.</p>
65
-
<p class="project-description mt-2 text-gray-700"><br>Once you are in settings, click on <code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm">Privacy & Security</code> and scroll down to the bottom of the page.</p>
66
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/Screenshot%202025-08-07%20at%2017.04.17.png" alt="Space Shooter MacOS" class="w-full h-auto mb-4 rounded-lg shadow-sm"/>
67
-
<h3 class="mb-2 text-xl font-small project-title-text"><br>Step 5</h3>
68
-
<p class="project-description mt-2 text-gray-700">Once you click <code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm">Open Anyway</code> you will see the game window open, you can now play Space Shooter!</p>
69
-
<p class="project-description mt-2 text-gray-700"><br>If you want to play the game again, you will need to repeat step 2!</p>
61
+
<!-- Project Info Section -->
62
+
<div class="mt-8 p-6 bg-gray-50 rounded-2xl shadow-md">
63
+
<h4 class="text-xl font-semibold mb-2 text-gray-900">Space Shooter (v1.2.3)</h4>
64
+
<p class="text-sm text-gray-600 mb-4">
65
+
<i class="fa-brands fa-github"></i>
66
+
<a href="https://github.com/therealfuntimeswithdanny/space-shooter" class="text-indigo-600 hover:text-indigo-800 transition-colors font-medium">/therealfuntimeswithdanny/space-shooter</a>
67
+
</p>
68
+
<p class="text-gray-700 leading-relaxed">
69
+
This game is a simple Space Invaders clone.
70
+
</p>
71
+
</div>
72
+
73
+
<!-- Install Section -->
74
+
<div class="mt-8">
75
+
<h4 class="text-xl font-semibold mb-4 text-gray-900">Install</h4>
76
+
77
+
<!-- Step 1 -->
78
+
<div class="mb-6 p-6 bg-gray-50 rounded-2xl shadow-md">
79
+
<h5 class="text-lg font-semibold mb-2"><code class="rounded-lg border bg-gray-200 px-2 py-1 text-sm font-medium">Step 1</code>: Download for <i class="fa-brands fa-apple"></i> MacOS</h5>
80
+
<p class="text-gray-700 mb-4">Choose your preferred download format:</p>
81
+
<div class="flex flex-wrap gap-2">
82
+
<a href="https://github.com/therealfuntimeswithdanny/space-shooter/releases/download/v1.3/Space.Shooter.app.zip" class="inline-block bg-indigo-600 text-white px-4 py-2 rounded-full text-sm font-medium hover:bg-indigo-700 transition duration-300">.app (Best Option)</a>
83
+
<a href="https://github.com/therealfuntimeswithdanny/space-shooter/archive/refs/tags/v1.3.tar.gz" class="inline-block bg-gray-200 text-gray-800 px-4 py-2 rounded-full text-sm font-medium hover:bg-gray-300 transition duration-300">.tar</a>
84
+
<a href="https://github.com/therealfuntimeswithdanny/space-shooter/archive/refs/tags/v1.3.zip" class="inline-block bg-gray-200 text-gray-800 px-4 py-2 rounded-full text-sm font-medium hover:bg-gray-300 transition duration-300">.zip</a>
85
+
</div>
70
86
</div>
87
+
88
+
<!-- Step 2 -->
89
+
<div class="mb-6 p-6 bg-gray-50 rounded-2xl shadow-md">
90
+
<h5 class="text-lg font-semibold mb-2"><code class="rounded-lg border bg-gray-200 px-2 py-1 text-sm font-medium">Step 2</code>: Locate and Open</h5>
91
+
<p class="text-gray-700">Look for the app named `Space Shooter` and double-click to open it.</p>
92
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/Screenshot%202025-08-07%20at%2016.57.55.png" alt="Space Shooter MacOS" class="w-full rounded-2xl shadow-lg my-6"/>
93
+
</div>
94
+
95
+
<!-- Step 3 -->
96
+
<div class="mb-6 p-6 bg-gray-50 rounded-2xl shadow-md">
97
+
<h5 class="text-lg font-semibold mb-2"><code class="rounded-lg border bg-gray-200 px-2 py-1 text-sm font-medium">Step 3</code>: Handle Unidentified Developer Warning</h5>
98
+
<p class="text-gray-700">A pop-up will appear stating the app is from an unidentified developer. This is because I am not a registered Apple Developer. Simply click <code class="bg-gray-200 rounded px-1 text-sm font-mono">Done</code>.</p>
99
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/Screenshot%202025-08-07%20at%2017.02.56.png" alt="Space Shooter MacOS" class="w-full rounded-2xl shadow-lg my-6"/>
100
+
</div>
101
+
102
+
<!-- Step 4 -->
103
+
<div class="mb-6 p-6 bg-gray-50 rounded-2xl shadow-md">
104
+
<h5 class="text-lg font-semibold mb-2"><code class="rounded-lg border bg-gray-200 px-2 py-1 text-sm font-medium">Step 4</code>: Bypass Security Settings</h5>
105
+
<p class="text-gray-700 mb-2">Since I don't pay for an Apple Developer license, you need to manually allow the app. Here's how:</p>
106
+
<ul class="list-disc list-inside text-gray-700 space-y-2">
107
+
<li>Open **System Settings** by pressing <code class="bg-gray-200 rounded px-1 text-sm font-mono">CMD + SPACE</code> on your keyboard, typing `settings`, and hitting enter.</li>
108
+
<li>Navigate to **Privacy & Security** and scroll to the bottom.</li>
109
+
</ul>
110
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/Screenshot%202025-08-07%20at%2017.04.17.png" alt="Space Shooter MacOS" class="w-full rounded-2xl shadow-lg my-6"/>
111
+
</div>
112
+
113
+
<!-- Step 5 -->
114
+
<div class="mb-6 p-6 bg-gray-50 rounded-2xl shadow-md">
115
+
<h5 class="text-lg font-semibold mb-2"><code class="rounded-lg border bg-gray-200 px-2 py-1 text-sm font-medium">Step 5</code>: Open Anyway and Play</h5>
116
+
<p class="text-gray-700">Once you click <code class="bg-gray-200 rounded px-1 text-sm font-mono">Open Anyway</code>, the game window will appear and you can start playing! Remember that you'll need to repeat **Step 2** each time you want to play the game.</p>
117
+
</div>
118
+
119
+
</div>
120
+
</article>
121
+
122
+
<!-- Footer -->
123
+
<footer class="mt-12 pt-4 text-center text-gray-500 border-t border-gray-200">
124
+
<div class="flex justify-center space-x-6 mb-4 text-lg">
125
+
<a href="javascript:history.back()" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-arrow-left"></i> Back</a>
126
+
<a href="/index.html" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-house"></i> Home</a>
127
+
</div>
128
+
<!-- Centered Iframe -->
129
+
<div class="flex justify-center mt-8">
130
+
<iframe src="https://status.madebydanny.uk/badge?theme=light" width="200" height="30" frameborder="0" scrolling="no" style="color-scheme: normal"></iframe>
71
131
</div>
72
-
</div>
73
-
<div class="w-9/10 max-w-md mx-auto">
74
-
<br><br>
75
-
<p class="text-center text-gray-500">© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
76
-
</div>
132
+
<p>
133
+
© 2024-<span id="currentYear"></span>
134
+
<a href="https://madebydanny.uk" class="hover:text-indigo-600 transition duration-300 font-medium">Made by Danny UK</a>
135
+
</p>
136
+
<p class="text-sm mt-1">
137
+
by Daniel Morrisey
138
+
</p>
139
+
</footer>
140
+
77
141
</div>
78
142
</div>
79
-
<script src="/script/main.js"></script>
143
+
144
+
<script>
145
+
// Set the current year for the copyright notice
146
+
document.getElementById('currentYear').textContent = new Date().getFullYear();
147
+
</script>
80
148
</body>
81
-
</html>
149
+
</html>
-62
script/leaving.js
-62
script/leaving.js
···
1
-
// --- REDIRECTION SCRIPT ---
2
-
3
-
// Get DOM elements
4
-
const countdownElement = document.getElementById('countdown');
5
-
const destinationLinkElement = document.getElementById('destination-link');
6
-
const goNowButton = document.getElementById('go-now-button');
7
-
const redirectContainer = document.getElementById('redirect-container');
8
-
const errorContainer = document.getElementById('error-container');
9
-
10
-
// Get the destination URL from the '?link=' parameter
11
-
const params = new URLSearchParams(window.location.search);
12
-
const destinationUrl = params.get('link');
13
-
14
-
// Function to perform the redirection
15
-
const redirectToDestination = () => {
16
-
if (destinationUrl) {
17
-
window.location.href = destinationUrl;
18
-
}
19
-
};
20
-
21
-
// Validate the URL
22
-
if (destinationUrl) {
23
-
try {
24
-
// Check if the URL is valid
25
-
new URL(destinationUrl);
26
-
27
-
// Update the link on the page for user visibility
28
-
destinationLinkElement.href = destinationUrl;
29
-
destinationLinkElement.textContent = destinationUrl;
30
-
31
-
// Set initial countdown value
32
-
let secondsLeft = 5;
33
-
34
-
// Set up the final redirect timer
35
-
const redirectTimer = setTimeout(redirectToDestination, secondsLeft * 1000);
36
-
37
-
// Set up the interval to update the countdown display every second
38
-
const countdownInterval = setInterval(() => {
39
-
secondsLeft--;
40
-
countdownElement.textContent = secondsLeft;
41
-
if (secondsLeft <= 0) {
42
-
clearInterval(countdownInterval);
43
-
}
44
-
}, 1000);
45
-
46
-
// Add event listener for the "Go Now" button
47
-
goNowButton.addEventListener('click', () => {
48
-
clearTimeout(redirectTimer); // Clear the scheduled redirect
49
-
clearInterval(countdownInterval); // Stop the countdown
50
-
redirectToDestination(); // Redirect immediately
51
-
});
52
-
53
-
} catch (e) {
54
-
// Handle invalid URL format
55
-
redirectContainer.classList.add('hidden');
56
-
errorContainer.classList.remove('hidden');
57
-
}
58
-
} else {
59
-
// Handle case where '?link=' parameter is missing
60
-
redirectContainer.classList.add('hidden');
61
-
errorContainer.classList.remove('hidden');
62
-
}
-4
script/main.js
-4
script/main.js
-41
script/search.js
-41
script/search.js
···
1
-
/**
2
-
* This script adds search functionality to the page and updates the copyright year.
3
-
*/
4
-
document.addEventListener('DOMContentLoaded', function() {
5
-
// --- Copyright Year Updater ---
6
-
// Finds the 'currentYear' span and sets its text to the current year.
7
-
const currentYearSpan = document.getElementById('currentYear');
8
-
if (currentYearSpan) {
9
-
currentYearSpan.textContent = new Date().getFullYear();
10
-
}
11
-
12
-
// --- Search Functionality ---
13
-
const searchInput = document.getElementById('projectSearch');
14
-
const projectCards = document.querySelectorAll('.project-card'); // Select all project cards
15
-
16
-
// Listen for the 'input' event, which is more responsive than 'keyup' for this purpose.
17
-
// It fires immediately when the value of the input element changes.
18
-
searchInput.addEventListener('input', function() {
19
-
// Get the search term and convert it to lowercase for case-insensitive matching.
20
-
const searchTerm = searchInput.value.toLowerCase();
21
-
22
-
// Loop through each project card to see if it matches the search term.
23
-
projectCards.forEach(card => {
24
-
// Get the title and description elements within the current card.
25
-
const titleElement = card.querySelector('.project-title-text');
26
-
const descriptionElement = card.querySelector('.project-description');
27
-
28
-
// Extract text content and convert to lowercase for comparison.
29
-
// If an element doesn't exist, default to an empty string.
30
-
const titleText = titleElement ? titleElement.textContent.toLowerCase() : '';
31
-
const descriptionText = descriptionElement ? descriptionElement.textContent.toLowerCase() : '';
32
-
33
-
// Check if the search term is found in either the title or description.
34
-
if (titleText.includes(searchTerm) || descriptionText.includes(searchTerm)) {
35
-
card.style.display = ''; // Show the project card if it matches.
36
-
} else {
37
-
card.style.display = 'none'; // Hide the project card if it doesn't match.
38
-
}
39
-
});
40
-
});
41
-
});
-86
search.html
-86
search.html
···
1
-
<!DOCTYPE html>
2
-
<html>
3
-
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6
-
<title>Search Text Bites - Daniel Morrisey</title>
7
-
<meta name="description" content="Search through Daniel Morrisey's Text Bites"/>
8
-
<meta name="keywords" content="Danile Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
9
-
<meta name="author" content="Daniel Morrisey"/>
10
-
<meta property="og:type" content="website"/>
11
-
<meta property="og:url" content="https://danielmorrisey.com/"/>
12
-
<meta property="og:title" content="Search Text Bites - Daniel Morrisey"/>
13
-
<meta property="og:description" content="Search through Daniel Morrisey's Text Bites"/>
14
-
<meta property="og:image" content="https://public-danielmorrisey-com.danielmorrisey.com/media/banner.jpg"/>
15
-
<link rel="me" href="https://mastodon.social/@danielmorrisey"/>
16
-
<link rel="icon" type="image/x-icon" href="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg">
17
-
<script src="https://kit.fontawesome.com/0ca27f8db1.js" crossorigin="anonymous"></script>
18
-
<script src="https://cdn.tailwindcss.com"></script>
19
-
</head>
20
-
<body>
21
-
<div id="__next">
22
-
<div>
23
-
<header class="flex flex-col items-center py-12 md:py-16">
24
-
<div class="mb-8">
25
-
<a href="/index.html" class="flex flex-col items-center">
26
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-16 h-16 mb-2 rounded-full"/>
27
-
<h1 class="text-3xl font-bold">Daniel Morrisey</h1>
28
-
</a>
29
-
</div>
30
-
</header>
31
-
<div class="w-9/10 max-w-md mx-auto">
32
-
<!-- Search Bar -->
33
-
<div class="mb-5">
34
-
<input type="text" id="projectSearch" placeholder="Search Text Bites..." class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
35
-
</div>
36
-
<h3 class="mb-2 mt-5 text-xl font-medium first:mt-0">Search Results</h3>
37
-
<div id="projectsList">
38
-
<!-- blueskydeck.html -->
39
-
<div class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
40
-
<h4 class="mb-2 text-xl font-small project-title-text">We need a Bluesky version of mastodon’s deck layout</h4>
41
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><i class="fa-solid fa-calendar"></i> Sun Aug 3, <i class="fa-solid fa-clock"></i> 50 Sec</code>
42
-
<p class="project-description mt-2 text-gray-700">
43
-
Just like Mastodon, Threads also has a “deck” layout for desktop users. And my 3 main social media platforms I use are Bluesky, Mastodon, and Threads. Having a Bluesky Deck layout for desktop would be nice to have.
44
-
</p>
45
-
<a href="blueskydeck.html" class="text-blue-600 transition-colors hover:text-blue-800">Read More...</a>
46
-
</div>
47
-
<!-- thepowerofhashtags.html -->
48
-
<div class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
49
-
<h4 class="mb-2 text-xl font-small project-title-text">The Power of Hashtags</h4>
50
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><i class="fa-solid fa-calendar"></i> Sun Aug 3, <i class="fa-solid fa-clock"></i> 1 Min</code>
51
-
<p class="project-description mt-2 text-gray-700">
52
-
All it takes is one # to reach an audience of 100+
53
-
</p>
54
-
<a href="thepowerofhashtags.html" class="text-blue-600 transition-colors hover:text-blue-800">Read More...</a>
55
-
</div>
56
-
<!-- igotamacmini.html -->
57
-
<div class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
58
-
<h4 class="mb-2 text-xl font-small project-title-text">I got a Mac Mini</h4>
59
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><i class="fa-solid fa-calendar"></i> Tue Aug 5, <i class="fa-solid fa-clock"></i> 1 Min</code>
60
-
<p class="project-description mt-2 text-gray-700">
61
-
It might be mini, but it sure is fast!
62
-
</p>
63
-
<a href="igotamacmini.html" class="text-blue-600 transition-colors hover:text-blue-800">Read More...</a>
64
-
</div>
65
-
<!-- index.html -->
66
-
<div class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
67
-
<h4 class="mb-2 text-xl font-small project-title-text">Text Bites</h4>
68
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><i class="fa-solid fa-calendar"></i> Sun Aug 3, <i class="fa-solid fa-clock"></i> 1 Min</code>
69
-
<p class="project-description mt-2 text-gray-700">
70
-
From news to things you don't care about read all of Daniel Morriey's Text Bites
71
-
</p>
72
-
<a href="index.html" class="text-blue-600 transition-colors hover:text-blue-800">Read More...</a>
73
-
</div>
74
-
</div>
75
-
<p class="mt-8 text-center">
76
-
<a href="/index.html" class="text-blue-600 transition-colors hover:text-blue-800"><i class="fa-solid fa-house"></i> Home</a>
77
-
</p>
78
-
<p class="text-center">© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
79
-
<hr>
80
-
<br>
81
-
</div>
82
-
</div>
83
-
</div>
84
-
<script src="/script/search.js"></script>
85
-
</body>
86
-
</html>
status.html
status.html
This is a binary file and will not be displayed.
-315
status.js
-315
status.js
···
1
-
class StatusBanner extends HTMLElement {
2
-
constructor() {
3
-
super();
4
-
this.attachShadow({ mode: 'open' });
5
-
this.API_HEARTBEAT_URL = 'https://uptime-kuma-cros.madebydannyuk.workers.dev/api/status-page/heartbeat/public';
6
-
this.API_STATUS_PAGE_URL = 'https://uptime-kuma-cros.madebydannyuk.workers.dev/api/status-page/public';
7
-
this.ORIGINAL_STATUS_PAGE_URL = 'https://status.danielmorrisey.com/';
8
-
this.MOCK_DATA = {
9
-
heartbeatList: {
10
-
"1": [{ status: 1, time: new Date().toISOString(), msg: "OK", ping: 50 }],
11
-
"2": [{ status: 0, time: new Date().toISOString(), msg: "Timeout", ping: null }],
12
-
"3": [{ status: 3, time: new Date().toISOString(), msg: "Maintenance", ping: 120 }],
13
-
},
14
-
uptimeList: { "1_24": 0.999, "2_24": 0.85, "3_24": 0.95 },
15
-
incident: {
16
-
title: "Investigating Connectivity Issues (Mock)",
17
-
content: "This is a mock incident to show how the banner works. Updates will be provided on our full status page.",
18
-
style: "warning",
19
-
pin: true
20
-
}
21
-
};
22
-
this.intervalId = null;
23
-
}
24
-
25
-
connectedCallback() {
26
-
this.render();
27
-
this.initializeStatusPage();
28
-
this.intervalId = setInterval(() => this.initializeStatusPage(), 60000);
29
-
window.addEventListener('resize', () => this.adjustBodyPadding());
30
-
}
31
-
32
-
disconnectedCallback() {
33
-
if (this.intervalId) {
34
-
clearInterval(this.intervalId);
35
-
}
36
-
window.removeEventListener('resize', () => this.adjustBodyPadding());
37
-
}
38
-
39
-
render() {
40
-
this.shadowRoot.innerHTML = `
41
-
<style>
42
-
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
43
-
44
-
:host {
45
-
all: initial;
46
-
display: block;
47
-
}
48
-
49
-
body {
50
-
font-family: 'Inter', sans-serif;
51
-
background-color: transparent;
52
-
margin: 0;
53
-
padding: 0;
54
-
box-sizing: border-box;
55
-
transition: padding-top 0.3s ease-in-out;
56
-
}
57
-
58
-
.overall-status-banner {
59
-
display: flex;
60
-
flex-direction: column;
61
-
align-items: flex-start;
62
-
padding: 1rem 1.25rem;
63
-
border-bottom: 1px solid;
64
-
font-weight: 500;
65
-
font-size: 0.875rem;
66
-
width: 100%;
67
-
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
68
-
margin-bottom: 0;
69
-
font-family: 'Inter', sans-serif;
70
-
}
71
-
.overall-status-banner.hidden {
72
-
display: none;
73
-
}
74
-
75
-
/* Dynamic Color Styles */
76
-
.status-style-warning { background-color: #fef9e6; border-color: #fce7b0; color: #4b3e21; }
77
-
.status-style-warning .status-icon, .status-style-warning .status-text a { color: #d17800; }
78
-
.status-style-danger { background-color: #fee2e2; border-color: #fca5a5; color: #991b1b; }
79
-
.status-style-danger .status-icon, .status-style-danger .status-text a { color: #dc2626; }
80
-
.status-style-info { background-color: #e0f2fe; border-color: #93c5fd; color: #1e40af; }
81
-
.status-style-info .status-icon, .status-style-info .status-text a { color: #3b82f6; }
82
-
.status-style-primary { background-color: #eef2ff; border-color: #c7d2fe; color: #4338ca; }
83
-
.status-style-primary .status-icon, .status-style-primary .status-text a { color: #6366f1; }
84
-
.status-style-light { background-color: #f9fafb; border-color: #e5e7eb; color: #374151; }
85
-
.status-style-light .status-icon, .status-style-light .status-text a { color: #9ca3af; }
86
-
.status-style-dark { background-color: #1f2937; border-color: #4b5563; color: #f9fafb; }
87
-
.status-style-dark .status-icon, .status-style-dark .status-text a { color: #d1d5db; }
88
-
89
-
.status-header {
90
-
display: flex;
91
-
align-items: center;
92
-
width: 100%;
93
-
}
94
-
.status-icon {
95
-
font-size: 1.5rem;
96
-
margin-right: 1rem;
97
-
line-height: 1;
98
-
}
99
-
.status-text {
100
-
flex-grow: 1;
101
-
text-align: left;
102
-
}
103
-
.status-text strong {
104
-
font-weight: 700;
105
-
margin-right: 0.25rem;
106
-
}
107
-
.status-text a {
108
-
text-decoration: underline;
109
-
font-weight: 600;
110
-
}
111
-
.close-button {
112
-
background: none;
113
-
border: none;
114
-
cursor: pointer;
115
-
font-size: 1rem;
116
-
color: #a1a1aa;
117
-
padding: 0.25rem;
118
-
line-height: 1;
119
-
margin-left: 1rem;
120
-
}
121
-
.incident-detail {
122
-
width: 100%;
123
-
font-size: 0.8rem;
124
-
text-align: left;
125
-
padding-left: calc(1.5rem + 1rem);
126
-
margin-top: 0.5rem;
127
-
line-height: 1.4;
128
-
}
129
-
.incident-detail.hidden {
130
-
display: none;
131
-
}
132
-
.loading-spinner {
133
-
border: 4px solid rgba(0, 0, 0, 0.1);
134
-
border-left-color: #3b82f6;
135
-
border-radius: 50%;
136
-
width: 24px;
137
-
height: 24px;
138
-
animation: spin 1s linear infinite;
139
-
margin: 1rem auto;
140
-
display: none;
141
-
}
142
-
@keyframes spin {
143
-
0% { transform: rotate(0deg); }
144
-
100% { transform: rotate(360deg); }
145
-
}
146
-
</style>
147
-
148
-
<div id="status-banner" class="overall-status-banner hidden">
149
-
<div class="status-header">
150
-
<span id="status-icon" class="status-icon"></span>
151
-
<div id="status-text" class="flex-grow"></div>
152
-
<button id="close-button" class="close-button">×</button>
153
-
</div>
154
-
<div id="incident-detail" class="incident-detail hidden"></div>
155
-
</div>
156
-
157
-
<div id="loading-indicator" class="loading-spinner"></div>
158
-
`;
159
-
}
160
-
161
-
adjustBodyPadding() {
162
-
const statusBanner = this.shadowRoot.getElementById('status-banner');
163
-
if (!statusBanner.classList.contains('hidden')) {
164
-
document.body.style.paddingTop = statusBanner.offsetHeight + 'px';
165
-
} else {
166
-
document.body.style.paddingTop = '0';
167
-
}
168
-
}
169
-
170
-
async initializeStatusPage() {
171
-
const loadingIndicator = this.shadowRoot.getElementById('loading-indicator');
172
-
const statusBanner = this.shadowRoot.getElementById('status-banner');
173
-
174
-
statusBanner.classList.add('hidden');
175
-
loadingIndicator.style.display = 'block';
176
-
document.body.style.paddingTop = '0';
177
-
178
-
let heartbeatData = await this.fetchData(this.API_HEARTBEAT_URL, 'heartbeat');
179
-
let statusPageData = await this.fetchData(this.API_STATUS_PAGE_URL, 'status page');
180
-
181
-
if (!heartbeatData && !statusPageData) {
182
-
heartbeatData = this.MOCK_DATA;
183
-
statusPageData = this.MOCK_DATA;
184
-
} else if (!heartbeatData) {
185
-
heartbeatData = this.MOCK_DATA;
186
-
} else if (!statusPageData) {
187
-
statusPageData = { incident: null };
188
-
}
189
-
190
-
this.renderStatus(heartbeatData, statusPageData);
191
-
}
192
-
193
-
async fetchData(url, dataType, retries = 0) {
194
-
const maxRetries = 5;
195
-
const baseDelay = 1000;
196
-
try {
197
-
const response = await fetch(url);
198
-
if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
199
-
return await response.json();
200
-
} catch (error) {
201
-
console.error(`Error fetching ${dataType} data:`, error);
202
-
if (retries < maxRetries) {
203
-
const delay = baseDelay * Math.pow(2, retries) + Math.random() * 1000;
204
-
await new Promise(resolve => setTimeout(resolve, delay));
205
-
return this.fetchData(url, dataType, retries + 1);
206
-
} else {
207
-
console.warn(`Max retries reached for ${dataType} data. Using mock data as fallback.`);
208
-
return null;
209
-
}
210
-
}
211
-
}
212
-
213
-
calculateOverallStatus(heartbeatList) {
214
-
if (!heartbeatList || Object.keys(heartbeatList).length === 0) return 'unknown';
215
-
let hasDown = false;
216
-
let hasPendingOrMaintenance = false;
217
-
let allDown = true;
218
-
let activeMonitors = 0;
219
-
220
-
for (const monitorId in heartbeatList) {
221
-
const heartbeats = heartbeatList[monitorId];
222
-
if (heartbeats && heartbeats.length > 0) {
223
-
activeMonitors++;
224
-
heartbeats.sort((a, b) => new Date(b.time) - new Date(a.time));
225
-
const latestStatus = heartbeats[0].status;
226
-
if (latestStatus === 0) hasDown = true;
227
-
else allDown = false;
228
-
if (latestStatus === 2 || latestStatus === 3) hasPendingOrMaintenance = true;
229
-
} else {
230
-
allDown = false;
231
-
}
232
-
}
233
-
if (activeMonitors === 0) return 'unknown';
234
-
if (hasDown) return allDown ? 'major-outage' : 'partial-outage';
235
-
if (hasPendingOrMaintenance) return 'degraded';
236
-
return 'operational';
237
-
}
238
-
239
-
renderStatus(heartbeatData, statusPageData) {
240
-
const overallStatus = this.calculateOverallStatus(heartbeatData.heartbeatList);
241
-
const loadingIndicator = this.shadowRoot.getElementById('loading-indicator');
242
-
const statusBanner = this.shadowRoot.getElementById('status-banner');
243
-
const statusText = this.shadowRoot.getElementById('status-text');
244
-
const statusIcon = this.shadowRoot.getElementById('status-icon');
245
-
const closeButton = this.shadowRoot.getElementById('close-button');
246
-
const incidentDetail = this.shadowRoot.getElementById('incident-detail');
247
-
248
-
loadingIndicator.style.display = 'none';
249
-
statusBanner.className = 'overall-status-banner';
250
-
incidentDetail.classList.add('hidden');
251
-
this.adjustBodyPadding();
252
-
253
-
let incident = statusPageData?.incident;
254
-
let incidentFound = incident?.pin;
255
-
256
-
if (overallStatus === 'operational' && !incidentFound) {
257
-
statusBanner.classList.add('hidden');
258
-
this.adjustBodyPadding();
259
-
return;
260
-
}
261
-
262
-
let bannerStyleClass;
263
-
let statusMessage;
264
-
let iconText;
265
-
266
-
if (incidentFound) {
267
-
bannerStyleClass = `status-style-${incident.style?.toLowerCase() || 'warning'}`;
268
-
statusMessage = `<strong>${incident.title}:</strong> For more details, visit the <a href="${this.ORIGINAL_STATUS_PAGE_URL}" target="_blank">full status page</a>.`;
269
-
iconText = '⚠️';
270
-
271
-
if (incident.style === 'danger') iconText = '🚨';
272
-
else if (incident.style === 'info') iconText = 'ℹ️';
273
-
274
-
incidentDetail.innerHTML = incident.content;
275
-
incidentDetail.classList.remove('hidden');
276
-
} else {
277
-
switch (overallStatus) {
278
-
case 'degraded':
279
-
bannerStyleClass = 'status-style-warning';
280
-
statusMessage = `<strong>Degraded Performance:</strong> Some services are currently experiencing issues. Please visit the <a href="${this.ORIGINAL_STATUS_PAGE_URL}" target="_blank">full status page</a> for more details.`;
281
-
iconText = '⚠️';
282
-
break;
283
-
case 'partial-outage':
284
-
bannerStyleClass = 'status-style-danger';
285
-
statusMessage = `<strong>Partial Outage:</strong> Some services are currently experiencing an outage. Please visit the <a href="${this.ORIGINAL_STATUS_PAGE_URL}" target="_blank">full status page</a> for more details.`;
286
-
iconText = '❌';
287
-
break;
288
-
case 'major-outage':
289
-
bannerStyleClass = 'status-style-danger';
290
-
statusMessage = `<strong>Major Outage:</strong> All services are currently experiencing a major outage. Please visit the <a href="${this.ORIGINAL_STATUS_PAGE_URL}" target="_blank">full status page</a> for more details.`;
291
-
iconText = '🚨';
292
-
break;
293
-
case 'unknown':
294
-
default:
295
-
bannerStyleClass = 'status-style-light';
296
-
statusMessage = `<strong>Status Unknown:</strong> Unable to retrieve service status. Please visit the <a href="${this.ORIGINAL_STATUS_PAGE_URL}" target="_blank">full status page</a>.`;
297
-
iconText = '❓';
298
-
break;
299
-
}
300
-
}
301
-
302
-
statusBanner.classList.add(bannerStyleClass);
303
-
statusText.innerHTML = statusMessage;
304
-
statusIcon.textContent = iconText;
305
-
statusBanner.classList.remove('hidden');
306
-
this.adjustBodyPadding();
307
-
308
-
closeButton.onclick = () => {
309
-
statusBanner.classList.add('hidden');
310
-
this.adjustBodyPadding();
311
-
};
312
-
}
313
-
}
314
-
315
-
customElements.define('status-banner', StatusBanner);
+84
-36
textbites/igotamacmini.html
+84
-36
textbites/igotamacmini.html
···
1
1
<!DOCTYPE html>
2
-
<html>
2
+
<html lang="en">
3
3
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
6
<title>I got a Mac Mini - Daniel Morrisey</title>
7
-
7
+
8
8
<meta name="description" content="It might be mini, but it sure is fast!"/>
9
9
<meta name="keywords" content="Danile Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
10
10
<meta name="author" content="Daniel Morrisey"/>
···
15
15
<meta property="og:description" content="It might be mini, but it sure is fast!"/>
16
16
<meta property="og:image" content="https://public-danielmorrisey-com.danielmorrisey.com/media/Screenshot%202025-08-05%20at%201.13.08%E2%80%AFPM.png"/>
17
17
18
-
<meta name="fediverse:creator" content="@danielmorrisey@mastodon.social">
19
-
<link rel="me" href="https://mastodon.social/@danielmorrisey"/>
20
-
<link rel="icon" type="image/x-icon" href="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg">
18
+
<!-- Google Fonts for a clean font -->
19
+
<link rel="preconnect" href="https://fonts.googleapis.com">
20
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
21
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
22
+
23
+
<!-- Status Banner -->
24
+
<script src="https://uptime.betterstack.com/widgets/announcement.js" data-id="223534" async="async" type="text/javascript"></script>
25
+
26
+
<!-- Tailwind CSS CDN -->
21
27
<script src="https://cdn.tailwindcss.com"></script>
22
-
<script src="https://kit.fontawesome.com/0ca27f8db1.js" crossorig in="anonymous"></script>
28
+
29
+
<!-- Font Awesome CDN -->
30
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" xintegrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
23
31
32
+
<style>
33
+
body {
34
+
font-family: 'Inter', sans-serif;
35
+
}
36
+
</style>
24
37
</head>
25
-
<body>
26
-
<div id="__next">
27
-
<div>
28
-
<div class="w-9/10 max-w-md mx-auto">
29
-
<br><br>
30
-
<h1 class="text-3xl font-bold">I got a Mac Mini</h1>
31
-
<h3 id="#" class="mb-2 mt-5 text-xl font-medium first:mt-0">It might be mini, but it sure is!</h3>
38
+
<body class="bg-gray-100 text-gray-800 antialiased leading-relaxed">
39
+
40
+
<!-- Main Container -->
41
+
<div class="min-h-screen flex items-center justify-center p-4">
42
+
43
+
<!-- Card-like container for the content -->
44
+
<div class="bg-white rounded-3xl shadow-xl p-8 md:p-12 w-full max-w-4xl">
45
+
46
+
<!-- Header Section -->
47
+
<header class="flex flex-col items-center mb-8 text-center">
48
+
<a href="/index.html" class="flex flex-col items-center">
49
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-24 h-24 mb-4 rounded-full shadow-lg"/>
50
+
<h1 class="text-3xl font-bold text-gray-900">Text Bites</h1>
51
+
<p class="text-lg text-gray-600 font-medium mt-1">Updates from Daniel Morrisey</p>
52
+
</a>
53
+
</header>
54
+
55
+
<hr class="border-gray-200 my-8">
56
+
57
+
<!-- Post Content -->
58
+
<article class="prose max-w-none prose-indigo">
59
+
<h1 class="text-3xl font-bold text-gray-900 mt-0">I got a Mac Mini</h1>
60
+
<h3 class="text-xl font-medium text-gray-700">It might be mini, but it sure is fast!</h3>
32
61
<p>1.5 months ago, I switched from Windows to Mac.
33
62
<br><br>
34
63
The Mac I was using for the past 1.5 months was a 2021 M1 iMac Base model. It got the job done, but after using it for about 4 weeks, I realized that the 8 gigs of RAM was starting to show. Because I mainly write about tech news, I have 10s of tabs open (Bluesky, 9to5 Mac, 9to5 Google, The Verge, MacRumors, CNET, and many more). I also draft my post for my blog and MBD News in Pages, so that’s another app open. I also use Apple Music to focus and most of the time have Discord and Figma open.
···
39
68
<br><br>
40
69
I will continue to post updates here!
41
70
<br><br>
42
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/IMG_2059.JPG" alt="Mac Mini" class="w-full rounded-lg shadow-lg mb-4">
43
-
<i>My Mac Mini on my Desk</i>
71
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/IMG_2059.JPG" alt="Mac Mini" class="w-full rounded-2xl shadow-lg my-6">
72
+
<i class="block text-center text-gray-500">My Mac Mini on my Desk</i>
44
73
<br><br>
45
74
</p>
46
-
<h3 class="mt-5 mb-2 text-xl font-medium"><i class="fa-solid fa-comments"></i> Comments</h3>
47
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><a href="/leaving.html?link=https://github.com/therealfuntimeswithdanny/giscuscomments" class="text-blue-600 hover:underline"><i class="fa-brands fa-github"></i>therealfuntimeswithdanny/giscuscomments</a></code></p>
75
+
</article>
76
+
77
+
<!-- Comments Section -->
78
+
<div class="mt-8 pt-4 border-t border-gray-200">
79
+
<h3 class="text-xl font-semibold mb-4"><i class="fa-solid fa-comments"></i> Comments</h3>
80
+
<div class="mb-4">
81
+
<code class="rounded-lg border bg-gray-100 px-2 py-1 text-sm block md:inline-block">
82
+
<a href="https://github.com/therealfuntimeswithdanny/giscuscomments" class="text-indigo-600 hover:text-indigo-800 transition-colors">
83
+
<i class="fa-brands fa-github"></i>therealfuntimeswithdanny/giscuscomments
84
+
</a>
85
+
</code>
86
+
</div>
87
+
<!-- Giscus comments script -->
48
88
<script src="https://giscus.app/client.js"
49
89
data-repo="therealfuntimeswithdanny/giscuscomments"
50
90
data-repo-id="R_kgDOPXUWOA"
···
62
102
async>
63
103
</script>
64
104
</div>
65
-
<div class="w-9/10 max-w-md mx-auto">
66
-
<br><br>
67
-
<p>© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
68
-
</div>
105
+
106
+
<footer class="mt-12 pt-4 text-center text-gray-500 border-t border-gray-200">
107
+
<div class="flex justify-center space-x-6 mb-4 text-lg">
108
+
<a href="javascript:history.back()" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-arrow-left"></i> Back</a>
109
+
<a href="/index.html" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-house"></i> Home</a>
110
+
</div>
111
+
<!-- Centered Iframe -->
112
+
<div class="flex justify-center mt-8">
113
+
<iframe src="https://status.madebydanny.uk/badge?theme=light" width="200" height="30" frameborder="0" scrolling="no" style="color-scheme: normal"></iframe>
114
+
</div>
115
+
<p>
116
+
© 2024-<span id="currentYear"></span>
117
+
<a href="https://madebydanny.uk" class="hover:text-indigo-600 transition duration-300 font-medium">Made by Danny UK</a>
118
+
</p>
119
+
<p class="text-sm mt-1">
120
+
by Daniel Morrisey
121
+
</p>
122
+
</footer>
123
+
69
124
</div>
70
125
</div>
71
-
<div class="w-9/10 max-w-md mx-auto">
72
-
<br>
73
-
<hr>
74
-
<p>
75
-
<a href="javascript:history.back()" ><i class="fa-solid fa-arrow-left"></i> Back</a> | <a href="/index.html"><i class="fa-solid fa-house"></i> Home</a> | <a href="/search.html"><i class="fa-solid fa-magnifying-glass"></i> Search</a>
76
-
</p>
77
-
<br>
78
-
<p>© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
79
-
<hr>
80
-
<br>
81
-
</div>
82
-
<script src="/script/main.js"></script>
126
+
127
+
<script>
128
+
// Set the current year for the copyright notice
129
+
document.getElementById('currentYear').textContent = new Date().getFullYear();
130
+
</script>
83
131
</body>
84
-
</html>
132
+
</html>
+153
-76
textbites/index.html
+153
-76
textbites/index.html
···
1
1
<!DOCTYPE html>
2
-
<html>
2
+
<html lang="en">
3
3
<head>
4
-
<meta charSet="utf-8"/>
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
6
<title>Text Bites - Daniel Morrisey</title>
7
-
8
7
<meta name="description" content="From news to things you don't care about read all of Daniel Morriey's Text Bites"/>
9
-
<meta name="keywords" content="Danile Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
8
+
<meta name="keywords" content="Daniel Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
10
9
<meta name="author" content="Daniel Morrisey"/>
11
10
12
11
<meta property="og:type" content="website"/>
13
12
<meta property="og:url" content="https://danielmorrisey.com/"/>
14
-
<meta property="og:title" content="Text Botes - Daniel Morrisey"/>
13
+
<meta property="og:title" content="Text Bites - Daniel Morrisey"/>
15
14
<meta property="og:description" content="From news to things you don't care about read all of Daniel Morriey's Text Bites"/>
16
15
<meta property="og:image" content="https://public-danielmorrisey-com.danielmorrisey.com/media/banner.jpg"/>
17
16
18
17
<link rel="me" href="https://mastodon.social/@danielmorrisey"/>
19
18
<link rel="icon" type="image/x-icon" href="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg">
20
-
<script src="https://kit.fontawesome.com/0ca27f8db1.js" crossorigin="anonymous"></script>
19
+
<!-- Google Fonts for a clean font -->
20
+
<link rel="preconnect" href="https://fonts.googleapis.com">
21
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
22
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
23
+
24
+
<!-- Status Banner -->
25
+
<script src="https://uptime.betterstack.com/widgets/announcement.js" data-id="223534" async="async" type="text/javascript"></script>
26
+
27
+
<!-- Tailwind CSS CDN -->
21
28
<script src="https://cdn.tailwindcss.com"></script>
29
+
30
+
<!-- Font Awesome CDN -->
31
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" xintegrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
32
+
33
+
<style>
34
+
body {
35
+
font-family: 'Inter', sans-serif;
36
+
}
37
+
</style>
22
38
</head>
23
-
<body>
24
-
<div id="__next">
25
-
<div>
26
-
<header class="flex flex-col items-center py-12 md:py-16">
27
-
<div class="mb-8">
28
-
<a href="/index.html" class="flex flex-col items-center">
29
-
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-16 h-16 mb-2 rounded-full"/>
30
-
<h1 class="text-3xl font-bold">Daniel Morrisey</h1>
31
-
</a>
32
-
</div>
39
+
<body class="bg-gray-100 text-gray-800 antialiased leading-relaxed">
40
+
41
+
<!-- Main Container -->
42
+
<div class="min-h-screen flex items-center justify-center p-4">
43
+
44
+
<!-- Card-like container for the content -->
45
+
<div class="bg-white rounded-3xl shadow-xl p-8 md:p-12 w-full max-w-4xl">
46
+
47
+
<!-- Header Section -->
48
+
<header class="flex flex-col items-center mb-8 text-center">
49
+
<a href="/index.html" class="flex flex-col items-center">
50
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-24 h-24 mb-4 rounded-full shadow-lg"/>
51
+
<h1 class="text-3xl font-bold text-gray-900">Text Bites</h1>
52
+
<p class="text-lg text-gray-600 font-medium mt-1">Updates from Daniel Morrisey</p>
53
+
</a>
33
54
</header>
34
-
<div class="w-9/10 max-w-md mx-auto">
35
-
<!-- Search Bar -->
36
-
<div class="mb-5">
37
-
<input type="text" id="projectSearch" placeholder="Search Text Bites..." class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
55
+
56
+
<hr class="border-gray-200 my-8">
57
+
58
+
<!-- Search Bar -->
59
+
<div class="mb-6">
60
+
<input type="text" id="textbiteSearch" placeholder="Search Text Bites..." class="w-full px-4 py-2 border border-gray-300 rounded-full focus:outline-none focus:ring-2 focus:ring-indigo-500 transition duration-300">
61
+
</div>
62
+
63
+
<!-- Text Bites List Container -->
64
+
<div id="projectsList" class="space-y-6">
65
+
<!-- macminiupdateaug15.html -->
66
+
<div class="textbite-card bg-gray-50 p-6 rounded-2xl shadow-md">
67
+
<h4 class="text-xl font-semibold mb-2 text-gray-900 textbite-title">Mac mini update, 2 weeks later</h4>
68
+
<div class="text-sm text-gray-500 mb-4">
69
+
<span class="mr-3"><i class="fa-solid fa-calendar-alt"></i> Fri Aug 16</span>
70
+
<span><i class="fa-solid fa-clock"></i> 1 Min Read</span>
71
+
</div>
72
+
<p class="mt-2 text-gray-700 leading-relaxed textbite-description">
73
+
I still can’t believe it’s 5’ x 5’ and yet so powerful
74
+
</p>
75
+
<a class="inline-block mt-4 text-indigo-600 hover:text-indigo-800 font-medium transition duration-300" href="https://raindrop.madebydanny.uk/?add=1&link=https://daniemorrisey.com/extbites/macminiupdateaug15.html&title=Daniel Morrisey - Mac mini Update, 2 weeks later"><i class="fa-solid fa-bookmark"></i></a> <a href="macminiupdateaug15.html" class="inline-block mt-4 text-indigo-600 hover:text-indigo-800 font-medium transition duration-300">Read More...</a>
38
76
</div>
39
-
40
-
<!-- Main Projects Heading -->
41
-
<h3 class="mb-2 mt-5 text-xl font-medium first:mt-0">Text Bites</h3>
42
-
43
-
<!-- Projects List Container -->
44
-
<div id="projectsList">
45
-
<!-- igotamacmini.html -->
46
-
<div class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
47
-
<h4 class="mb-2 text-xl font-small project-title-text">I got a Mac Mini</h4>
48
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><i class="fa-solid fa-calendar"></i> Tue Aug 5, <i class="fa-solid fa-clock"></i> 1 Min</code>
49
-
<p class="project-description mt-2 text-gray-700">
50
-
It might be mini, but it sure is fast!
51
-
</p>
52
-
<a href="igotamacmini.html" class="text-blue-600 transition-colors hover:text-blue-800">Read More...</a>
77
+
<!-- igotamacmini.html -->
78
+
<div class="textbite-card bg-gray-50 p-6 rounded-2xl shadow-md">
79
+
<h4 class="text-xl font-semibold mb-2 text-gray-900 textbite-title">I got a Mac Mini</h4>
80
+
<div class="text-sm text-gray-500 mb-4">
81
+
<span class="mr-3"><i class="fa-solid fa-calendar-alt"></i> Tue Aug 5</span>
82
+
<span><i class="fa-solid fa-clock"></i> 1 Min Read</span>
53
83
</div>
54
-
<!-- card -->
55
-
<div id="mbdio" class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
56
-
<h4 class="mb-2 text-xl font-small project-title-text">I need a Bluesky version of mastodon’s deck layout</h4>
57
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><i class="fa-solid fa-calendar"></i> Sun Aug 3, <i class="fa-solid fa-clock"></i> 50 Sec</code></p>
58
-
<p class="project-description mt-2 text-gray-700">
59
-
Just like Mastodon, Threads also has a “deck” layout for desktop users. And my 3 main social media platforms I use are Bluesky, Mastodon, and Threads. Having a Bluesky Deck layout for desktop would be nice to have.
60
-
</p>
61
-
<a href="blueskydeck.html" class="text-blue-600 transition-colors hover:text-blue-800">Read More...</a> <a href="#" class="text-blue-600 transition-colors hover:text-blue-800"> <!-- Share Button --> </a>
84
+
<p class="mt-2 text-gray-700 leading-relaxed textbite-description">
85
+
It might be mini, but it sure is fast!
86
+
</p>
87
+
<a href="igotamacmini.html" class="inline-block mt-4 text-indigo-600 hover:text-indigo-800 font-medium transition duration-300">Read More...</a>
88
+
</div>
89
+
<!-- card -->
90
+
<div class="textbite-card bg-gray-50 p-6 rounded-2xl shadow-md">
91
+
<h4 class="text-xl font-semibold mb-2 text-gray-900 textbite-title">I need a Bluesky version of mastodon’s deck layout</h4>
92
+
<div class="text-sm text-gray-500 mb-4">
93
+
<span class="mr-3"><i class="fa-solid fa-calendar-alt"></i> Sun Aug 3</span>
94
+
<span><i class="fa-solid fa-clock"></i> 50 Sec Read</span>
62
95
</div>
63
-
<!-- card -->
64
-
<div id="mbdio" class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
65
-
<h4 class="mb-2 text-xl font-small project-title-text">The Power of Hashtags</h4>
66
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><i class="fa-solid fa-calendar"></i> Sun Aug 3, <i class="fa-solid fa-clock"></i> 1 Min</code></p>
67
-
<p class="project-description mt-2 text-gray-700">
68
-
All it takes is one # to reach an audience of 100+
69
-
</p>
70
-
<a href="thepowerofhashtags.html" class="text-blue-600 transition-colors hover:text-blue-800">Read More...</a> <a href="#" class="text-blue-600 transition-colors hover:text-blue-800"> <!-- Share Button --> </a>
96
+
<p class="mt-2 text-gray-700 leading-relaxed textbite-description">
97
+
Just like Mastodon, Threads also has a “deck” layout for desktop users. And my 3 main social media platforms I use are Bluesky, Mastodon, and Threads. Having a Bluesky Deck layout for desktop would be nice to have.
98
+
</p>
99
+
<a href="blueskydeck.html" class="inline-block mt-4 text-indigo-600 hover:text-indigo-800 font-medium transition duration-300">Read More...</a>
100
+
</div>
101
+
<!-- card -->
102
+
<div class="textbite-card bg-gray-50 p-6 rounded-2xl shadow-md">
103
+
<h4 class="text-xl font-semibold mb-2 text-gray-900 textbite-title">The Power of Hashtags</h4>
104
+
<div class="text-sm text-gray-500 mb-4">
105
+
<span class="mr-3"><i class="fa-solid fa-calendar-alt"></i> Sun Aug 3</span>
106
+
<span><i class="fa-solid fa-clock"></i> 1 Min Read</span>
71
107
</div>
72
-
<!-- card -->
73
-
<div id="mbdio" class="project-card mb-4 p-4 border rounded-lg shadow-sm bg-white">
74
-
<h4 class="mb-2 text-xl font-small project-title-text">MBD is working on MBDIO</h4>
75
-
<code class="rounded-lg border bg-gray-50 px-1 py-0.5 text-sm"><i class="fa-solid fa-calendar"></i> Sat Aug 2, <i class="fa-solid fa-clock"></i> 30 Sec</code></p>
76
-
<p class="project-description mt-2 text-gray-700">
77
-
MBD is working on a new tool called MBDIO, it's a simple, easy & fast link shortener that will allow you to shorten links and share them.
78
-
</p>
79
-
<a href="#" class="text-blue-600 transition-colors hover:text-blue-800"><!-- Read More --> </a> <a href="#" class="text-blue-600 transition-colors hover:text-blue-800"> <!-- Share Button --> </a>
108
+
<p class="mt-2 text-gray-700 leading-relaxed textbite-description">
109
+
All it takes is one # to reach an audience of 100+
110
+
</p>
111
+
<a href="thepowerofhashtags.html" class="inline-block mt-4 text-indigo-600 hover:text-indigo-800 font-medium transition duration-300">Read More...</a>
112
+
</div>
113
+
<!-- card -->
114
+
<div class="textbite-card bg-gray-50 p-6 rounded-2xl shadow-md">
115
+
<h4 class="text-xl font-semibold mb-2 text-gray-900 textbite-title">MBD is working on MBDIO</h4>
116
+
<div class="text-sm text-gray-500 mb-4">
117
+
<span class="mr-3"><i class="fa-solid fa-calendar-alt"></i> Sat Aug 2</span>
118
+
<span><i class="fa-solid fa-clock"></i> 30 Sec Read</span>
80
119
</div>
120
+
<p class="mt-2 text-gray-700 leading-relaxed textbite-description">
121
+
MBD is working on a new tool called MBDIO, it's a simple, easy & fast link shortener that will allow you to shorten links and share them.
122
+
</p>
123
+
<!-- This one doesn't have a link yet, so I've removed the anchor tag to prevent a broken link -->
81
124
</div>
82
125
</div>
83
-
<div class="w-9/10 max-w-md mx-auto">
84
-
<br><br>
85
-
<p class="text-center text-gray-500">© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
86
-
</div>
126
+
127
+
<!-- Footer -->
128
+
<footer class="mt-12 pt-4 text-center text-gray-500 border-t border-gray-200">
129
+
<div class="flex justify-center space-x-6 mb-4 text-lg">
130
+
<a href="javascript:history.back()" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-arrow-left"></i> Back</a>
131
+
<a href="/index.html" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-house"></i> Home</a>
132
+
</div>
133
+
<!-- Centered Iframe -->
134
+
<div class="flex justify-center mt-8">
135
+
<iframe src="https://status.madebydanny.uk/badge?theme=light" width="200" height="30" frameborder="0" scrolling="no" style="color-scheme: normal"></iframe>
136
+
</div>
137
+
<p>
138
+
© 2024-<span id="currentYear"></span>
139
+
<a href="https://madebydanny.uk" class="hover:text-indigo-600 transition duration-300 font-medium">Made by Danny UK</a>
140
+
</p>
141
+
<p class="text-sm mt-1">
142
+
by Daniel Morrisey
143
+
</p>
144
+
</footer>
145
+
87
146
</div>
88
147
</div>
89
-
<div class="w-9/10 max-w-md mx-auto">
90
-
<br>
91
-
<hr>
92
-
<p>
93
-
<a href="javascript:history.back()" ><i class="fa-solid fa-arrow-left"></i> Back</a> | <a href="/index.html"><i class="fa-solid fa-house"></i> Home</a> | <a href="/search.html"><i class="fa-solid fa-magnifying-glass"></i> Search</a>
94
-
</p>
95
-
<br>
96
-
<p>© 2024-<span id="currentYear"></span> <a href="/leaving.html?link=https://madebydanny.uk" class="text-blue-600 transition-colors hover:text-blue-800">Made by Danny UK</a> <i>by Daniel Morrisey</i></p>
97
-
<hr>
98
-
<br>
99
-
</div>
100
-
<script src="/script/main.js"></script>
101
-
<script src="/script/search.js"></script>
148
+
149
+
<script>
150
+
// Set the current year for the copyright notice
151
+
document.getElementById('currentYear').textContent = new Date().getFullYear();
152
+
153
+
// Get the search input and all project cards
154
+
const searchInput = document.getElementById('textbiteSearch');
155
+
const textbiteCards = document.querySelectorAll('.textbite-card');
156
+
157
+
// Add a 'keyup' event listener to the search input
158
+
searchInput.addEventListener('keyup', (e) => {
159
+
// Get the value from the search input and convert it to lowercase
160
+
const searchValue = e.target.value.toLowerCase();
161
+
162
+
// Loop through each textbite card to check for a match
163
+
textbiteCards.forEach(card => {
164
+
// Get the title and description text from the current card
165
+
const title = card.querySelector('.textbite-title').textContent.toLowerCase();
166
+
const description = card.querySelector('.textbite-description').textContent.toLowerCase();
167
+
168
+
// Check if the search value is found in either the title or description
169
+
if (title.includes(searchValue) || description.includes(searchValue)) {
170
+
// If it's a match, show the card
171
+
card.style.display = 'block';
172
+
} else {
173
+
// If it's not a match, hide the card
174
+
card.style.display = 'none';
175
+
}
176
+
});
177
+
});
178
+
</script>
102
179
</body>
103
180
</html>
+140
textbites/macminiupdateaug15.html
+140
textbites/macminiupdateaug15.html
···
1
+
<!DOCTYPE html>
2
+
<html lang="en">
3
+
<head>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+
<title>Mac mini update, 2 weeks later - Daniel Morrisey</title>
7
+
8
+
<meta name="description" content="I still can’t believe it’s 5’ x 5’ and yet so powerful"/>
9
+
<meta name="keywords" content="Danile Morrisey, Danny Morrisey, MBD, Made by Danny, Made by Danny UK"/>
10
+
<meta name="author" content="Daniel Morrisey"/>
11
+
12
+
<meta property="og:type" content="website"/>
13
+
<meta property="og:url" content="https://danielmorrisey.com/"/>
14
+
<meta property="og:title" content="Mac mini update, 2 weeks later - Daniel Morrisey"/>
15
+
<meta property="og:description" content="I still can’t believe it’s 5’ x 5’ and yet so powerful"/>
16
+
<meta property="og:image" content="https://public-danielmorrisey-com.danielmorrisey.com/media/mac-mini-m4-desk1.jpeg.webp"/>
17
+
18
+
<!-- Google Fonts for a clean font -->
19
+
<link rel="preconnect" href="https://fonts.googleapis.com">
20
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
21
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
22
+
23
+
<!-- Status Banner -->
24
+
<script src="https://uptime.betterstack.com/widgets/announcement.js" data-id="223534" async="async" type="text/javascript"></script>
25
+
26
+
<!-- Tailwind CSS CDN -->
27
+
<script src="https://cdn.tailwindcss.com"></script>
28
+
29
+
<!-- Font Awesome CDN -->
30
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" xintegrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
31
+
32
+
<style>
33
+
body {
34
+
font-family: 'Inter', sans-serif;
35
+
}
36
+
</style>
37
+
</head>
38
+
<body class="bg-gray-100 text-gray-800 antialiased leading-relaxed">
39
+
40
+
<!-- Main Container -->
41
+
<div class="min-h-screen flex items-center justify-center p-4">
42
+
43
+
<!-- Card-like container for the content -->
44
+
<div class="bg-white rounded-3xl shadow-xl p-8 md:p-12 w-full max-w-4xl">
45
+
46
+
<!-- Header Section -->
47
+
<header class="flex flex-col items-center mb-8 text-center">
48
+
<a href="/index.html" class="flex flex-col items-center">
49
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/icon.jpg" alt="Profile Picture" class="w-24 h-24 mb-4 rounded-full shadow-lg"/>
50
+
<h1 class="text-3xl font-bold text-gray-900">Text Bites</h1>
51
+
<p class="text-lg text-gray-600 font-medium mt-1">Updates from Daniel Morrisey</p>
52
+
</a>
53
+
</header>
54
+
55
+
<hr class="border-gray-200 my-8">
56
+
57
+
<!-- Post Content -->
58
+
<article class="prose max-w-none prose-indigo">
59
+
<h1 class="text-3xl font-bold text-gray-900 mt-0">Mac mini update, 2 weeks later</h1>
60
+
<h3 class="text-xl font-medium text-gray-700">I still can’t believe it’s 5’ x 5’ and yet so powerful</h3>
61
+
<p>I’ve had this M4 Mac mini for about 2 weeks and it’s the perfect computer for me. It can get all my tasks done without any issues. Apps never slow down or crash, macOS feels responsive at all times even though I’m running macOS 26 Beta 6 which is a Developer Beta.
62
+
<br><br>
63
+
Apple Intelligence feels way faster than on my previous Mac which was a 2020 M1 iMac.
64
+
<br><br>
65
+
It might be small, but it sure does have a lot of ports. I use the built-in HDMI port for my main 23” Amazon Basics Monitor because that’s my main monitor.
66
+
<br><br>
67
+
Then I have a USB-C dock that I use just for my second monitor, which mostly has YouTube or Twitch because my ADHD brain needs it. Now I still need a USB-A hub, which I use for USB drives and other accessories that use USB-A.
68
+
<br><br>
69
+
Then I have a SD Card and Micro SD Card reader that’s connected to the second Front USB-C port with the first one open in case I need it.
70
+
<br><br>
71
+
Now one thing I hate about this Mac mini is the Power Button, It’s in the most inconvenient place possible. Now with that said I don’t really use it, I never need to shut it down because most of the time it’s in sleep mode.
72
+
<br><br>
73
+
Besides the power button, this is the best mini computer for non-“pro users”. Now, like all Apple products, the M4 Mac mini works best if you use iCloud and have an iPhone.
74
+
<br><br>
75
+
And the price is a steal at $600 for an M4, 256GB with 16GB of RAM. Or you can be smart like me and use the .edu discount and do a trade-in.
76
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/IMG_2059.JPG" alt="Mac Mini" class="w-full rounded-2xl shadow-lg my-6">
77
+
<i class="block text-center text-gray-500">My Mac mini on my Desk, on Aug 3</i>
78
+
<br><br>
79
+
<img src="https://public-danielmorrisey-com.danielmorrisey.com/media/IMG_2204.jpeg" alt="Mac Mini" class="w-full rounded-2xl shadow-lg my-6">
80
+
<i class="block text-center text-gray-500">My Mac mini on my Desk, on Aug 15</i>
81
+
<br><br>
82
+
</p>
83
+
</article>
84
+
85
+
<!-- Comments Section -->
86
+
<div class="mt-8 pt-4 border-t border-gray-200">
87
+
<h3 class="text-xl font-semibold mb-4"><i class="fa-solid fa-comments"></i> Comments</h3>
88
+
<div class="mb-4">
89
+
<code class="rounded-lg border bg-gray-100 px-2 py-1 text-sm block md:inline-block">
90
+
<a href="https://github.com/therealfuntimeswithdanny/giscuscomments" class="text-indigo-600 hover:text-indigo-800 transition-colors">
91
+
<i class="fa-brands fa-github"></i>therealfuntimeswithdanny/giscuscomments
92
+
</a>
93
+
</code>
94
+
</div>
95
+
<!-- Giscus comments script -->
96
+
<script src="https://giscus.app/client.js"
97
+
data-repo="therealfuntimeswithdanny/giscuscomments"
98
+
data-repo-id="R_kgDOPXUWOA"
99
+
data-category="Announcements"
100
+
data-category-id="DIC_kwDOPXUWOM4CttzC"
101
+
data-mapping="og:title"
102
+
data-strict="0"
103
+
data-reactions-enabled="1"
104
+
data-emit-metadata="0"
105
+
data-input-position="top"
106
+
data-theme="light_tritanopia"
107
+
data-lang="en"
108
+
data-loading="lazy"
109
+
crossorigin="anonymous"
110
+
async>
111
+
</script>
112
+
</div>
113
+
114
+
<footer class="mt-12 pt-4 text-center text-gray-500 border-t border-gray-200">
115
+
<div class="flex justify-center space-x-6 mb-4 text-lg">
116
+
<a href="javascript:history.back()" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-arrow-left"></i> Back</a>
117
+
<a href="/index.html" class="text-gray-600 hover:text-indigo-600 transition duration-300"><i class="fa-solid fa-house"></i> Home</a>
118
+
</div>
119
+
<!-- Centered Iframe -->
120
+
<div class="flex justify-center mt-8">
121
+
<iframe src="https://status.madebydanny.uk/badge?theme=light" width="200" height="30" frameborder="0" scrolling="no" style="color-scheme: normal"></iframe>
122
+
</div>
123
+
<p>
124
+
© 2024-<span id="currentYear"></span>
125
+
<a href="https://madebydanny.uk" class="hover:text-indigo-600 transition duration-300 font-medium">Made by Danny UK</a>
126
+
</p>
127
+
<p class="text-sm mt-1">
128
+
by Daniel Morrisey
129
+
</p>
130
+
</footer>
131
+
132
+
</div>
133
+
</div>
134
+
135
+
<script>
136
+
// Set the current year for the copyright notice
137
+
document.getElementById('currentYear').textContent = new Date().getFullYear();
138
+
</script>
139
+
</body>
140
+
</html>