From 756a5a9a8a9e0209e4d4452ae990fb751e03d72a Mon Sep 17 00:00:00 2001
From: Salt <rehashedsalt@cock.li>
Date: Tue, 9 Feb 2021 05:24:58 -0600
Subject: [PATCH] Work on more revamping of the Minecraft section

---
 minecraft/index.php         | 20 ++++++----------
 minecraft/setup/index.php   | 48 +++++++++++++++++++------------------
 minecraft/styles/styles.css | 30 +++++++++++++++++++++++
 styles/styles.css           |  2 ++
 4 files changed, 64 insertions(+), 36 deletions(-)

diff --git a/minecraft/index.php b/minecraft/index.php
index c344bda..b9a5d8b 100644
--- a/minecraft/index.php
+++ b/minecraft/index.php
@@ -5,22 +5,16 @@
 		<link href="/styles/buttons.css" type="text/css" rel="stylesheet" />
 		<link href="/minecraft/styles/styles.css" type="text/css" rel="stylesheet" />
 		<link rel="shortcut icon" href="/favicon.ico" />
-		<title>9iron</title>
+		<title>9iron - Modded Minecraft</title>
 	</head>
 	<body>
 		<?php include $_SERVER['DOCUMENT_ROOT'].'/src/common-header.php';?>
 		<div class="content">
 			<div class="section">
-				<h1>Modded Minecraft</h1>
-				<p>It's been a go-to of ours for a while. Ongoing and historical modpacks are listed here for your convenience and participation.</p>
-				<p>At-a-glance information is provided here for the various packs we play.</p>
-				<div class="iconbuttoncontainer">
-					<a href="/minecraft/setup" class="iconbutton">
-						<i class="fa fa-play"></i>
-						<h1>Setup</h1>
-						<p>Set up an entire modded Minecraft environment</p>
-					</a>
-				</div>
+				<a href="/minecraft/setup" class="startbutton">
+					<i class="fa fa-play"></i>
+					<p>Confused? Click here to get started</p>
+				</a>
 			</div>
 			<?php
 # Define a pack card generator function
@@ -72,14 +66,14 @@ if (!empty($packs)) {
 		# We have a valid current pack, remove it from the list and print it upfront
 		$currentpack = readlink("packs/current");
 		$packs = array_diff($packs, ["$currentpack", "current"]);
-		echo '<h1>Current Modpack</h1>';
+		echo '<div class="currentcontainer"><h1>Current Modpack</h1>';
 		echo_pack($currentpack);
 		# If there's a server IP name along with that, print that out too
 		if (file_exists("packs/currentip")) {
 			$ip = file_get_contents("packs/currentip");
 			echo "<p><code class=\"bigcode\">$ip</code></p>";
 		}
-		echo '</div><div class="section">';
+		echo '</div></div><div class="section">';
 	}
 	# Sort the list of remaining packs
 	sort($packs);
diff --git a/minecraft/setup/index.php b/minecraft/setup/index.php
index 1073a32..9aab4b9 100644
--- a/minecraft/setup/index.php
+++ b/minecraft/setup/index.php
@@ -2,37 +2,35 @@
 <html>
 	<head>
 		<?php include $_SERVER['DOCUMENT_ROOT'].'/src/common-meta.php';?>
+		<link href="/minecraft/styles/styles.css" type="text/css" rel="stylesheet" />
 		<title>9iron - Modded Minecraft Setup</title>
 	</head>
 	<body>
 		<?php include $_SERVER['DOCUMENT_ROOT'].'/src/common-header.php';?>
 		<div class="content">
 			<div class="section">
+				<a href="/minecraft" class="startbutton">
+					<p>Return to modpacks</p>
+				</a>
 				<h1>Setting Up Modded Minecraft</h1>
-				<p>This guide will set you up with the following:</p>
-				<ul>
-					<li>Java, because that's <em>still</em> a pain in the dick to set up</li>
-					<li>A new Minecraft game launcher to help organize modpacks</li>
-					<li>Whatever modpack we're playing</li>
-				</ul>
 			</div>
-			<div class="section" id="java">
-				<h1>1. Installing Java</h1>
+			<div class="subcontainer" id="java">
+				<h2>1. Installing Java</h2>
+				<p>Minecraft depends on Java. It's important that you have the latest 64-bit edition of Java installed.</p>
 				<ol>
-					<li>Download <a href="https://sdlc-esd.oracle.com/ESD6/JSCDL/jdk/8u251-b08/3d5a2bb8f8d4428bbe94aed7ec7ae784/jre-8u251-windows-x64.exe?GroupName=JSC&FilePath=/ESD6/JSCDL/jdk/8u251-b08/3d5a2bb8f8d4428bbe94aed7ec7ae784/jre-8u251-windows-x64.exe&BHost=javadl.sun.com&File=jre-8u251-windows-x64.exe&AuthParam=1593609737_aee69d42e03369a5aed61477a858b110&ext=.exe">the 64-bit edition of Java 8</a></li>
-					<li>Run it</li>
-					<li>You're done</li>
+					<li>Go to <a href="https://www.java.com/en/download/manual.jsp">Java Downloads</a></li>
+					<li>Download and run the "Windows Offline (64-bit)" option</li>
 				</ol>
 			</div>
-			<div class="section" id="multimc">
-				<h1>2. Installing MultiMC</h1>
+			<div class="subcontainer" id="multimc">
+				<h2>2. Installing MultiMC</h2>
 				<p>MultiMC is the launcher that we use to organize our modpacks. It has a number of features to make pack installation easier.</p>
 				<ol>
 					<li>Download <a href="https://multimc.org/#Download">MultiMC</a></li>
-					<li>Extract the zip file somewhere, like your desktop or Documents</li>
+					<li>Extract the zip file somewhere, like your desktop or Documents folder</li>
 					<li>Run <code>multimc.exe</code></li>
 				</ol>
-				<p>MultiMC will then run you through basic setup. You can accept the defaults, but change the following:</p>
+				<p>MultiMC will then run you through basic setup. You can accept the defaults, but will probably want to change the following:</p>
 				<ul>
 					<li>On the page where it asks you to set up Java, set these values:</li>
 					<ul>
@@ -42,28 +40,32 @@
 				</ul>
 				<p>After that, it'll drop you to the main screen and you can progress to the next step.</p>
 			</div>
-			<div class="section" id="pack">
-				<h1>3. Installing a Modpack</h1>
-				<p>Packs on the server, as of the time of writing this document, will from now on be provided in a format that's much easier to use with MultiMC. If, for whatever reason, you have to install one that <em>isn't</em>, flag down a moderator and have them show you. It's honestly a pretty involved process.</p>
+			<div class="subcontainer" id="pack">
+				<h2>3. Installing a Modpack</h2>
+				<p>All modpacks here are installable through MultiMC.</p>
 				<ol>
+					<li>Download the modpack you want to play</li>
 					<li>Open MultiMC</li>
 					<li>Hit the "Add Instance" button in the upper-left</li>
 					<li>Pick the option on the left called "Import from Zip"</li>
-					<li>Copy the pack download link from the previous page and stick it in the URL</li>
+					<li>Browse for the zip you just downloaded</li>
 					<li>Click OK</li>
 				</ol>
 				<p>This will set you up with a nice, shiny new instance with all the mods ready to go. Double-click it to launch it.</p>
 				<p>If MultiMC prompts for it, be sure to set up your Minecraft account.</p>
 			</div>
-			<div class="section" id="joining">
-				<h1>4. Joining a Server</h1>
-				<p>This one's pretty easy, thankfully</p>
+			<div class="subcontainer" id="joining">
+				<h2>4. Joining the Server</h2>
+				<p>Now the last thing we need to do is connect you to the server.</p>
 				<ol>
+					<li>Launch the game by double-clicking the modpack icon</li>
 					<li>Copy the server URL (something like <code>modpack.mc.9iron.club</code>)</li>
-					<li>Open the game, go to Multiplayer, and click "Add Server"</li>
+					<li>In the game, go to "Multiplayer", and click "Add Server"</li>
 					<li>Stick whatever name you want in the name field and paste the server URL in the "IP Address" field</li>
 					<li>Double-click it to join</li>
 				</ol>
+				<p>You're looking for the huge, can't-miss-it serif font with the gray background:</p>
+				<code class="bigcode">serverip.blah.blah</code>
 			</div>
 		</div>
 		<?php include $_SERVER['DOCUMENT_ROOT'].'/src/common-footer.php';?>
diff --git a/minecraft/styles/styles.css b/minecraft/styles/styles.css
index 1082294..3e65ced 100644
--- a/minecraft/styles/styles.css
+++ b/minecraft/styles/styles.css
@@ -5,13 +5,43 @@
  * Distributed under terms of the MIT license.
  */
 
+a.startbutton {
+	background: var(--greenlink);
+	border-radius: 8px;
+	box-shadow: 5px 5px var(--shadow);
+	color: var(--background);
+	display: block;
+	font-size: 140%;
+	padding: 1em;
+}
+a.startbutton:hover {
+	background: var(--greenlink-hover);
+}
+a.startbutton i {
+	float: right;
+	vertical-align: middle;
+}
+a.startbutton p {
+	display: inline-block;
+	font-weight: bold;
+	margin: 0;
+	vertical-align: middle;
+}
 code.bigcode {
+	background: var(--background);
+	border-radius: 8px;
 	display: block;
 	font-size: 400%;
 	text-align: center;
 	margin: auto;
 	padding: 0.5em;
 }
+div.currentcontainer {
+	border: 4px solid var(--line);
+	border-radius: 8px;
+	margin: 1em 0;
+	padding: 1em;
+}
 div.packcontainer {
 	display: grid;
 	grid-gap: 1em;
diff --git a/styles/styles.css b/styles/styles.css
index 02d800e..1410dc6 100644
--- a/styles/styles.css
+++ b/styles/styles.css
@@ -11,6 +11,8 @@
 	--background-bright: #fdfcfa;
 	--background: #ecebe9;
 	--line: #d6d5d3;
+	--greenlink: #327117;
+	--greenlink-hover: #47b625;
 	--link: #286a9d;
 	--link-hover: #3ea5f3;
 	--shadow: 8px -5px #d6d5d3;