Merge remote-tracking branch 'origin/main' into feature/94/create-abo…

…ut-section

.github/workflows/eslint.yml

@@ -0,0 +1,50 @@
+# This workflow uses actions that are not certified by GitHub.
+# They are provided by a third-party and are governed by
+# separate terms of service, privacy policy, and support
+# documentation.
+# ESLint is a tool for identifying and reporting on patterns
+# found in ECMAScript/JavaScript code.
+# More details at https://github.com/eslint/eslint
+# and https://eslint.org
+
+name: ESLint
+
+on:
+  push:
+    branches: [ "main" ]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [ "main" ]
+  schedule:
+    - cron: '29 2 * * 1'
+
+jobs:
+  eslint:
+    name: Run eslint scanning
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      security-events: write
+      actions: read # only required for a private repository by github/codeql-action/upload-sarif to get the Action run status
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Install ESLint
+        run: |
+          npm install [email protected]
+          npm install @microsoft/[email protected]
+
+      - name: Run ESLint
+        run: npx eslint .
+          --config .eslintrc.cjs
+          --ext .js,.jsx,.ts,.tsx
+          --format @microsoft/eslint-formatter-sarif
+          --output-file eslint-results.sarif
+        continue-on-error: true
+
+      - name: Upload analysis results to GitHub
+        uses: github/codeql-action/upload-sarif@v2
+        with:
+          sarif_file: eslint-results.sarif
+          wait-for-processing: true

src/components/Navbar/Navbar.tsx

@@ -1,13 +1,9 @@
 import { useEffect, useState } from 'react';
-import { useWindowScroll } from '@uidotdev/usehooks';
 
 import Hamburger from 'hamburger-react';
 import { NavItems, Menu } from '@components';
 
 const Navbar = () => {
-    const [scrollPos] = useWindowScroll();
-    const scrollPosY = scrollPos.y as number;
-
     const [showMenu, setShowMenu] = useState(false);
 
     const hideMenu = () => setShowMenu(false);
@@ -18,16 +14,10 @@ const Navbar = () => {
     }, [showMenu]);
 
     return (
-        <nav
-            className={`gradient fixed top-0 z-50 flex h-fit w-full items-center justify-between px-10 text-white lg:justify-normal ${
-                scrollPosY < 100
-                    ? 'p-8 transition-all duration-500 ease-in-out'
-                    : 'bg-midnight p-4 shadow-lg transition-all duration-500 ease-in-out'
-            }`}
-        >
+        <nav className="gradient fixed top-0 z-50 flex h-fit w-full items-center justify-between p-8 px-10 text-white lg:justify-normal">
             <div className="logo lg:mr-8">
                 <img
-                    className="w-14"
+                    className="w-14 h-14"
                     src="./src/assets/logo.svg"
                     alt="HawkHacks Logo"
                 />
@@ -37,11 +27,7 @@ const Navbar = () => {
                 <NavItems isHorizontal={true} handleClick={hideMenu} />
             </div>
 
-            <div
-                className={`portal-btn hidden transition-all duration-500 ease-in-out lg:block ${
-                    scrollPosY < 100 ? 'lg:mr-32' : 'lg:mr-0'
-                }`}
-            >
+            <div className="portal-btn hidden transition-all duration-500 ease-in-out lg:mr-32 lg:block">
                 <button className="px-4 py-2 xl:px-6 xl:py-3">
                     Application Portal
                 </button>

src/pages/Landing.tsx

@@ -3,7 +3,11 @@ import { Navbar } from '@components';
 
 const Landing: React.FC = () => {
     return (
-        <div>
+        // padding calculation
+        // logo in navbar height = 3.5rem
+        // navbar adds top and bottom padding of 2rem
+        // total top padding = 3.5 + 4 = 7.5rem
+        <div className="pt-[7.5rem]">
             <Navbar />
             <About />
             <FooterSection />