Browse Source

fix: new table and project icon

pull/6486/head
sreehari jayaraj 1 year ago
parent
commit
a975f6559b
  1. 12
      packages/nc-gui/assets/nc-icons/record.svg
  2. 15
      packages/nc-gui/assets/nc-icons/table.svg
  3. 4
      packages/nc-gui/components/dashboard/TreeView/TableNode.vue
  4. 2
      packages/nc-gui/components/dashboard/settings/Metadata.vue
  5. 5
      packages/nc-gui/components/dashboard/settings/UIAcl.vue
  6. 2
      packages/nc-gui/components/dlg/TableDelete.vue
  7. 1
      packages/nc-gui/components/general/TableIcon.vue
  8. 2
      packages/nc-gui/components/smartsheet/column/LinkedToAnotherRecordOptions.vue
  9. 4
      packages/nc-gui/components/smartsheet/expanded-form/index.vue
  10. 4
      packages/nc-gui/utils/iconUtils.ts

12
packages/nc-gui/assets/nc-icons/record.svg

@ -0,0 +1,12 @@
<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1409_68546)">
<path d="M12.3571 5.96842L4.64282 10.4219" stroke="#1F293A" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
<rect x="1.15184" width="9.06208" height="9.06208" rx="1.335" transform="matrix(0.866044 -0.499967 0.866044 0.499967 -0.345705 8.77119)" stroke="#1F293A" stroke-width="1.33"/>
<path d="M4 6.33984L11.7143 10.7933" stroke="#1F293A" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
</g>
<defs>
<clipPath id="clip0_1409_68546">
<rect width="16" height="16" fill="white" transform="translate(0.5)"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 712 B

15
packages/nc-gui/assets/nc-icons/table.svg

@ -1,12 +1,13 @@
<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1409_68546)"> <g clip-path="url(#clip0_440_61068)">
<path d="M12.3571 5.96842L4.64282 10.4219" stroke="#1F293A" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/> <path d="M16 9.77002L0 9.77002" stroke="#4A5268" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
<rect x="1.15184" width="9.06208" height="9.06208" rx="1.335" transform="matrix(0.866044 -0.499967 0.866044 0.499967 -0.345705 8.77119)" stroke="#1F293A" stroke-width="1.33"/> <path d="M16 6.21997L0 6.21997" stroke="#4A5268" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4 6.33984L11.7143 10.7933" stroke="#1F293A" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/> <path d="M15.3334 3.99984C15.3334 3.26346 14.7365 2.6665 14.0001 2.6665H8.00008H2.00008C1.2637 2.6665 0.666748 3.26346 0.666748 3.99984V11.9998C0.666748 12.7362 1.2637 13.3332 2.00008 13.3332H8.00008H14.0001C14.7365 13.3332 15.3334 12.7362 15.3334 11.9998V3.99984Z" stroke="#4A5268" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M6 3L6 13" stroke="#4A5268" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
</g> </g>
<defs> <defs>
<clipPath id="clip0_1409_68546"> <clipPath id="clip0_440_61068">
<rect width="16" height="16" fill="white" transform="translate(0.5)"/> <rect width="16" height="16" fill="white"/>
</clipPath> </clipPath>
</defs> </defs>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 712 B

After

Width:  |  Height:  |  Size: 955 B

4
packages/nc-gui/components/dashboard/TreeView/TableNode.vue

@ -204,8 +204,8 @@ const isTableOpened = computed(() => {
<template #title> <template #title>
{{ $t('general.changeIcon') }} {{ $t('general.changeIcon') }}
</template> </template>
<component
<MdiTable :is="iconMap.table"
v-if="table.type === 'table'" v-if="table.type === 'table'"
class="flex w-5 !text-gray-500 text-sm" class="flex w-5 !text-gray-500 text-sm"
:class="{ :class="{

2
packages/nc-gui/components/dashboard/settings/Metadata.vue

@ -165,7 +165,7 @@ const columns = [
<div v-if="column.key === 'table_name'"> <div v-if="column.key === 'table_name'">
<div class="flex items-center gap-1"> <div class="flex items-center gap-1">
<div class="min-w-5 flex items-center justify-center"> <div class="min-w-5 flex items-center justify-center">
<GeneralTableIcon :meta="record" class="text-gray-500"></GeneralTableIcon> <GeneralTableIcon :meta="record" class="text-gray-500" />
</div> </div>
<span class="overflow-ellipsis min-w-0 shrink-1">{{ record.title || record.table_name }}</span> <span class="overflow-ellipsis min-w-0 shrink-1">{{ record.title || record.table_name }}</span>
</div> </div>

5
packages/nc-gui/components/dashboard/settings/UIAcl.vue

@ -171,10 +171,7 @@ const columns = [
<div v-if="column.name === 'table_name'"> <div v-if="column.name === 'table_name'">
<div class="flex items-center gap-1"> <div class="flex items-center gap-1">
<div class="min-w-5 flex items-center justify-center"> <div class="min-w-5 flex items-center justify-center">
<GeneralTableIcon <GeneralTableIcon :meta="{ meta: record.table_meta, type: record.ptype }" class="text-gray-500" />
:meta="{ meta: record.table_meta, type: record.ptype }"
class="text-gray-500"
></GeneralTableIcon>
</div> </div>
<GeneralTruncateText> <GeneralTruncateText>
<span class="overflow-ellipsis min-w-0 shrink-1">{{ record._ptn }}</span> <span class="overflow-ellipsis min-w-0 shrink-1">{{ record._ptn }}</span>

2
packages/nc-gui/components/dlg/TableDelete.vue

@ -106,7 +106,7 @@ const onDelete = async () => {
<GeneralDeleteModal v-model:visible="visible" :entity-name="$t('objects.table')" :on-delete="onDelete"> <GeneralDeleteModal v-model:visible="visible" :entity-name="$t('objects.table')" :on-delete="onDelete">
<template #entity-preview> <template #entity-preview>
<div v-if="table" class="flex flex-row items-center py-2.25 px-2.5 bg-gray-50 rounded-lg text-gray-700 mb-4"> <div v-if="table" class="flex flex-row items-center py-2.25 px-2.5 bg-gray-50 rounded-lg text-gray-700 mb-4">
<GeneralTableIcon :meta="table" class="nc-view-icon"></GeneralTableIcon> <GeneralTableIcon :meta="table" class="nc-view-icon" />
<div <div
class="capitalize text-ellipsis overflow-hidden select-none w-full pl-1.75" class="capitalize text-ellipsis overflow-hidden select-none w-full pl-1.75"
:style="{ wordBreak: 'keep-all', whiteSpace: 'nowrap', display: 'inline' }" :style="{ wordBreak: 'keep-all', whiteSpace: 'nowrap', display: 'inline' }"

1
packages/nc-gui/components/general/TableIcon.vue

@ -16,7 +16,6 @@ const { meta: tableMeta } = defineProps<{
:emoji="tableMeta.meta?.icon" :emoji="tableMeta.meta?.icon"
readonly readonly
/> />
<component :is="iconMap.eye" v-else-if="tableMeta?.type === 'view'" class="w-5 mx-0.75" /> <component :is="iconMap.eye" v-else-if="tableMeta?.type === 'view'" class="w-5 mx-0.75" />
<component :is="iconMap.table" v-else class="w-5 mx-0.5" /> <component :is="iconMap.table" v-else class="w-5 mx-0.5" />
</template> </template>

2
packages/nc-gui/components/smartsheet/column/LinkedToAnotherRecordOptions.vue

@ -80,7 +80,7 @@ const isLinks = computed(() => vModel.value.uidt === UITypes.Links)
<a-select-option v-for="table of refTables" :key="table.title" :value="table.id"> <a-select-option v-for="table of refTables" :key="table.title" :value="table.id">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="min-w-5 flex items-center justify-center"> <div class="min-w-5 flex items-center justify-center">
<GeneralTableIcon :meta="table" class="text-gray-500"></GeneralTableIcon> <GeneralTableIcon :meta="table" class="text-gray-500" />
</div> </div>
<span class="overflow-ellipsis min-w-0 shrink-1">{{ table.title }}</span> <span class="overflow-ellipsis min-w-0 shrink-1">{{ table.title }}</span>

4
packages/nc-gui/components/smartsheet/expanded-form/index.vue

@ -3,7 +3,7 @@ import type { TableType, ViewType } from 'nocodb-sdk'
import { isLinksOrLTAR, isSystemColumn, isVirtualCol } from 'nocodb-sdk' import { isLinksOrLTAR, isSystemColumn, isVirtualCol } from 'nocodb-sdk'
import type { Ref } from 'vue' import type { Ref } from 'vue'
import MdiChevronDown from '~icons/mdi/chevron-down' import MdiChevronDown from '~icons/mdi/chevron-down'
import TableIcon from '~icons/nc-icons/table' import RecordIcon from '~icons/nc-icons/record'
import { import {
CellClickHookInj, CellClickHookInj,
@ -408,7 +408,7 @@ export default {
{{ displayValue }} {{ displayValue }}
</div> </div>
<div class="bg-gray-100 px-2 gap-1 flex my-1 items-center rounded-lg text-gray-800 font-medium"> <div class="bg-gray-100 px-2 gap-1 flex my-1 items-center rounded-lg text-gray-800 font-medium">
<TableIcon class="w-6 h-6 text-sm" /> <RecordIcon class="w-6 h-6 text-sm" />
All {{ meta.title }} All {{ meta.title }}
</div> </div>
</div> </div>

4
packages/nc-gui/utils/iconUtils.ts

@ -13,7 +13,6 @@ import MdiThumbUp from '~icons/mdi/thumb-up'
import MdiThumbUpOutline from '~icons/mdi/thumb-up-outline' import MdiThumbUpOutline from '~icons/mdi/thumb-up-outline'
import MdiFlag from '~icons/mdi/flag' import MdiFlag from '~icons/mdi/flag'
import MdiFlagOutline from '~icons/mdi/flag-outline' import MdiFlagOutline from '~icons/mdi/flag-outline'
import MdiTable from '~icons/mdi/table'
import MsMove from '~icons/material-symbols/drive-file-move-outline' import MsMove from '~icons/material-symbols/drive-file-move-outline'
import MSCloseRounded from '~icons/material-symbols/close-rounded' import MSCloseRounded from '~icons/material-symbols/close-rounded'
import MdiTableLarge from '~icons/mdi/table-large' import MdiTableLarge from '~icons/mdi/table-large'
@ -82,6 +81,7 @@ import NcCommentHere from '~icons/nc-icons/comment-here'
import NcAddDataSource from '~icons/nc-icons/add-data-source' import NcAddDataSource from '~icons/nc-icons/add-data-source'
import NcDatabaseIcon from '~icons/nc-icons/database' import NcDatabaseIcon from '~icons/nc-icons/database'
import Project from '~icons/nc-icons/project' import Project from '~icons/nc-icons/project'
import TableIcon from '~icons/nc-icons/table'
// Roles // Roles
import MaterialSymbolsManageAccountsOutline from '~icons/material-symbols/manage-accounts-outline' import MaterialSymbolsManageAccountsOutline from '~icons/material-symbols/manage-accounts-outline'
@ -324,7 +324,7 @@ export const iconMap = {
// threeDotHorizontal: h('span', { class: 'material-symbols' }, 'more_horiz'), // threeDotHorizontal: h('span', { class: 'material-symbols' }, 'more_horiz'),
threeDotVertical: MdiDotsVertical, threeDotVertical: MdiDotsVertical,
threeDotHorizontal: MdiDotsHorizontal, threeDotHorizontal: MdiDotsHorizontal,
table: MdiTable, table: TableIcon,
excel: PhExcelThin, // h('span', { class: 'material-symbols' }, 'grid_on'), excel: PhExcelThin, // h('span', { class: 'material-symbols' }, 'grid_on'),
csv: PhCsvThin, // h('span', { class: 'material-symbols' }, 'grid_on'), csv: PhCsvThin, // h('span', { class: 'material-symbols' }, 'grid_on'),
code: Code, code: Code,

Loading…
Cancel
Save