kiyarose · kiyarose · Dec 2, 2023 · Dec 2, 2023 · Dec 2, 2023 · Dec 2, 2023
diff --git a/docs/1.html b/docs/1.html
@@ -0,0 +1,40 @@
+<!DOCTYPE=HTML>
+<link rel="stylesheet" type="text/css" href="style.css">
+
+<center>
+<a href="/">←Back</a>
+
+<h1 id="steps">Steps</h1>
+
+Click <a href="https://github.com/DamianSwanAAJHS2/SillyLittleFiles/releases/download/Pipeline/silly.onc">this link</a> (You should have just gotten a file downloaded)<br>
+Go to <code>chrome://network</code><br>
+This funny thing only works on chromebooks running chrome<br>
+
+<br>
+Scroll to the bottom and press <code>Import ONC</code>, then upload the onc file<br>
+Delete the file and then go to your quick access settings (click the clock) <br>
+Click <code>VPN</code>, and then <code>Silly little file</code> (If unmodified from this original upload)<br>
+Please note this may take a few tries to connect, but be persistant, it will work eventually<br>
+<br>
+Profit<br>
+
+<p>Check out <a href=/11.html> if you are interested in making your own files 😜 </a> </p>
+<p id="udate" style="color:lightgrey; font-style:italic;">Synced: </p>
+
+<script>
+document.getElementById("udate").innerHTML = document.getElementById("udate").innerHTML + document.lastModified;
+</script>
+</center>
+<script src="https://giscus.app/client.js"
+        data-repo="DamianSwanAAJHS2/SillyLittleFiles"
+        data-repo-id="R_kgDOJPpxXw"
+        data-mapping="number"
+        data-term="1"
+        data-reactions-enabled="1"
+        data-emit-metadata="0"
+        data-input-position="bottom"
+        data-theme="light"
+        data-lang="en"
+        crossorigin="anonymous"
+        async>
+</script>
diff --git a/docs/11.html b/docs/11.html
@@ -0,0 +1,54 @@
+<!DOCTYPE=HTML>
+<link rel="stylesheet" type="text/css" href="style.css">
+<center>
+<a href="/">←Back</a>
+<h1 id="intro">Intro</h1>
+
+If you are looking at this post, you mayhaps be interested in making your own .onc files to import a VPN into ChromeOS. <br>
+If you want a premade file check out <a href="/1.html">this page </a>instead.<br>
+
+<h2 id="making-a-ipsec-config-via-proton">Making a IPSec config via Proton</h2><br>
+<h3 id="web-side">Web side</h3><br>
+<br>
+<a href="https://account.protonvpn.com/signup?plan=free&amp;currency=EUR&amp;ref=upsell">Make a Proton account</a><br>
+A good website to make a burner email for this is <a href="https://signup.mail.com/#.7518-header-signup1-1">mail.com </a><br>
+Visit the <a href="https://account.protonvpn.com/downloads">Proton downloads dashboard</a><br>
+Set your options as follows <br>
+<img src="https://github.com/DamianSwanAAJHS2/SillyLittleFiles/assets/75678535/fbbf9aea-efde-450e-81f1-9846607ea1ec" alt="image"><br>
+Expand the country you want, go to a low latency server (or any) and choose the dropdown arrow beside download <br>
+<img src="https://github.com/DamianSwanAAJHS2/SillyLittleFiles/assets/75678535/ab8dc037-8bd7-4335-a451-b063552c1e25" alt="image"><br>
+Use this to copy the link (This will be your hostname) <br>
+Go to the <a href="https://account.protonvpn.com/account#openvpn">Proton accounts dashboard</a> and note your credentials for OpenVPN<br>
+
+<h3 id="chromebook-side">Chromebook side</h3><br>
+<br>
+Go to Settings &gt; Network &gt; Vpn &gt; Click the (+)<br>
+Set Service name to something silly idc<br>
+Set Provider Type to <code>IPsec (iKEv2)</code><br>
+Set Server Hostname to <code>Step 4 Hostname</code><br>
+Double check Authentication Type is <code>Username and password</code><br>
+Set Username to <code>Step 5 Credentials</code><br>
+Set Password to <code>Step 5 Credentials</code> <br>
+Double check Server CA Certificate is set to <code>ProtonVPN Root CA [ProtonVPN Root CA]</code><br>
+Toggle <code>Save identity and password</code> so you dont have to remember all of this<br>
+Click connect<h2 id="onc-making">ONC making</h2><br>
+You can also use this info along with the premade file here to make a new one (using the same certs as they are the default certs for PVN CA Root) <br>
+<p id="udate" style="color:lightgrey; font-style:italic;">Synced: </p>
+
+<script>
+document.getElementById("udate").innerHTML = document.getElementById("udate").innerHTML + document.lastModified;
+</script>
+</center>
+<script src="https://giscus.app/client.js"
+        data-repo="DamianSwanAAJHS2/SillyLittleFiles"
+        data-repo-id="R_kgDOJPpxXw"
+        data-mapping="number"
+        data-term="11"
+        data-reactions-enabled="1"
+        data-emit-metadata="0"
+        data-input-position="bottom"
+        data-theme="light"
+        data-lang="en"
+        crossorigin="anonymous"
+        async>
+</script>
diff --git a/docs/404.html b/docs/404.html
@@ -1,33 +1,65 @@
-<!DOCTYPE html>
 <html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Page Not Found</title>
+<head>
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
+<style>
+body {
+  margin: 0;
+  padding: 0;
+  font-family: Arial, sans-serif;
+  color: white;
+  text-align: center;
+  animation: gradient 10s infinite;
+  background-size: cover;
+}
 
-    <style media="screen">
-      body { background: #ECEFF1; color: rgba(0,0,0,0.87); font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0; padding: 0; }
-      #message { background: white; max-width: 360px; margin: 100px auto 16px; padding: 32px 24px 16px; border-radius: 3px; }
-      #message h3 { color: #888; font-weight: normal; font-size: 16px; margin: 16px 0 12px; }
-      #message h2 { color: #ffa100; font-weight: bold; font-size: 16px; margin: 0 0 8px; }
-      #message h1 { font-size: 22px; font-weight: 300; color: rgba(0,0,0,0.6); margin: 0 0 16px;}
-      #message p { line-height: 140%; margin: 16px 0 24px; font-size: 14px; }
-      #message a { display: block; text-align: center; background: #039be5; text-transform: uppercase; text-decoration: none; color: white; padding: 16px; border-radius: 4px; }
-      #message, #message a { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
-      #load { color: rgba(0,0,0,0.4); text-align: center; font-size: 13px; }
-      @media (max-width: 600px) {
-        body, #message { margin-top: 0; background: white; box-shadow: none; }
-        body { border-top: 16px solid #ffa100; }
-      }
-    </style>
-  </head>
-  <body>
-    <div id="message">
-      <h2>404</h2>
-      <h1>Page Not Found</h1>
-      <p>The specified file was not found on this website. Please check the URL for mistakes and try again.</p>
-      <h3>Why am I seeing this?</h3>
-      <p>This page was generated by the Firebase Command-Line Interface. To modify it, edit the <code>404.html</code> file in your project's configured <code>public</code> directory.</p>
-    </div>
-  </body>
+@keyframes gradient {
+  0% {
+    background: linear-gradient(to right, #ff0000, #ffff00);
+  }
+  25% {
+    background: linear-gradient(to right, #ffff00, #00ff00);
+  }
+  50% {
+    background: linear-gradient(to right, #00ff00, #00ffff);
+  }
+  75% {
+    background: linear-gradient(to right, #00ffff, #0000ff);
+  }
+  100% {
+    background: linear-gradient(to right, #0000ff, #ff0000);
+  }
+}
+
+h1 {
+  font-size: 5em;
+  margin-top: 20%;
+}
+
+img {
+  width: 300px;
+  height: 300px;
+  margin-top: 20px;
+}
+</style>
+</head>
+<body>
+<h1 id="word">404</h1>
+<img id="image" alt="A random image">
+<h2>
+<a href="/">Back</a>
+</h2>
+<script>
+// Get a random word from the Wordnik API
+/*var wordnik_url = "https://api.wordnik.com/v4/words.json/randomWord?hasDictionaryDef=true&minCorpusCount=0&minLength=5&maxLength=15&api_key=YOUR_API_KEY";
+$.getJSON(wordnik_url, function(data) {
+  // Set the word as the text of the h1 element
+  $("#word").text(data.word);
+});
+*/
+// Get a random image from the Lorem Picsum API
+var picsum_url = "https://picsum.photos/300";
+// Set the image source as the url
+$("#image").attr("src", picsum_url);
+</script>
+</body>
 </html>
diff --git a/docs/disc.html.template b/docs/disc.html.template
@@ -0,0 +1,25 @@
+<!Some Code Generated Via https://markdowntohtml.com/>
+<!DOCTYPE=HTML>
+<link rel="stylesheet" type="text/css" href="style.css">
+
+<center>
+
+  <!CONTENT GOES IN HERE>
+
+<script>
+document.getElementById("udate").innerHTML = document.getElementById("udate").innerHTML + document.lastModified;
+</script>
+</center>
+<script src="https://giscus.app/client.js"
+        data-repo="DamianSwanAAJHS2/SillyLittleFiles"
+        data-repo-id="R_kgDOJPpxXw"
+        data-mapping="number"
+        data-term="DISCUSSIONID"
+        data-reactions-enabled="1"
+        data-emit-metadata="0"
+        data-input-position="bottom"
+        data-theme="light"
+        data-lang="en"
+        crossorigin="anonymous"
+        async> // data-term must contain github discussion id
+</script>
diff --git a/docs/index.html b/docs/index.html
@@ -25,10 +25,15 @@ <h3 id="region"></h3>
 });
 </script>
 
-<center><h1>SLF Protocol Setup</h1><br><h3 style='font-family=arial'> See <a href='https://github.com/DamianSwanAAJHS2/SillyLittleFiles/discussions/1' style='font-family=arial'>#1</a> for a premade (albeit slow and unstable) file!<br> </h3>
-<h3 style='font-family=arial'> See <a href='https://github.com/DamianSwanAAJHS2/SillyLittleFiles/discussions/11' style='font-family=arial'>#11</a> for a tutorial on how to make files, although this requires some level of critical thinking. </h3>
+<center><h1>SLF Protocol Setup</h1><br><h3 style='font-family=arial'> See <a href='/1.html' style='font-family=arial'>#1</a> for a premade (albeit slow and unstable) file!<br> </h3>
+<h3 style='font-family=arial'> See <a href='/11.html' style='font-family=arial'>#11</a> for a tutorial on how to make files, although this requires some level of critical thinking. </h3>
 <h3 style='font-family=arial'> Technical Links </h3>
 <p style='font-family=arial'>Template File: </p>
 <script src="https://emgit.luolix.top/embed-v2.js?target=https%3A%2F%2Fgit.luolix.top%2FDamianSwanAAJHS2%2FSillyLittleFiles%2Fblob%2Fmain%2Ftemplate.onc&style=default&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showFullPath=on&showCopy=on"></script>
 <p style='font-family=arial'>Onc File Breakdown:</p> <a style='font-family=arial' href='https://github.com/DamianSwanAAJHS2/SillyLittleFiles/blob/source/silly.onc'>https://chromium.googlesource.com/chromium/src/+/main/components/onc/docs/onc_spec.md</a>
+<p id="udate" style="color:lightgrey; font-style:italic;">Updated: </p>
+
+<script>
+document.getElementById("udate").innerHTML = document.getElementById("udate").innerHTML + document.lastModified;
+</script>
 </center>