Изменить стиль всплывающей подсказки - recharts - PullRequest
Новая
       9

Изменить стиль всплывающей подсказки - recharts

0 голосов
/ 01 октября 2018

Я создал настраиваемую подсказку для своей диаграммы, которую я реализовал с помощью повторных графиков.Я хотел бы изменить его стиль, но не могу удалить лишние пробелы между строками.Я попытался изменить высоту строки, отступы и поля, которые убрали бы пробел, но ничего не получалось.

enter image description here

<div className='customTooltip'>
                    <h2 className='tooltipLabel'>{e.payload[0].payload.initiatorUsername}</h2>
                    <i className='tooltipTitle'>{e.payload[0].payload.title}</i>
                    <div className='tooltipContent'>
                        <p>Request startTime:</p>
                        <p>Approver name:</p>
                        <p>Approver Title</p>
                        <p>Approved Time: {moment.unix(e.payload[0].payload.time).format('MMM Do YYYY, h:mm:ss')}</p>
                    </div>
                </div>

.recharts-tooltip-wrapper {
  .customTooltip {
    margin: 0;
    line-height: 5px;
    border: 1px solid #f5f5f5;
    background-color: rgba(255, 255, 255, 255);
    padding-bottom: 0%;

    .tooltipTitle {
      margin: -10px;
      color: #666;
      top:5px;
    }
  }
}

какое свойство стиля поможет мне достичь этого?

1 Ответ

0 голосов
/ 01 октября 2018

Похоже, для элементов <p> определены поля.

.recharts-tooltip-wrapper { .customTooltip { p { margin:0; } } }

...