mirror of
https://github.com/logseq/logseq.git
synced 2026-04-24 22:25:01 +00:00
enhance(ui): upgrade tailwind & configures
This commit is contained in:
charlie
14
package.json
14
package.json
@@ -7,7 +7,9 @@
|
||||
"@axe-core/playwright": "^4.4.4",
|
||||
"@capacitor/cli": "^4.0.0",
|
||||
"@playwright/test": "^1.24.2",
|
||||
"@tailwindcss/ui": "0.7.2",
|
||||
"@tailwindcss/forms": "0.5.3",
|
||||
"@tailwindcss/typography": "0.5.7",
|
||||
"@tailwindcss/aspect-ratio": "0.4.2",
|
||||
"@types/gulp": "^4.0.7",
|
||||
"cross-env": "^7.0.3",
|
||||
"cssnano": "^5.1.13",
|
||||
@@ -17,16 +19,16 @@
|
||||
"ip": "1.1.8",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"playwright": "^1.24.2",
|
||||
"postcss": "8.4.16",
|
||||
"postcss": "8.4.17",
|
||||
"postcss-cli": "10.0.0",
|
||||
"postcss-import": "^15.0.0",
|
||||
"postcss-import-ext-glob": "^2.0.1",
|
||||
"postcss-nested": "5.0.6",
|
||||
"postcss-import": "15.0.0",
|
||||
"postcss-import-ext-glob": "2.0.1",
|
||||
"postcss-nested": "6.0.0",
|
||||
"purgecss": "4.0.2",
|
||||
"shadow-cljs": "2.17.5",
|
||||
"stylelint": "^13.8.0",
|
||||
"stylelint-config-standard": "^20.0.0",
|
||||
"tailwindcss": "2.2.16",
|
||||
"tailwindcss": "3.1.8",
|
||||
"typescript": "^4.4.3"
|
||||
},
|
||||
"scripts": {
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
.wrapper {
|
||||
@apply relative flex-shrink-0
|
||||
h-6 w-11 border-2 border-transparent flex
|
||||
rounded-full cursor-pointer focus:outline-none focus:shadow-outline;
|
||||
rounded-full cursor-pointer focus:outline-none;
|
||||
}
|
||||
|
||||
.switcher {
|
||||
@@ -313,7 +313,7 @@ html.is-mobile {
|
||||
|
||||
.form-select {
|
||||
@apply block w-full pl-3 pr-10 py-2 text-base leading-6
|
||||
border-gray-300 focus:outline-none focus:shadow-outline-blue sm:text-sm sm:leading-5;
|
||||
border-gray-300 focus:outline-none sm:text-sm sm:leading-5;
|
||||
|
||||
background-color: var(--ls-primary-background-color, transparent);
|
||||
background-repeat: no-repeat;
|
||||
|
||||
@@ -3,49 +3,49 @@ const colors = require('tailwindcss/colors')
|
||||
function exposeColorsToCssVars({ addBase, theme }) {
|
||||
function extractColorVars(colorObj, colorGroup = '') {
|
||||
return Object.keys(colorObj).reduce((vars, colorKey) => {
|
||||
const value = colorObj[colorKey];
|
||||
const value = colorObj[colorKey]
|
||||
|
||||
const newVars =
|
||||
typeof value === 'string'
|
||||
? { [`--color${colorGroup}-${colorKey}`]: value }
|
||||
: extractColorVars(value, `-${colorKey}`);
|
||||
: extractColorVars(value, `-${colorKey}`)
|
||||
|
||||
return { ...vars, ...newVars };
|
||||
}, {});
|
||||
return { ...vars, ...newVars }
|
||||
}, {})
|
||||
}
|
||||
|
||||
addBase({
|
||||
':root': extractColorVars(theme('colors')),
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
mode: 'jit',
|
||||
purge: {
|
||||
content: [
|
||||
'./src/**/*.js',
|
||||
'./src/**/*.cljs',
|
||||
'./resources/**/*.html'
|
||||
],
|
||||
safelist: [
|
||||
"bg-black",
|
||||
"bg-white",
|
||||
"bg-gray-50", "bg-red-50", "bg-yellow-50", "bg-green-50", "bg-blue-50", "bg-indigo-50", "bg-orange-50", "bg-rose-50", "bg-purple-50",
|
||||
"bg-gray-100", "bg-red-100", "bg-yellow-100", "bg-green-100", "bg-blue-100", "bg-indigo-100", "bg-orange-100", "bg-rose-100", "bg-purple-100", "bg-pink-100",
|
||||
"bg-gray-200", "bg-red-200", "bg-yellow-200", "bg-green-200", "bg-blue-200", "bg-indigo-200", "bg-orange-200", "bg-rose-200", "bg-purple-200", "bg-pink-200",
|
||||
"bg-gray-300", "bg-red-300", "bg-yellow-300", "bg-green-300", "bg-blue-300", "bg-indigo-300", "bg-orange-300", "bg-rose-300", "bg-purple-300", "bg-pink-300",
|
||||
"bg-gray-400", "bg-red-400", "bg-yellow-400", "bg-green-400", "bg-blue-400", "bg-indigo-400", "bg-orange-400", "bg-rose-400", "bg-purple-400", "bg-pink-400",
|
||||
"bg-gray-500", "bg-red-500", "bg-yellow-500", "bg-green-500", "bg-blue-500", "bg-indigo-500", "bg-orange-500", "bg-rose-500", "bg-purple-500", "bg-pink-500",
|
||||
"bg-gray-600", "bg-red-600", "bg-yellow-600", "bg-green-600", "bg-blue-600", "bg-indigo-600", "bg-orange-600", "bg-rose-600", "bg-purple-600", "bg-pink-600",
|
||||
"bg-gray-700", "bg-red-700", "bg-yellow-700", "bg-green-700", "bg-blue-700", "bg-indigo-700", "bg-orange-700", "bg-rose-700", "bg-purple-700", "bg-pink-700",
|
||||
"bg-gray-800", "bg-red-800", "bg-yellow-800", "bg-green-800", "bg-blue-800", "bg-indigo-800", "bg-orange-800", "bg-rose-800", "bg-purple-800", "bg-pink-800",
|
||||
"bg-gray-900", "bg-red-900", "bg-yellow-900", "bg-green-900", "bg-blue-900", "bg-indigo-900", "bg-orange-900", "bg-rose-900", "bg-purple-900", "bg-pink-900",
|
||||
]
|
||||
},
|
||||
plugins: [
|
||||
require('@tailwindcss/ui'),
|
||||
exposeColorsToCssVars],
|
||||
darkMode: 'class',
|
||||
content: [
|
||||
'./src/**/*.js',
|
||||
'./src/**/*.cljs',
|
||||
'./resources/**/*.html'
|
||||
],
|
||||
safelist: [
|
||||
'bg-black',
|
||||
'bg-white',
|
||||
'bg-gray-50', 'bg-red-50', 'bg-yellow-50', 'bg-green-50', 'bg-blue-50', 'bg-indigo-50', 'bg-orange-50', 'bg-rose-50', 'bg-purple-50',
|
||||
'bg-gray-100', 'bg-red-100', 'bg-yellow-100', 'bg-green-100', 'bg-blue-100', 'bg-indigo-100', 'bg-orange-100', 'bg-rose-100', 'bg-purple-100', 'bg-pink-100',
|
||||
'bg-gray-200', 'bg-red-200', 'bg-yellow-200', 'bg-green-200', 'bg-blue-200', 'bg-indigo-200', 'bg-orange-200', 'bg-rose-200', 'bg-purple-200', 'bg-pink-200',
|
||||
'bg-gray-300', 'bg-red-300', 'bg-yellow-300', 'bg-green-300', 'bg-blue-300', 'bg-indigo-300', 'bg-orange-300', 'bg-rose-300', 'bg-purple-300', 'bg-pink-300',
|
||||
'bg-gray-400', 'bg-red-400', 'bg-yellow-400', 'bg-green-400', 'bg-blue-400', 'bg-indigo-400', 'bg-orange-400', 'bg-rose-400', 'bg-purple-400', 'bg-pink-400',
|
||||
'bg-gray-500', 'bg-red-500', 'bg-yellow-500', 'bg-green-500', 'bg-blue-500', 'bg-indigo-500', 'bg-orange-500', 'bg-rose-500', 'bg-purple-500', 'bg-pink-500',
|
||||
'bg-gray-600', 'bg-red-600', 'bg-yellow-600', 'bg-green-600', 'bg-blue-600', 'bg-indigo-600', 'bg-orange-600', 'bg-rose-600', 'bg-purple-600', 'bg-pink-600',
|
||||
'bg-gray-700', 'bg-red-700', 'bg-yellow-700', 'bg-green-700', 'bg-blue-700', 'bg-indigo-700', 'bg-orange-700', 'bg-rose-700', 'bg-purple-700', 'bg-pink-700',
|
||||
'bg-gray-800', 'bg-red-800', 'bg-yellow-800', 'bg-green-800', 'bg-blue-800', 'bg-indigo-800', 'bg-orange-800', 'bg-rose-800', 'bg-purple-800', 'bg-pink-800',
|
||||
'bg-gray-900', 'bg-red-900', 'bg-yellow-900', 'bg-green-900', 'bg-blue-900', 'bg-indigo-900', 'bg-orange-900', 'bg-rose-900', 'bg-purple-900', 'bg-pink-900',
|
||||
],
|
||||
plugins: [
|
||||
require('@tailwindcss/forms'),
|
||||
require('@tailwindcss/typography'),
|
||||
require('@tailwindcss/aspect-ratio'),
|
||||
exposeColorsToCssVars
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
fontSize: {
|
||||
|
||||
Reference in New Issue
Block a user