fix css

components/main/index.tsx

@@ -71,37 +71,37 @@ export const Main = () => {
             )}
           </div>
         </div>
-        <div
-          className={classNames(
-            "flex items-center justify-center lg:justify-end text-right gap-1 mt-4 lg:mt-0",
-            {
-              "text-gray-300 text-xs": !user?.sub,
-              "text-white text-sm": user?.sub,
-            }
-          )}
-        >
-          {user?.sub ? (
-            <>
-              Logged as
-              <Link
-                href={user?.profile}
-                target="_blank"
-                className="hover:text-blue-500 flex items-center justify-end gap-2"
-              >
-                @{user?.preferred_username}
-                <Image
-                  src={user?.picture}
-                  width={24}
-                  height={24}
-                  className="rounded-full ring-1 ring-white/60 border border-black"
-                  alt={user?.preferred_username}
-                />
-              </Link>
-            </>
-          ) : (
-            "to save your generations in your own gallery"
-          )}
-        </div>
+      </div>
+      <div
+        className={classNames(
+          "flex items-center justify-center lg:justify-end text-right gap-1 mt-4 lg:mt-0 pr-2 lg:pr-4",
+          {
+            "text-gray-300 text-xs": !user?.sub,
+            "text-white text-sm": user?.sub,
+          }
+        )}
+      >
+        {user?.sub ? (
+          <>
+            Logged as
+            <Link
+              href={user?.profile}
+              target="_blank"
+              className="hover:text-blue-500 flex items-center justify-end gap-2"
+            >
+              @{user?.preferred_username}
+              <Image
+                src={user?.picture}
+                width={24}
+                height={24}
+                className="rounded-full ring-1 ring-white/60 border border-black"
+                alt={user?.preferred_username}
+              />
+            </Link>
+          </>
+        ) : (
+          "to save your generations in your own gallery"
+        )}
       </div>
       <p
         className="text-white/70 font-medium text-sm flex items-center justify-center lg:justify-start gap-2 hover:text-white cursor-pointer mt-3"