The repository for my website https://ellpeck.de/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

249 lines
13 KiB

2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
1 year ago
2 years ago
  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>Ellpeck.de</title>
  7. <meta name="author" content="Ellpeck">
  8. <meta name="description" content="Ellpeck's little internet place">
  9. <meta name="keywords" content="Ellpeck, Actually Additions, Rock Bottom, Programming, Minecraft, Game Development, Nature's Aura, C#, Java, Blog, Tutorial, Foe Frenzy">
  10. <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
  11. <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto">
  12. <link rel="stylesheet" href="style/prettify.css">
  13. <link rel="stylesheet" href="style/style.css">
  14. <link rel="icon" href="favicon.ico">
  15. <meta property="og:title" content="Ellpeck.de">
  16. <meta property="og:description" content="Ellpeck's little internet place">
  17. <meta property="og:image" content="https://www.ellpeck.de/res/logoSmall.png">
  18. <meta name="twitter:card" content="summary">
  19. <meta name="twitter:site" content="@Ellpeck">
  20. <meta name="twitter:creator" content="@Ellpeck">
  21. <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  22. <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
  23. <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
  24. <script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/prettify.js"></script>
  25. <script src="scripts/util.js"></script>
  26. <script src="scripts/main.js"></script>
  27. <!-- Global site tag (gtag.js) - Google Analytics -->
  28. <script async src="https://www.googletagmanager.com/gtag/js?id=UA-150032076-2"></script>
  29. <script>
  30. window.dataLayer = window.dataLayer || [];
  31. let gtag = function () {
  32. dataLayer.push(arguments);
  33. }
  34. gtag('js', new Date());
  35. gtag('config', 'UA-150032076-2');
  36. </script>
  37. <script data-ad-client="ca-pub-5754829579653773" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  38. </head>
  39. <body data-spy="scroll" data-target="#navbar">
  40. <!-- Navbar -->
  41. <nav class="navbar fixed-top navbar-expand-lg navbar-light bg-light rounded-bottom" id="navbar">
  42. <script src="scripts/navbar.js"></script>
  43. <!-- Navbar brand and logo -->
  44. <a class="navbar-brand mb-0 h1" href="#">
  45. <img src="res/logo.png" width="40" height="40" alt=""> Ellpeck.de
  46. </a>
  47. <!-- Responsive navbar menu opener -->
  48. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-content">
  49. <span class="navbar-toggler-icon"></span>
  50. </button>
  51. <!-- Navbar content -->
  52. <div class="collapse navbar-collapse" id="navbar-content">
  53. <div class="navbar-nav mr-auto" id="nav-items">
  54. <a class="nav-item nav-link" href="#projects">Projects</a>
  55. <a class="nav-item nav-link" href="#social">Social</a>
  56. <a class="nav-item nav-link" href="#about">About</a>
  57. <a class="nav-item nav-link" href="#blog">Blog</a>
  58. </div>
  59. <span class="navbar-text">
  60. <div class="custom-control custom-checkbox">
  61. <input type="checkbox" class="custom-control-input" id="dark-mode">
  62. <label class="custom-control-label" for="dark-mode">Dark Mode</label>
  63. </div>
  64. </span>
  65. </div>
  66. </nav>
  67. <!-- Content -->
  68. <div class="container main">
  69. <!-- Cookie notification -->
  70. <script src="scripts/cookieinfo.js"></script>
  71. <div id="main">
  72. <div class="no-blog">
  73. <!-- Home -->
  74. <div class="jumbotron">
  75. <div class="container">
  76. <div class="row">
  77. <div class="col-md-auto">
  78. <img src="res/me.png" class="rounded-circle" width="200" height="200" id="navbar-image">
  79. </div>
  80. <div class="col">
  81. <h1 class="display-4" id="intro-text"></h1>
  82. <script src="scripts/greet.js"></script>
  83. <p class="lead">Welcome to my little website! I'm Ellpeck, a student and programmer from Germany. I do a lot of stuff, actually. My life is pretty busy.</p>
  84. <!-- Sponsor buttons -->
  85. <div class="sellout">
  86. <iframe src="https://github.com/sponsors/Ellpeck/button" title="Sponsor Ellpeck" height="32" width="116" style="border: 0; margin-right: 10px;"></iframe>
  87. <a href="https://www.patreon.com/bePatron?u=2494595" data-patreon-widget-type="become-patron-button"></a>
  88. <script async src="https://c6.patreon.com/becomePatronButton.bundle.js"></script>
  89. </div>
  90. </div>
  91. </div>
  92. </div>
  93. </div>
  94. <!-- Projects -->
  95. <a class="anchor" id="projects"></a>
  96. <div class="list-display rounded">
  97. <h1>Projects</h1>
  98. <p>
  99. Here is a list of some of the things that you might know me from. If you want to have a more in-depth look at everything I do, check out some of the sites linked in the <a href="#social">Social</a> section.
  100. </p>
  101. <div id="project-list">
  102. <em>The content that should be here is dynamically generated. Please enable JavaScript if you see this.</em>
  103. </div>
  104. <script src="scripts/projects.js"></script>
  105. </div>
  106. <!-- Social -->
  107. <a class="anchor" id="social"></a>
  108. <div class="list-display rounded">
  109. <h1>Social</h1>
  110. <p>
  111. These are other websites where you can find me and the things I do, including the pages where I publish my code and games and where I sometimes stream and upload videos. This list also includes a lot of ways to reach me.
  112. </p>
  113. <div class="row">
  114. <div class="col">
  115. <div id="social-list">
  116. <em>The content that should be here is dynamically generated. Please enable JavaScript if you see this.</em>
  117. </div>
  118. Additionally, here are some miscellaneous platforms:
  119. <ul>
  120. <li>My Nintendo Switch friend code is <strong>SW-5281-8834-6801</strong></li>
  121. <li>If you want to play my Mario Maker 2 levels, my ID is <strong>8BH-566-4WF</strong></li>
  122. <li>If you play The Sims 4, you can check out my builds on the gallery by searching for <strong>Ellpeck</strong></li>
  123. </ul>
  124. </div>
  125. <div class="col-md-auto" id="discord-div">
  126. <em>The content that should be here is dynamically generated. Please enable JavaScript if you see this.</em>
  127. </div>
  128. </div>
  129. <script src="scripts/social.js"></script>
  130. </div>
  131. <!-- About -->
  132. <a class="anchor" id="about"></a>
  133. <div class="list-display rounded">
  134. <h1>About</h1>
  135. <p>
  136. Sometimes, some people ask me some questions about myself or my projects, so I decided to compile a list of some of the answers in a Q&A-like fashion so that I don't have to keep repeating them. If you're curious about me, this might be interesting to you!
  137. </p>
  138. <div id="about-list">
  139. <em>The content that should be here is dynamically generated. Please enable JavaScript if you see this.</em>
  140. </div>
  141. <script src="scripts/about.js"></script>
  142. </div>
  143. <!-- Blog -->
  144. <a class="anchor" id="blog"></a>
  145. <div class="list-display rounded">
  146. <h1>Blog</h1>
  147. <p>
  148. Occasionally I enjoy writing stuff. So here's some of the stuff I've written. Just click on any of the headers to open the post. Alternatively, you can subscribe to this blog using <a href="/rss.xml">RSS</a>, <a href="/atom.xml">Atom</a> or <a href="/feed.json">JSON</a>.
  149. </p>
  150. <div id="blog-list">
  151. <em>The content that should be here is dynamically generated. Please enable JavaScript if you see this.</em>
  152. </div>
  153. <button type="button" class="btn btn-link" id="blog-archive-button">Show archived posts</button>
  154. <div id="blog-archive">
  155. <em>The content that should be here is dynamically generated. Please enable JavaScript if you see this.</em>
  156. </div>
  157. <script src="scripts/blog.js"></script>
  158. </div>
  159. </div>
  160. </div>
  161. </div>
  162. <!-- Footer -->
  163. <div class="footer rounded-top">
  164. <span class="text-muted"><a href="https://git.ellpeck.de/Ellpeck/Web">&copy; 2018-2021 Ellpeck</a> &ndash; <a href="#impressum">Impressum</a> &ndash; <a href="#privacy">Privacy</a></span>
  165. <div class="quote">
  166. <span id="quote-text"></span>
  167. <script src="scripts/quote.js"></script>
  168. <img src="res/blobheart.png" id="blobheart">
  169. </div>
  170. </div>
  171. <!-- Impressum -->
  172. <div class="modal fade" id="impressum-modal" tabindex="-1">
  173. <div class="modal-dialog modal-lg">
  174. <div class="modal-content">
  175. <div class="modal-header">
  176. <h5 class="modal-title">Impressum</h5>
  177. <button type="button" class="close" data-dismiss="modal">&times;</button>
  178. </div>
  179. <div class="modal-body">
  180. <p>
  181. Julian Schubert
  182. <br>Kastanienweg 27
  183. <br>52074 Aachen
  184. </p>
  185. <p>
  186. Telefon: 0241 45093753
  187. <br>E-Mail: me@ellpeck.de
  188. </p>
  189. <p>Die obenstehende Person ist ebenfalls verantwortlich für den Inhalt (gem. § 55 Abs. 2 RStV).</p>
  190. </div>
  191. </div>
  192. </div>
  193. </div>
  194. <!-- Privacy -->
  195. <div class="modal fade" id="privacy-modal" tabindex="-1">
  196. <div class="modal-dialog modal-lg">
  197. <div class="modal-content">
  198. <div class="modal-header">
  199. <h5 class="modal-title">Privacy</h5>
  200. <button type="button" class="close" data-dismiss="modal">&times;</button>
  201. </div>
  202. <div class="modal-body">
  203. <p>This site uses cookies to store information about your browsing activity.</p>
  204. <p>Ellpeck.de stores the following information:</p>
  205. <ul>
  206. <li>A cookie named <code>dark</code> with the value <code>true</code> or <code>false</code> that stores if you have dark mode enabled</li>
  207. <li>A cookie named <code>notification</code> with the value <code>true</code> or <code>false</code> that stores if you have already closed the cookie notification that displays at the top of the page</li>
  208. </ul>
  209. <p>Due to widgets and embeds, additional information will be stored by other sites. Please refer to those sites' privacy policies for more information:</p>
  210. <ul>
  211. <li>Google uses cookies to serve ads based on a user's prior visits to this website. You may opt out of personal advertising by visiting <a href="https://www.google.com/settings/ads">Ad Settings</a>. For more information, see <a href="http://www.google.com/policies/privacy/partners/">how Google uses data when you use its partners' sites or apps</a>.</li>
  212. <li>Discord uses cookies for its widget embed. For more information, see <a href="https://discordapp.com/privacy">their privacy policy</a>.</li>
  213. <li>Twitter uses cookies for its tweet embeds. For more information, see <a href="https://twitter.com/en/privacy">their privacy policy</a>.</li>
  214. </ul>
  215. <p>
  216. Transparency is very important to us, and as such, if you have any doubts about the security of this website, you can view its source code <a href="https://git.ellpeck.de/Ellpeck/Web">on Gitea</a>.
  217. <br>Keep in mind that you can also review or delete stored cookies for any site at any time in your browser's settings.
  218. </p>
  219. </div>
  220. </div>
  221. </div>
  222. </div>
  223. </body>
  224. </html>