Merge pull request #107 from Alaboudi1/master

Design improvement and clean up on devs.json

devs.json

@@ -1075,11 +1075,11 @@
   },
   {
     "name": "عبدالله القثامي",
-    "githubURL": "https://github.com/efrontsa",
+    "githubURL": "https://github.com/algethamy",
     "projects": [
       {
         "name": "Carbony",
-        "URL": "https://github.com/efrontsa/carbony",
+        "URL": "https://github.com/algethamy/carbony",
         "description": "مكتبة للتعامل مع التواريخ الهجرية للغة PHP مبنية على أسس مكتبة Carbon الشهيرة",
         "details": {
           "id": 116293912,
@@ -1366,6 +1366,7 @@
   },
   {
     "name": "منى الرزقان",
+    "githubURL": "https://github.com/ArwaAlrazooq",
     "projects": [
       {
         "name": "Arabic-twitter-analysis",
@@ -1382,6 +1383,7 @@
   },
   {
     "name": "خلود الغامدي",
+    "githubURL": "https://github.com/ArwaAlrazooq",
     "projects": [
       {
         "name": "Arabic-twitter-analysis",
@@ -1398,6 +1400,7 @@
   },
   {
     "name": "روان المعثم",
+    "githubURL": "https://github.com/ArwaAlrazooq",
     "projects": [
       {
         "name": "Arabic-twitter-analysis",
@@ -1431,6 +1434,7 @@
   },
   {
     "name": "إيمان النخيلان",
+    "githubURL": "https://github.com/ArwaAlrazooq",
     "projects": [
       {
         "name": "Arabic-twitter-analysis",
@@ -1539,11 +1543,11 @@
   },
   {
     "name": "عبدالعزيز الفهيقي",
-    "githubURL": "https://github.com/alfuhigi",
+    "githubURL": "https://github.com/ajf-sa",
     "projects": [
       {
         "name": "medicines-expired-date",
-        "URL": "https://github.com/alfuhigi/medicines-expired-date",
+        "URL": "https://github.com/ajf-sa/medicines-expired-date",
         "description": "انتهاء تواريخ الادوية",
         "details": {
           "id": 122369578,
@@ -2697,11 +2701,11 @@
   },
   {
     "name": "فارس العتيبي",
-    "githubURL": "https://github.com/farisd3v",
+    "githubURL": "https://github.com/farisc0de",
     "projects": [
       {
         "name": "PhpSanitization",
-        "URL": "https://github.com/farisd3v/PhpSanitization",
+        "URL": "https://github.com/farisc0de/PhpSanitization",
         "description": "Simple PHP Sanitization Class, This is a simple class that can verify and clean values to assure they are valid. It can take a given string and remove or encode certain types of text values, so it can be displayed in Web pages lowering the risk of being used to perform security attacks. The class can also sanitize arrays of data by processing the array values one by one.",
         "details": {
           "id": 328045828,
@@ -2737,7 +2741,7 @@
       },
       {
         "name": "Uploady",
-        "URL": "https://github.com/farisd3v/Uploady",
+        "URL": "https://github.com/farisc0de/Uploady",
         "description": "Uploady is a Simple File Uploader Script with Multi File Upload Support, It comes with more than 20 features and you can set up it in less than 5 minutes.",
         "details": {
           "id": 323133229,
@@ -2934,11 +2938,11 @@
   },
   {
     "name": "محمد الغموي",
-    "githubURL": "https://github.com/MohaTech10",
+    "githubURL": "https://github.com/mhmdvoid",
     "projects": [
       {
         "name": "Typed Programming Language",
-        "URL": "https://github.com/MohaTech10/UQUCompiler",
+        "URL": "https://github.com/mhmdvoid/UQUCompiler",
         "description": "A compiler written in Java targeting MIPS-32bit architecture",
         "details": {
           "id": 382432599,
@@ -3178,7 +3182,7 @@
   },
   {
     "name": "ياسر طواش",
-    "githubURL": "https://github.com/tawashy/urway.js",
+    "githubURL": "https://github.com/tawashy",
     "projects": [
       {
         "name": "URWAY Payment Gateway",

homepage/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "a",
+  "name": "saudi-oss",
   "type": "module",
   "version": "0.0.1",
   "scripts": {

homepage/public/manifest.json

@@ -1,10 +1,10 @@
 {
-  "short_name": "SOOS",
-  "name": "Saudi OOS",
+  "short_name": "Saudi OSS",
+  "name": "Saudi OSS",
   "icons": [
     {
       "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
+      "sizes": "64x64",
       "type": "image/x-icon"
     }
   ],

homepage/src/components/Developer.astro

@@ -1,47 +1,10 @@
 ---
-import { downloadAvatar, downloadPlaceholder } from "./../utilities/getAvatar";
 import { Icon } from "astro-icon";
 import { Image } from "@astrojs/image/components";
 import RepoLink from "./RepoLink.astro";
 
 const { dev } = Astro.props;
-let imagePath = null;
-
-const usernameRegex = /github\.com\/([^/]+)(\/|$)/;
-
-if (dev.githubURL) {
-	// Regular expression to extract the username from a GitHub URL
-	
-	const match = dev.githubURL.match(usernameRegex);
-
-	if (match && match[1]) {
-		const username = match[1];
-		imagePath = await downloadAvatar(username);
-
-	} else {
-        // FIX: need to fix the code to go to the first project
-		console.log("Invalid GitHub URL or username not found.");
-        console.log("URL: " + dev.githubURL);
-        console.log("name" + dev.name);
-        imagePath = await downloadPlaceholder(dev.name);	
-    }
-} else {
-    // if username not provided, steal it from the first project
-    console.log("No GitHub URL found for" + dev.name + ".");
-    const url = dev.projects[0].URL;
-    const match = url.match(usernameRegex);
-    if (match && match[1]) {
-		const username = match[1];
-		imagePath = await downloadAvatar(username);
-
-	} else {
-		console.log("Couldn't get url from project.");
-        imagePath = await downloadPlaceholder(dev.name);	
-        dev.githubURL = "#";
-    }
-}
-
-imagePath = imagePath?.replaceAll("\\", "/").replaceAll("public", "");
+const imagePath = `${dev.githubURL}.png?size=64`;
 ---
 
 <div class="

homepage/src/components/Header.astro

@@ -1,7 +1,7 @@
 ---
 const { title } = Astro.props;
 ---
-<header class="py-8 pt-16">
+<header class="">
     <div class="container mx-auto p-2">
         <h1 class="text-3xl font-bold space-y-1">
             <a href={Astro.url}>{title}</a>

homepage/src/layouts/Layout.astro

@@ -14,8 +14,8 @@ const { title } = Astro.props;
 		<meta charset="UTF-8" />
 		<meta name="description" content="Saudi Open Source Community">
 		<meta name="viewport" content="width=device-width" />
-		<link rel="shortcut icon" href="/favicon.ico" />
-		<link rel="icon" href="./favicon.ico" />
+		<link rel="shortcut icon" href="/favicon.ico" sizes="196x196" />
+		<link rel="icon" href="./favicon.ico" sizes="196x196" />
 		<meta property="og:image" content="./favicon.ico" />
 		<meta name="theme-color" content="#003300" />
 		<link rel="manifest" href="./manifest.json" />

homepage/src/pages/index.astro

@@ -3,40 +3,59 @@ import Layout from "../layouts/Layout.astro";
 import Developers from "../components/sections/Developers.astro";
 import Header from "../components/Header.astro";
 import Footer from "../components/Footer.astro";
-const title = "مجموعة المصادر المفتوحة السعودية";
+import { Image } from "@astrojs/image/components";
+const title = "المجموعة السعودية للمصادر المفتوحة";
 ---
 
 <Layout title={title}>
-    <main>
-        <Header title={title} />
-        <section id="intro" class="text-green-600 dark:text-white">
-            <div class="container mx-auto p-2 ">
-                <p>
-                    الهدف من فكرة جمع المشاريع المفتوحة المصدر هو تحفيز المجتمع التقني السعودي لإثراء المحتوى البرمجي وخلق بيئة تعارف بين المبرمجين من خلال عرض بعض من أعمالهم. هذه المجموعة تدار من قبل
-
-                </p>
-            </div>
-        </section>
-        <section id="cta" class="py-8 p-2 text-green-600 dark:text-white">
-			<div class="container mx-auto">
-				<div class="
-                flex justify-between justify-items-center items-center 
+    <main class="flex flex-col sm:flex-row justify-start sm:flex-start items-center  p-2">
+        <div class="w-32 h-32 ">
+            <Image
+                width={250}
+                height={250}
+                src="/SaudiOSS/logo.png"
+                alt="Saudi Open Source Community"
+                class="rounded-full w-full h-full object-cover object-center"
+            />
+        </div>
+
+        <!-- Header with minimal padding -->
+        <Header title={title} class="flex-shrink-0 p-0" />
+    </main>
+
+	<section id="intro" class="text-green-600 dark:text-white">
+		<div class="container mx-auto p-2">
+			<p>
+				الهدف من فكرة جمع المشاريع المفتوحة المصدر هو تحفيز المجتمع التقني السعودي لإثراء المحتوى البرمجي وخلق بيئة تعارف بين المبرمجين من خلال عرض بعض من
+				أعمالهم. هذه المجموعة تدار من قبل
+			</p>
+		</div>
+	</section>
+	<section id="cta" class="py-8 p-2 text-green-600 dark:text-white">
+		<div class="container mx-auto">
+			<div
+				class="flex justify-between justify-items-center items-center
                 p-4 rounded-lg
                 bg-white bg-opacity-50
-                dark:bg-white dark:bg-opacity-50 dark:text-green-600" role="alert">
-					<div>شاركنا وقم بإضافة مشروعك هنا</div>
-					<a target="_blank" href="https://github.com/SaudiOpenSourceCommunity/SaudiOSS#user-content-%D9%83%D9%8A%D9%81-%D8%A3%D8%B6%D9%8A%D9%81-%D9%85%D8%B4%D8%B1%D9%88%D8%B9%D9%8A-----" 
-                    class="block 
+                dark:bg-white dark:bg-opacity-50 dark:text-green-600"
+				role="alert"
+			>
+				<div>شاركنا وقم بإضافة مشروعك هنا</div>
+				<a
+					target="_blank"
+					href="https://github.com/SaudiOpenSourceCommunity/SaudiOSS#user-content-%D9%83%D9%8A%D9%81-%D8%A3%D8%B6%D9%8A%D9%81-%D9%85%D8%B4%D8%B1%D9%88%D8%B9%D9%8A-----"
+					class="block
                     font-medium rounded-lg text-sm px-5 py-2.5
-                    focus:outline-none focus:ring-4 
-                    focus:ring-green-300 
+                    focus:outline-none focus:ring-4
+                    focus:ring-green-300
                     text-white bg-green-500
-                    hover:bg-green-400 dark:focus:ring-green-900">إضافة</a>
-				</div>
+                    hover:bg-green-400 dark:focus:ring-green-900"
+					>إضافة</a
+				>
 			</div>
-		</section>
+		</div>
+	</section>
 
-        <Developers />
-		<Footer />
-    </main>
+	<Developers />
+	<Footer />
 </Layout>