registry-status-pagelet/css.styl at master · nodejitsu/registry-status-pagelet · GitHub

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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
$base = #444
$blue = #2980b9
$highlight = #f4f4f4

.map
.charts
  border-left: 5px solid $highlight

.registries
  font-size: 16px
  width: 17.25% !important // Add margin right to registries

  ul
    padding-left: 0
    margin: 10px 0

  li
    font-weight: bold
    list-style: none
    height: 38px
    padding: 0 .5em
    cursor: pointer

    &:hover
      background-color: $base

      a
        color: white

    &.highlight:not(:hover)
      background-color: $highlight

    div
      height: 1em

  a
    display: block
    color: $base

    &:hover
      text-decoration: none

  .registry-details
    font-size: 12px
    color: #AAA

  .icon
    text-align: right

.charts
  .axis
    line
    path
      fill: transparent
      stroke: $base
      stroke-width: 1.25

  text
    font-size: 14px

  .value
    font-size: 40px
    font-weight: bold
    fill: $blue

  .unit
  .title
    font-size: 14px
    font-weight: bold
    text-transform: uppercase
    fill: #999

.registry
  display: none

  &.show
    display: block

.row
  color: #444
  font-family: "proxima-nova-1", "proxima-nova-2", sans-serif;
  position: relative

.countries
  fill: $blue

.heatmap
  stroke: $highlight
  stroke-width: 2

  for i in 0..10
    &.hecta-{i}
      fill: lighten($blue, (10 - i) * 10%)

.registries
  path
    fill: $base
    stroke: $highlight
    stroke-width: 2

    &.highlight
      fill: #ffb800

.line
  fill: transparent
  stroke: $base
  stroke-width: 2

.stack
  &.success
    fill: $blue

  &.failure
    fill: #ffb800

.grid
  stroke: #CCC
  stroke-width: .5

.north-america
  fill: #a7cf37

.south-america
  fill: #bdce36

.asia
  fill: #c77f33

.europe
  fill: #c46833

.africa
  fill: #ccb033

.oceania
  fill: #bf3d33

//
// Full complement from
// "npm color"
//
// @color1: #bf3d33;
// @color2: #c15233;
// @color3: #c46833;
// @color4: #c77f33;
// @color5: #c99733;
// @color6: #ccb033;
// @color7: #cdc834;
// @color8: #bdce36;
// @color9: #a7cf37;
// @color10: #91d039;
//
// Alternate 1 -- other color scheme
//
// 'north-america': '#bf3d33',
// 'south-america': '#c15233',
// 'asia':          '#c46833',
// 'europe':        '#c77f33',
// 'africa':        '#c99733',
// 'oceania':       '#ccb033'
//