@frontify/fondue/dist/packages/charts/style.css

Design system of Frontify

:root{--fc-base-color: var(--color-surface-default);--fc-primary-base-color: var(--color-charts-primary-default);--fc-secondary-base-color: var(--color-charts-secondary-default);--fc-tertiary-base-color: var(--color-charts-tertiary-default);--fc-backfilled-base-color: var(--color-container-secondary-on-secondary-container);--fc-negative-base-color: var(--color-error-default);--fc-primary-hover-color: var(--color-charts-primary-hover);--fc-secondary-hover-color: var(--color-charts-secondary-hover);--fc-tertiary-hover-color: var(--color-charts-tertiary-hover);--fc-primary-weak-color: var(--color-charts-primary-subtle);--fc-secondary-weak-color: var(--color-charts-secondary-subtle);--fc-tertiary-weak-color: var(--color-charts-tertiary-subtle);--fc-backfilled-weak-color: rgba(250, 250, 250, .3);--fc-negative-weak-color: rgba(254, 142, 163, .1);--fc-tick-stroke-color: var(--color-line-strong);--fc-axis-x-color: var(--color-line-strong);--fc-axis-y-color: "transparent";--fc-grid-stroke-color: var(--color-line-mid);--fc-tooltip-crosshair-stroke-color: var(--color-line-mid);--fc-tooltip-crosshair-stroke-color-weak: rgba(8, 8, 8, .05);--fc-font-family: var(--typography-font-family-primary);--fc-font-color-default: var(--color-primary-default);--fc-font-color-weak: var(--color-secondary-default)}.visx-tooltip-glyph svg{width:6px;height:6px}.bar-chart-cursor-pointer svg rect{cursor:pointer}._label_1cnpe_3{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-x-small);font-weight:var(--typography-font-weight-bold)}._root_1fixl_4{display:flex;flex-wrap:wrap;gap:var(--spacing-large);align-self:flex-start}._item_1fixl_11{display:flex}._label_1fixl_15{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-small);font-weight:var(--typography-font-weight-regular);color:var(--color-primary-default)}._colorBox_1fixl_22{align-self:center;margin-right:var(--spacing-x-small);display:inline-block}._shape-line_1fixl_28{width:3rem;height:2px;border-radius:0}._shape-rectangle_1fixl_34{width:3rem;height:.75rem;border-radius:0}._shape-circle_1fixl_40{width:.75rem;height:.75rem;border-radius:9999px}._shape-square_1fixl_46{width:.75rem;height:.75rem;border-radius:1px}._root_12zit_4{background-color:var(--color-primary-default);color:var(--color-primary-on-primary);padding:var(--spacing-small);border-radius:var(--border-radius-medium);border:1px solid var(--color-primary-default);max-width:16.25rem;word-break:break-all}._imageWrapper_12zit_14{margin:-.25rem}._image_12zit_14{height:7rem;-o-object-fit:cover;object-fit:cover;margin-bottom:1.25rem;width:100%}._body_12zit_25{padding-bottom:0}._body_12zit_25._withTitle_12zit_28{padding-bottom:var(--spacing-small)}._title_12zit_32{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-small);font-weight:var(--typography-font-weight-bold);color:var(--color-primary-on-primary)}._type_12zit_39{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-small);font-weight:var(--typography-font-weight-regular);color:var(--color-primary-on-primary);padding-bottom:var(--spacing-x-small)}._description_12zit_47{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-x-small);font-weight:var(--typography-font-weight-regular);color:var(--color-primary-on-primary)}._descriptionLine_12zit_54{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._item_12zit_60{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-small);font-weight:var(--typography-font-weight-regular);color:var(--color-primary-on-primary)}._itemDot_12zit_67{display:inline-block;width:.5rem;height:.5rem;border-radius:9999px;margin-right:var(--spacing-xx-small)}._itemValue_12zit_75{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-small);font-weight:var(--typography-font-weight-bold)}._root_gqg3e_2{display:flex;flex-direction:column;gap:var(--spacing-large)}._root_1cl5u_4{margin-block:.5rem 1.25rem}._titleRow_1cl5u_8{display:flex;align-items:center}._title_1cl5u_8{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-large);font-weight:var(--typography-font-weight-medium);margin-right:.375rem;color:var(--color-primary-default)}._descriptionWrapper_1cl5u_21{margin-top:.875rem}._description_1cl5u_21{font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-small);font-weight:var(--typography-font-weight-regular);color:var(--color-secondary-default)}._root_gqg3e_2,._stack_98ryw_3{display:flex;flex-direction:column;gap:var(--spacing-large)}._bar_98ryw_9{overflow:hidden;border-radius:.375rem;width:100%;position:relative;display:flex;height:.75rem;background-color:var(--color-container-secondary-hover)}._root_1o7ku_2{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-x-large)}@media (min-width: 768px){._root_1o7ku_2{gap:var(--spacing-large)}}._root_ryw0h_2{width:100%;height:100%;display:flex;flex-direction:column;gap:var(--spacing-large);-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:none}._chartWrapper_ryw0h_12{width:100%;height:100%}