BeyondCodeBootcamp · uniqname · Apr 6, 2021 · Apr 7, 2021 · Apr 8, 2021 · Apr 8, 2021
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,7 @@
+/build
+/dist
+/tmp
+
 # Logs
 logs
 *.log

diff --git a/.prettierrc.json b/.prettierrc.json
@@ -0,0 +1,3 @@
+{
+    "tabWidth": 2
+}
diff --git a/README.md b/README.md
@@ -6,7 +6,97 @@ Intentional Markdown blog template - Lightweight, yet Sophisticated.
 
 [![](https://user-images.githubusercontent.com/122831/113492733-e735cc80-9496-11eb-8787-43fee2671891.jpg)](https://www.youtube.com/watch?v=LlYrvZuIYUQ&list=PLxki0D-ilnqZfyo2dZe11ZNGP7RJxJcoA&index=11&rel=0)
 
+## How to Use Beyond Theme
+
+1. Download both stylesheets:
+
+   ```bash
+   curl -LO https://raw.githubusercontent.com/BeyondCodeBootcamp/beyond-blog-template/main/assets/github-markdown.css
+
+   curl -LO https://raw.githubusercontent.com/BeyondCodeBootcamp/beyond-blog-template/main/assets/beyond-theme.css
+   ```
+
+2. Include them in the `<head>` of your html:
+
+   ```html
+   <link rel="stylesheet" href="/assets/github-markdown.css" />
+   <link rel="stylesheet" href="/assets/beyond-theme.css" />
+   ```
+
+Example:
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <!-- Beyond Code Styles -->
+    <link rel="stylesheet" href="/assets/github-markdown.css" />
+    <link rel="stylesheet" href="/assets/beyond-theme.css" />
+  </head>
+  <body>
+    <!-- more content -->
+  </body>
+</html>
+```
+
+## How to use the Beyond Markdown Article
+
+Inside of your `<body>` create an `<article class="markdown-body">` with the rendered Markdown output.
+
+```html
+<article class="markdown-body">
+  <!-- Place rendered markdown content here. Example: -->
+  <p>Hello</p>
+  <ol>
+    <li>One</li>
+    <li>Two</li>
+    <li>Three</li>
+  </ol>
+</article>
+```
+
+## How to use the Beyond Header
+
+Create a `<nav class="beyond-nav">` with a single `<a href="/">` link to the homepage, and a `<ul>` containing all other links.
+
+```html
+<nav class="beyond-nav">
+  <a href="/">
+    <span style="font-weight: bold">Beyond</span>
+    <span style="font-weight: lighter">Code</span>
+  </a>
+  <ul>
+    <li><a href="/">Blog</a></li>
+    <li><a href="/contact.html">Contact</a></li>
+  </ul>
+</nav>
+```
+
+## How to use the Beyond Footer
+
+Create a `<footer class="beyond-footer">` and all elements inside of it will be spaced evenly.
+
+```html
+<footer class="beyond-footer">
+  © 2021
+  <center>&#x2665;</center>
+  AJ ONeal
+</footer>
+```
+
+# How to Build a Beyond Markdown Blog
+
+```bash
+curl -sS https://webinstall.dev | bash
+
+webi sd comrak
+
+bash build.sh
+```
+
 # Credit
 
--   @sindresorhus for [github-markdown.css](https://github.com/sindresorhus/github-markdown-css) (MIT License)
--   @uniqname for beyond-theme.css
+- @sindresorhus for [github-markdown.css](https://github.com/sindresorhus/github-markdown-css) (MIT License)
+- @uniqname for beyond-theme.css
diff --git a/assets/beyond-theme.css b/assets/beyond-theme.css
@@ -1,87 +1,135 @@
 /* Created by @uniqname */
 html,
 body {
-    box-sizing: border-box;
-    font-family: sans-serif;
-    margin: 0;
-    padding: 0;
+  box-sizing: border-box;
+  font-family: sans-serif;
+  margin: 0;
+  padding: 0;
 }
 
 *,
 *::before,
 *::after {
-    color: inherit;
+  color: inherit;
 }
 
 body {
-    display: grid;
-    grid-template-rows: max-content 1fr max-content;
-    min-height: 100%;
+  display: grid;
+  grid-template-rows: max-content 1fr max-content;
+  min-height: 100%;
 }
 
 .beyond-nav {
-    display: grid;
-    gap: 1em;
-    grid-template-columns: auto 1fr;
+  display: grid;
+  gap: 1em;
+  grid-template-columns: auto 1fr;
 
-    background-color: #333;
-    padding: 1em;
-    color: #fafafa;
+  background-color: #333;
+  padding: 1em;
+  color: #fafafa;
 }
 
 .beyond-nav > a {
-    color: #fff;
-    font-size: 1.5em;
+  color: #fff;
+  font-size: 1.5em;
 }
 .beyond-nav > ul {
-    display: grid;
-    grid-auto-columns: max-content;
-    gap: 1em;
-    grid-auto-flow: column;
-    list-style: none;
-    margin: 0;
-    padding: 0;
-    padding-top: 0.5em;
+  display: grid;
+  grid-auto-columns: max-content;
+  gap: 1em;
+  grid-auto-flow: column;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  padding-top: 0.5em;
 }
 
 .beyond-nav a,
 .beyond-nav a:visited {
-    color: inherit;
-    text-decoration: none;
+  color: inherit;
+  text-decoration: none;
 }
 .beyond-nav a:hover {
-    color: #ccc;
-    text-decoration: none;
+  color: #ccc;
+  text-decoration: none;
 }
 
 .beyond-footer {
-    padding: 1em;
-    display: grid;
-    grid-auto-flow: column;
-    place-items: center;
-    color: #ccc;
+  padding: 1em;
+  display: grid;
+  grid-auto-flow: column;
+  place-items: center;
+  color: #ccc;
 }
 
 .beyond-footer a,
 .beyond-footer a:visited {
-    color: #5e8be0;
+  color: #5e8be0;
 }
 
 .markdown-body {
-    padding: 1em;
+  width: 100%;
+  max-width: 980px;
+  margin: 0 auto;
+  padding: 15px;
+  width: 100%;
+}
+
+@media (min-width: 767px) {
+  .markdown-body {
+    padding: 45px;
+  }
 }
 
 /* Markdown wrapper taken from github-markdown-css docs by @sindresorhus */
 .markdown-body {
-    box-sizing: border-box;
-    min-width: 200px;
-    max-width: 980px;
-    margin: 0 auto;
-    padding: 45px;
+  box-sizing: border-box;
+  min-width: 200px;
+  max-width: 980px;
+  margin: 0 auto;
+  padding: 45px;
 }
 
 @media (max-width: 767px) {
-    .markdown-body {
-        padding: 15px;
-    }
+  .markdown-body {
+    padding: 15px;
+  }
+}
+
+.responsive-table.responsive-table {
+  display: grid;
+  grid-template-rows: min-content 1fr;
+  gap: 1em;
+  padding: 1em;
+}
+
+.responsive-table + .responsive-table {
+  margin-top: 4em;
+}
+
+.responsive-table:nth-of-type(odd) {
+  background-color: #eee;
+}
+
+.responsive-table.responsive-table > dt {
+  margin: 0;
+  color: #999;
+  border-bottom: 1px solid #999;
+}
+.responsive-table.responsive-table > dd {
+  padding: 0;
+}
+
+@media (min-width: 767px) {
+  .responsive-table.responsive-table {
+    display: grid;
+    grid-template-rows: min-content 1fr;
+    grid-auto-flow: column;
+    gap: 1em;
+    padding: 1em;
+  }
+
+  .responsive-table:nth-of-type(odd) {
+    background-color: unset;
+  }
 }
diff --git a/assets/exploites.md b/assets/exploites.md
@@ -0,0 +1,89 @@
+Cover Art
+
+: ![][box-0-0]
+
+Details
+
+: **The Legend of Zelda: Twilight Princess** \
+(17s and 1 button) \
+![][disc-0-0] \
+**$50 ~ $100** \
+[Amazon](https://amzn.to/3ceOPP4) \| [eBay](https://ebay.us/U6lK9d)
+
+Exploit
+
+: _"Twilight Hack"_ \
+Github: [FIX94/twilight-hack-gc][source-0-0] \
+**Download**: [github.com/FIX94/twilight-hack-gc/releases][download-0-0] \
+**Instructions**: [GC Forever: Twilight Hack][readme-0-0] \
+Demo: [youtu.be/BO89dmKzBw4][demo-0-0] \
+Notes: Press Start \
+Buttons: start
+
+---
+
+Cover Art
+
+: ![][box-0-1]
+
+Details
+
+: **The Legend of Zelda: Wind Waker** \
+(16s and 1 button) \
+![][disc-0-1] \
+**$55 ~ $70** \
+[Amazon](https://amzn.to/2ObHGHn) \| [eBay](https://ebay.us/LcUYUr)
+
+Exploit
+
+: **"WWHack"** \
+Github: [FIX94/ww-hack-gc][source-0-1] \
+**Download**: [github.com/FIX94/ww-hack-gc/releases][download-0-1] \
+**Instructions**: [GC Forever: Wind Waker Hack][readme-0-1] \
+Demo: [youtu.be/wyfLvGx5LZA][demo-0-1] \
+Notes: Press Start \
+Buttons: start
+
+---
+
+Cover Art
+
+: ![][box-0-2]
+
+Details
+
+: **Super Mario Sunshine** \
+(5s and 0 buttons) \
+![][disc-0-2] \
+**$45 ~ $75** \
+[Amazon](https://local.kit.co/Proxy.ashx?TSID=25396&GR_URL=http%3A%2F%2Fwww.amazon.co.uk%2Fdp%2FB00006GSHY&TRACK=coolaj86&amazon-ids-by-cc=US%3Dco0dcd-20%2CCA%3Dcoolaj86-20%2CGB%3Dcoolaj86-21) \| [eBay](https://ebay.us/ctZ08l)
+
+Exploit
+
+: **"ShineHax"** \
+Github: [QbeRoot/shinehax-gc][source-0-2] \
+**Download**: [github.com/QbeRoot/shinehax-gc/releases][download-0-2] \
+**Instructions**: [GC Forever: shinehax][readme-0-2] \
+Demo: [youtu.be/E1Ef1xSvvFw][demo-0-2] \
+Notes: PAL Only \
+Fully Automatic \
+Buttons: N/A
+
+[box-0-0]: https://i.imgur.com/wpxhgcc.jpg "Box Art"
+[disc-0-0]: https://i.imgur.com/F5HERXM.png "Disc Art"
+[source-0-0]: https://github.com/FIX94/twilight-hack-gc "Source Code"
+[download-0-0]: https://github.com/FIX94/twilight-hack-gc/releases "Download"
+[readme-0-0]: http://www.gc-forever.com/forums/viewtopic.php?f=39&t=3306 "Instructions"
+[demo-0-0]: https://youtu.be/BO89dmKzBw4 "YouTube Demo"
+[box-0-1]: https://i.imgur.com/7dW2Gll.jpg "Box Art"
+[disc-0-1]: https://i.imgur.com/n4fRV79.png "Disc Art"
+[source-0-1]: https://github.com/FIX94/ww-hack-gc "Source Code"
+[download-0-1]: https://github.com/FIX94/ww-hack-gc/releases "Download"
+[readme-0-1]: http://www.gc-forever.com/forums/viewtopic.php?f=39&t=3311 "Instructions"
+[demo-0-1]: https://youtu.be/wyfLvGx5LZA "YouTube Demo"
+[box-0-2]: https://i.imgur.com/Rwanv1X.jpg "Box Art"
+[disc-0-2]: https://i.imgur.com/yL3OiF9.png "Disc Art"
+[source-0-2]: https://github.com/QbeRoot/shinehax-gc "Source Code"
+[download-0-2]: https://github.com/QbeRoot/shinehax-gc/releases "Download"
+[readme-0-2]: http://www.gc-forever.com/forums/viewtopic.php?f=39&t=4500 "Instructions"
+[demo-0-2]: https://youtu.be/E1Ef1xSvvFw?t=134 "YouTube Demo"
-Original file line number
+Diff line change
@@ -1,3 +1,7 @@
+    /build
+    /dist
+    /tmp
     # Logs
     logs
     *.log
@@ Expand Down @@