madebydanny.uk written in html, css, and a lot of JavaScript I don't understand madeydanny.uk
html css javascript

did a thing

+49 -273
.DS_Store

This is a binary file and will not be displayed.

+3 -23
404.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>error 404</title> 7 - <link rel="stylesheet" href="/css/style.css"> 8 - </head> 9 - <body> 10 - <div id="terminal"> 11 - <div id="output"> 12 - <pre class="prompt">client@ssh-madebydanny-uk ~ % ssh visitor@104.21.10.10</pre> 13 - <p class="welcome"><span class="accent">Error 404</span> Page not Found</p> 14 - 15 - </div> 16 - 17 - <div id="output"> 18 - <br> 19 - <p class="login">&copy; 2024-2025 <span class="accent">Made by Danny UK</span>, by Daniel Morrisey</p> 20 - </div> 21 - </div> 22 - </body> 23 - </html> 1 + error 404, page not found 2 + <br> 3 + site hosted on <a href="https://wisp.place">wisp.place</a>
+33 -60
css/style.css
··· 1 - /* Custom Fonts and Colors */ 2 - :root { 3 - --bg-color: #1a1a1a; 4 - --text-color: #ffffff; 5 - --accent-color: #ff9933; /* A vibrant orange */ 6 - --font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; 7 - } 8 - 9 1 /* Base Styles */ 10 2 body { 11 - background-color: var(--bg-color); 12 - color: var(--text-color); 13 - font-family: var(--font-family); 14 - font-size: 14px; 3 + background-color: #1a1a1a; 4 + color: #ffffff; 5 + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; 6 + font-size: 16px; 15 7 margin: 0; 16 - padding: 20px; 17 - height: 100vh; 18 - box-sizing: border-box; 8 + padding: 40px 20px; 9 + line-height: 1.6; 19 10 } 20 11 21 - /* Terminal Container */ 22 - #terminal { 23 - max-width: 800px; 24 - margin: 0 auto; 25 - /* Optional: subtle border to make it look like a window */ 26 - /* border: 1px solid var(--accent-color); */ 27 - padding: 10px; 28 - height: 100%; 29 - overflow-y: auto; /* Allow scrolling for long outputs */ 12 + /* Headings */ 13 + h1 { 14 + font-size: 28px; 15 + margin: 0 0 20px 0; 16 + color: #ffffff; 30 17 } 31 18 32 - /* Output Text */ 33 - #output p { 34 - margin: 0; /* Remove default paragraph spacing */ 35 - white-space: pre-wrap; /* Preserve formatting and wrap text */ 19 + /* Paragraphs */ 20 + p { 21 + margin: 10px 0; 22 + color: #ffffff; 36 23 } 37 24 38 - /* Specific Output Styling */ 39 - .prompt { 40 - color: var(--accent-color); 41 - font-weight: bold; 25 + /* Emphasis */ 26 + i { 27 + color: #f4871b; 42 28 } 43 - .welcome { 44 - color: var(--text-color); 29 + 30 + a { 31 + color: #ff9933; 32 + text-decoration: none; 45 33 } 46 - .login { 47 - color: #888888; /* Slightly gray for less important info */ 34 + b { 35 + font-weight: bold; 36 + color: #ffffff; 48 37 } 49 - .error { 50 - color: #ff5555; /* Red for errors */ 51 - } 52 - .accent { 53 - color: var(--accent-color); 54 - } 55 - 56 - /* Input Line */ 57 - #input-line { 58 - display: flex; 59 - align-items: center; 60 - margin-top: 10px; 38 + a:hover { 39 + text-decoration: underline; 40 + color: white; 61 41 } 62 - 63 - /* Input Field */ 64 - #command-input { 65 - flex-grow: 1; /* Take up all available space */ 66 - background: transparent; 67 - border: none; 68 - color: var(--text-color); 69 - font-family: inherit; 70 - font-size: inherit; 71 - outline: none; /* Remove focus outline */ 72 - caret-color: var(--accent-color); /* Change the cursor color */ 73 - padding-left: 0; /* Align with prompt */ 42 + hr { 43 + border: 0; 44 + height: 1px; 45 + background: #333333; 46 + margin: 20px 0; 74 47 }
+13 -23
index.html
··· 11 11 <meta property="og:description" id="og-description" content="Posting everything into the endless jet stream of posts"> 12 12 <meta property="og:type" content="website"> 13 13 <meta property="og:url" content="https://madebydanny.uk/"> 14 - <meta property="og:image" id="og-image" content="ogimg.png"> 14 + <meta property="og:image" id="og-image" content="/media/ogimg.png"> 15 15 <link rel="stylesheet" href="/css/style.css"> 16 16 </head> 17 17 <body> 18 - <div id="terminal"> 19 - <div id="output"> 20 - <pre class="prompt">client@ssh-madebydanny-uk ~ % ssh visitor@104.21.10.10</pre> 21 - <p class="welcome">Hello I'm Daniel Morrisey and welcome to my tiny website.</p> 22 - <p class="welcome">Don't expect to find much here as this website isn't really used.</p> 23 - <br> 24 - <p class="login">Last login: <span id="login-time"></span> from unkown ip</p> 25 - <p class="login">Type <span class="accent">help</span> to see available commands.</p> 26 - </div> 27 - 28 - <div id="input-line"> 29 - <span class="prompt prefix">visitor@104.21.10.10:~#&nbsp;</span> 30 - <input type="text" id="command-input" autofocus> 31 - </div> 32 - 33 - <div id="output"> 34 - <br> 35 - <p class="login">&copy; 2024-2025 <span class="accent">Made by Danny UK</span>, by Daniel Morrisey</p> 36 - </div> 37 - </div> 38 - 39 - <script src="/js/script.js"></script> 18 + <h1>Hi, I'm Daniel Morrisey</h1> 19 + <p>I like to lisiten to Music <i>(Mainly Tate McRae and Taylor Swift)</i>, and post on Bluesky.</p> 20 + <p><b>Social Links:</b></p> 21 + <ul> 22 + <li><a href="/followonbsky.html?did=madebydanny.uk" >Bluesky</a></li> 23 + <li><a href="https://instagram.com/madebydanny.uk" target="_blank">Instagram</a></li> 24 + <li><a href="https://tangled.org/madebydannyuk" target="_blank">Tangled</a></li> 25 + <li><a href="https://threads.net/@madebydanny.uk" target="_blank">Threads</a></li> 26 + <li><a href="https://mastodon.social/@danielmorrisey" target="_blank">Mastodon</a></li> 27 + </ul> 28 + <hr> 29 + <p>&copy; 2024-2026 Daniel Morrisey by <a href="/followonbsky.html?did=madebydanny.uk">@madebydanny.uk</a></p> 40 30 </body> 41 31 </html>
-167
js/script.js
··· 1 - document.addEventListener('DOMContentLoaded', () => { 2 - const input = document.getElementById('command-input'); 3 - const output = document.getElementById('output'); 4 - const inputLine = document.getElementById('input-line'); 5 - 6 - // Focus the input field when the page loads or anywhere is clicked 7 - document.addEventListener('click', () => { 8 - input.focus(); 9 - }); 10 - 11 - // Command handler object 12 - const commands = { 13 - // Simple Link Command 14 - 'bsky': { 15 - description: 'Shows a clickable link to my Bluesky profile.', 16 - execute: () => { 17 - return ` 18 - <p>My Bluesky link:</p> 19 - <p><span class="accent">https://bsky.app/profile/madebydanny.uk</span></p> 20 - `; 21 - } 22 - }, 23 - // Simple Text Command 24 - 'about': { 25 - description: 'Shows a short bio about me.', 26 - execute: () => { 27 - return ` 28 - <p>Hello, I'm <span class="accent">Daniel Morrisey</span>.</p> 29 - <p>I'm a full-stack developer with a passion for creative web design.</p> 30 - <p>I specialize in HTML, CSS, JavaScript, and NodeJS.</p> 31 - `; 32 - } 33 - }, 34 - // Navigation Command (Opens a new tab) 35 - 'tangled': { 36 - description: 'Opens my Tangled profile in a new tab.', 37 - execute: () => { 38 - window.open('https://tangled.org/madebydanny.uk', '_blank'); // **CHANGE THIS TO YOUR GITHUB** 39 - return `<p>Opening <span class="accent">https://tangled.org/madebydanny.uk</span> in new tab...</p>`; 40 - } 41 - }, 42 - 'blog': { 43 - description: 'Opens my blog in a new tab.', 44 - execute: () => { 45 - window.open('https://blog.madebydanny.uk', '_blank'); // **CHANGE THIS TO YOUR GITHUB** 46 - return `<p>Opening <span class="accent">https://blog.madebydanny.uk</span> in new tab...</p>`; 47 - } 48 - }, 49 - 'pds': { 50 - description: 'Learn about the MBD PDS', 51 - execute: () => { 52 - return ` 53 - <p><span class="accent">https://pds.madebydanny.uk</span> learn more</p> 54 - `; 55 - } 56 - }, 57 - // Refresh Command 58 - 'refresh': { 59 - description: 'Refreshes the webpage.', 60 - execute: () => { 61 - setTimeout(() => location.reload(), 500); 62 - return `<p>Refreshing page...</p>`; 63 - } 64 - }, 65 - 'clear': { 66 - description: 'Clears all commands from terminal.', 67 - execute: () => { 68 - setTimeout(() => location.reload(), 500); 69 - return `<p>Clearing terminal...</p>`; 70 - } 71 - }, 72 - // Exit Command 73 - 'exit': { 74 - description: 'Closes the webpage.', 75 - execute: () => { 76 - setTimeout(() => window.close(), 500); 77 - return `<p>Closing page...</p>`; 78 - } 79 - }, 80 - // Help Command 81 - 'help': { 82 - description: 'Shows this list of available commands.', 83 - execute: () => { 84 - let helpText = '<p class="accent">Available Commands:</p>'; 85 - for (const cmd in commands) { 86 - helpText += `<p><span class="accent">${cmd}</span> - ${commands[cmd].description}</p>`; 87 - } 88 - helpText += `<p><span class="accent">cd /filename</span> - Opens a file in a new tab (e.g., cd /index.html)</p>`; 89 - return helpText; 90 - } 91 - } 92 - }; 93 - 94 - // Event listener for Ctrl+C (close the webpage) 95 - document.addEventListener('keydown', (e) => { 96 - if ((e.ctrlKey || e.metaKey) && e.key === 'c') { 97 - e.preventDefault(); 98 - const commandOutput = document.createElement('p'); 99 - commandOutput.innerHTML = `<span class="prompt prefix">visitor@ssh-madebydanny-uk:~#&nbsp;</span>^C`; 100 - output.appendChild(commandOutput); 101 - output.scrollTop = output.scrollHeight; 102 - setTimeout(() => window.close(), 500); 103 - } 104 - }); 105 - 106 - // Event listener for the Enter key 107 - input.addEventListener('keydown', (e) => { 108 - if (e.key === 'Enter') { 109 - const command = input.value.trim().toLowerCase(); 110 - input.value = ''; // Clear the input field 111 - 112 - // 1. Output the command that was just entered 113 - const commandOutput = document.createElement('p'); 114 - commandOutput.innerHTML = `<span class="prompt prefix">visitor@ssh-madebydanny-uk:~#&nbsp;</span>${command} <br><br>`; 115 - output.appendChild(commandOutput); 116 - 117 - // 2. Process the command 118 - let resultHTML = ''; 119 - 120 - if (command === '') { 121 - // Do nothing for empty command 122 - resultHTML = ''; 123 - } else if (commands[command]) { 124 - // Command found: execute it 125 - resultHTML = commands[command].execute(); 126 - } else if (command.startsWith('cd /')) { 127 - // Handle cd command to open files 128 - const filename = command.substring(4).trim(); 129 - if (filename) { 130 - const fileUrl = `${window.location.origin}/${filename}`; 131 - window.open(fileUrl, '_blank'); 132 - resultHTML = `<p>Opening <span class="accent">${filename}</span> in new tab...</p>`; 133 - } else { 134 - resultHTML = `<p class="error">cd: missing filename</p>`; 135 - } 136 - } else { 137 - // Command not found 138 - resultHTML = `<p class="error">-bash: ${command}: command not found, type help to see all commands</p>`; 139 - } 140 - 141 - // 3. Output the result 142 - const resultElement = document.createElement('div'); 143 - resultElement.innerHTML = resultHTML; 144 - output.appendChild(resultElement); 145 - 146 - // 4. Scroll to the bottom to see the new output 147 - output.scrollTop = output.scrollHeight; 148 - } 149 - }); 150 - 151 - // Initial scroll to the bottom on load (optional, but nice for long welcome text) 152 - output.scrollTop = output.scrollHeight; 153 - 154 - // Set login time to current system time and fetch user's IP 155 - const loginTimeElement = document.getElementById('login-time'); 156 - const now = new Date(); 157 - loginTimeElement.textContent = now.toString(); 158 - 159 - // Fetch user's IP address 160 - fetch('https://api.ipify.org?format=json') 161 - .then(response => response.json()) 162 - .then(data => { 163 - const loginLine = document.querySelector('p.login'); 164 - loginLine.innerHTML = `Last login: <span id="login-time">${now.toString()}</span> from ${data.ip}`; 165 - }) 166 - .catch(error => console.error('Error fetching IP:', error)); 167 - });