visual overhaul (not really)

.eslintrc.js

@@ -19,7 +19,10 @@ module.exports = {
     sourceType: "module",
   },
   plugins: ["react-hooks", "react", "@docusaurus"],
-  rules: {},
+  rules: {
+    "@docusaurus/no-html-links": "OFF",
+    "@docusaurus/prefer-docusaurus-heading": "OFF",
+  },
   settings: {
     "import/resolver": {
       node: {

docs/guides/privacy.mdx

@@ -10,18 +10,24 @@ Every individual should be able to uphold their right to privacy online, includi
 
 **_I have read and agree to the terms & conditions_** - One of the biggest, if not **the** [biggest lie](https://advancetitan.com/opinion/2021/09/15/who-really-reads-terms-and-conditions) you'll tell yourself throughout your lifetime on the internet. Terms of service are often too long to read, but it's important to understand what's in them. Your rights online depend on them.
 
-<Visit link="https://tosdr.org/" title="Terms of Service; Didn't Read">
+<Visit
+title="Terms of Service; Didn't Read"
+button={{
+    text: "Terms you agreed to",
+    destination:
+      "https://tosdr.org/",
+  }}>
 
 <Thumb
-  children="ToS;DR for short, this is a young project started in June 2012 to help fix the “biggest lie on the web”: almost no one really reads the terms of service we agree to all the time."
+  children="ToS;DR is a project launched in 2012 to address a common issue: users rarely read online Terms of Service (ToS) agreements.  This initiative aims to improve user awareness of these agreements."
   src="app_icons/tosdr.svg"
 />
-
+  
 </Visit>
 
 ## <FontAwesomeIcon icon="fa-solid fa-magnifying-glass" /> Search Engines
 
-Many popular search engines collect user data to personalize advertisements. This can limit your exposure to diverse viewpoints and potentially create confirmation bias.  Privacy-focused search engines offer an alternative, prioritizing user privacy and delivering uncensored, informative search results.
+Many popular search engines collect user data to personalize advertisements. This can limit your exposure to diverse viewpoints and potentially create confirmation bias. Privacy-focused search engines offer an alternative, prioritizing user privacy and delivering uncensored, informative search results.
 
 <Expand title="Searx" >
 
@@ -38,11 +44,6 @@ To that end, Searx does not share users' IP addresses or search history with the
 - [Brave Search](https://search.brave.com/)
 - [Duckduckgo](https://duckduckgo.com/) <Badge link="https://9to5mac.com/2022/05/25/duckduckgo-privacy-microsoft-permission-tracking/" name="warning">Controversial</Badge>
 
-<Visit link="https://searchengine.party/" title="Compare search engines">
-  Web page for comparing popular search engines across some privacy-centric data
-  points.
-</Visit>
-
 ## <FontAwesomeIcon icon="fa-solid fa-ban" /> Ad-blocking
 
 Don't pretend that you love to see advertisements.
@@ -94,17 +95,22 @@ Work in progress
 
 ## <FontAwesomeIcon icon="fa-solid fa-lock" /> Password manager
 
-Password managers securely store and manage online login credentials. These applications encrypt passwords in a central vault, accessible only with a master password.  They also often generate strong, unique passwords to prevent brute-force attacks and eliminate the burden of remembering numerous credentials.
+Password managers securely store and manage online login credentials. These applications encrypt passwords in a central vault, accessible only with a master password. They also often generate strong, unique passwords to prevent brute-force attacks and eliminate the burden of remembering numerous credentials.
 
 :::info
 While many browsers offer built-in password managers and login saving, these features may not be ideal for optimal security. Standalone password managers often provide stronger encryption, multi-device access, and additional security features not found in browsers.
 :::
 
 ### Stateless generator
 
-Password generator that does not store any database files online or create one locally. [Learn more here](https://blog.lesspass.com/2016-10-19/how-does-it-work)
+Password generator that does not store any database files online or create one locally. [learn more here](https://blog.lesspass.com/2016-10-19/how-does-it-work)
 
-<Visit link="https://www.lesspass.com/" title="LessPass">
+<Visit 
+title="LessPass"
+button={{
+  text:"Forgot your password?",
+  destination:"https://www.lesspass.com/"
+}}>
 
 <Thumb
   children="Stop wasting your time synchronizing your encrypted vault. Remember one master password to access your passwords, anywhere, anytime, from any device. No sync needed."
@@ -123,7 +129,13 @@ This is an excellent choice for handling internet banking. You are only reliant
 
 Password databases are encrypted but hosted on the provider's servers
 
-<Visit link="https://www.lesspass.com/" title="Bitwarden">
+<Visit 
+title="Bitwarden"
+button={{
+  text:"Remember password for this site",
+  destination:"https://bitwarden.com/"
+}}
+>
 
 <Thumb
   children="Drive collaboration, boost productivity, and experience the power of open source with Bitwarden, the easiest way to secure all your passwords and sensitive information."
@@ -132,6 +144,8 @@ Password databases are encrypted but hosted on the provider's servers
 
 </Visit>
 
+<br></br>
+
 - [LastPass](https://alternativeto.net/outgoing/software/lastpass) <Badge name="warning">Proprietary</Badge>
 
 ### Manual cloud integration
@@ -146,17 +160,29 @@ Setup cloud syncing with a service of your choice or host database files locally
 Two-factor authentication (2FA) adds an extra layer of security to your online accounts. It requires a second code, in addition to your password, to log in. This code can be:
 
 - A 6-digit one-time password (OTP) sent to your registered phone number.
-- Generated periodically on your mobile device using a Time-based One-Time Password (TOTP) authenticator app.
+- Generated periodically on your mobile device using a Time-based One-Time Password ([TOTP](https://datatracker.ietf.org/doc/html/rfc6238)) authenticator app.
 
 Backup codes are usually provided as a recovery method in case you lose access to your preferred 2FA methods.
 
 :::danger
-Disabling 2FA on private messaging services and social media platforms significantly weakens your account security. This increases the risk of unauthorized access, impersonation, and exposure of private information.  For optimal protection, enabling 2FA is highly recommended.
+Disabling 2FA on private messaging services and social media platforms significantly weakens your account security. This increases the risk of unauthorized access, impersonation, and exposure of private information. For optimal protection, enabling 2FA is highly recommended.
 :::
 
 ### TOTP applications
 
-- [Aegis](https://github.com/beemdevelopment/Aegis)
+<Visit
+title="Aegis Authenticator"
+button={{
+  text:"Level Up Your Account Security"
+}}>
+
+<Thumb
+children="Aegis Authenticator, a free, open-source Android app, offers robust 2FA with encrypted storage for tokens and backups, prioritizing user control and security."
+src="app_icons/aegis.png"/>
+</Visit>
+
+<br></br>
+
 - [andOTP](https://github.com/andOTP/andOTP) <Badge link="https://forum.xda-developers.com/t/app-4-4-open-source-andotp-open-source-two-factor-authentication-for-android.3636993/post-87021655" name="secondary" >Unmaintained</Badge>
 
 ## <FontAwesomeIcon icon="fa-regular fa-envelope" /> Temporary email services

docs/guides/utility.mdx

@@ -4,16 +4,31 @@ sidebar_position: 2
 
 # Utility
 
-Utility apps are practical tools that enhance productivity and improve user experiences on devices. They offer features like file management, system optimization, security, backup, productivity tools, communication, and multimedia functions. These apps streamline tasks, boost efficiency, and contribute to a more organized and productive digital environment.
+Utility apps are software applications designed to enhance your digital experience. They offer a variety of features to streamline tasks and improve efficiency, including:
+
+- File Management: Organize and access your files with ease.
+- System Optimization: Keep your device running smoothly.
+- Security: Protect your data and privacy.
+- Backup: Ensure your important information is safeguarded.
+- Productivity Tools: Enhance your workflow and get things done.
+- Communication: Facilitate seamless communication with others.
+- Multimedia Functions: Enhance your multimedia experience.
+
+By leveraging these functionalities, utility apps can transform your device into a more organized and productive workspace.
 
 ## <FontAwesomeIcon icon="fa-solid fa-download" /> Torrent client
 
-Downloading huge files on the internet can be a time-consuming process due to their large size, requiring a stable and high-speed internet connection. Additionally, utilizing reliable download managers or [torrent clients](https://www.techslang.com/torrenting-what-is-it-and-how-does-it-work/) can help optimize the process by allowing users to pause and resume downloads, ensuring a smoother experience.
+Large file downloads can be time-consuming due to their size. A stable, high-speed internet connection is essential. Reliable download managers or [torrent clients](https://www.techslang.com/torrenting-what-is-it-and-how-does-it-work/) can optimize the process by enabling pausing and resuming downloads, improving efficiency.
 
 <Tabs>
 <TabItem value="Desktop">
 
-<Visit link="https://www.qbittorrent.org/" title="qBittorrent">
+<Visit 
+title="qBittorrent"
+button={{
+  text:"Please uninstall Bittorrent",
+  destination:"https://www.qbittorrent.org/",
+}}>
 
 <Thumb
   children="qBittorrent is a popular, user-friendly, and free BitTorrent client that enables easy and efficient file downloading through the BitTorrent protocol."
@@ -25,7 +40,12 @@ Downloading huge files on the internet can be a time-consuming process due to th
    </TabItem>
    <TabItem value="Android">
 
-<Visit link="https://gitlab.com/proninyaroslav/libretorrent" title="LibreTorrent">
+<Visit 
+title="LibreTorrent"
+button={{
+  text:"Efficient Torrent Downloads",
+  destination:"https://gitlab.com/proninyaroslav/libretorrent",
+}}>
 
 <Thumb
   children="LibreTorrent is an open-source BitTorrent client for Android, enabling users to download and manage torrent files on their mobile devices."
@@ -38,14 +58,14 @@ Downloading huge files on the internet can be a time-consuming process due to th
  </Tabs>
 <Expand title="Downloading torrent files">
 
-- Install a BitTorrent client software on your computer, such as *qBittorrent*.
+- Install a BitTorrent client software on your computer (or smartphone), such as _qBittorrent_.
 - Visit a [reputable torrent website](https://codebeautify.org/base64-decode?input=aHR0cHM6Ly93d3cuZm1oeS5tbC90b3JyZW50cGlyYWN5Z3VpZGUjdG9ycmVudC1zaXRlcw==) and search for the desired file.
 - Click on the [magnet link](https://www.howtogeek.com/764859/what-is-a-magnet-link-and-how-do-you-use-one/) or download button to save the torrent file to your computer.
 - Open your installed BitTorrent client and use the "Open" or "Add Torrent" option to select and open the downloaded torrent file.
 - Choose a download location on your computer for the files from the torrent.
 - Monitor the download progress, pause or resume the download, and adjust settings within the BitTorrent client.
 
-Optional: Consider seeding the downloaded file to contribute to the torrent's availability and support other users.
+Optional: Consider [seeding](https://en.wikipedia.org/wiki/Glossary_of_BitTorrent_terms#Seed_/_seeding) the downloaded file to contribute to the torrent's availability and support other users.
 
 <More link="https://alternativeto.net/software/qbittorrent/">
   Find more torrent clients
@@ -69,7 +89,13 @@ Network file transfer applications streamline the process of sharing files betwe
 
 These capabilities transform file exchange into a reliable and efficient experience.
 
-<Visit link="https://github.com/schollz/croc" title="croc">
+<Visit 
+link="https://github.com/schollz/croc" 
+title="croc"
+button={{
+  text:"Secure File Sharing Made Simple",
+  destination:"https://github.com/schollz/croc",
+}}>
 
 <Thumb
   children="Croc, a CLI file-transfer tool, ensures secure relay-based transfers with end-to-end encryption, cross-platform compatibility, multiple file support, resume functionality, and proxy options like Tor, eliminating the need for local servers or port-forwarding."
@@ -87,11 +113,16 @@ Software accessibility ensures applications are usable by a wide range of users
 
 These considerations promote usability and ensure everyone can benefit from technology.
 
-<Visit link="https://github.com/xanderfrangos/twinkle-tray" title="Twinkle Tray">
+<Visit link="https://github.com/xanderfrangos/twinkle-tray" 
+title="Twinkle Tray"
+button={{
+  text:"Perfect Brightness is a Twinkle Away",
+  destination:"https://github.com/xanderfrangos/twinkle-tray",
+}}>
 
 <Thumb
   children="Twinkle Tray adds a system tray icon for easy management of brightness levels on multiple monitors, addressing the lack of native support for external displays in Windows 10 and 11."
   src="app_icons/twinkletray.ico"
 />
 
-</Visit>
+</Visit>

src/components/Custom.js

@@ -1,5 +1,6 @@
 import React from "react";
 import Details from "@theme/Details";
+import clsx from "clsx";
 
 export function Expand({ children, title }) {
   return (
@@ -26,9 +27,9 @@ export function Expand({ children, title }) {
 export function More({ children, link }) {
   return (
     // <div>
-      <a href={link} className="button button--block button--primary">
-        {children}
-      </a>
+    <a href={link} className="button button--block button--primary">
+      {children}
+    </a>
     // </div>
   );
 }
@@ -41,33 +42,57 @@ export function Badge({ name, link, children }) {
   );
 }
 
-export function Visit({ title, children, link }) {
+export function Thumb({ src, children }) {
   return (
-    <div class="card">
-      <div class="card__header">
-        <h3>{title}</h3>
-      </div>
-      <div class="card__body">
-        <p>{children}</p>
-      </div>
-      <div class="card__footer">
-        <a
-          href={link}
-          target="_blank"
-          class="button button--primary button--block"
-        >
-          Visit website
-        </a>
-      </div>
+    <div class="avatar">
+      <img src={require(`@site/static/img/${src}`).default} />
+      <div class="avatar__intro">{children}</div>
     </div>
   );
 }
 
-export function Thumb({ src, children }) {
+function Button({ destination, text }) {
   return (
-    <div class="avatar">
-      <img src={require(`@site/static/img/${src}`).default} />
-      <div class="avatar__intro">{children}</div>
+    <a
+      className={clsx("button button--primary button--outline button--lg")}
+      href={destination}
+    >
+      {text}
+    </a>
+  );
+}
+
+// Borrowed from homotechsual
+export function CodeSource({ title, text, button, className }) {
+  return (
+    <span className={clsx("hero__wrapper")}>
+      <section
+        className={clsx("post__hero hero shadow--md bordered", className)}
+      >
+        <div className={clsx("container")}>
+          <h2 className="hero__title">{title}</h2>
+          <p>{text}</p>
+          <div className={clsx("hero__button")}>
+            {Button({ destination: button.destination, text: button.text })}
+          </div>
+        </div>
+      </section>
+    </span>
+  );
+}
+
+export function Visit({ title, children, button }) {
+  return (
+    <div class="card">
+      <div>
+        <h2>{title}</h2>
+      </div>
+      <div class="container">
+        <p>{children}</p>
+      </div>
+      <div className={clsx("hero__button")}>
+        {Button({ destination: button.destination, text: button.text })}
+      </div>
     </div>
   );
 }