github
/
nocodb
mirror of https://github.com/nocodb/nocodb
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

refactor(gui-v2): styling with css class

pull/2795/head
Wing-Kam Wong 2 years ago
parent
f86a34d5a5
commit
d3a44868df
1 changed files with 25 additions and 25 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 46
      packages/nc-gui-v2/components/dashboard/TabView.vue

46
packages/nc-gui-v2/components/dashboard/TabView.vue
Unescape View File

@ -8,6 +8,7 @@ import MdiExcelIcon from '~icons/mdi/file-excel'
import MdiJSONIcon from '~icons/mdi/code-json' import MdiJSONIcon from '~icons/mdi/code-json'
import MdiAirTableIcon from '~icons/mdi/table-large' import MdiAirTableIcon from '~icons/mdi/table-large'
import MdiRequestDataSourceIcon from '~icons/mdi/open-in-new' import MdiRequestDataSourceIcon from '~icons/mdi/open-in-new'
import MdiAccountGroupIcon from '~icons/mdi/account-group'
const { tabs, activeTab, closeTab } = useTabs() const { tabs, activeTab, closeTab } = useTabs()
// TODO: use useUIPermission when it's ready // TODO: use useUIPermission when it's ready
@ -31,8 +32,9 @@ const onEdit = (targetKey: number, action: string) => {
<a-tabs v-model:activeKey="activeTab" hide-add type="editable-card" :tab-position="top" @edit="onEdit"> <a-tabs v-model:activeKey="activeTab" hide-add type="editable-card" :tab-position="top" @edit="onEdit">
<a-tab-pane v-for="(tab, i) in tabs" :key="i" :value="i" class="text-capitalize" :closable="true"> <a-tab-pane v-for="(tab, i) in tabs" :key="i" :value="i" class="text-capitalize" :closable="true">
<template #tab> <template #tab>
<span> <span class="flex items-center gap-2">
<MdiTableIcon class="text-primary mdi-icons" /> <MdiTableIcon v-if="tab.type === 'table'" class="text-primary" />
<MdiAccountGroupIcon v-if="tab.type === 'auth'" class="text-primary" />
{{ tab.title }} {{ tab.title }}
</span> </span>
</template> </template>
@ -42,15 +44,15 @@ const onEdit = (targetKey: number, action: string) => {
<a-menu v-model:selectedKeys="currentMenu" mode="horizontal"> <a-menu v-model:selectedKeys="currentMenu" mode="horizontal">
<a-sub-menu key="addORImport"> <a-sub-menu key="addORImport">
<template #title> <template #title>
<span> <span class="flex items-center gap-2">
<MdiPlusIcon class="mdi-icons" /> <MdiPlusIcon />
Add / Import Add / Import
</span> </span>
</template> </template>
<a-menu-item-group v-if="isUIAllowed('addTable')" title=""> <a-menu-item-group v-if="isUIAllowed('addTable')">
<a-menu-item key="add-new-table" v-t="['a:actions:create-table']" @click="tableCreateDialog = true"> <a-menu-item key="add-new-table" v-t="['a:actions:create-table']" @click="tableCreateDialog = true">
<span> <span class="flex items-center gap-2">
<MdiTableIcon class="text-primary mdi-icons" /> <MdiTableIcon class="text-primary" />
<!-- Add new table --> <!-- Add new table -->
{{ $t('tooltip.addTable') }} {{ $t('tooltip.addTable') }}
</span> </span>
@ -63,8 +65,8 @@ const onEdit = (targetKey: number, action: string) => {
v-t="['a:actions:import-airtable']" v-t="['a:actions:import-airtable']"
@click="airtableImportDialog = true" @click="airtableImportDialog = true"
> >
<span> <span class="flex items-center gap-2">
<MdiAirTableIcon class="text-primary mdi-icons" /> <MdiAirTableIcon class="text-primary" />
<!-- TODO: i18n --> <!-- TODO: i18n -->
Airtable Airtable
</span> </span>
@ -76,8 +78,8 @@ const onEdit = (targetKey: number, action: string) => {
@click="fileImportDialog = true" @click="fileImportDialog = true"
importType="csv" importType="csv"
> >
<span> <span class="flex items-center gap-2">
<MdiCsvIcon class="text-primary mdi-icons" /> <MdiCsvIcon class="text-primary" />
<!-- TODO: i18n --> <!-- TODO: i18n -->
CSV file CSV file
</span> </span>
@ -89,8 +91,8 @@ const onEdit = (targetKey: number, action: string) => {
@click="fileImportDialog = true" @click="fileImportDialog = true"
importType="json" importType="json"
> >
<span> <span class="flex items-center gap-2">
<MdiJSONIcon class="text-primary mdi-icons" /> <MdiJSONIcon class="text-primary" />
<!-- TODO: i18n --> <!-- TODO: i18n -->
JSON file JSON file
</span> </span>
@ -102,20 +104,22 @@ const onEdit = (targetKey: number, action: string) => {
@click="fileImportDialog = true" @click="fileImportDialog = true"
importType="excel" importType="excel"
> >
<span> <span class="flex items-center gap-2">
<MdiExcelIcon class="text-primary mdi-icons" /> <MdiExcelIcon class="text-primary" />
<!-- TODO: i18n --> <!-- TODO: i18n -->
Microsoft Excel Microsoft Excel
</span> </span>
</a-menu-item> </a-menu-item>
</a-menu-item-group> </a-menu-item-group>
<a-divider style="margin: 0px" /> <a-divider class="ma-0 mb-2" />
<a-menu-item v-if="isUIAllowed('importRequest')" key="add-new-table" v-t="['e:datasource:import-request']"> <a-menu-item v-if="isUIAllowed('importRequest')" key="add-new-table" v-t="['e:datasource:import-request']">
<a href="https://github.com/nocodb/nocodb/issues/2052" target="_blank"> <a-anchor-link href="https://github.com/nocodb/nocodb/issues/2052" target="_blank" class="pa-0">
<MdiRequestDataSourceIcon class="text-primary mdi-icons" /> <span class="flex items-center gap-2">
<MdiRequestDataSourceIcon class="text-primary" />
<!-- TODO: i18n --> <!-- TODO: i18n -->
Request Data Source Request Data Source
</a> </span>
</a-anchor-link>
</a-menu-item> </a-menu-item>
</a-sub-menu> </a-sub-menu>
</a-menu> </a-menu>
@ -136,10 +140,6 @@ const onEdit = (targetKey: number, action: string) => {
</template> </template>
<style scoped lang="scss"> <style scoped lang="scss">
.mdi-icons {
margin-bottom: -5px;
}
:deep(.ant-menu-item-group-list) .ant-menu-item { :deep(.ant-menu-item-group-list) .ant-menu-item {
padding: 0px 46px 0px 16px; padding: 0px 46px 0px 16px;
margin: 0px; margin: 0px;

Write Preview
Loading…
Cancel
Save