How to use the darken function from polished
Find comprehensive JavaScript polished.darken code examples handpicked from public code repositorys.
48 49 50 51 52 53 54 55 56 57
}, function (_a) { var theme = _a.theme; return theme.white; }, function (_a) { var theme = _a.theme; return polished_1.darken(0.1, theme.red1); }); var Web3StatusConnect = styled_components_1["default"](Web3StatusGeneric)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n color: ", ";\n font-weight: 500;\n\n :hover,\n :focus {\n border: 1px solid ", ";\n color: ", ";\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n color: ", ";\n font-weight: 500;\n\n :hover,\n :focus {\n border: 1px solid ", ";\n color: ", ";\n }\n\n ", "\n"])), function (_a) { var theme = _a.theme;
1
0
1
+ 11 other calls in file
32 33 34 35 36 37 38 39 40 41
}, function (_a) { var selected = _a.selected; return (selected ? 'none' : '0px 6px 10px rgba(0, 0, 0, 0.075)'); }, function (_a) { var selected = _a.selected, theme = _a.theme; return (selected ? theme.bg2 : polished_1.darken(0.05, theme.primary1)); }); var LabelRow = styled_components_1["default"].div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n align-items: center;\n color: ", ";\n font-size: 0.75rem;\n line-height: 1rem;\n padding: 0.75rem 1rem 0 1rem;\n span:hover {\n cursor: pointer;\n color: ", ";\n }\n"], ["\n ", "\n align-items: center;\n color: ", ";\n font-size: 0.75rem;\n line-height: 1rem;\n padding: 0.75rem 1rem 0 1rem;\n span:hover {\n cursor: pointer;\n color: ", ";\n }\n"])), function (_a) { var theme = _a.theme; return theme.flexRowNoWrap;
1
0
1
54 55 56 57 58 59 60 61 62 63
";\n }\n\n input {\n width: 100%;\n height: 100%;\n border: 0px;\n border-radius: 2rem;\n }\n"])), function (_a) { var theme = _a.theme, active = _a.active, warning = _a.warning; return active && "1px solid " + (warning ? theme.red1 : theme.primary1); }, function (_a) { var theme = _a.theme, active = _a.active, warning = _a.warning; return active && "1px solid " + (warning ? polished_1.darken(0.1, theme.red1) : polished_1.darken(0.1, theme.primary1)); }); var SlippageEmojiContainer = styled_components_1["default"].span(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n color: #f3841e;\n ", "\n"], ["\n color: #f3841e;\n ", "\n"])), function (_a) { var theme = _a.theme;
1
0
1
28 29 30 31 32 33 34 35 36 37
exports.HoverCard = styled_components_1["default"](Card_1["default"])(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border: 1px solid ", ";\n :hover {\n border: 1px solid ", ";\n }\n"], ["\n border: 1px solid ", ";\n :hover {\n border: 1px solid ", ";\n }\n"])), function (_a) { var theme = _a.theme; return theme.bg2; }, function (_a) { var theme = _a.theme; return polished_1.darken(0.06, theme.bg2); }); function MinimalPositionCard(_a) { var pair = _a.pair, _b = _a.showUnwrapped, showUnwrapped = _b === void 0 ? false : _b, border = _a.border; var account = hooks_1.useActiveWeb3React().account;
1
0
1
polished.transparentize is the most popular function in polished (17 examples)