summaryrefslogtreecommitdiff
path: root/assets/sass/_variables.sass
blob: d710d8c971a8baf04859c82a96273f792d5391d2 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
$xs-device-width: 480px
$sm-device-width: 768px
$md-device-width: 1150px

$colors: ('primary': #333, 'light': #999, 'lighter': #dedede, 'dark': #000, 'medium': #555, 'error': #b94a48)
$link-colors: ('primary': #3366CC, 'focus': #DF5353, 'hover': #333)
$background-colors: ('primary': #fbfbfb, 'light': #fcfcfc, 'lighter': #fefefe)

$alert-colors: ('default': #c09853, 'success': #468847, 'error': #b94a48, 'info': #3a87ad, 'normal': #333)
$alert-background-colors: ('default': #fcf8e3, 'success': #dff0d8, 'error': #f2dede, 'info': #d9edf7, 'normal': #f0f0f0)
$alert-border-colors: ('default': #fbeed5, 'success': #d6e9c6, 'error': #eed3d7, 'info': #bce8f1, 'normal': #ddd)

$button-colors: ('default': #333, 'red': #fff, 'blue': #fff, 'disabled': #ccc)
$button-background-colors: ('default': #f5f5f5, 'red': #d14836, 'blue': #4d90fe, 'disabled': #f7f7f7)
$button-border-colors: ('default': #ddd, 'red': #b0281a, 'blue': #3079ed, 'disabled': #ccc)
$button-hover-colors: ('default': #000, 'red': #fff, 'blue': #fff)
$button-hover-background-colors: ('default': #fafafa, 'red': #c53727, 'blue': #357ae8)
$button-hover-border-colors: ('default': #bbb, 'red': #b0281a, 'blue': #3079ed)

$font-sizes: ('normal': 1.0em, 'tiny': 0.7em, 'small': 0.8em, 'compact': 0.9em, 'medium': 1.2em, 'large': 1.4em, 'xlarge': 1.6em, 'title': 1.5em)

$icon-colors: ('success': #468847, 'error': #b94a48)

$text-font: 'Helvetica Neue', Helvetica, Arial, sans-serif
$board-task-limit-color: #DF5353

@function size($key)
  @return map-get($font-sizes, $key)

@function color($key: 'primary')
  @return map-get($colors, $key)

@function link-color($key: 'primary')
  @return map-get($link-colors, $key)

@function bg-color($key: 'primary')
  @return map-get($background-colors, $key)

@function icon-color($key)
  @return map-get($icon-colors, $key)

@function alert-color($key)
  @return map-get($alert-colors, $key)

@function alert-bg-color($key)
  @return map-get($alert-background-colors, $key)

@function alert-border-color($key)
  @return map-get($alert-border-colors, $key)

@function button-color($key)
  @return map-get($button-colors, $key)

@function button-bg-color($key)
  @return map-get($button-background-colors, $key)

@function button-border-color($key)
  @return map-get($button-border-colors, $key)

@function button-hover-color($key)
  @return map-get($button-hover-colors, $key)

@function button-hover-bg-color($key)
  @return map-get($button-hover-background-colors, $key)

@function button-hover-border-color($key)
  @return map-get($button-hover-border-colors, $key)