- client: Use the same tooltip style everywhere
Close #1866
Squashed commit of the following:
commit 3347832caa33b01a0155b212987f02dc4824ab08
Merge: 7766502d d794b11e
Author: ArtemBaskal <a.baskal@adguard.com>
Date: Fri Jul 17 15:12:45 2020 +0300
Merge branch 'master' into fix/1866
commit 7766502d4a904ad0a4d240481f7eabf0e25cfb62
Author: ArtemBaskal <a.baskal@adguard.com>
Date: Fri Jul 17 12:16:59 2020 +0300
Fix icon color classes
commit 90191bf74b5eb1855c733c226f7acb4e906c7ad9
Author: ArtemBaskal <a.baskal@adguard.com>
Date: Fri Jul 17 11:46:22 2020 +0300
Use logs icons, use pointer cursor, fix review markup formatting
commit 0ba50fcd956101f5054ce38c2329df3e8abdfcd2
Author: ArtemBaskal <a.baskal@adguard.com>
Date: Thu Jul 16 18:05:30 2020 +0300
Use help cursor on tooltips
commit bf4e14afe69f874d29be73d8cd4cfbe240ca0304
Author: ArtemBaskal <a.baskal@adguard.com>
Date: Thu Jul 16 17:41:47 2020 +0300
Use tooltip in logs, rename tooltip classes
commit 00568fdc8e8484c5bae67c51ee8189a3a558e219
Author: ArtemBaskal <a.baskal@adguard.com>
Date: Thu Jul 16 17:01:49 2020 +0300
- client: Use the same tooltip style everywhere
This commit is contained in:
@@ -154,27 +154,23 @@ const Table = (props) => {
|
||||
headerClassName: 'logs__text',
|
||||
},
|
||||
{
|
||||
Header: () => {
|
||||
const plainSelected = classNames('cursor--pointer', {
|
||||
'icon--selected': !isDetailed,
|
||||
});
|
||||
|
||||
const detailedSelected = classNames('cursor--pointer', {
|
||||
'icon--selected': isDetailed,
|
||||
});
|
||||
|
||||
Header: function Header() {
|
||||
return <div className="d-flex justify-content-between">
|
||||
{t('client_table_header')}
|
||||
{<span>
|
||||
<svg
|
||||
className={`icons icon--small icon--active mr-2 cursor--pointer ${plainSelected}`}
|
||||
className={classNames('icons icon--24 icon--green mr-2 cursor--pointer', {
|
||||
'icon--selected': !isDetailed,
|
||||
})}
|
||||
onClick={() => toggleDetailedLogs(false)}
|
||||
>
|
||||
<title><Trans>compact</Trans></title>
|
||||
<use xlinkHref='#list' />
|
||||
</svg>
|
||||
<svg
|
||||
className={`icons icon--small icon--active cursor--pointer ${detailedSelected}`}
|
||||
className={classNames('icons icon--24 icon--green cursor--pointer', {
|
||||
'icon--selected': isDetailed,
|
||||
})}
|
||||
onClick={() => toggleDetailedLogs(true)}
|
||||
>
|
||||
<title><Trans>default</Trans></title>
|
||||
@@ -261,12 +257,12 @@ const Table = (props) => {
|
||||
getPaginationProps={() => ({ className: 'custom-pagination custom-pagination--padding' })}
|
||||
getTbodyProps={() => ({ className: 'd-block' })}
|
||||
previousText={
|
||||
<svg className="icons icon--small icon--gray w-100 h-100 cursor--pointer">
|
||||
<svg className="icons icon--24 icon--gray w-100 h-100 cursor--pointer">
|
||||
<title><Trans>previous_btn</Trans></title>
|
||||
<use xlinkHref="#arrow-left" />
|
||||
</svg>}
|
||||
nextText={
|
||||
<svg className="icons icon--small icon--gray w-100 h-100 cursor--pointer">
|
||||
<svg className="icons icon--24 icon--gray w-100 h-100 cursor--pointer">
|
||||
<title><Trans>next_btn</Trans></title>
|
||||
<use xlinkHref="#arrow-right" />
|
||||
</svg>}
|
||||
|
||||
Reference in New Issue
Block a user