Issue #172 #171 #169: HOTFIX

src/app/components/Header.js

@@ -67,7 +67,7 @@ function DefaultContent({
 
   return (
     <>
-      <div className="flex align-middle items-center flex-shrink-0 max-sm:pl-3 pl-5">
+      <div className="flex align-middle items-center flex-shrink-0 max-sm:pl-0 pl-5">
         <IconButton
           className=" h-[36px] w-[36px] mx-2 mr-6 max-sm:mr-3 max-sm:mx-0"
           size="large"

src/app/components/MenuProfile.js

@@ -132,7 +132,7 @@ export default function AccountMenu() {
             alt="Acessar meu perfil"
           >
             {(userData["avatar_file_name"] === "") || (userData["avatar_file_name"] === null) ? (
-              <div className={`flex items-center justify-center text-xl font-bold text-main rounded-full h-[38px] w-[38px] ${getRandomBg(userData["id"])}`} >{userData["name"][0]}</div>
+              <div className={`flex items-center max-sm:-ml-px justify-center text-xl font-bold text-main rounded-full h-[38px] w-[38px] ${getRandomBg(userData["id"])}`} >{userData["name"][0]}</div>
             ) : (
               <Avatar
                 src={

src/app/components/ModalNotifications.js

@@ -41,7 +41,7 @@ export default function ModalNotifications({ countNotifications, notifications,
                 type="button"
                 alt="Notificações"
                 title="Em construção"
-                className="bg-transparent hover:text-secondary w-10 h-10 rounded text-text-color flex-shrink-0 transition"
+                className="bg-transparent max-sm:-ml-px max-sm:-mr-2 hover:text-secondary w-10 h-10 rounded text-text-color flex-shrink-0 transition"
                 id="basic-button"
                 aria-controls={open ? 'basic-menu' : undefined}
                 aria-haspopup="true"
@@ -49,7 +49,6 @@ export default function ModalNotifications({ countNotifications, notifications,
                 onClick={handleClick}
             >
                 <Badge badgeContent={countNotifications} color="primary">
-
                     <NotificationsIcon className="h-full bg-grey text-3xl" />
                 </Badge>
 

src/app/editar/[id]/components/UpdateInfo.js

@@ -21,6 +21,27 @@ export default function UpdateInfo({ user }) {
     const reEmail = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/
 
 
+    function getRandomBg(id) {
+        const colors = [
+          "bg-secondary",
+          "bg-orange",
+          "bg-secondary-hover",
+          "bg-orange-hover",
+          "bg-violet",
+          "bg-pink",
+          "bg-red",
+          "bg-text-color",
+          "bg-text-color-click",
+          "bg-button-filters",
+          "bg-text-filter",
+          "bg-other-links",
+          "bg-blue-button",
+        ]
+    
+        return colors[id % colors.length];
+      }
+
+
     const handleSubmit = async (e) => {
         e.preventDefault()
 
@@ -154,13 +175,18 @@ export default function UpdateInfo({ user }) {
                 <div className=" flex flex-col  mt-4">
                     <label className=" text-xl text-main-text font-bold mx-6 ">Foto de perfil</label>
                     <div className="flex flex-row justify-between my-2 mx-4">
+                        {photo ?
                             <div className="">
                                 <img
                                     src={photo ? photoURL : mecredURL + user["avatar"]}
                                     className="w-[150px] h-[150px] object-cover  rounded-full"
                                     alt="Editar perfil"
                                 />
-                        </div>
+                            </div> :
+                            <div className={`flex items-center justify-center text-xl font-bold ml-4 text-main rounded-full h-[150px] w-[150px] ${getRandomBg(user["id"])}`} >{user["name"][0]}</div>
+
+                        }
+
                         {!changedPhoto ?
                             <div className="flex items-end justify-end">
                                 <label className="text-main font-bold px-4 py-2 rounded-lg  bg-secondary  hover:bg-secondary-hover">

src/app/perfil/[id]/components/CreateCollectionModal.js

@@ -85,7 +85,7 @@ export default function CreateCollectionModal({ open, onClose, idLogin }) {
     >
       <div className="flex flex-col bg-main p-5 rounded-lg w-[40%] max-sm:w-[85%]">
         <div className="text-2xl font-bold text-main-text">Criar Coleção</div>
-        <p className="text-lg text-main-text font-bold mb-1 mt-4">Nome da Coleção</p>
+        <p className="text-lg text-main-text font-bold mb-1 mt-4">Nome da Coleção*</p>
         <form onSubmit={handleSubmit}>
           <TextField
             size="small"
@@ -94,6 +94,7 @@ export default function CreateCollectionModal({ open, onClose, idLogin }) {
             value={name}
             helperText={`${name.length}/150`}
             error={name.length > 150}
+            required
           />
           <p className="text-lg text-main-text font-bold mb-3 mt-4">Esta coleção é:</p>
           <FormLabel >