nextjs-mdx-blog-theme
- View: demo site
- Framework: Next.js
- Deployment: Vercel
- Content: MDX
- Styling: Tailwind CSS
Running Locally
$ git clone https://github.com/alexcarpenter/nextjs-mdx-blog-theme
$ cd nextjs-mdx-blog-theme
$ npm install
$ npm run dev:watch
Styling
To organize Tailwind CSS light and dark styles on elements, we make use of cx utility as an array. The first string contains the base styles, the second string is for light mode styles, and lastly the third string is for dark mode styling.
import { cx } from '@/lib/utils'
<div
className={cx(
'p-4', // base styles
'text-gray-900', // light mode styles
'dark:text-gray-50'. // dark mode styles
)}
/>
6 Jun 23, 2022
4 Mar 25, 2022
94 Dec 31, 2022
8 Dec 8, 2022
6 Dec 24, 2022
6 Dec 13, 2022
9 Dec 22, 2022
19 Sep 9, 2022
46 Dec 23, 2022
3 Jun 28, 2022