fk-react-ui-components
Version:
Step 1 : Create a file in [ Seeds / Plants / Trees ] <br> Step 2 : It should export an Object with component name and story Component [Refer other components] <br> Step 3 : Story Component should return a react component <br> Step 3 : Created file should
63 lines (60 loc) • 1.57 kB
JavaScript
/**
* Created by manoraj.k on 17/08/17.
*/
import React from "react";
import styled from "styled-components";
import { colors } from "../../colorCodes";
export const SimpleSearchIcon = styled.span`
position:absolute;
right: 10px;
top: 50%;
-webkit-transform: translateY(-54%);
-ms-transform: translateY(-54%);
transform: translateY(-54%);
cursor : pointer;
&.active-icon-color {
color : ${colors.brandBlue}
}
&.inprogress-icon-color {
color : ${colors.inprogressIcon}
}
`;
export const SearchTypeList = styled.ul`
list-style: none;
padding: 0px;
width: 100%;
float: left;
position:absolute;
margin: 0px;
border-radius: 4px;
background-color: #ffffff;
box-shadow: 0 1px 4px 0 rgba(63, 63, 63, 0.3);
border: 1px solid rgba(0, 0, 0, 0.2);
z-index:1;
.search-type-list-item {
background: ${colors.whiteText};
padding: 10px;
font-family: Arial;
cursor: pointer;
font-size: 12px;
&:hover {
background-color: rgba(234, 234, 234, 0.5);
}
&:first-child {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
&:last-child {
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
a {
text-decoration: none;
color: ${colors.headingColor};
.id-type {
color: ${colors.categoryTobeSelectedColor}
}
}
}
`;
//# sourceMappingURL=SearchWithOptions.js.map