Replace carret with buffet icon

Signed-off-by: Virginie Ky <virginie.ky@gmail.com>
This commit is contained in:
Virginie Ky 2020-02-27 14:39:10 +01:00
parent 81cc30680a
commit 24c07727da
5 changed files with 18 additions and 36 deletions

View File

@ -63,7 +63,10 @@ function TableHeader({ headers, isBulkable }) {
{header.label} {header.label}
{sortBy === header.name && ( {sortBy === header.name && (
<Arrow className={`${sortOrder === 'ASC' && 'isAsc'}`} /> <Arrow
fill="#212529"
isUp={sortOrder === 'ASC' && 'isAsc'}
/>
)} )}
</span> </span>
</th> </th>

View File

@ -1,6 +1,7 @@
/* eslint-disable */ /* eslint-disable */
import React from 'react';
import styled, { css } from 'styled-components'; import styled, { css } from 'styled-components';
import { Carret } from '@buffetjs/icons';
const Table = styled.table` const Table = styled.table`
border-radius: 3px; border-radius: 3px;
@ -94,21 +95,14 @@ const TableRow = styled.tr`
} }
`; `;
const Arrow = styled.div` const Arrow = styled(props => <Carret {...props} />)`
&:after { margin-left: 5px;
content: '\f0d8'; ${({ isUp }) =>
font-family: 'FontAwesome'; isUp &&
font-size: 13px; `
font-weight: 600;
position: absolute;
top: 0px;
right: -12px;
}
&.isAsc {
&:after {
transform: rotateZ(180deg); transform: rotateZ(180deg);
}
} `}
`; `;
const Truncate = styled.div``; const Truncate = styled.div``;

View File

@ -1,12 +1,11 @@
import React, { forwardRef } from 'react'; import React, { forwardRef } from 'react';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Grab } from '@buffetjs/icons'; import { Carret, Grab } from '@buffetjs/icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import pluginId from '../../pluginId'; import pluginId from '../../pluginId';
import PreviewCarret from '../PreviewCarret'; import PreviewCarret from '../PreviewCarret';
import BannerWrapper from './BannerWrapper'; import BannerWrapper from './BannerWrapper';
import CarretTop from './CarretTop';
/* eslint-disable jsx-a11y/no-static-element-interactions */ /* eslint-disable jsx-a11y/no-static-element-interactions */
@ -45,7 +44,7 @@ const Banner = forwardRef(
{isDragging && <PreviewCarret isComponent />} {isDragging && <PreviewCarret isComponent />}
<> <>
<span className="img-wrapper" style={{ display }}> <span className="img-wrapper" style={{ display }}>
<CarretTop isOpen={isOpen} hasErrors={hasErrors} /> <Carret isOpen={isOpen} hasErrors={hasErrors} />
</span> </span>
<FormattedMessage <FormattedMessage

View File

@ -2,10 +2,9 @@ import React, { useState } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import { Carret } from '@buffetjs/icons';
import getTrad from '../../utils/getTrad'; import getTrad from '../../utils/getTrad';
import Carret from '../../icons/Carret';
import DropdownButton from '../DropdownButton'; import DropdownButton from '../DropdownButton';
import DropdownSection from '../DropdownSection'; import DropdownSection from '../DropdownSection';
import SortList from '../SortList'; import SortList from '../SortList';
@ -37,7 +36,7 @@ const SortPicker = ({ onChange, value }) => {
<Wrapper> <Wrapper>
<DropdownButton onClick={hangleToggle} isActive={isOpen}> <DropdownButton onClick={hangleToggle} isActive={isOpen}>
<FormattedMessage id={getTrad('sort.label')} /> <FormattedMessage id={getTrad('sort.label')} />
<Carret isUp={!isOpen} /> <Carret fill={isOpen ? '#007EFF' : '#292b2c'} />
</DropdownButton> </DropdownButton>
<DropdownSection isOpen={isOpen}> <DropdownSection isOpen={isOpen}>
<SortList <SortList

View File

@ -1,13 +0,0 @@
import React from 'react';
const Carret = () => {
return (
<svg width="7" height="5" xmlns="http://www.w3.org/2000/svg">
<path
d="M0 .469c0 .127.043.237.13.33l3.062 3.28a.407.407 0 0 0 .616 0L6.87.8A.467.467 0 0 0 7 .468a.467.467 0 0 0-.13-.33A.407.407 0 0 0 6.563 0H.438A.407.407 0 0 0 .13.14.467.467 0 0 0 0 .468z"
fillRule="nonzero"
/>
</svg>
);
};
export default Carret;