➖ remove b-tooltip component

components/bsx/Offer/OfferTable.vue

@@ -82,11 +82,11 @@
  field="expirationBlock"
  :label="$t('offer.expiration')"
  sortable>
- <b-tooltip
+ <NeoTooltip
  v-if="!isExpired(props.row.expiration)"
  :label="calcExpirationDate(props.row.expiration)">
  {{ calcExpirationTime(props.row.expiration) }}
- </b-tooltip>
+ </NeoTooltip>
  <span v-else>
  {{ calcExpirationTime(props.row.expiration) }}
  </span>
@@ -99,7 +99,7 @@
  width="120"
  sortable>
  <div class="buttons">
- <b-tooltip
+ <NeoTooltip
  v-if="isOwner"
  :label="$t('offer.expired')"
  :active="calcExpirationTime(props.row.expiration) === 'expired'"
@@ -110,7 +110,7 @@
  icon-left="money-bill"
  :disabled="calcExpirationTime(props.row.expiration) === 'expired'"
  @click="tellFrens(props.row.caller, false)" />
- </b-tooltip>
+ </NeoTooltip>
  <b-button
  v-if="props.row.caller === accountId || isOwner"
  type="is-orange"
@@ -159,11 +159,13 @@ import { Offer } from './types'
 import OfferMixin from '@/utils/mixins/offerMixin'
 import PrefixMixin from '@/utils/mixins/prefixMixin'
 import { getKusamaAssetId } from '@/utils/api/bsx/query'
+import { NeoTooltip } from '@kodadot1/brick'
 
 const components = {
  Identity: () => import('@/components/identity/IdentityIndex.vue'),
  Money: () => import('@/components/bsx/format/TokenMoney.vue'),
  Pagination: () => import('@/components/rmrk/Gallery/Pagination.vue'),
+ NeoTooltip,
 }
 
 @Component({ components, filters: { formatDistanceToNow } })

components/common/IdentityForm.vue

@@ -4,11 +4,12 @@
  <form>
  <p class="title is-size-3">
  {{ $i18n.t('identity.set') }}
- <b-tooltip
+ <NeoTooltip
  :label="$i18n.t('identity.fundsReserve')"
- position="is-bottom">
+ position="bottom"
+ multiline>
  <NeoIcon icon="info-circle" pack="fas" />
- </b-tooltip>
+ </NeoTooltip>
  </p>
 
  <p v-if="accountId" class="subtitle is-size-6">
@@ -89,7 +90,7 @@ import { notificationTypes, showNotification } from '@/utils/notification'
 import { onApiConnect } from '@kodadot1/sub-api'
 import { hexToString, isHex } from '@polkadot/util'
 import { Data } from '@polkadot/types'
-import { NeoIcon } from '@kodadot1/brick'
+import { NeoIcon, NeoTooltip } from '@kodadot1/brick'
 
 const Auth = defineAsyncComponent(() => import('@/components/shared/Auth.vue'))
 const BasicInput = defineAsyncComponent(

components/gallery/GalleryItemAction/GalleryItemActionType/GalleryItemBuy.vue

@@ -16,8 +16,8 @@
  <NeoTooltip
  v-if="!active"
  :active="disabled"
- append-to-body
- :label="$t('tooltip.notEnoughBalance')">
+ :label="$t('tooltip.notEnoughBalance')"
+ multiline>
  <NeoButton
  :label="label"
  size="large"

components/gallery/GalleryItemAction/GalleryItemActionType/GalleryItemOffer.vue

@@ -21,12 +21,12 @@
  <NeoTooltip
  v-if="active && !confirm"
  :active="insufficientBalance || offerPriceInvalid"
- append-to-body
  :label="
  insufficientBalance
  ? $t('tooltip.notEnoughBalance')
  : $t('tooltip.invalidAmount')
- ">
+ "
+ multiline>
  <NeoButton
  :disabled="disabledConfirmBtn"
  label="Confirm 1/2"

components/gallery/GalleryItemAction/GalleryItemActionType/GalleryItemRelist.vue

@@ -6,8 +6,8 @@
  <template #action>
  <NeoTooltip
  :active="isListDisabled"
- append-to-body
- :label="$t('tooltip.emptyListAmount')">
+ :label="$t('tooltip.emptyListAmount')"
+ multiline>
  <NeoButton
  :label="
  isListed

components/gallery/GalleryItemAction/GalleryItemActionType/GalleryItemTransfer.vue

@@ -6,7 +6,7 @@
  <template #action>
  <NeoTooltip
  :active="isTransferButtonDisabled"
- append-to-body
+ multiline
  position="bottom"
  :label="$t('tooltip.emptyAddress')">
  <NeoButton

components/gallery/GalleryItemTabsPanel/GalleryItemOffers.vue

@@ -110,8 +110,7 @@ const isOwner = computed(() => checkOwner(dprops.account, accountId.value))
 const isActive = (row) => row.status === OfferStatusType.ACTIVE
 
 const isActiveAndNotExpired = (row) =>
- isActive(row) &&
- expirationTime(row.expiration) !== 'Expired'
+ isActive(row) && expirationTime(row.expiration) !== 'Expired'
 
 const { accountId } = useAuth()
 

components/navbar/CreateDropdown.vue

@@ -7,48 +7,48 @@
  </div>
  </template>
  <b-dropdown-item has-link>
- <b-tooltip
- position="is-left"
+ <NeoTooltip
+ position="left"
  :label="$t('createDropdown.start')"
  class="navbar-item-tooltip">
  <nuxt-link data-cy="classic" :to="`/${urlPrefix}/create`">
  {{ $t('classic') }}
  </nuxt-link>
- </b-tooltip>
+ </NeoTooltip>
  </b-dropdown-item>
 
  <b-dropdown-item has-link>
- <b-tooltip
+ <NeoTooltip
  v-if="chain === 'bsx' && accountId"
- position="is-left"
+ position="left"
  :label="$t('createDropdown.waifu')"
  class="navbar-item-tooltip">
  <nuxt-link data-cy="waifu" :to="`/${urlPrefix}/waifu`">
  {{ $t('navbar.create.waifu') }}
  </nuxt-link>
- </b-tooltip>
+ </NeoTooltip>
  </b-dropdown-item>
  <template v-if="chain === 'rmrk'">
  <b-dropdown-item has-link>
- <b-tooltip
- position="is-left"
+ <NeoTooltip
+ position="left"
  :label="$t('createDropdown.simplifiedNft')"
  class="navbar-item-tooltip">
  <nuxt-link data-cy="simple" :to="`/${urlPrefix}/mint`">
  {{ $t('simple') }}
  </nuxt-link>
- </b-tooltip>
+ </NeoTooltip>
  </b-dropdown-item>
  </template>
  <b-dropdown-item v-if="redesign" has-link>
- <b-tooltip
- position="is-left"
+ <NeoTooltip
+ position="left"
  :label="$t('createDropdown.massmint')"
  class="navbar-item-tooltip">
  <nuxt-link data-cy="massmint" :to="`/${urlPrefix}/massmint`">
  {{ $t('multipleNFTS') }}
  </nuxt-link>
- </b-tooltip>
+ </NeoTooltip>
  </b-dropdown-item>
  </b-dropdown>
 
@@ -87,6 +87,7 @@
 
 <script lang="ts" setup>
 import MobileExpandableSection from '@/components/navbar/MobileExpandableSection.vue'
+import { NeoTooltip } from '@kodadot1/brick'
 
 defineProps<{
  chain: string

components/rmrk/Create/DropUpload.vue

@@ -55,14 +55,12 @@
 
 <script lang="ts">
 import { Component, Emit, Prop, Ref, Vue } from 'nuxt-property-decorator'
-import Tooltip from '@/components/shared/Tooltip.vue'
 import MediaResolver from '@/components/media/MediaResolver.vue'
 import { MAX_UPLOADED_FILE_SIZE } from '@/utils/constants'
 import { NeoIcon } from '@kodadot1/brick'
 
 @Component({
  components: {
- Tooltip,
  MediaResolver,
  NeoIcon,
  },

components/rmrk/Create/SimpleMint.vue

@@ -231,7 +231,6 @@ const components = {
  Auth: () => import('@/components/shared/Auth.vue'),
  MetadataUpload: () => import('./DropUpload.vue'),
  PasswordInput: () => import('@/components/shared/PasswordInput.vue'),
- Tooltip: () => import('@/components/shared/Tooltip.vue'),
  Support,
  AttributeTagInput: () => import('./AttributeTagInput.vue'),
  BalanceInput: () => import('@/components/shared/BalanceInput.vue'),

components/rmrk/Gallery/EmotionList.vue

@@ -6,15 +6,15 @@
  type="is-outlined"
  class="emoji-box mb-2"
  @click="$emit('selected', emoji.parsed)">
- <b-tooltip append-to-body>
+ <NeoTooltip>
  {{ emoji.parsed }}
  <span class="ml-1">{{ emoji.count }}</span>
  <template #content>
  <div v-for="issuer in emoji.issuers" :key="issuer">
  <Identity :address="issuer" />
  </div>
  </template>
- </b-tooltip>
+ </NeoTooltip>
  </b-button>
 
  <b-button
@@ -32,7 +32,7 @@ import orderBy from 'lodash/orderBy'
 
 import { Emotion } from '../service/scheme'
 import EmotionModal from './EmotionModal.vue'
-import { NeoIcon } from '@kodadot1/brick'
+import { NeoIcon, NeoTooltip } from '@kodadot1/brick'
 
 const issuerId = (emotion: Emotion) => emotion.caller
 
@@ -51,6 +51,7 @@ interface Emoji {
  components: {
  Identity: () => import('@/components/identity/IdentityIndex.vue'),
  NeoIcon,
+ NeoTooltip,
  },
 })
 export default class EmotionList extends Vue {

components/rmrk/Gallery/History.vue

@@ -102,14 +102,11 @@
  cell-class="short-identity__table"
  field="Date"
  label="Date">
- <b-tooltip
- :label="props.row.Date"
- position="is-right"
- append-to-body>
+ <NeoTooltip :label="props.row.Date" position="right" multiline>
  <BlockExplorerLink
  :block-id="props.row.Block"
  :text="props.row.Time" />
- </b-tooltip>
+ </NeoTooltip>
  </b-table-column>
  </b-table>
  </div>
@@ -140,14 +137,15 @@ import {
 import shortAddress from '@/utils/shortAddress'
 
 import { Interaction as EventInteraction } from '../service/scheme'
-import { NeoIcon } from '@kodadot1/brick'
+import { NeoIcon, NeoTooltip } from '@kodadot1/brick'
 
 const components = {
  Identity: () => import('@/components/identity/IdentityIndex.vue'),
  Pagination: () => import('@/components/rmrk/Gallery/Pagination.vue'),
  BlockExplorerLink: () => import('@/components/shared/BlockExplorerLink.vue'),
  CommonTokenMoney: () => import('@/components/shared/CommonTokenMoney.vue'),
  NeoIcon,
+ NeoTooltip,
 }
 
 type TableRowItem = {

components/rmrk/Gallery/Holder/Holder.vue

@@ -115,11 +115,11 @@
  field="Timestamp"
  :label="dateHeaderLabel"
  sortable>
- <b-tooltip :label="props.row.Date" position="is-right">
+ <NeoTooltip :label="props.row.Date" position="right">
  <BlockExplorerLink
  :text="props.row.Time"
  :block-id="props.row.Block" />
- </b-tooltip>
+ </NeoTooltip>
  </b-table-column>
  <template slot="detail" slot-scope="props">
  <tr v-for="item in props.row.Items" :key="item.Item.id">
@@ -149,9 +149,9 @@
  {{ item.Percentage | toPercent('-') }}
  </td>
  <td v-show="columnsVisible['Date'].display">
- <b-tooltip :label="item.Date" position="is-right">
+ <NeoTooltip :label="item.Date" position="right">
  <BlockExplorerLink :text="item.Time" :block-id="item.Block" />
- </b-tooltip>
+ </NeoTooltip>
  </td>
  </tr>
  </template>
@@ -174,12 +174,13 @@ import PrefixMixin from '@/utils/mixins/prefixMixin'
 import { parseDate, parsePriceForItem } from './helper'
 import { Interaction as EventInteraction } from '../../service/scheme'
 import { usePreferencesStore } from '@/stores/preferences'
-import { NeoCheckbox, NeoIcon } from '@kodadot1/brick'
+import { NeoCheckbox, NeoIcon, NeoTooltip } from '@kodadot1/brick'
 
 const components = {
  Identity: () => import('@/components/identity/IdentityIndex.vue'),
  BlockExplorerLink: () => import('@/components/shared/BlockExplorerLink.vue'),
  NeoIcon,
+ NeoTooltip,
  NeoCheckbox,
 }
 

components/rmrk/Gallery/Layout.vue

@@ -1,7 +1,7 @@
 <template>
  <div class="content is-hidden-mobile">
  <b-field :position="position">
- <b-tooltip :label="$t('tooltip.largeDisplay')">
+ <NeoTooltip :label="$t('tooltip.largeDisplay')">
  <b-radio-button
  v-model="preferenceLayout"
  type="is-primary"
@@ -13,8 +13,8 @@
  <NeoIcon icon="th-large" />
  </span>
  </b-radio-button>
- </b-tooltip>
- <b-tooltip :label="$t('tooltip.smallDisplay')">
+ </NeoTooltip>
+ <NeoTooltip :label="$t('tooltip.smallDisplay')">
  <b-radio-button
  v-model="preferenceLayout"
  type="is-primary"
@@ -26,7 +26,7 @@
  <NeoIcon icon="th" />
  </span>
  </b-radio-button>
- </b-tooltip>
+ </NeoTooltip>
  </b-field>
  </div>
 </template>
@@ -35,9 +35,9 @@
 import { Component, Prop, Vue } from 'nuxt-property-decorator'
 import { RmrkType } from '@/components/rmrk/service/scheme'
 import { usePreferencesStore } from '@/stores/preferences'
-import { NeoIcon } from '@kodadot1/brick'
+import { NeoIcon, NeoTooltip } from '@kodadot1/brick'
 
-@Component({ components: { NeoIcon } })
+@Component({ components: { NeoIcon, NeoTooltip } })
 export default class Layout extends Vue {
  @Prop({ default: 'nftDetail' }) public type!: string
  @Prop({ default: 'rmrk/detail' }) public link!: string