Add github repo link and adjust header searhc placeholder

MaoShizhong · Jan 5, 2024 · 088427f · 088427f
1 parent a855020
commit 088427f
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 3 deletions.
diff --git a/src/components/header/Header.jsx b/src/components/header/Header.jsx
@@ -123,8 +123,8 @@ export function Header({
                         <input
                             type="search"
                             name="search"
-                            aria-label="search peepl"
-                            placeholder="Search for peepl"
+                            aria-label="search peepl users"
+                            placeholder="Find peepl"
                             defaultValue={query}
                             className={headerStyles.search}
                             ref={searchRef}

diff --git a/src/components/settings/Settings.jsx b/src/components/settings/Settings.jsx
@@ -36,7 +36,9 @@ export function Settings() {
         if (emailRes instanceof Error || !emailRes.ok) {
             alert(SERVER_ERROR);
         } else {
-            alert('An email containing a one-time use link has sent to the email associated with this account.');
+            alert(
+                'An email containing a one-time use link has sent to the email associated with this account.'
+            );
         }
     }
 
@@ -65,6 +67,16 @@ export function Settings() {
             >
                 Request account deletion
             </button>
+
+            <a
+                href="https://github.com/MaoShizhong/Peepl"
+                target="_blank"
+                rel="noreferrer"
+                className={settingsStyles.github}
+            >
+                <img src="/github.png" alt="github logo" />
+                MaoShizhong
+            </a>
         </main>
     );
 }
diff --git a/src/components/settings/css/settings.module.css b/src/components/settings/css/settings.module.css
@@ -22,3 +22,19 @@
 .error {
     composes: error from '../../login/css/login.module.css';
 }
+
+.github {
+    align-items: center;
+    display: flex;
+    gap: 6px;
+    margin-top: auto;
+    transition: var(--transition);
+
+    & > img {
+        width: 40px;
+    }
+
+    &:hover {
+        opacity: 0.7;
+    }
+}