mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-11-15 00:54:06 -08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Refactor maxWidth to CSS variable

Browse source 
- Update GlobalExecutionsList.vue
- Update PageViewLayout.vue
- Define --content-container-width
- Update ProjectSettings.vue
- Update TemplatesView.vue
This commit is contained in:
Oleg Ivaniv 2024-11-12 11:28:23 +01:00
parent 69f859b9ea
commit 49bd5c6acc
No known key found for this signature in database
5 changed files with 6 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/editor-ui/src/components/executions/global/GlobalExecutionsList.vue
View file

@ -459,8 +459,8 @@ async function onAutoRefreshToggle(value: boolean) {
position: relative; position: relative;
height: 100%; height: 100%;
width: 100%; width: 100%;
max-width: 1280px;
padding: var(--spacing-l) var(--spacing-2xl) 0; padding: var(--spacing-l) var(--spacing-2xl) 0;
max-width: var(--content-container-width);
} }
.execList { .execList {

2
packages/editor-ui/src/components/layouts/PageViewLayout.vue
View file

@ -13,7 +13,7 @@
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
width: 100%; width: 100%;
max-width: 1280px; max-width: var(--content-container-width);
box-sizing: border-box; box-sizing: border-box;
align-content: start; align-content: start;
padding: var(--spacing-l) var(--spacing-2xl) 0; padding: var(--spacing-l) var(--spacing-2xl) 0;

1
packages/editor-ui/src/n8n-theme.scss
View file

@ -4,6 +4,7 @@
:root { :root {
// Using native css variable enables us to use this value in JS // Using native css variable enables us to use this value in JS
--header-height: 65; --header-height: 65;
--content-container-width: 1280px;
} }
.clickable { .clickable {

4
packages/editor-ui/src/views/ProjectSettings.vue
View file

@ -400,7 +400,7 @@ onMounted(() => {
form { form {
width: 100%; width: 100%;
max-width: 1280px; max-width: var(--content-container-width);
padding: 0 var(--spacing-2xl); padding: 0 var(--spacing-2xl);
fieldset { fieldset {
@ -417,7 +417,7 @@ onMounted(() => {
.header { .header {
width: 100%; width: 100%;
max-width: 1280px; max-width: var(--content-container-width);
padding: var(--spacing-l) var(--spacing-2xl) 0; padding: var(--spacing-l) var(--spacing-2xl) 0;
} }

2
packages/editor-ui/src/views/TemplatesView.vue
View file

@ -30,7 +30,7 @@ withDefaults(defineProps<Props>(), {
.template { .template {
display: flex; display: flex;
width: 100%; width: 100%;
max-width: 1280px; max-width: var(--content-container-width);
padding: var(--spacing-l) var(--spacing-l) 0; padding: var(--spacing-l) var(--spacing-l) 0;
justify-content: center; justify-content: center;
@media (min-width: 1200px) { @media (min-width: 1200px) {