c03fd837ea
* Updated Elixir version; made phx interactive * Added JS formatting rules * Added yt-dlp to dockerfile * Added a basic PR template * Added default responses for the PR template
78 lines
2.5 KiB
JavaScript
78 lines
2.5 KiB
JavaScript
// See the Tailwind configuration guide for advanced usage
|
|
// https://tailwindcss.com/docs/configuration
|
|
|
|
const plugin = require('tailwindcss/plugin')
|
|
const fs = require('fs')
|
|
const path = require('path')
|
|
|
|
module.exports = {
|
|
content: ['./js/**/*.js', '../lib/pinchflat_web.ex', '../lib/pinchflat_web/**/*.*ex'],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
brand: '#FD4F00'
|
|
}
|
|
}
|
|
},
|
|
plugins: [
|
|
require('@tailwindcss/forms'),
|
|
// Allows prefixing tailwind classes with LiveView classes to add rules
|
|
// only when LiveView classes are applied, for example:
|
|
//
|
|
// <div class="phx-click-loading:animate-ping">
|
|
//
|
|
plugin(({ addVariant }) =>
|
|
addVariant('phx-no-feedback', ['.phx-no-feedback&', '.phx-no-feedback &'])
|
|
),
|
|
plugin(({ addVariant }) =>
|
|
addVariant('phx-click-loading', ['.phx-click-loading&', '.phx-click-loading &'])
|
|
),
|
|
plugin(({ addVariant }) =>
|
|
addVariant('phx-submit-loading', ['.phx-submit-loading&', '.phx-submit-loading &'])
|
|
),
|
|
plugin(({ addVariant }) =>
|
|
addVariant('phx-change-loading', ['.phx-change-loading&', '.phx-change-loading &'])
|
|
),
|
|
|
|
// Embeds Heroicons (https://heroicons.com) into your app.css bundle
|
|
// See your `CoreComponents.icon/1` for more information.
|
|
//
|
|
plugin(function ({ matchComponents, theme }) {
|
|
let iconsDir = path.join(__dirname, './vendor/heroicons/optimized')
|
|
let values = {}
|
|
let icons = [
|
|
['', '/24/outline'],
|
|
['-solid', '/24/solid'],
|
|
['-mini', '/20/solid']
|
|
]
|
|
icons.forEach(([suffix, dir]) => {
|
|
fs.readdirSync(path.join(iconsDir, dir)).forEach((file) => {
|
|
let name = path.basename(file, '.svg') + suffix
|
|
values[name] = { name, fullPath: path.join(iconsDir, dir, file) }
|
|
})
|
|
})
|
|
matchComponents(
|
|
{
|
|
hero: ({ name, fullPath }) => {
|
|
let content = fs
|
|
.readFileSync(fullPath)
|
|
.toString()
|
|
.replace(/\r?\n|\r/g, '')
|
|
return {
|
|
[`--hero-${name}`]: `url('data:image/svg+xml;utf8,${content}')`,
|
|
'-webkit-mask': `var(--hero-${name})`,
|
|
mask: `var(--hero-${name})`,
|
|
'mask-repeat': 'no-repeat',
|
|
'background-color': 'currentColor',
|
|
'vertical-align': 'middle',
|
|
display: 'inline-block',
|
|
width: theme('spacing.5'),
|
|
height: theme('spacing.5')
|
|
}
|
|
}
|
|
},
|
|
{ values }
|
|
)
|
|
})
|
|
]
|
|
}
|