Implement new feature XYZ

MaxRohowsky · Mar 13, 2024 · 7fd86f8 · 7fd86f8
1 parent b1d740b
commit 7fd86f8
Show file tree

Hide file tree

Showing 40 changed files with 467 additions and 0 deletions.
diff --git a/docs/index.html b/docs/index.html
@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="style.css">
+    <!--<script defer data-url="https://devhunt.org/tool/gitpro" src="https://cdn.jsdelivr.net/gh/sidiDev/devhunt-banner/indexV0.js" ></script> -->
+</head>
+
+<body>
+    <nav>
+        <div class="nav-left">
+            <i class="fab fa-github" style="font-size: 1.5em; color: #171515;">
+                <span style="font-family: 'Roboto', sans-serif;"> GitPro </span>
+            </i>
+            </i>
+        </div>
+        <div class="nav-center">
+            <a id="forks-link" href="https://github.com/maxontech/best-github-profile-readme/fork" target="_blank" style="text-decoration: none;">
+                <i class=" fas fa-code-branch" style="font-size: 1.5em; color: #000;"></i>
+                <span id="forks">...</span>
+            </a>
+            <a id="stars-link" href="https://github.com/maxontech/best-github-profile-readme/stargazers" target="_blank" style="text-decoration: none;">
+                <i class="fas fa-star" style="font-size: 1.5em; color: #f1c40f;"></i>
+                <span id="stars">...</span>
+            </a>
+        </div>
+        <div class="nav-right">
+            <a href="https://discord.com/invite/JERatQsfY8" target="_blank" style="text-decoration: none; color: inherit;">
+                <i class="socials fab fa-discord" style="font-size: 1.5em; color: #7289da; margin: 0 10px;"></i>
+            </a>
+            <a href="https://www.youtube.com/@maxontech" target="_blank" style="text-decoration: none; color: inherit;">
+                <i class="socials fab fa-youtube" style="font-size: 1.5em; color: #FF0000; margin: 0 10px;"></i>
+            </a>
+            <a href="https://twitter.com/@max_on_tech" target="_blank" style="text-decoration: none; color: inherit;">
+                <i class="socials fab fa-twitter" style="font-size: 1.5em; color: #1DA1F2; margin: 0 10px;"></i>
+            </a>
+        </div>
+    </nav>
+    <section id="hero">
+        <div id="hero-container">
+            <p class="small-text">The (soon to be) #1 Open Source Repo for GitHub Profile Inspiration</p>
+            <h1>Unique GitHub Profile Designs</h1>
+            <h2>Curated list of GitHub's best Profiles <br /> and Readme.md Files</h2>
+        </div>
+        <img id="background-image" src="screenshots/maxontech.jpeg" alt="Background Image">
+
+    </section>
+
+    <section id="instructions">
+        <div id="instruction-steps">
+            <div class="step">
+                <i class="step-icon fas fa-code-branch"></i>
+                <span><strong>Step 1:</strong> Star and Fork this <a href="https://github.com/maxontech/best-github-profile-readme">Repository</a></span>
+            </div>
+            <div class="step">
+                <i class="step-icon fas fa-edit"></i>
+                <span><strong>Step 2:</strong> Make Branch with New Profile <br/> <a href="https://github.com/maxontech/best-github-profile-readme#contribute">➜ View Instructions</a></span>
+            </div>
+            <div class="step">
+                <i class="step-icon fas fa-upload"></i>
+                <span><strong>Step 3:</strong> Push Changes & Create <br/> a Pull Request</span>
+            </div>
+
+            <div id="mobile-instructions">
+                <a id="mobile-forks-link" href="https://github.com/maxontech/best-github-profile-readme/fork" target="_blank" style="text-decoration: none;">
+                    <i class=" fas fa-code-branch" style="font-size: 1.5em; color: #000;"></i>
+                    <span>Create a Pull Request <br/> to Submit a Profile</span>
+                </a>
+            </div>
+        </div>
+
+
+    </section>
+
+    <section id="social-proof">
+        <span>As seen on:</span>
+        <div class="proof-icon">
+            <i class="fab fa-hacker-news" style="color: #ff6600;"></i>
+        </div>
+        <div class="proof-icon">
+            <i class="fab fa-product-hunt" style="color: #da552f;"></i>
+        </div>
+        <div class="proof-icon">
+            <i class="fab fa-reddit" style="color: #ff4500;"></i>
+        </div>
+        <div class="proof-icon">
+            <i class="fab fa-youtube" style="color: #FF0000;"></i>
+        </div>
+        <div class="proof-icon">
+            <i class="fab fa-twitter" style="color: #1DA1F2;"></i>
+        </div>
+    </section>
+
+
+    <div id="screenshotContainer"></div>
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+    <script src="script.js"></script>
+</body>
+
+</html>
diff --git a/docs/screenshots/BrunnerLivio.jpeg b/docs/screenshots/BrunnerLivio.jpeg
diff --git a/docs/screenshots/Code-Bullet.jpeg b/docs/screenshots/Code-Bullet.jpeg
diff --git a/docs/screenshots/DoubleGremlin181.jpeg b/docs/screenshots/DoubleGremlin181.jpeg
diff --git a/docs/screenshots/HwangTaehyun.jpeg b/docs/screenshots/HwangTaehyun.jpeg
diff --git a/docs/screenshots/Ileriayo.jpeg b/docs/screenshots/Ileriayo.jpeg
diff --git a/docs/screenshots/M0nica.jpeg b/docs/screenshots/M0nica.jpeg
diff --git a/docs/screenshots/MacroPower.jpeg b/docs/screenshots/MacroPower.jpeg
diff --git a/docs/screenshots/RaghavK16.jpeg b/docs/screenshots/RaghavK16.jpeg
diff --git a/docs/screenshots/Raymo111.jpeg b/docs/screenshots/Raymo111.jpeg
diff --git a/docs/screenshots/ari-hacks.jpeg b/docs/screenshots/ari-hacks.jpeg
diff --git a/docs/screenshots/bdougie.jpeg b/docs/screenshots/bdougie.jpeg
diff --git a/docs/screenshots/codewithgauri.jpeg b/docs/screenshots/codewithgauri.jpeg
diff --git a/docs/screenshots/cszach.jpeg b/docs/screenshots/cszach.jpeg
diff --git a/docs/screenshots/d-koppenhagen.jpeg b/docs/screenshots/d-koppenhagen.jpeg
diff --git a/docs/screenshots/emilwidlund.jpeg b/docs/screenshots/emilwidlund.jpeg
diff --git a/docs/screenshots/ethomson.jpeg b/docs/screenshots/ethomson.jpeg
diff --git a/docs/screenshots/garimasingh128.jpeg b/docs/screenshots/garimasingh128.jpeg
diff --git a/docs/screenshots/guilyx.jpeg b/docs/screenshots/guilyx.jpeg
diff --git a/docs/screenshots/jonathangin52.jpeg b/docs/screenshots/jonathangin52.jpeg
diff --git a/docs/screenshots/karim-eg.jpeg b/docs/screenshots/karim-eg.jpeg
diff --git a/docs/screenshots/laxmena.jpeg b/docs/screenshots/laxmena.jpeg
diff --git a/docs/screenshots/leereilly.jpeg b/docs/screenshots/leereilly.jpeg
diff --git a/docs/screenshots/maxontech.jpeg b/docs/screenshots/maxontech.jpeg
diff --git a/docs/screenshots/mokkapps.jpeg b/docs/screenshots/mokkapps.jpeg
diff --git a/docs/screenshots/muhammedh-shadir.jpeg b/docs/screenshots/muhammedh-shadir.jpeg
diff --git a/docs/screenshots/natemoo-re.jpeg b/docs/screenshots/natemoo-re.jpeg
diff --git a/docs/screenshots/ouuan.jpeg b/docs/screenshots/ouuan.jpeg
diff --git a/docs/screenshots/rahul-jha98.jpeg b/docs/screenshots/rahul-jha98.jpeg
diff --git a/docs/screenshots/ritik307.jpeg b/docs/screenshots/ritik307.jpeg
diff --git a/docs/screenshots/rossjrw.jpeg b/docs/screenshots/rossjrw.jpeg
diff --git a/docs/screenshots/sagar-viradiya.jpeg b/docs/screenshots/sagar-viradiya.jpeg
diff --git a/docs/screenshots/techytushar.jpeg b/docs/screenshots/techytushar.jpeg
diff --git a/docs/screenshots/terkelg.jpeg b/docs/screenshots/terkelg.jpeg
diff --git a/docs/screenshots/thaiane.jpeg b/docs/screenshots/thaiane.jpeg
diff --git a/docs/screenshots/theabbie.jpeg b/docs/screenshots/theabbie.jpeg
diff --git a/docs/screenshots/timburgan.jpeg b/docs/screenshots/timburgan.jpeg
diff --git a/docs/screenshots/xiaoluoboding.jpeg b/docs/screenshots/xiaoluoboding.jpeg
diff --git a/docs/script.js b/docs/script.js
@@ -0,0 +1,47 @@
+$.getJSON('./data.json', function(data) {
+    var screenshotContainer = $('#screenshotContainer');
+    $.each(data, function(index, item) {
+        var card = $('<div>').addClass('card');
+        var img = $('<img>').attr('src', item.screenshotPath);
+        card.append(img); // Append the image to the card first
+
+        var info = $('<div>').addClass('card-info');
+
+        var profilePicture = $('<div>').addClass('profile-picture').css('background-image', 'url(' + item.screenshotPath + ')');
+        info.append(profilePicture);
+
+        var name = $('<p>').attr('id', 'name').text(item.firstName + ' ' + item.lastName);
+        info.append(name);
+
+        var githubRepo = $('<a>')
+        .attr('id', 'githubRepo')
+        .attr('href', item.githubProfile)
+        .attr('title', 'GitHub Profile') 
+        .html('<i class="fab fa-github"></i>');
+        info.append(githubRepo);
+
+        var readme = $('<a>')
+        .attr('id', 'readme')
+        .attr('href', item.githubReadme)
+        .html('<i class="fas fa-book"></i>')
+        .attr('title', 'Readme.md');
+        info.append(readme);
+
+        //var date = new Date(item.timestamp);
+        //var timestamp = $('<p>').attr('id', 'timestamp').text(date.toLocaleDateString());
+        //info.append(timestamp);
+
+        card.append(info);
+
+        screenshotContainer.append(card);
+    });
+}).fail(function(jqxhr, textStatus, error) {
+    console.error('Error:', error);
+});
+
+fetch('https://api.github.com/repos/maxontech/best-github-profile-readme')
+    .then(response => response.json())
+    .then(data => {
+        document.getElementById('forks').textContent = data.forks_count;
+        document.getElementById('stars').textContent = data.stargazers_count;
+    });