I have a problem when creating a new layout.tsx file in (auth) folder, when I import the globals.scss file I can’t apply the styles to the whole web. Please let me know where the issue is. Thanks all.
This is my structure folder
enter image description here
the new layout.tsx file
import '@/public/styles/globals.scss';
import { MantineProvider } from '@mantine/core';
import { Metadata } from 'next';
export const metadata: Metadata = {
title: 'Login',
description: 'Login',
};
export default function SecondLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang='en' data-mantine-color-scheme='light'>
<body>
<MantineProvider defaultColorScheme='light'>{children}</MantineProvider>
</body>
</html>
);
}