Merge pull request #1 from the1anonlypr3/main

add FAT32 format guides for linux and macOS, along with site icon and selection colours - pr3
hackrfstuff · Dec 7, 2024 · 6659b91 · 6659b91
2 parents 21f2348 + 7a95580
commit 6659b91
Show file tree

Hide file tree

Showing 4 changed files with 59 additions and 0 deletions.
diff --git a/docs/microsdcardsetup.html b/docs/microsdcardsetup.html
@@ -6,6 +6,7 @@
     <title>MicroSD Card Setup</title>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
+    <link rel="icon" type="image/x-icon" href="../images/Site_Icon.png">
     <link rel="stylesheet" href="../styles.css">
 </head>
 <body>
@@ -17,6 +18,7 @@
                     <div class="col">
                         <div class="card h-100 border-0">
                             <div class="card-body">
+                                <!-- Windows Guide (by arouut) -->
                                 <h3 class="card-title">MicroSD Card Setup (Windows Guide)</h3>
                                 <p class="card-text">For the sake of keeping this guide simple, the steps are the exactly the same for people with MicroSD Cards smaller than 32 gigabytes.</p>
                                 <ol class="custom-list">
@@ -37,6 +39,51 @@ <h3 class="card-title">MicroSD Card Setup (Windows Guide)</h3>
                                     </li>
                                     <li>Press the "Start" button and wait until the process is complete.</li>
                                     <li>You can now eject the MicroSD Card, and move on to the next page.</li>
+                                    <li>For a Linux guide, please look below.</li> 
+                                </ol>
+                                <!-- Linux Guide (pr3 made this!) -->
+                                <h3 class="card-title">MicroSD Card Setup (Linux Guide using GParted)</h3>
+                                <p class="card-text">This guide is for MicroSD cards under 32GB.</p>
+                                <i>For the further sake of simplicity, a GUI tool is intentionally used. You may also want to back up any important files on your MicroSD card before formatting.</i></p>
+                                <ol class="custom-list">
+                                    <li>as the Windows guide specifies, plug your MicroSD card into your computer.</li>
+                                    <li>Update your Linux system with <code>sudo apt update</code>, <code>sudo pacman -Syu</code>, or <code>sudo yum update</code>.</li>
+                                    <li>Install GParted with <code>sudo apt install gparted</code>, <code>sudo pacman -Sy gparted</code>, or <code>sudo yum install gparted</code>, and run it with root priviledges with <code>sudo gparted</code>.</li>
+                                    <li>Select your device in the dropdown located at the top right corner of the GParted homescreen.
+                                        <br>
+                                        <img src="https://phoenixnap.com/kb/wp-content/uploads/2021/04/select-disk.png" alt="GParted Dropdown" style="max-width: 550px; height: auto; margin: 10px 0;">
+                                    </li>
+                                    <li>Right click the partition, select "Format to", then select "fat32".
+                                        <br>
+                                        <img src="https://phoenixnap.com/kb/wp-content/uploads/2021/04/select-format-option.png" alt="GParted Formatting Dialog" style="max-width: 550px; height: auto; margin: 10px 0;">
+                                    </li>
+                                    <li>Click the green check mark to apply all operations, then "Apply" at the warning dialog. Let it do it's thing.
+                                        <br>
+                                        <img src="https://phoenixnap.com/kb/wp-content/uploads/2021/04/apply-format-operation.png" alt="GParted Checkmark Location" style="max-width: 550px; height: auto; margin: 10px 0;">
+                                    </li>
+                                    <li>Click "Close" when the operation is completed. Now you're free to move onto the next page!</li>
+                                </ol>
+                                <p class="card-text">More ways to format for Linux can be found <a href="https://phoenixnap.com/kb/linux-format-usb">here.</a> This Linux guide is also based off of it!</p>
+                                <!-- MacOS Guide (pr3 made this too!) -->
+                                <h3 class="card-title">MicroSD Card Setup (MacOS Guide Using DiskUtility)</h3>
+                                <p class="card-text">This works for 32GB MicroSD cards, and possibly >32GB MicroSD cards. </p>
+                                <ol class="custom-list">
+                                    <li>Insert your MicroSD card into your MacOS device.</li>
+                                    <li>Open Disk Utility, which is preinstalled on MacOS.</li>
+                                    <li>Select the MicroSD card, and click on "Erase" in the top toolbar. Make sure it's the correct MicroSD card!
+                                        <br>
+                                        <img src="https://iboysoft.com/images/en-howto/format-sd-card-on-mac/format-drive-disk-utility.png" alt="Erase Dialog" style="max-width: 400px; height: auto; margin: 10px 0;">
+                                    </li>
+                                    <li>Give the MicroSD card a name, and format it for "MS-DOS (FAT)", otherwise, "ExFAT" may be sufficient.
+                                        <br>
+                                        <img src="https://iboysoft.com/images/en-howto/format-sd-card-on-mac/format-drive-disk-utility-2.png" alt="MicroSD Card Naming and Formatting Dialog" style="max-width: 400px; height: auto; margin: 10px 0;">
+                                    </li>
+                                    <li>If you want to securely format the MicroSD card (make it harder to recover data), open "Security Options" and adjust the slider to your preference.
+                                        <br>
+                                        <img src="https://iboysoft.com/images/en-howto/format-sd-card-on-mac/security-options-disk-utility.jpeg" alt="Formatting Security Options on MacOS" tyle="max-width: 400px; height: auto; margin: 10px 0;">
+                                    </li>
+                                    <li>Finally, click "Erase" to format your MicroSD card.</li>
+                                    <p class="card-text">For more ways to format your MicroSD card on MacOS, <a href="https://iboysoft.com/howto/format-sd-card-on-mac.html#:~:text=Step%201%3A%20Insert%20the%20SD,less%3B%20otherwise%2C%20choose%20ExFAT.">This site is worth a visit</a>. This MacOS guide is also based off of it! </p>
                                 </ol>
                             </div>
                         </div>

diff --git a/images/Site_Icon.png b/images/Site_Icon.png
diff --git a/index.html b/index.html
@@ -7,6 +7,7 @@
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="styles.css">
+    <link rel="icon" type="image/x-icon" href="../images/Site_Icon.png">
 </head>
 <body>
     <div class="container-fluid">

diff --git a/styles.css b/styles.css
@@ -2,6 +2,11 @@ body {
     font-family: Arial, sans-serif;
 }
 
+::selection {
+    color: white;
+    background-color: #333;
+}
+
 .sidebar {
     height: 100vh;
     position: fixed;
@@ -65,3 +70,9 @@ body {
     font-family: 'Inter', Arial, sans-serif;
 }
 
+code {
+    font-size: 17px;
+    border: 0.5px solid #333;
+    border-radius: 5px;
+    padding: 2.5px;
+}