mohiit1502/Automata
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: migrate editor-ui to Vite.js and various DX improvements (N8N-2277) (#4061)

Browse Source 
* feat: Added vite.js dependencies.

* chore: Removed tests folder to follow same structure as design-system

* chore: Removed unused testing config.

* chore: Created vite.js index.html

* refactor: Updated scss structure and imports.

* refactor: Updated workflow building.

* fix: Cleared up all workflow dependency cycles. Added proper package.json imports config.

* feat: Got a working build using Vite. Need to fix issues next.

* fix: Progress! Getting process.env error.

* fix: Changed process.env to import.meta.env.

* fix: Fixed circular imports that used require(). Fixed monaco editor.

* chore: Removed commented code.

* chore: Cleaned up package.json

* feat: Made necessary changes to replace base path in css files.

* feat: Serve CSS files for `editor-ui` Vite migration (#4069)

⚡ Serve CSS files for Vite migration

* chore: Fixed package-lock.json.

* fix: Fixed build after centralized tsconfig update.

* fix: Removed lodash-es replacement.

* fix: Commented out vitest test command.

* style: Fixed linting issues.

* fix: Added lodash-es hotfix back.

* chore: Updated package-lock.json

* refactor: Renamed all n8n scss variables to no longer be defined as private.

* feat(editor): add application-wide el-button replacement.

* fix(editor): Fix import in page alert after merge.

* chore(editor): update package-lock.json.

* fix: Case sensitive lodash-es replacement for vue-agile.

* fix: add alias for lodash-es camelcase import.

* fix: add patch-package support for fixing quill

* feat: add patch-package on postinstall

* fix: update quill patch path.

* refactor: rename quill patch

* fix: update quill version.

* fix: update quill patch

* fix: fix linting rules after installing eslint in design-system

* fix: update date picker button to have primary color

* test: update callout component snapshots

* fix(editor): fix linting issues in editor after enabling eslint

* fix(cli): add /assets/* to auth ignore endpoints in server

* chore: update package-lock.json

* chore: update package-lock.json

* fix(editor): fix linting issues

* feat: add vite-legacy support

* fix: update workflow package interface imports to type imports.

* chore: update package-lock.json

* fix(editor) fix importing translations other than english

* fix(editor): remove test command until vitest is added

* fix: increase memory allocation for vite build

* fix: add patch-package patches to n8n-custom docker build

* fix: add performance and load time improvements

* fix: add proper typing to setNodeType

* chore: update package-lock.json

* style: use generic type for reduce in setNodeType

Co-authored-by: Iván Ovejero <ivov.src@gmail.com>
This commit is contained in:
Alex Grozav
2022-09-23 17:14:28 +03:00
committed by GitHub
parent e709cb5fe2
commit 27e2ce0470
248 changed files with 6220 additions and 10845 deletions
Download Patch File Download Diff File Expand all files Collapse all files

185
packages/design-system/src/css/dropdown.scss Normal file
View File

@@ -0,0 +1,185 @@
@use "mixins/mixins";
@use "./common/var";
@use "./popper";
@include mixins.b(dropdown) {
display: inline-block;
position: relative;
color: var(--color-text-dark);
font-size: var.$font-size-base;
.el-button-group {
display: block;
.el-button {
float: none;
}
}
& .el-dropdown__caret-button {
padding-left: 5px;
padding-right: 5px;
position: relative;
border-left: none;
&::before {
$gap: 5px;
content: '';
position: absolute;
display: block;
width: 1px;
top: $gap;
bottom: $gap;
left: 0;
background: rgba(var.$color-white, 0.5);
}
&.button::before {
background: hsla(
var(#{--button-default-border-color-h}),
var(#{--button-default-border-color-s}),
var(#{--button-default-border-color-l}),
0.5
);
}
&:hover {
&::before {
top: 0;
bottom: 0;
}
}
& .el-dropdown__icon {
padding-left: 0;
}
}
@include mixins.e(icon) {
font-size: 12px;
margin: 0 3px;
}
.el-dropdown-selfdefine {
// 自定义
&:focus:active,
&:focus:not(.focusing) {
outline-width: 0;
}
}
}
@include mixins.b(dropdown-menu) {
position: absolute;
top: 0;
left: 0;
z-index: 10;
padding: 10px 0;
margin: 5px 0;
background-color: var.$color-white;
border: 1px solid var(--border-color-light);
border-radius: var(--border-radius-base);
box-shadow: var.$dropdown-menu-box-shadow;
@include mixins.e(item) {
list-style: none;
line-height: 36px;
padding: 0 16px;
margin: 0;
font-size: var.$font-size-base;
font-weight: var(--font-weight-regular);
color: var(--color-text-dark);
cursor: pointer;
outline: none;
&:not(.is-disabled):hover,
&:focus {
background-color: var.$dropdown-menuItem-hover-fill;
color: var.$dropdown-menuItem-hover-color;
}
i {
margin-right: 5px;
}
@include mixins.m(divided) {
$divided-offset: 6px;
position: relative;
margin-top: $divided-offset;
border-top: 1px solid var(--border-color-light);
&:before {
content: '';
height: $divided-offset;
display: block;
margin: 0 -16px;
background-color: var.$color-white;
}
}
@include mixins.when(disabled) {
cursor: default;
color: var.$font-color-disabled-base;
pointer-events: none;
}
}
@include mixins.m(medium) {
padding: 6px 0;
@include mixins.e(item) {
line-height: 30px;
padding: 0 17px;
font-size: 14px;
&.el-dropdown-menu__item--divided {
$divided-offset: 6px;
margin-top: $divided-offset;
&:before {
height: $divided-offset;
margin: 0 -17px;
}
}
}
}
@include mixins.m(small) {
padding: 6px 0;
@include mixins.e(item) {
line-height: 27px;
padding: 0 15px;
font-size: 13px;
&.el-dropdown-menu__item--divided {
$divided-offset: 4px;
margin-top: $divided-offset;
&:before {
height: $divided-offset;
margin: 0 -15px;
}
}
}
}
@include mixins.m(mini) {
padding: 3px 0;
@include mixins.e(item) {
line-height: 24px;
padding: 0 10px;
font-size: 12px;
&.el-dropdown-menu__item--divided {
$divided-offset: 3px;
margin-top: $divided-offset;
&:before {
height: $divided-offset;
margin: 0 -10px;
}
}
}
}
}