songtianlun
9ce9feafb7
- Update the footer layout to include copyright information and navigation links - Improve the header layout with a responsive theme switcher - Configure Tailwind CSS to use light and dark themes This change enhances the project's user interface and user experience by providing a more visually appealing and responsive design. It includes updates to the footer and header layouts, making it easier for users to navigate the site. Additionally, it configures Tailwind CSS to use light and dark themes, allowing users to customize their experience to suit their preferences.
37 lines
1.4 KiB
JavaScript
37 lines
1.4 KiB
JavaScript
const defaultTheme = require('tailwindcss/defaultTheme')
|
|
|
|
module.exports = {
|
|
content: [
|
|
'./public/*.html',
|
|
'./app/helpers/**/*.rb',
|
|
'./app/javascript/**/*.js',
|
|
'./app/views/**/*.{erb,haml,html,slim}',
|
|
'./node_modules/flowbite/**/*.js'
|
|
],
|
|
theme: {
|
|
extend: {
|
|
fontFamily: {
|
|
sans: ['Inter var', ...defaultTheme.fontFamily.sans],
|
|
},
|
|
},
|
|
},
|
|
plugins: [
|
|
require('@tailwindcss/typography'),
|
|
require('daisyui'),
|
|
// require('flowbite/plugin')
|
|
// require('@tailwindcss/forms'),
|
|
// require('@tailwindcss/typography'),
|
|
// require('@tailwindcss/container-queries'),
|
|
],
|
|
daisyui: {
|
|
themes: ["light", "dark"], // false: only light + dark | true: all themes | array: specific themes like this ["light", "dark", "cupcake"]
|
|
darkTheme: "dark", // name of one of the included themes for dark mode
|
|
base: true, // applies background color and foreground color for root element by default
|
|
styled: true, // include daisyUI colors and design decisions for all components
|
|
utils: true, // adds responsive and modifier utility classes
|
|
prefix: "", // prefix for daisyUI classnames (components, modifiers and responsive class names. Not colors)
|
|
logs: true, // Shows info about daisyUI version and used config in the console when building your CSS
|
|
themeRoot: ":root", // The element that receives theme color CSS variables
|
|
},
|
|
}
|