mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2025-03-05 20:50:17 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

update last component

Browse source
This commit is contained in:
Mutasem 2021-07-29 15:30:53 +02:00
parent f645e0248b
commit a328b8c66b
2 changed files with 15 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
packages/editor-ui/src/components/SaveWorkflowButton.vue
View file

@ -1,14 +1,10 @@
<template> <template>
<el-button :disabled="isWorkflowSaving" :class="{saved: isSaved}" size="small" @click="save" round :type="isSaved ? 'text': 'primary'"> <span :class="$style.container">
<font-awesome-icon v-if="isWorkflowSaving" icon="spinner" spin /> <n8n-button label="Save" :disabled="isWorkflowSaving" size="md" @click="save" v-if="isDirty || isNewWorkflow" />
<span v-else-if="isDirty || isNewWorkflow"> <span :class="$style.saved" v-else>Saved</span>
Save </span>
</span>
<span v-else>Saved</span>
</el-button>
</template> </template>
<script lang="ts"> <script lang="ts">
import mixins from "vue-typed-mixins"; import mixins from "vue-typed-mixins";
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
@ -39,27 +35,17 @@ export default mixins(workflowHelpers).extend({
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" module>
.el-button { .container {
width: 65px; width: 65px;
}
// override disabled colors .saved {
color: white; color: $--custom-font-very-light;
background-color: $--color-primary; font-size: 12px;
font-weight: 600;
&:hover:not(.saved) { line-height: 12px;
color: white; text-align: center;
background-color: $--color-primary; padding: var(--spacing-2xs) var(--spacing-xs);
}
&.saved {
color: $--custom-font-very-light;
font-size: 12px;
font-weight: 600;
line-height: 12px;
text-align: center;
background-color: unset;
pointer-events: none;
}
} }
</style> </style>

2
packages/editor-ui/src/plugins/compontents.ts
View file

@ -122,7 +122,7 @@ Vue.use(Switch);
Vue.use(Select); Vue.use(Select);
Vue.use(Option); Vue.use(Option);
Vue.use(OptionGroup); Vue.use(OptionGroup);
Vue.use(Button); // Vue.use(Button);
Vue.use(ButtonGroup); Vue.use(ButtonGroup);
Vue.use(Table); Vue.use(Table);
Vue.use(TableColumn); Vue.use(TableColumn);