Add About page and expand docs content/styles

Add a new docs/about page (docs/docs.html) with site header/footer and basic About layout. Expand the Docs tab in docs/index.html with a Features section, General Information, and Sources table (including a link to the server repo and usage notes). Update docs/main.css to add styles for .sources-text, .docs-grid, .docs-tips and headings to support the new documentation layout and improve visual presentation.

docs/index.html

@@ -108,8 +108,61 @@
 
         <div id="docs" class="tabcontent">
             <h1 class="title"><span style="color: #db65d5">Docs</span></h1>
-            <br>
+            <p>SoftwareManager is a desktop app to search, browse, and download software & games from multiple sources in one place.</p>
-            <p>Simplify searching & downloading</p>
+            <div class="base-information-frame">
+                <h2>Features</h2>
+                <div class="endpoint-parameters-container docs-tips">
+                    <p class="sources-text">• Searching & Downloading Software from various pages</p>
+                    <p class="sources-text">• Network Interface Binding</p>
+                    <p class="sources-text">• Simple UI, Speed Limiting etc.</p>
+                    <p class="sources-text">• No Logins required</p>
+                </div>
+            </div>
+
+            <div class="base-information-frame">
+                <h2>General Information</h2>
+                <div class="endpoint-parameters-container docs-tips">
+                    <p class="sources-text">• Rutracker is the default source since it is the largest index overall.</p>
+                    <p class="sources-text">• Use m0nkrus if you want Adobe software, it directly gets the posts from his Telegram channel.</p>
+                    <p class="sources-text">• Torrents start seeding after completion and start seeding on application start.</p>
+                    <p class="sources-text">• MacOS Builds haven't been properly tested - We're thankful to receive feedback.</p>
+                    <p class="sources-text">• If you want to host your own server, clone our <a href="https://github.com/KeksPirates/SoftwareManager-Server" style="color: #db65d5;">server repository</a>, enter your cookie for rutracker.org and run server.py. Detailed Instructions on how to get your rutracker cookie are in the README of the server repo.</p>                
+                    <p class="sources-text">• SoftwareManager is still in development and most likely contains issues. Please report any bugs you find via GitHub. Contributions are also greatly appreciated.</p>
+                </div>
+            </div>
+
+            <div class="base-information-frame">
+                <h2>Sources</h2>
+                <br>
+                <p>Use the dropdown menu in the top right to select your source.</p>
+                <div class="endpoint-parameters-container docs-grid">
+                    <div class="endpoint-parameters-header">
+                        <p>Source</p>
+                        <p>Category</p>
+                        <p>Notes</p>
+                    </div>
+                    <div class="endpoint-parameters-content">
+                        <p class="sources-text">RuTracker</p>
+                        <p class="sources-text">Software & games</p>
+                        <p class="sources-text">Has an extremely large amount of Software. Relies on an API for searching.</p>
+                    </div>
+                    <div class="endpoint-parameters-content">
+                        <p class="sources-text">UzTracker</p>
+                        <p class="sources-text">Software & games</p>
+                        <p class="sources-text">Similar to RuTracker, smaller. Use this as fallback if RuTracker is down or there's API issues.</p>
+                    </div>
+                    <div class="endpoint-parameters-content">
+                        <p class="sources-text">m0nkrus</p>
+                        <p class="sources-text">Adobe Software</p>
+                        <p class="sources-text">Lots of curated releases. Focused on mainly professional Software.</p>
+                    </div>
+                    <div class="endpoint-parameters-content">
+                        <p class="sources-text">SteamRip</p>
+                        <p class="sources-text">Games</p>
+                        <p class="sources-text">Currently very experimental due to download link retrieveal. May not always work as expected.</p>
+                    </div>
+                </div>
+            </div>
         </div>
 
         <div id="notfound" class="tabcontent">

docs/main.css

@@ -299,6 +299,38 @@ pre.api-response {
 .json-boolean { color: #ffab4a; }
 .json-integer { color: #66ff80; }
 
+.sources-text {
+    color: #ffffff;
+    font-size: 1rem;
+}
+
+.docs-grid .endpoint-parameters-header,
+.docs-grid .endpoint-parameters-content {
+    grid-template-columns: 10rem 14rem 1fr;
+}
+
+.docs-grid .endpoint-parameters-header p {
+    color: #8f8d8d;
+}
+
+.docs-grid .endpoint-parameters-content {
+    padding: 0.5rem 0;
+    border-top: 1px solid #ffffff0a;
+}
+
+.docs-grid .endpoint-parameters-content:first-of-type {
+    border-top: none;
+}
+
+.docs-tips .sources-text {
+    padding: 0.25rem 0;
+}
+
+
+.base-information-frame h2 {
+    color: #db65d5;
+}
+
 .notfound-frame {
     display: flex;
     flex-direction: column;