mirror of
https://github.com/n8n-io/n8n.git
synced 2025-03-05 20:50:17 -08:00
fix(editor): Fix github star button layout (#13630)
This commit is contained in:
Milorad FIlipović
GitHub
parent
999fb8174a
commit
139b5b378d
|
|
@ -10,6 +10,7 @@ import {
|
|||
STICKY_NODE_TYPE,
|
||||
VIEWS,
|
||||
WORKFLOW_EVALUATION_EXPERIMENT,
|
||||
N8N_MAIN_GITHUB_REPO_URL,
|
||||
} from '@/constants';
|
||||
import { useExecutionsStore } from '@/stores/executions.store';
|
||||
import { useNDVStore } from '@/stores/ndv.store';
|
||||
|
|
@ -223,9 +224,11 @@ function hideGithubButton() {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="container">
|
||||
<div :class="{ 'main-header': true, expanded: !uiStore.sidebarMenuCollapsed }">
|
||||
<div v-show="!hideMenuBar" class="top-menu">
|
||||
<div :class="$style.container">
|
||||
<div
|
||||
:class="{ [$style['main-header']]: true, [$style.expanded]: !uiStore.sidebarMenuCollapsed }"
|
||||
>
|
||||
<div v-show="!hideMenuBar" :class="$style['top-menu']">
|
||||
<WorkflowDetails
|
||||
v-if="workflow?.name"
|
||||
:id="workflow.id"
|
||||
|
|
@ -236,6 +239,25 @@ function hideGithubButton() {
|
|||
:active="workflow.active"
|
||||
:read-only="readOnly"
|
||||
/>
|
||||
<div v-if="showGitHubButton" :class="[$style['github-button'], 'hidden-sm-and-down']">
|
||||
<div :class="$style['github-button-container']">
|
||||
<GithubButton
|
||||
:href="N8N_MAIN_GITHUB_REPO_URL"
|
||||
:data-color-scheme="uiStore.appliedTheme"
|
||||
data-size="large"
|
||||
data-show-count="true"
|
||||
:aria-label="locale.baseText('editor.mainHeader.githubButton.label')"
|
||||
>
|
||||
{{ locale.baseText('generic.star') }}
|
||||
</GithubButton>
|
||||
<N8nIcon
|
||||
:class="$style['close-github-button']"
|
||||
icon="times-circle"
|
||||
size="medium"
|
||||
@click="hideGithubButton"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<TabBar
|
||||
v-if="onWorkflowPage"
|
||||
|
|
@ -244,29 +266,10 @@ function hideGithubButton() {
|
|||
@update:model-value="onTabSelected"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="showGitHubButton" class="github-button hidden-sm-and-down">
|
||||
<div class="github-button-container">
|
||||
<GithubButton
|
||||
href="https://github.com/n8n-io/n8n"
|
||||
:data-color-scheme="uiStore.appliedTheme"
|
||||
data-size="large"
|
||||
data-show-count="true"
|
||||
aria-label="Star n8n-io/n8n on GitHub"
|
||||
>
|
||||
Star
|
||||
</GithubButton>
|
||||
<N8nIcon
|
||||
class="close-github-button"
|
||||
icon="times-circle"
|
||||
size="medium"
|
||||
@click="hideGithubButton"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
<style module lang="scss">
|
||||
.container {
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
|
@ -288,22 +291,15 @@ function hideGithubButton() {
|
|||
align-items: center;
|
||||
font-size: 0.9em;
|
||||
font-weight: 400;
|
||||
padding: var(--spacing-xs) var(--spacing-m);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.github-button {
|
||||
display: flex;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
align-self: stretch;
|
||||
justify-content: center;
|
||||
min-width: 170px;
|
||||
padding-top: 2px;
|
||||
padding-left: var(--spacing-m);
|
||||
padding-right: var(--spacing-m);
|
||||
padding: var(--spacing-5xs) var(--spacing-m) 0;
|
||||
background-color: var(--color-background-xlight);
|
||||
border-bottom: var(--border-width-base) var(--border-style-base) var(--color-foreground-base);
|
||||
border-left: var(--border-width-base) var(--border-style-base) var(--color-foreground-base);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -771,6 +771,7 @@ $--header-spacing: 20px;
|
|||
.container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding: var(--spacing-xs) var(--spacing-m);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
|
|
|
|||
|
|
@ -104,6 +104,7 @@ export const COMMUNITY_NODES_BLOCKLIST_DOCS_URL = `https://${DOCS_DOMAIN}/integr
|
|||
export const CUSTOM_NODES_DOCS_URL = `https://${DOCS_DOMAIN}/integrations/creating-nodes/code/create-n8n-nodes-module/`;
|
||||
export const EXPRESSIONS_DOCS_URL = `https://${DOCS_DOMAIN}/code-examples/expressions/`;
|
||||
export const N8N_PRICING_PAGE_URL = 'https://n8n.io/pricing';
|
||||
export const N8N_MAIN_GITHUB_REPO_URL = 'https://github.com/n8n-io/n8n';
|
||||
|
||||
export const NODE_INSERT_SPACER_BETWEEN_INPUT_GROUPS = false;
|
||||
export const NODE_MIN_INPUT_ITEMS_COUNT = 4;
|
||||
|
|
|
|||
|
|
@ -65,6 +65,7 @@
|
|||
"generic.error": "Something went wrong",
|
||||
"generic.settings": "Settings",
|
||||
"generic.service": "the service",
|
||||
"generic.star": "Star",
|
||||
"generic.tryNow": "Try now",
|
||||
"generic.dismiss": "Dismiss",
|
||||
"generic.unsavedWork.confirmMessage.headline": "Save changes before leaving?",
|
||||
|
|
@ -675,6 +676,7 @@
|
|||
"duplicateWorkflowDialog.errors.forbidden.title": "Duplicate workflow failed",
|
||||
"duplicateWorkflowDialog.errors.forbidden.message": "This action is forbidden. Do you have the correct permissions?",
|
||||
"duplicateWorkflowDialog.errors.generic.title": "Duplicate workflow failed",
|
||||
"editor.mainHeader.githubButton.label": "Star n8n-io/n8n on GitHub",
|
||||
"error": "Error",
|
||||
"error.goBack": "Go back",
|
||||
"error.pageNotFound": "Oops, couldn’t find that",
|
||||
|
|
|
|||
Loading…
Reference in a new issue