I am using React.jsx code for the home page. Is it possible to change the text color f

I figured it out :) I need to use <div class="snippet-clipboard-

Hi, have you tried using useConfig provided by Nextra? <div class="highlight highl

Dark and Light mode about nextra HOT 3 CLOSED

Shubham-EV commented on June 9, 2024

Dark and Light mode

from nextra.

Comments (3)

Shubham-EV commented on June 9, 2024 1

I figured it out :)

I need to use

import { useTheme } from "nextra-theme-docs";

export default function HomePage() {
    const { theme } = useTheme();

  return (
    <div>
       <span style={{ color: theme === "dark" ? "green" : "red" }}>
          Hello World!
        </span>
    </div>
  );
}

from nextra.

jakubgrygiel commented on June 9, 2024

Hi, have you tried using useConfig provided by Nextra?

import { useConfig } from "nextra-theme-docs/dist/index.mjs";

export default function HomePage() {
  const { darkMode } = useConfig();

  return (
    <div>
      <span style={{ color: darkMode ? "white" : "black" }}>Hello World!</span>
    </div>
  );
}

from nextra.

Shubham-EV commented on June 9, 2024

In my case useConfig is here import { useConfig } from "nextra-theme-docs";
and its not working the way you showed

from nextra.

Dark and Light mode about nextra HOT 3 CLOSED

Comments (3)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent