nothing added in css

actually, the bigger issue is that global.css is not taking effect at all.

Then you might be taking a look at some wrong global.css

Go to your root layout and check if its imported there

sent duplicated images by mistake, oops

Should work. Is your globals.css completely empty?

Also im pretty sure you dont have to name the global style "global.css" but try changing from globals.css to global.css

that was there by default

I really dont know what the issue is then. This usually happens due to removing everything in page.tsx while keeping the styling from global.css

What does your page.ts file look like?

the one in the highest level of app folder hasn't been changed at all.

Then how do you even have those inputs and buttons?

oh you are speaking specifically about this route

hold on

Does the route you are currently on have a global css / stylesheet? And what does its layout (if any) look like?

I was assuming this is the root route

"use client";

import React from "react";
import {useState, useEffect} from 'react'
import { redirect } from "next/navigation";


function SignUp(){


    return(
        
    <div className='signupMain'>
    <div className='signupContainer'>
    <form method='POST' onSubmit={handleSubmit}>

    <input className='email' type='text' placeholder='Enter your email address' name="email" value={userInfo?.email} onChange={handleChange}/>
    <input className='username' type='text' placeholder='Enter your username' name='username' value={userInfo?.username} onChange={handleChange}/>
    <input className='password' type='password' placeholder='Enter your password' name='password' value={userInfo?.password} onChange={handleChange}/>
    <input className='location' type='text' placeholder='Enter your location here' name='location' value={userInfo?.password} onChange={handleChange}/>
    <input className='birthdate' type='date' placeholder='Enter your birthdate' name='birthdate' value={userInfo?.birthdate as unknown as string} onChange={handleChange}/>
    <input className='bio' type='text' placeholder='Enter your bio here' name='bio' value={userInfo?.bio} onChange={handleChange}/>
    <input className='profVis' type='text' name='isVisible'  placeholder='Do you want your profile to be visible' value={userInfo?.isVisible as unknown as string} onChange={handleChange}/>
    <div className='errorDiv'>{error}</div>
    <button type='submit' className='subBtn'>Sign up</button>
    </form>
    </div>
    
    </div>
    )

}
export default SignUp;

I trimmed part of the code cause discord has word limit

@Clown this might sound confusing but nextjs keep throwing this at me even tho i don't have toString property anywhere in my code

this happen when i try to type something

ohhh, i figured out why

Seems like you have some stylesheet somewhere

Cause you are using classnames

no no it is because i was running on production lol

npm start instead of npm run dev

Damn i literally dont have any idea lol. Maybe its cursed 😭. Try clearing .next and .node_modules and running

Also npm start doesn't hot reload so make sure you are on npm run dev

OHHHH

😭😭😭

yeah, that was the solution

that why global css wasn't updating