Browse Source

fix(gui-v2): badge togglig issue

Signed-off-by: Pranav C <pranavxc@gmail.com>
pull/2860/head
Pranav C 2 years ago
parent
commit
4bbcb0f82b
  1. 2
      packages/nc-gui-v2/assets/style-v2.scss
  2. 27
      packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue

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

@ -94,5 +94,5 @@ html {
} }
.nc-badge { .nc-badge {
@apply relative after:(absolute top-[-2px] right-[-2px] w-[8px] h-[8px] rounded-full bg-primary content-['']); @apply relative after:(absolute top-[-2px] right-[-2px] w-[8px] h-[8px] rounded-full bg-primary content-[''] !z-20);
} }

27
packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue

@ -77,22 +77,17 @@ const onMove = (event: { moved: { newIndex: number } }) => {
<template> <template>
<a-dropdown :trigger="['click']"> <a-dropdown :trigger="['click']">
<a-button <div :class="{ 'nc-badge': isAnyFieldHidden }">
v-t="['c:fields']" <a-button v-t="['c:fields']" class="nc-fields-menu-btn nc-toolbar-btn text-xs" :disabled="isLocked" size="small">
class="nc-fields-menu-btn nc-toolbar-btn text-xs" <div class="flex align-center gap-1">
:class="{ 'nc-badge': isAnyFieldHidden }" <!-- <v-icon small class="mr-1" color="#777"> mdi-eye-off-outline </v-icon> -->
:disabled="isLocked" <MdiEyeIcon class="text-grey"></MdiEyeIcon>
size="small" <!-- Fields -->
> <span class="text-xs text-capitalize nc-fields-menu-btn">{{ $t('objects.fields') }}</span>
<div class="flex align-center gap-1"> <MdiMenuDownIcon class="text-grey"></MdiMenuDownIcon>
<!-- <v-icon small class="mr-1" color="#777"> mdi-eye-off-outline </v-icon> --> </div>
<MdiEyeIcon class="text-grey"></MdiEyeIcon> </a-button>
<!-- Fields --> </div>
<span class="text-xs text-capitalize nc-fields-menu-btn">{{ $t('objects.fields') }}</span>
<MdiMenuDownIcon class="text-grey"></MdiMenuDownIcon>
</div>
</a-button>
<template #overlay> <template #overlay>
<div class="pt-0 min-w-[280px] bg-white shadow" @click.stop> <div class="pt-0 min-w-[280px] bg-white shadow" @click.stop>
<div class="p-1" @click.stop> <div class="p-1" @click.stop>

Loading…
Cancel
Save