Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

refactor: use design system windicss config #21503

Merged
merged 19 commits into from Jun 22, 2022
Merged

refactor: use design system windicss config #21503

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
19 commits
Select commit Hold shift + click to select a range
a5bd89b
chore: use design system windi config
elevatebart Apr 30, 2022
c1a85bf
fix: windi config should have colors in the right place
elevatebart Apr 30, 2022
f3740d3
fix: remove direct dependencies to old windi
elevatebart Apr 30, 2022
1945916
Merge branch '10.0-release' into elevatebart/use-shared-windicss
elevatebart May 14, 2022
dd96433
upgrade css plugin for types
elevatebart May 16, 2022
d0f8114
Merge branch '10.0-release' into elevatebart/use-shared-windicss
elevatebart May 16, 2022
b656eab
Merge branch '10.0-release' into elevatebart/use-shared-windicss
elevatebart May 17, 2022
b637d94
Merge branch '10.0-release' into elevatebart/use-shared-windicss
elevatebart May 18, 2022
cfd1cb3
Merge branch '10.0-release' into elevatebart/use-shared-windicss
elevatebart May 18, 2022
4191ddf
update windi plugin
elevatebart May 18, 2022
3a19570
Merge branch 'develop' into elevatebart/use-shared-windicss
elevatebart May 25, 2022
7c191a6
Merge branch 'develop' into elevatebart/use-shared-windicss
elevatebart Jun 6, 2022
c326da6
Merge branch 'develop' into elevatebart/use-shared-windicss
ZachJW34 Jun 16, 2022
dc62e8d
Merge branch 'develop' into elevatebart/use-shared-windicss
elevatebart Jun 21, 2022
f2cb0d2
Merge branch 'develop' into elevatebart/use-shared-windicss
elevatebart Jun 21, 2022
80002d9
refactor: update without the safelist
elevatebart Jun 21, 2022
51376db
Merge branch 'develop' into elevatebart/use-shared-windicss
elevatebart Jun 21, 2022
c5dbba1
Merge branch 'develop' into elevatebart/use-shared-windicss
elevatebart Jun 21, 2022
5570637
Merge branch 'develop' into elevatebart/use-shared-windicss
elevatebart Jun 22, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
3 changes: 1 addition & 2 deletions packages/app/package.json
View file
Open in desktop
Expand Up @@ -19,6 +19,7 @@
},
"dependencies": {},
"devDependencies": {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just learned that https://github.com/cypress-io/cypress-design exists!

"@cypress-design/css": "0.1.0",
"@graphql-typed-document-node/core": "^3.1.0",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not directly related but do you think we should consider changing to TailwindCSS at this point for future sustainability? It has way more contributors, and just looking at the repo we have 18 issues (Tailwind) vs 172(Windi).

I feel like Tailwind will likely outlast and be a more sustainability option. I have no idea of the cost of migration - should be small, since Windi is "Tailwind compatible".

I don't see a strong benefit to Windi since Tailwind now has a JIT compiler, which was the main issue Windi solved (speed).

Thoughts?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unless there is a compelling reason (bug, needed enhancement), I would prefer to avoid unnecessary changes.
Tailwind is great and really active, but this does not justify yet the potential fixing of the problems.

Among the differences, TailwindCSS is a PostCSS-based plugin instead of being independent in WindiCSS. It means that in WindiCSS the plugin controls the configuration. With TailwindCSS, we would have to export a TailwindCSS config.

There are a few configurations as well that would need to migrate. Colors, safelist, plugins.

"@headlessui/vue": "1.4.0",
"@iconify/iconify": "2.1.2",
Expand All @@ -34,7 +35,6 @@
"@vitejs/plugin-vue": "2.2.4",
"@vitejs/plugin-vue-jsx": "1.3.8",
"@vueuse/core": "7.2.2",
"@windicss/plugin-interaction-variants": "1.0.0",
"ansi-to-html": "0.6.14",
"bluebird": "3.5.3",
"classnames": "2.3.1",
Expand Down Expand Up @@ -68,7 +68,6 @@
"vue-i18n": "9.2.0-beta.7",
"vue-router": "4",
"vue-tsc": "^0.3.0",
"windicss": "3.1.4",
"wonka": "^4.0.15"
},
"files": [
Expand Down
7 changes: 4 additions & 3 deletions packages/app/windi.config.ts
View file
Open in desktop
@@ -1,4 +1,5 @@
import { defaultConfig } from '@packages/frontend-shared/windi.config'
import { defineConfig } from 'windicss/helpers'
/**
* This file is used for vscode plugin autocompletion of windi colors
*/

export default defineConfig(defaultConfig)
export { default } from '@packages/frontend-shared/windi.config'
195 changes: 0 additions & 195 deletions packages/frontend-shared/.windicss/colors.ts
View file
Open in desktop

This file was deleted.

141 changes: 0 additions & 141 deletions packages/frontend-shared/.windicss/icon-color-plugins.ts
View file
Open in desktop

This file was deleted.

27 changes: 0 additions & 27 deletions packages/frontend-shared/.windicss/safelist.ts
View file
Open in desktop

This file was deleted.