https://github.com/tinacms/tina-tailwind-inline-demo

https://github.com/tinacms/tina-tailwind-inline-demo

cms nextjs react tailwindcss tina tinacms

Last synced: 3 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/tinacms/tina-tailwind-inline-demo
• Owner: tinacms
• License: apache-2.0
• Created: 2021-03-08T16:10:46.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2021-04-12T18:12:25.000Z (almost 4 years ago)
• Last Synced: 2023-03-03T12:05:44.000Z (almost 2 years ago)
• Topics: cms, nextjs, react, tailwindcss, tina, tinacms
• Language: JavaScript
• Homepage: https://tina-demo-two.vercel.app/
• Size: 2.26 MB
• Stars: 21
• Watchers: 8
• Forks: 11
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
> ## **🚧 THIS IS EXPERIMENTAL 🚧**

> Please note that Tina's inline editing is an experimental feature and is prone to breaking changes.

## Tina + Tailwind + Next.js Demo Project

An inline-editing demo built with [Tina](https://github.com/tinacms/tinacms), [Tailwind CSS](https://github.com/tailwindlabs/tailwindcss), and [Next.js](https://github.com/vercel/next.js/).

- 🖋️ Edit text inline or in the settings modal for any block.

- 🦉 Support for dark mode with a mode toggle in the navbar.

- 📓 Use as a reference or jumping off point for your own projects.

- 🖼️ Demo image [from Unsplash](https://unsplash.com/photos/3SfRHVfivdA)

Editing is enabled by default and saving will prompt you with the raw _JSON_ and a link to the docs. You can disable editing by editing the `tinaOptions` object inside `index.js`. To learn how to work with a backend, [check out our docs](https://tina.io/docs/getting-started/backends/).