diff options
-rw-r--r-- | Windows Regular.ttf | bin | 0 -> 88840 bytes | |||
-rw-r--r-- | about.html | 46 | ||||
-rw-r--r-- | blog.html | 26 | ||||
-rw-r--r-- | img/background.png | bin | 0 -> 2498889 bytes | |||
-rw-r--r-- | img/planets/Planet-1.png | bin | 0 -> 1885728 bytes | |||
-rw-r--r-- | img/planets/Planet-2.png | bin | 0 -> 1857869 bytes | |||
-rw-r--r-- | img/planets/Planet-3.png | bin | 0 -> 1738175 bytes | |||
-rw-r--r-- | img/planets/Planet-4.png | bin | 0 -> 1805249 bytes | |||
-rw-r--r-- | img/planets/Planet-5.png | bin | 0 -> 1932452 bytes | |||
-rw-r--r-- | img/uc.png | bin | 0 -> 126475 bytes | |||
-rw-r--r-- | img/wordart.png | bin | 0 -> 272965 bytes | |||
-rw-r--r-- | index.css | 75 | ||||
-rw-r--r-- | index.html | 43 | ||||
-rw-r--r-- | projects.html | 26 | ||||
-rw-r--r-- | timedate.js | 15 |
15 files changed, 231 insertions, 0 deletions
diff --git a/Windows Regular.ttf b/Windows Regular.ttf new file mode 100644 index 0000000..26abb3d --- /dev/null +++ b/Windows Regular.ttf Binary files differdiff --git a/about.html b/about.html new file mode 100644 index 0000000..a34cd05 --- /dev/null +++ b/about.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <title>mounderfod</title> + <meta name="description" content="" /> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <link rel="stylesheet" href="index.css" /> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> + <script src="timedate.js"></script> + </head> + <body> + <marquee + ><p id="timedate" style="font-size: x-large"> + The time is {} and the date is {} + </p></marquee + > + <div id="main"> + <a href="/"><img class="logo" src="img/wordart.png" /></a><br /> + <div class="box"> + <h1>ABOUT</h1> + <p> + Hello! :D My name is Noah, but I go by <b>mounderfod</b>. I am + interested in music, programming and video games. + </p> + <p><b>Languages I speak:</b> French, English</p> + <p> + <b>Languages I code in:</b> Python, JS, Java (and C# by extension), + Rust + </p> + <h3>SOCIALS</h3> + <a href="https://mastodon.sdf.org/@mounderfod"> + <p>Mastodon</p> + </a> + <a href="https://metapixl.com/i/web/profile/577395471914797016"> + <p>Pixelfed</p> + </a> + <a href="https://lemmy.sdf.org/u/mounderfod"> + <p>Lemmy</p> + </a> + <p><b>Discord:</b> @mounderfod</p> + </div> + </div> + </body> +</html> diff --git a/blog.html b/blog.html new file mode 100644 index 0000000..e0d9499 --- /dev/null +++ b/blog.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <title>mounderfod</title> + <meta name="description" content="" /> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <link rel="stylesheet" href="index.css" /> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> + <script src="timedate.js"></script> + </head> + <body> + <marquee + ><p id="timedate" style="font-size: x-large"> + The time is {} and the date is {} + </p></marquee + > + <div id="main" style="text-align: center"> + <img class="logo" src="img/uc.png" /><br /> + <a href="/" + ><h1><b>Back to homepage</b></h1></a + > + </div> + </body> +</html> diff --git a/img/background.png b/img/background.png new file mode 100644 index 0000000..a6b2247 --- /dev/null +++ b/img/background.png Binary files differdiff --git a/img/planets/Planet-1.png b/img/planets/Planet-1.png new file mode 100644 index 0000000..daf403f --- /dev/null +++ b/img/planets/Planet-1.png Binary files differdiff --git a/img/planets/Planet-2.png b/img/planets/Planet-2.png new file mode 100644 index 0000000..711144b --- /dev/null +++ b/img/planets/Planet-2.png Binary files differdiff --git a/img/planets/Planet-3.png b/img/planets/Planet-3.png new file mode 100644 index 0000000..fd9bd87 --- /dev/null +++ b/img/planets/Planet-3.png Binary files differdiff --git a/img/planets/Planet-4.png b/img/planets/Planet-4.png new file mode 100644 index 0000000..704f109 --- /dev/null +++ b/img/planets/Planet-4.png Binary files differdiff --git a/img/planets/Planet-5.png b/img/planets/Planet-5.png new file mode 100644 index 0000000..097dc71 --- /dev/null +++ b/img/planets/Planet-5.png Binary files differdiff --git a/img/uc.png b/img/uc.png new file mode 100644 index 0000000..d51765b --- /dev/null +++ b/img/uc.png Binary files differdiff --git a/img/wordart.png b/img/wordart.png new file mode 100644 index 0000000..a0c6b1d --- /dev/null +++ b/img/wordart.png Binary files differdiff --git a/index.css b/index.css new file mode 100644 index 0000000..f659a89 --- /dev/null +++ b/index.css @@ -0,0 +1,75 @@ +@font-face { + font-family: windows; + src: url("Windows Regular.ttf"); +} + +html { + background-image: url(img/background.png); + width: 100%; + height: 100%; + color: white; +} +p, +h1, +h2, +h3, +h4, +h5, +h6 { + font-family: windows; +} +.field { + width: 25%; + display: inline-block; + padding-left: 4em; + padding-right: 4em; + text-align: center; +} +.field > img { + width: 5rem; + height: 5rem; +} +a { + color: -webkit-link; + text-decoration: underline wavy -webkit-link; +} + +a > :is(p, h1, h2, h3, h4, h5, h6) { + color: -webkit-link; +} + +marquee { + width: 100%; +} + +#main { + width: 100%; + margin: auto; +} + +.logo { + display: block; + margin-left: auto; + margin-right: auto; + width: 40%; +} + +.box { + background-color: whitesmoke; + border: 5px solid darkcyan; + width: 60%; + text-align: center; + margin: auto; +} + +.box > ul { + color: black; +} + +.box > :is(p, h1, h2, h3, h4, h5, h6) { + color: black; +} + +.box > ul > li > :is(p, h1, h2, h3, h4, h5, h6) { + color: black; +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..7d3234b --- /dev/null +++ b/index.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <title>mounderfod</title> + <meta name="description" content="" /> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <link rel="stylesheet" href="index.css" /> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> + <script src="timedate.js"></script> + </head> + <body> + <marquee + ><p id="timedate" style="font-size: x-large"> + The time is {} and the date is {} + </h2></marquee + > + <div id="main"> + <img class="logo" src="img/wordart.png" /><br /> + <div id="container"> + <div class="field"> + <img src="img/planets/Planet-1.png" /> + <a href="/about.html"> + <h2><b>ABOUT</b></h2> + </a> + </div> + <div class="field"> + <img src="img/planets/Planet-2.png" /> + <a href="/blog.html"> + <h2><b>BLOG</b></h2> + </a> + </div> + <div class="field"> + <img src="img/planets/Planet-3.png" /> + <a href="/projects.html"> + <h2><b>PROJECTS</b></h2> + </a> + </div> + </div> + </div> + </body> +</html> diff --git a/projects.html b/projects.html new file mode 100644 index 0000000..e0d9499 --- /dev/null +++ b/projects.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <title>mounderfod</title> + <meta name="description" content="" /> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <link rel="stylesheet" href="index.css" /> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> + <script src="timedate.js"></script> + </head> + <body> + <marquee + ><p id="timedate" style="font-size: x-large"> + The time is {} and the date is {} + </p></marquee + > + <div id="main" style="text-align: center"> + <img class="logo" src="img/uc.png" /><br /> + <a href="/" + ><h1><b>Back to homepage</b></h1></a + > + </div> + </body> +</html> diff --git a/timedate.js b/timedate.js new file mode 100644 index 0000000..a9562ab --- /dev/null +++ b/timedate.js @@ -0,0 +1,15 @@ +updateDate = () => { + const d = new Date(); + $("#timedate").text( + `The time is ${(d.getHours() < 10 ? "0" : "") + d.getHours()}:${ + (d.getMinutes() < 10 ? "0" : "") + d.getMinutes() + }:${ + (d.getSeconds() < 10 ? "0" : "") + d.getSeconds() + } and the date is ${d.toLocaleString("en-us", { + weekday: "long", + })} ${d.getDate()} ${d.toLocaleString("en-us", { + month: "long", + })} ${d.getFullYear()}` + ); +}; +time = setInterval(updateDate, 1000); |