MAHcodes · livisupajares · Apr 7, 2023 · Apr 7, 2023 · Apr 7, 2023 · Apr 7, 2023
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+**/.DS_Store
diff --git a/docs/README.md b/docs/README.md
@@ -1,7 +1,5 @@
 # Startpage
 
-## This is [MAHcodes's](https://github.com/MAHcodes) fork of mtwb47's [startpage](https://github.com/mtwb47/mtwb47.github.io) with [gruvbox](https://github.com/morhetz/gruvbox) and [nord](https://github.com/arcticicestudio/nord) theme.
-
 ### Change Theme:
 
 To change the theme press "c".
@@ -30,6 +28,12 @@ To change the theme press "c".
 
 This is a fork of RamenMaestro's [startpage](https://github.com/RamenMaestro/startpage) with a image scroll option and larger option size.
 
+## To Do
+
+- [ ] Make the background rectangle bigger
+- [ ] Make a wikipage explaining how to add a custom startpage to Mozilla Firefox.
+- [x] ~~Fix white background issue found in Firefox 117.~~
+
 ## Credits
 
 Images used in the sidebar are by background artist [Waneella](https://twitter.com/waneella_).
diff --git a/docs/general.css b/docs/general.css
@@ -85,13 +85,15 @@ body {
   background-image: url("img/");
   background-repeat: repeat;
   width: 670px;
+  min-width: 1100px; /* Prevents the layout to get cut off */
   height: 320px;
   position: absolute;
   top: 0px;
   bottom: 100px;
   left: 0px;
   right: 0px;
   margin: auto;
+  overflow: auto /* Adds scrollbars */
 }
 
 h1 {
@@ -107,6 +109,9 @@ h1 {
 }
 
 .main {
+ /* Transforms the whole page and makes it smaller  */
+  --webkit-transform: scale(0.8);
+      -moz-transform: scale(0.8);
   display: inline-block;
   border-style: solid;
   border-width: 1px;
@@ -187,14 +192,14 @@ img {
   font-family: Iosevka, monospace;
   font-size: 18px;
   position: absolute;
-  top: 565px;
+  top: 35px;
+  left: 250px;
   width: auto;
   height: auto;
-  left: 12px;
 }
 
 li {
-  margin: 10px 0;
+  margin: 5px 0; /* Margin between the text elements of the lis */
 }
 
 nav {
@@ -216,9 +221,9 @@ ul {
   text-align: center;
   height: 100%;
   border-color: var(--main-border);
-  border-right-width: 1px;
+  border-right-width: 1px; /* changes border of the table where the list goes */
   border-right-style: solid;
-  padding: 10px 25px;
+  padding: 0px 15px;
   transition: all 0.8s;
   cursor: default;
   list-style-type: none;

diff --git a/docs/index.html b/docs/index.html
@@ -3,7 +3,7 @@
 <html id="html" data-theme="default">
 <head>
 	<meta charset="utf-8">
-	<title>New Tab</title>
+	<title>Home</title>
 	<link rel="stylesheet" style="text/css" href="general.css" />
 </head>
 <body>
@@ -20,50 +20,70 @@
 
 		<header>
 			<br>
-			<h1 ><span id="greet">Hello</span>, <span class="flair">Mhmd Ali</span></h1>
+			<h1 ><span id="greet">Hello</span>, <span class="flair">Liv ※\(^o^)/※ </span></h1>
 		</header>
 
 		<nav>
 			<br>
-
 			<ul class="green">
-				<li style="font-size:22px">Design</li>
-				<li><a href="https://behance.com/">Behance</a></li>
-				<li><a href="https://dribbble.com/">Dribbble</a></li>
-				<li><a href="https://www.awwwards.com/">Awwwards</a></li>
-				<li><a href="https://httpster.net/">Httpster</a></li>
-				<li><a href="https://land-book.com/">Land book</a></li>
-				<li><a href="https://www.admiretheweb.com/">AdmiretheWeb</a></li>
+				<li style="font-size:22px">Art & Design</li>
+				<li><a href="https://drawabox.com/lesson/0/2" target="_blank">Drawabox</a></li>
+				<li><a href="https://www.proko.com/" target="_blank">Proko</a></li>
+				<li><a href="https://www.lovelifedrawing.com/" target="_blank">Gesture Drawing</a></li>
+        			<li><a href="https://www.ctrlpaint.com/" target="_blank">Ctrlpaint</a></li>
+				<li><a href="https://www.domestika.org/" target="_blank">Domestika</a></li>
+				<li><a href="https://otokano.com/colors-by-pigment/" target="_blank">WatercolorDB Oto</a></li>
+				<li><a href="https://www.kimcrick.com/pages/pigment-database-swatch-card-color-charts-for-watercolor-paint-ink-gouache-acrylic" target="_blank">PigmentDB Kim</a></li>
+				<li><a href="https://www.janeblundellart.com/painted-watercolour-swatches---introduction.html" target="_blank">Colorpedia Blundell</a></li>
+				<li><a href="https://artistpigments.org/collections/art_materials?welcome=true" target="_blank">Artist's Pigments</a></li>
+				<li><a href="https://app.artistassistapp.com/" target="_blank">Art Assist</a></li>
+        			<li><a href="https://lospec.com/#_" target="_blank">Lospec</a></li>
+
 			</ul>
 
 			<ul class="red">
-				<li style="font-size:22px">Tech</li>
-				<li><a href="https://dev.to/">dev.to</a></li>
-				<li><a href="https://app.daily.dev/">daily.dev</a></li>
-				<li><a href="https://www.producthunt.com">producthunt</a></li>
-				<li><a href="https://free-for.dev/">free-for.dev</a></li>
-				<li><a href="https://tiny-helpers.dev/">tiny-helpers</a></li>
-				<li><a href="https://devresourc.es/">devresourc.es</a></li>
+					<li style="font-size:22px">Dev</li>
+					<li><a href ="https://chatgpt.com/" target="_blank">ChatGPT</a></li>
+					<li><a href ="https://explainshell.com/#" target="_blank">explain shell</a></li>
+					<li><a href="https://app.explain.dev/" target="_blank">explain.dev</a></li>
+					<li><a href="https://todocodeacademy.com/cursos/" target="_blank">TodoCode</a></li>
+					<li><a href="https://www.hacksplaining.com/lessons" target="_blank">Hacksplaining</a></li>
+					<li><a href="https://academy.hackthebox.com/login" target="_blank">HTB Academy</a></li>
+					<li><a href="https://tryhackme.com/login" target="_blank">Try Hack Me</a></li>
+					<li><a href="https://www.theodinproject.com/sign_in" target="_blank">The Odin Project</a></li>
+					<li><a href="https://www.freecodecamp.org" target="_blank">freecodecamp.org</a></li>
+	        			<li><a href ="https://www.w3schools.com" target="_blank">w3schools.com</a></li>
+	        			<li><a href="https://www.nerdfonts.com/cheat-sheet" target="_blank">Nerd Icons</a></li>
+        			<li><a href="https://iconify.design/" target="_blank">Iconify</a></li>
 			</ul>
 
 			<ul class="blue">
-				<li style="font-size:22px">Social</li>
-				<li><a href="https://www.youtube.com">Youtube</a></li>
-				<li><a href="https://github.com/">Github</a></li>
-				<li><a href="https://linkedin.com/">LinkedIn</a></li>
-				<li><a href="https://twitter.com/">Twitter</a></li>
-				<li><a href="https://reddit.com/">Reddit</a></li>
-				<li><a href="https://discord.com/app">Discord</a></li>
+				<li style="font-size:22px">Else</li>
+				<li><a href="https://drive.google.com/drive/u/0/my-drive" target="_blank">Google Drive</a></li>
+        			<li><a href="https://mail.google.com/mail/u/1/#inbox" target="_blank">Gmail</a></li>
+        			<li><a href="https://photos.google.com/u/4/" target="_blank">Google Photos</a></li>
+				<li><a href="https://www.keybr.com" target="_blank">Touch typing</a></li>
+				<li><a href="https://stardewvalleywiki.com/Stardew_Valley_Wiki" target="_blank">Stardew Wiki</a></li>
+				<li><a href="https://rootsofpacha.wiki.gg/" target="_blank">Pacha Wiki</a></li>
+        			<li><a href="https://editor.codecogs.com/" target="_blank">Latex Equation Editor</a></li>
+				<li><a href="https://help.obsidian.md/How+to/Format+your+notes" target="_blank">Obsidian-md</a></li>
+				<li><a href="https://publish.obsidian.md/hub/02+-+Community+Expansions/02.05+All+Community+Expansions/Plugins/obsidian-admonition/" target="_blank">Obsidian-hub</a></li>
+				<li><a href="https://cienciadedatos.net/" target="_blank">Data Science</a></li>
 			</ul>
 
 			<ul class="yellow">
-				<li style="font-size:22px">Else</li>
-				<li><a href="https://mail.google.com">Gmail</a></li>
-				<li><a href="https://figma.com">Figma</a></li>
-				<li><a href="https://temp-mail.com/">Temp Mail</a></li>
-				<li><a href="https://monkeytype.com/">Monkeytype</a></li>
-				<li><a href="https://keep.google.com">Google Keep</a></li>
-				<li><a href="https://soundcloud.com/">Soundcloud</a></li>
+				<li style="font-size:22px">Academic</li>
+				<li><a href="https://singlelogin.re/"
+				target="_blank">Z-lib</a></li>
+				<li><a href="https://www.deepl.com/translator" target="_blank">DeepL</a></li>
+				<li><a href="https://annas-archive.org/" target="_blank">Anna's Archive</a></li>
+				<li><a href="https://www.classcentral.com/" target="_blank">Class central</a></li>
+				<li><a href="https://www.coursera.org/" target="_blank">Coursera</a></li>
+				<li><a href="https://www.futurelearn.com/your-courses" target="_blank">Future Learn</a></li>
+				<li><a href="https://www.udemy.com/" target="_blank">Udemy</a></li>
+				<li><a href="https://temp-mail.com/" target="_blank">Temp Mail</a></li>
+				<li><a href="https://web.gettoby.com/" target="_blank">Toby</a></li>
+				<li><a href="https://embednotion.com/" target="_blank">Notion Embed</a></li>
 			</ul>
 		</nav>
 
@@ -129,7 +149,7 @@ <h1 ><span id="greet">Hello</span>, <span class="flair">Mhmd Ali</span></h1>
 				}
 				if (n < 1) {
 					slideIndex = 23;
-				}				
+				}
 				slide.querySelector("img").src = `img/side${slideIndex}.gif`
 				console.log(slideIndex)
 			}
@@ -138,7 +158,7 @@ <h1 ><span id="greet">Hello</span>, <span class="flair">Mhmd Ali</span></h1>
 			const html = document.getElementById("html");
 
 			// Themes list
-			const colorchemes = ["default", "gruvbox", "nord", "Macchiato", "Mocha"];
+			const colorchemes = ["Mocha", "Macchiato", "default", "gruvbox", "nord"];
 
 			let changeTheme = (e) => {
 				// Change theme key
@@ -161,13 +181,13 @@ <h1 ><span id="greet">Hello</span>, <span class="flair">Mhmd Ali</span></h1>
 						case 2:
 						slideIndex=10;
 						break;
-            case 3:
-            case 4:
+            			case 3:
+            			case 4:
 						slideIndex=21;
 						break;
 						default:
-            havematched = false;
-							}
+            			havematched = false;
+						}
 							if (havematched){
 							localStorage.setItem("slideIndex", slideIndex);
 							showSlides(slideIndex);

diff --git a/mozilla.cfg b/mozilla.cfg
@@ -1,14 +1,12 @@
-// Any comment. You must start the file with a single-line comment!
-let { classes:Cc, interfaces:Ci, utils:Cu } = Components;
+//
+var {classes:Cc,interfaces:Ci,utils:Cu} = Components;
 
+/* set new tab page */
 try {
   Cu.import("resource:///modules/AboutNewTab.jsm");
-  let newTabURL = "/Users/skinofmyeden/Documents/start-page/docs/index.html";
+  var newTabURL = "file:///Users/skinofmyeden/Documents/start-page/docs/index.html";
   AboutNewTab.newTabURL = newTabURL;
-  Cu.import("resource:///modules/HomePage.jsm");
-  HomePage.set(newTabURL);
-} catch(e) { Cu.reportError(e); }
-
+} catch(e){Cu.reportError(e);} // report errors in the Browser Console
 
 // Auto focus new tab content
 try {
@@ -19,4 +17,4 @@ try {
     window = BrowserWindowTracker.getTopWindow();
     window.gBrowser.selectedBrowser.focus();
   }, "browser-open-newtab-start");
-} catch(e) { Cu.reportError(e); }
+} catch(e) { Cu.reportError(e); }