mozaik
Version:
Mozaik dashboard composition tool
67 lines (53 loc) • 2.18 kB
text/stylus
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,200,800|Montserrat:400,700")
// GENERIC
$main-bg-color = #ebf0f1
$main-txt-color = #333
$main-margin = 2vmin
$main-font = normal normal 400 unquote("1.6vmin/3vmin") "Open Sans", sans-serif
$card-bg-color = #fff
// DASHBOARD
$dashboard-header-height = 6vmin
$dashboard-header-font = normal normal 400 unquote("2.6vmin/6vmin") "Montserrat", sans-serif
// WIDGET
$widget-spacing = 2vmin
$widget-shadow = 0 1px 1px rgba(0, 0, 0, 0.15)
$widget-border-radius = 2px
// WIDGET — header
$widget-header-height = 5vmin
$widget-header-bg-color = #fafafa
$widget-header-icon-color = #bbb
$widget-header-icon-size = 2vmin
$widget-header-font = normal normal 400 2vmin "Montserrat", sans-serif
// COUNT
$count-padding = 0.4vmin 1.2vmin
$count-font-size = 1.8vmin
$count-border-radius = 2vmin
$count-border = 1px solid #ddd
// WIDGET — header count
$widget-header-count-padding = 0.6vmin 1.6vmin
// WIDGET — body
$widget-body-border = 3px solid #fff
// TABLE
$table-border-h = 1px solid #253246
// LABEL
$label-bg-color = #fff
$label-txt-color = $main-txt-color
$label-addon-bg-color = $main-bg-color
$label-addon-txt-color = #000
$label-border-radius = 2px
$label-border = 1px solid #ddd
// Meaningful color
$unknown-color = #d3dfe8
$success-color = #8ddb8d
$warning-color = #d1be65
$failure-color = #e37856
// CHART
$histogram-bar-bg-color = #fafafa
$chart-axis-txt-color = #777
$chart-grid-line-color = #ccc
$pie-chart-outline-stroke = #ddd
$pie-chart-outline-stroke-width = 6px
$pie-svg-legend-bg-color = #ededed
// PROPS
$prop-key-txt-color = $main-txt-color
$prop-value-txt-color = lighten($main-txt-color, 10)