further styling

softstack · Apr 2, 2024 · aa4d09b · aa4d09b
1 parent 73713e3
commit aa4d09b
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 5 deletions.
diff --git a/src/App.css b/src/App.css
@@ -54,19 +54,18 @@
 }
 
 .avatar {
+    display: flex;
     align-items: center;
     justify-content: center;
-    display: flex;
-    width: 100%;
     overflow: hidden;
     height: 100%;
+    padding: 1em 2em 1em 2em;
 }
 
 .avatar img {
-    scale: 0.8;
+    object-fit: scale-down;
     max-width: 100%;
     max-height: 100%;
-    object-fit: scale-down;
 }
 
 .add-to-home {
@@ -158,9 +157,17 @@
     justify-content: flex-end;
 }
 
+.skip-button span {
+    cursor: pointer;
+}
+
 .back-button {
     display: flex;
     padding: 1em;
     font-size: 0.8rem;
     justify-content: flex-start;
 }
+
+.back-button img {
+    cursor: pointer;
+}
diff --git a/src/App.tsx b/src/App.tsx
@@ -30,6 +30,9 @@ function App() {
         setView(View.CONNECT);
     };
 
+    const skip = () => {
+        setView(View.CONNECT);
+    };
     const goBack = () => {
         if (view === View.LANDING) {
             return;
@@ -43,7 +46,7 @@ function App() {
                 {view === View.LANDING && (
                     <div className="components-container">
                         <div className="skip-button">
-                            <span>Skip</span>
+                            <span onClick={skip}>Skip</span>
                         </div>
                         <div className="avatar">
                             <img src={avatarScooter} alt="" />