Browse Source

refactor(gui-v2): remove footer overlay

Signed-off-by: Pranav C <pranavxc@gmail.com>
pull/3123/head
Pranav C 2 years ago
parent
commit
7cc2294fb1
  1. 6
      packages/nc-gui-v2/components/smartsheet/Gallery.vue
  2. 13
      packages/nc-gui-v2/layouts/default.vue
  3. 10
      packages/nc-gui-v2/pages/[projectType]/[projectId]/index.vue
  4. 7
      packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index.vue

6
packages/nc-gui-v2/components/smartsheet/Gallery.vue

@ -50,10 +50,9 @@ const attachments = (record: any): Array<Attachment> => {
}
</script>
<!-- TODO: Fix scrolling -->
<template>
<div class="flex flex-col h-full min-h-0 w-full">
<div class="nc-gallery-container min-h-0 flex-1 grid grid-cols-4 gap-4 my-4 px-3">
<div class="flex flex-col h-full w-full">
<div class="nc-gallery-container min-h-0 flex-1 grid grid-cols-4 gap-4 my-4 px-3 overflow-auto">
<div v-for="(record, recordIndex) in data" :key="recordIndex" class="flex flex-col">
<a-card hoverable class="!rounded-lg h-full">
<template #cover>
@ -97,7 +96,6 @@ const attachments = (record: any): Array<Attachment> => {
<style scoped>
.nc-gallery-container {
height: calc(100vh - 250px);
overflow: auto;
}
</style>

13
packages/nc-gui-v2/layouts/default.vue

@ -1,14 +1,11 @@
<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
import { useHead, useRoute } from '#imports'
import { useProject } from '~/composables'
const route = useRoute()
const { te, t } = useI18n()
const { isSharedBase } = useProject()
useHead({
title: route.meta?.title && te(route.meta.title as string) ? `${t(route.meta.title as string)} | NocoDB` : 'NocoDB',
})
@ -21,7 +18,7 @@ export default {
</script>
<template>
<div class="w-full h-full" :class="{ 'mb-10': isSharedBase }">
<div class="w-full h-full">
<teleport v-if="$slots.sidebar" to="#nc-sidebar-left">
<slot name="sidebar" />
</teleport>
@ -29,13 +26,5 @@ export default {
<a-layout-content>
<slot />
</a-layout-content>
<div v-if="isSharedBase" class="bg-white w-[100vw] h-[20px] fixed bottom-0 left-0 z-99 flex px-2 align-center border-t-1">
<div class="flex-1" />
<img src="~/public/favicon-32.png" class="h-[15px] mr-1" />
<a href="https://github.com/nocodb/nocodb" target="_blank" class="text-xs text-primary/100">
Powered by
<span class="font-bold"> NocoDB </span>
</a>
</div>
</div>
</template>

10
packages/nc-gui-v2/pages/[projectType]/[projectId]/index.vue

@ -58,12 +58,20 @@ await loadTables()
>
<div style="height: var(--header-height)" class="flex items-center !bg-primary text-white px-1 pl-5 gap-2">
<div
v-if="isOpen"
v-if="isOpen && !isSharedBase"
class="w-[40px] min-w-[40px] transition-all duration-200 p-1 cursor-pointer transform hover:scale-105"
@click="navigateTo('/')"
>
<img alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
</div>
<a
v-if="isOpen && isSharedBase"
class="w-[40px] min-w-[40px] transition-all duration-200 p-1 cursor-pointer transform hover:scale-105"
href="https://github.com/nocodb/nocodb"
target="_blank"
>
<img alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
</a>
<div v-if="isSharedBase">
<template v-if="isOpen">

7
packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index.vue

@ -17,8 +17,6 @@ const { tabs, activeTabIndex, activeTab, closeTab } = useTabs()
const { isUIAllowed } = useUIPermission()
const { isSharedBase } = useProject()
const tableCreateDialog = ref(false)
const airtableImportDialog = ref(false)
const quickImportDialog = ref(false)
@ -45,7 +43,7 @@ const icon = (tab: TabItem) => {
</script>
<template>
<div class="h-full w-full nc-container pt-[9px]" :class="{ shared: isSharedBase }">
<div class="h-full w-full nc-container pt-[9px]">
<div class="h-full w-full flex flex-col">
<div>
<a-tabs v-model:activeKey="activeTabIndex" class="nc-root-tabs" type="editable-card" @edit="closeTab">
@ -160,9 +158,6 @@ const icon = (tab: TabItem) => {
.nc-container {
height: calc(100vh - var(--header-height));
flex: 1 1 100%;
&.shared {
height: calc(100vh - var(--header-height) - 20px);
}
}
:deep(.nc-root-tabs) {

Loading…
Cancel
Save