IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web:components:Link: added opacity property for arrowDropdown, in addition to 6b43f64a47

Browse Source
This commit is contained in:
Daniil Senkiv 2019-07-08 14:09:27 +03:00
parent 7e1eeb9766
commit c8ad7835d2
1 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
web/ASC.Web.Components/src/components/link/index.js
View File

@ -1,4 +1,4 @@
import React, {useState} from 'react';
import React, {useState, useRef, useEffect} from 'react';
import styled, { css } from 'styled-components';
import PropTypes from 'prop-types';
import { Icons } from '../icons'
@ -16,6 +16,11 @@ const getDropdownColor = color => {
}
}
const opacityCss = css `
opacity: ${props =>
(props.isSemitransparent && '0.5')};
`;
const colorCss = css`
color: ${props =>
(props.color === 'black' && '#333333') ||
@ -42,6 +47,7 @@ const Caret = styled(Icons.ExpanderDownIcon)`
width: 10px;
margin-left: 5px;
margin-top: -4px;
${opacityCss};
`;
const StyledLink = styled(SimpleLink).attrs((props) => ({
@ -51,6 +57,7 @@ const StyledLink = styled(SimpleLink).attrs((props) => ({
title: props.title
}))`
${colorCss};
${opacityCss};
font-size: ${props => props.fontSize}px;
cursor: pointer;
position: relative;
@ -102,13 +109,6 @@ ${props => (props.isTextOverflow &&
`)
}
${props => (props.isSemitransparent
&&
css`
opacity: 0.5;
`)
}
`;
const Link = props => {
@ -119,7 +119,7 @@ const Link = props => {
onMouseEnter={() => {props.dropdownType === 'appearDottedAfterHover' && toggle(!isHovered)}}
onMouseLeave={() => {props.dropdownType === 'appearDottedAfterHover' && toggle(!isHovered)}}>
<StyledLink {...props} />
{(props.dropdownType === 'alwaysDotted' || (isHovered && props.dropdownType === 'appearDottedAfterHover')) && <Caret size='small' isfill={true} color={getDropdownColor(props.color)} /> }
{(props.dropdownType === 'alwaysDotted' || (isHovered && props.dropdownType === 'appearDottedAfterHover')) && <Caret {...props} size='small' isfill={true} color={getDropdownColor(props.color)} /> }
</span>
);
}