village-hall
/
opnform
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Upgrade to tailwind3

This commit is contained in:
JhumanJ 2022-10-17 13:35:54 +02:00
parent 2b45f3c3b1
commit d7ffb6233c
5 changed files with 338 additions and 781 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1067
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

6
package.json
View File

@ -48,7 +48,7 @@
"@babel/eslint-parser": "^7.15.0", "@babel/eslint-parser": "^7.15.0",
"@babel/plugin-syntax-dynamic-import": "^7.8.3", "@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@babel/preset-env": "^7.15.0", "@babel/preset-env": "^7.15.0",
"autoprefixer": "^10.3.1", "autoprefixer": "^10.4.12",
"cross-env": "^7.0.3", "cross-env": "^7.0.3",
"eslint": "^7.32.0", "eslint": "^7.32.0",
"eslint-config-standard": "^16.0.3", "eslint-config-standard": "^16.0.3",
@ -61,11 +61,11 @@
"laravel-mix": "^6.0.27", "laravel-mix": "^6.0.27",
"laravel-mix-bundle-analyzer": "^1.0.5", "laravel-mix-bundle-analyzer": "^1.0.5",
"laravel-mix-versionhash": "2.0.1", "laravel-mix-versionhash": "2.0.1",
"postcss": "^8.3.6", "postcss": "^8.4.18",
"resolve-url-loader": "^3.1.4", "resolve-url-loader": "^3.1.4",
"sass": "^1.37.5", "sass": "^1.37.5",
"sass-loader": "^10.2.0", "sass-loader": "^10.2.0",
"tailwindcss": "^2.2.7", "tailwindcss": "^3.1.8",
"vue-loader": "^15.9.8", "vue-loader": "^15.9.8",
"vue-template-compiler": "^2.6.14" "vue-template-compiler": "^2.6.14"
} }

6
resources/js/components/Navbar.vue
View File

@ -3,14 +3,14 @@
<div class="max-w-7xl mx-auto px-8"> <div class="max-w-7xl mx-auto px-8">
<div class="flex items-center justify-between h-16"> <div class="flex items-center justify-between h-16">
<div class="flex items-center"> <div class="flex items-center">
<router-link :to="{ name: user ? 'home' : 'welcome' }" class="flex-shrink-0 font-bold flex items-center"> <router-link :to="{ name: user ? 'home' : 'welcome' }" class="flex-shrink-0 font-semibold flex items-center">
<img :src="asset('img/logo.svg')" alt="notion tools logo" class="w-10 h-10"> <img :src="asset('img/logo.svg')" alt="notion tools logo" class="w-10 h-10">
<span <span
class="ml-2 text-xl hidden sm:inline text-black dark:text-white" class="ml-2 text-xl hidden sm:inline text-black dark:text-white"
> >
{{ appName }}</span><span {{ appName }}</span><span
class="bg-gray-100 font-semibold inline-block mb-4 ml-1 px-3 rounded-full text-black text-xs tracking-wider" class="bg-gray-100 text-gray-600 font-semibold inline-block mb-4 ml-1 px-3 rounded-full text-black text-xs tracking-wider"
>Beta</span> >BETA</span>
</router-link> </router-link>
<workspace-dropdown class="ml-6" /> <workspace-dropdown class="ml-6" />
</div> </div>

19
tailwind.config.js vendored
View File

@ -1,8 +1,8 @@
const colors = require('tailwindcss/colors') const colors = require('tailwindcss/colors')
module.exports = { module.exports = {
mode: 'jit',
important: true, important: true,
purge: {
content: [ content: [
'./resources/**/*.blade.php', './resources/**/*.blade.php',
'./resources/**/*.js', './resources/**/*.js',
@ -13,16 +13,15 @@ module.exports = {
/.*bg-(nt-blue|blue|gray|red|yellow|green).*/, // Buttons /.*bg-(nt-blue|blue|gray|red|yellow|green).*/, // Buttons
...['green', 'red', 'blue', 'yellow'].map((color) => ['bg-' + color + '-100', 'border-' + color + '-500']).flat() // Alerts ...['green', 'red', 'blue', 'yellow'].map((color) => ['bg-' + color + '-100', 'border-' + color + '-500']).flat() // Alerts
] ]
}
}, },
darkMode: 'class', // or 'media' or 'class' darkMode: 'class', // or 'media' or 'class'
theme: { theme: {
extend: { extend: {
keyframes: { keyframes: {
'bonce-slow': { 'bonce-slow': {
'0%, 20%': { transform: 'translateY(0)' }, '0%, 20%': {transform: 'translateY(0)'},
'8%': { transform: 'translateY(-25%)' }, '8%': {transform: 'translateY(-25%)'},
'16%': { transform: 'translateY(+10%)' } '16%': {transform: 'translateY(+10%)'}
} }
}, },
animation: { animation: {
@ -71,15 +70,5 @@ module.exports = {
} }
} }
}, },
variants: {
extend: {
animation: ['hover'],
brightness: ['hover', 'focus'],
invert: ['dark'],
maxWidth: ['hover'],
display: ['group-hover', 'dark'],
rotate: ['group-hover']
}
},
plugins: [] plugins: []
} }

1
webpack.mix.js vendored
View File

@ -13,7 +13,6 @@ mix
processCssUrls: false, processCssUrls: false,
postCss: [tailwindcss('./tailwind.config.js')] postCss: [tailwindcss('./tailwind.config.js')]
}) })
.disableNotifications() .disableNotifications()
if (mix.inProduction()) { if (mix.inProduction()) {