styles for navigation and survey info

SurveyFrontend/src/components/Account/Account.module.css

@@ -1,10 +1,24 @@
 /*Account.module.css*/
 
 .account {
-    padding: 0;
-    margin: 31px 39px 25px 0;
+    width: 15%;
+    background-color: #F3F3F3;
+    border-radius: 40px;
+    align-items: center;
+    padding: 4.58px 13px 4.58px 4.58px;
+    margin: 26px 33px 27px 0;
+}
+
+.accountText{
+    font-size: 24px;
+    font-weight: 600;
+    color: black;
+    width: 100%;
+    text-decoration: none;
 }
 
 .accountImg{
+    vertical-align: middle;
     width: 55px;
+    margin-right: 9px;
 }

SurveyFrontend/src/components/Account/Account.tsx

@@ -1,7 +1,5 @@
-/// <reference types="vite-plugin-svgr/client" />
 import React from 'react';
 import styles from './Account.module.css'
-import AccountSvg from '../../../public/account.svg?react'
 
 interface AccountProps {
     href: string;
@@ -10,9 +8,9 @@ interface AccountProps {
 
 const Account: React.FC<AccountProps> = ({href, user}) => {
     return (
-        <div>
-            <a className={styles.account} href={href}>
-                <AccountSvg className={styles.accountImg}/>
+        <div className={styles.account}>
+            <a className={styles.accountText} href={href}>
+                <img src='../../../public/account.svg' className={styles.accountImg} alt='account'/>
                 {user}
             </a>
         </div>