Browse Source

chore(nc-gui): hide navigation arrows when form was submitted

pull/3669/head
braks 2 years ago committed by Raju Udava
parent
commit
f9be31038d
  1. 2
      packages/nc-gui/assets/style.scss
  2. 45
      packages/nc-gui/pages/[projectType]/form/[viewId]/index/survey.vue

2
packages/nc-gui/assets/style.scss

@ -214,7 +214,7 @@ a {
}
&:hover::after {
@apply !border-0 transform scale-110 ring ring-accent;
@apply transform scale-110 ring ring-accent;
}
&:active::after {

45
packages/nc-gui/pages/[projectType]/form/[viewId]/index/survey.vue

@ -285,28 +285,31 @@ onMounted(() => {
</Transition>
</div>
<div
class="color-transition shadow-sm absolute bottom-18 right-1/2 transform translate-x-[50%] md:bottom-4 md:(right-12 transform-none) flex items-center bg-white border dark:bg-slate-500 rounded divide-x-1"
>
<a-tooltip title="Go to previous" :mouse-enter-delay="0.25" :mouse-leave-delay="0">
<button class="p-0.5 flex items-center group color-transition" @click="goPrevious">
<MdiChevronLeft :class="isFirst ? 'text-gray-300' : 'group-hover:text-accent'" class="text-2xl md:text-md" />
</button>
</a-tooltip>
<a-tooltip
:title="v$.localState[field.title]?.$error ? v$.localState[field.title].$errors[0].$message : 'Go to next'"
:mouse-enter-delay="0.25"
:mouse-leave-delay="0"
<Transition name="fade">
<div
v-if="!submitted"
class="color-transition shadow-sm absolute bottom-18 right-1/2 transform translate-x-[50%] md:bottom-4 md:(right-12 transform-none) flex items-center bg-white border dark:bg-slate-500 rounded divide-x-1"
>
<button class="p-0.5 flex items-center group color-transition" @click="goNext">
<MdiChevronRight
:class="isLast || v$.localState[field.title]?.$error ? 'text-gray-300' : 'group-hover:text-accent'"
class="text-2xl md:text-md"
/>
</button>
</a-tooltip>
</div>
<a-tooltip title="Go to previous" :mouse-enter-delay="0.25" :mouse-leave-delay="0">
<button class="p-0.5 flex items-center group color-transition" @click="goPrevious">
<MdiChevronLeft :class="isFirst ? 'text-gray-300' : 'group-hover:text-accent'" class="text-2xl md:text-md" />
</button>
</a-tooltip>
<a-tooltip
:title="v$.localState[field.title]?.$error ? v$.localState[field.title].$errors[0].$message : 'Go to next'"
:mouse-enter-delay="0.25"
:mouse-leave-delay="0"
>
<button class="p-0.5 flex items-center group color-transition" @click="goNext">
<MdiChevronRight
:class="isLast || v$.localState[field.title]?.$error ? 'text-gray-300' : 'group-hover:text-accent'"
class="text-2xl md:text-md"
/>
</button>
</a-tooltip>
</div>
</Transition>
</div>
</template>

Loading…
Cancel
Save