chore: fix too big margin in tooltips (#2438)

This commit is contained in:
macqbat 2022-12-20 14:41:30 +01:00 committed by GitHub
parent e3ff090915
commit a830e4729f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 6 deletions

View File

@ -31,6 +31,19 @@ describe('markets table', { tags: '@smoke' }, () => {
cy.getByTestId('taker-fee').should('contain.text', '%');
cy.getByTestId('market-volume').should('not.be.empty');
cy.getByTestId('market-name').should('not.be.empty');
cy.getByTestId('trading-mode-col')
.contains('Monitoring auction - liquidity')
.eq(0)
.realHover();
cy.get('[data-testid="trading-mode-tooltip"] p').should('have.class', '');
cy.get(
'[data-testid="market-trading-mode"] [data-testid="item-value"]'
).realHover();
cy.get('[data-testid="trading-mode-tooltip"] p').should(
'have.class',
'mb-4'
);
});
it('able to select market from dropdown', () => {

View File

@ -1,12 +1,12 @@
import type { ReactNode } from 'react';
import classNames from 'classnames';
import { useEnvironment } from '@vegaprotocol/environment';
import { t } from '@vegaprotocol/react-helpers';
import * as Schema from '@vegaprotocol/types';
import { ExternalLink } from '@vegaprotocol/ui-toolkit';
import { createDocsLinks } from '@vegaprotocol/react-helpers';
import { MarketDataGrid } from './market-data-grid';
import type { ReactNode } from 'react';
import { useEnvironment } from '@vegaprotocol/environment';
type TradingModeTooltipProps = {
tradingMode: Schema.MarketTradingMode | null;
trigger: Schema.AuctionTrigger | null;
@ -32,7 +32,7 @@ export const TradingModeTooltip = ({
case Schema.MarketTradingMode.TRADING_MODE_OPENING_AUCTION: {
return (
<section data-testid="trading-mode-tooltip">
<p className="mb-4">
<p className={classNames({ 'mb-4': Boolean(compiledGrid) })}>
<span>
{t(
'This new market is in an opening auction to determine a fair mid-price before starting continuous trading.'
@ -55,7 +55,7 @@ export const TradingModeTooltip = ({
case Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY: {
return (
<section data-testid="trading-mode-tooltip">
<p className="mb-4">
<p className={classNames({ 'mb-4': Boolean(compiledGrid) })}>
<span>
{t(
'This market is in auction until it reaches sufficient liquidity.'
@ -79,7 +79,7 @@ export const TradingModeTooltip = ({
case Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE: {
return (
<section data-testid="trading-mode-tooltip">
<p className="mb-4">
<p className={classNames({ 'mb-4': Boolean(compiledGrid) })}>
<span>
{t('This market is in auction due to high price volatility.')}
</span>{' '}