UNPKG

@stokr/components-library

Version:

STOKR - Components Library

38 lines (37 loc) 2.95 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.DonutChartValue = exports.DonutChartTrend = exports.DonutChartLabel = exports.DonutChartInfo = exports.Content = exports.Chart = void 0; var _styledComponents = _interopRequireDefault(require("styled-components")); function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } const Chart = exports.Chart = _styledComponents.default.div.withConfig({ displayName: "DonutChartstyles__Chart", componentId: "sc-mlj05j-0" })(["position:relative;display:block;max-width:320px;& > svg{width:100%;height:auto;}", ""], props => props.center && "\n margin: 0 auto;\n "); const thickness = '14px'; const Content = exports.Content = _styledComponents.default.div.withConfig({ displayName: "DonutChartstyles__Content", componentId: "sc-mlj05j-1" })(["display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;top:", ";left:", ";right:", ";bottom:", ";text-align:center;"], thickness, thickness, thickness, thickness); const DonutChartLabel = exports.DonutChartLabel = _styledComponents.default.p.withConfig({ displayName: "DonutChartstyles__DonutChartLabel", componentId: "sc-mlj05j-2" })(["font-family:'Open Sans';font-size:11px;line-height:16px;letter-spacing:2px;text-transform:uppercase;padding:4px 0;margin:0;", ""], props => props.strong && "\n font-weight: bold;\n "); const DonutChartValue = exports.DonutChartValue = _styledComponents.default.h3.withConfig({ displayName: "DonutChartstyles__DonutChartValue", componentId: "sc-mlj05j-3" })(["font-family:'Open Sans';font-weight:300;font-size:", ";line-height:58px;letter-spacing:2.4px;margin:0;padding:7px 0;margin-bottom:7px;"], _ref => { let { fontSize } = _ref; return fontSize ? "".concat(fontSize, "px") : '55px'; }); const DonutChartInfo = exports.DonutChartInfo = _styledComponents.default.p.withConfig({ displayName: "DonutChartstyles__DonutChartInfo", componentId: "sc-mlj05j-4" })(["font-family:'Open Sans';font-weight:300;font-size:22px;line-height:28px;letter-spacing:0.8px;margin:0;"]); const DonutChartTrend = exports.DonutChartTrend = _styledComponents.default.span.withConfig({ displayName: "DonutChartstyles__DonutChartTrend", componentId: "sc-mlj05j-5" })(["display:inline-block;margin-left:8px;&:before{content:'\\f1fc';font-family:'Ionicons';speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;text-rendering:auto;-moz-osx-font-smoothing:grayscale;font-size:12px;line-height:12px;display:inline-block;vertical-align:middle;margin-top:-1px;width:12px;height:12px;margin-right:8px;}", " ", ""], props => props.inc && "\n color: ".concat(props.theme.cProgressDone, ";\n\n &:before {\n content: '\\f3d8';\n }\n "), props => props.dec && "\n color: ".concat(props.theme.cWarning, ";\n\n &:before {\n content: '\\f3d0';\n }\n "));