How to Implement the Universal Selector #471
-
|
Hello community, I'm currently working on a project and I'm looking to implement the Universal Selector in my CSS code. I want to apply a style to all elements on the page, and I believe the Universal Selector (*) is the right choice for this. o m import type { Metadata } from "next";
import "./globals.css";
import stylex from "@stylexjs/stylex";
import { weightFont, colors, fontFamily } from "../tokens.stylex";
export const metadata: Metadata = {
title: "Create Next App",
description: "Generated by create next app",
};
const MAXWIDTH = "@media screen and (max-width: 600px)";
const styles = stylex.create({
font: {
fontFamily: fontFamily.Epilogue,
fontSize: 16,
color: colors["cinza-600"],
WebkitFontSmoothing: "antialiased",
MozOsxFontSmoothing: "grayscale",
},
body: {
fontFamily: fontFamily.Epilogue,
fontSize: 16,
},
"*": {
padding: 0,
margin: 0,
boxSizing: "border-box",
fontFamily: fontFamily.Epilogue,
},
code: {
fontFamily: fontFamily.Epilogue,
},
button: {
fontFamily: fontFamily.Epilogue,
},
});
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en">
<body
{...stylex.props(
styles.font,
styles["*"],
styles.button,
styles.code,
styles.body
)}
>
{children}
</body>
</html>
);
}
I would like the universal selector to define for all my components that the correct form is Epilogue, but the way I did it below, the buttons do not apply this font, they only apply if I define it directly in the component
|
Beta Was this translation helpful? Give feedback.
Answered by
nucleartux
Mar 1, 2024
Replies: 2 comments
-
|
Maybe this comment will be helpful for you: #324 (comment) |
Beta Was this translation helpful? Give feedback.
0 replies
Answer selected by
felpereira
-
|
Yes, as already mentioned. For global styles and resets, just use a normal CSS file. |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Maybe this comment will be helpful for you: #324 (comment)