Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

text-slate-xxx & bg-slate-xxx does not work out of the box? #82

Open
addlistener opened this issue Dec 25, 2023 · 0 comments
Open

text-slate-xxx & bg-slate-xxx does not work out of the box? #82

addlistener opened this issue Dec 25, 2023 · 0 comments

Comments

@addlistener
Copy link

addlistener commented Dec 25, 2023 •
edited
Loading

❌ bg-slate-600
❌ text-slate-100
✅ text-black

I read the manual that if there's a preset, color weights inverting would be skipped. But this is a bare bones project so there's no way to find a preset I guess?

Have I been configuring improperly?

Or is there a way I can work around it?

image image

The config is dead simple

import { type Config } from "tailwindcss";

export default {
  content: ["./src/**/*.tsx"],
  darkMode: "class",
  theme: {
    // extend: {
    //   fontFamily: {
    //     sans: ["var(--font-sans)", ...fontFamily.sans],
    //   },
    // },
  },
  plugins: [
    require("nightwind"),
  ],
} satisfies Config;

The versions

{
  "type": "module",
  "scripts": {
    "build": "next build",
    "db:push": "prisma db push",
    "db:studio": "prisma studio",
    "dev": "next dev",
    "postinstall": "prisma generate",
    "lint": "next lint",
    "start": "next start"
  },
  "dependencies": {
    "@grapesjs/react": "^1.0.0",
    "@next-auth/prisma-adapter": "^1.0.7",
    "@prisma/client": "^5.6.0",
    "@t3-oss/env-nextjs": "^0.7.1",
    "@tanstack/react-query": "^4.36.1",
    "@trpc/client": "^10.43.6",
    "@trpc/next": "^10.43.6",
    "@trpc/react-query": "^10.43.6",
    "@trpc/server": "^10.43.6",
    "next": "^14.0.3",
    "next-auth": "^4.24.5",
    "nightwind": "^1.1.13",
    "nodemailer": "^6.9.7",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-icons": "^4.12.0",
    "superjson": "^2.2.1",
    "zod": "^3.22.4"
  },
  "devDependencies": {
    "@next/eslint-plugin-next": "^14.0.3",
    "@types/eslint": "^8.44.7",
    "@types/node": "^18.17.0",
    "@types/react": "^18.2.37",
    "@types/react-dom": "^18.2.15",
    "@typescript-eslint/eslint-plugin": "^6.11.0",
    "@typescript-eslint/parser": "^6.11.0",
    "autoprefixer": "^10.4.14",
    "eslint": "^8.54.0",
    "postcss": "^8.4.31",
    "prettier": "^3.1.0",
    "prettier-plugin-tailwindcss": "^0.5.7",
    "prisma": "^5.6.0",
    "tailwindcss": "^3.3.5",
    "typescript": "^5.1.6"
  },
  "ct3aMetadata": {
    "initVersion": "7.24.1"
  },
  "packageManager": "[email protected]"
}

This is how I called init()

// in _app.tsx
import nightwind from "nightwind/helper";
const MyApp: AppType<{ session: Session | null }> = ({
  Component,
  pageProps: { session, ...pageProps },
}) => {
  return (
    <>
      <Head>
        ...
        <script dangerouslySetInnerHTML={{__html: nightwind.init()}}/>
      </Head>
      ...
    </>
  );
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@addlistener