nhsuk-tools-chart-components-react 1.1.8 → 1.1.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -31,17 +31,14 @@
31
31
  background: repeating-linear-gradient(45deg, #da5147, #da5147 4.5px, #d5281b 4.5px, #d5281b 9px);
32
32
  }
33
33
 
34
- .nhsuk-bmi-graph {
35
- position: relative;
36
- outline: 1px solid black;
37
- display: flex;
38
- height: 28px;
39
- margin-bottom: nhsuk-spacing(4);
34
+ .nhsuk-bmi-legend-key-classification-obese {
35
+ border-bottom: none;
36
+ box-shadow: none;
40
37
  }
41
- @media (min-width: 320px) and (max-width: 641px) {
42
- .nhsuk-bmi-graph {
43
- height: 24px;
44
- }
38
+
39
+ .nhsuk-bmi-legend-key-marker {
40
+ border-bottom: none;
41
+ box-shadow: none;
45
42
  }
46
43
 
47
44
  .nhsuk-bmi-classification-underweight, .nhsuk-bmi-legend-key-classification-underweight {
@@ -60,28 +57,16 @@
60
57
  background: repeating-linear-gradient(45deg, #da5147, #da5147 4.5px, #d5281b 4.5px, #d5281b 9px);
61
58
  }
62
59
 
63
- .nhsuk-bmi-legend-key-classification-obese {
64
- border-bottom: none;
65
- box-shadow: none;
66
- }
67
-
68
- .nhsuk-bmi-legend-key-marker {
69
- border-bottom: none;
70
- box-shadow: none;
71
- }
72
-
73
- .nhsuk-bmi-chart-marker {
74
- position: absolute;
75
- z-index: 4;
76
- height: 24px;
77
- width: 24px;
78
- margin: 2px 0 -12px -12px;
60
+ .nhsuk-bmi-graph {
61
+ position: relative;
62
+ outline: 1px solid black;
63
+ display: flex;
64
+ height: 28px;
65
+ margin-bottom: nhsuk-spacing(4);
79
66
  }
80
67
  @media (min-width: 320px) and (max-width: 641px) {
81
- .nhsuk-bmi-chart-marker {
82
- height: 20px;
83
- width: 20px;
84
- margin: 2px 0 -10px -10px;
68
+ .nhsuk-bmi-graph {
69
+ height: 24px;
85
70
  }
86
71
  }
87
72
 
@@ -132,46 +117,88 @@
132
117
  box-shadow: none;
133
118
  }
134
119
 
135
- .nhsuk-bp-classification-low, .nhsuk-bp-legend-key-classification-low {
136
- background: #330072;
120
+ .nhsuk-bmi-axis-marker {
121
+ position: absolute;
122
+ outline: 0.5px solid black;
123
+ height: 5px;
124
+ bottom: -5px;
137
125
  }
138
126
 
139
- .nhsuk-bp-classification-healthy, .nhsuk-bp-legend-key-classification-healthy {
140
- background: repeating-linear-gradient(-45deg, #59c3bc, #59c3bc 4.5px, #33b6ad 4.5px, #33b6ad 9px);
127
+ .nhsuk-bmi-axis-marker-label {
128
+ position: absolute;
129
+ bottom: -25px;
130
+ left: -10px;
131
+ width: 20px;
132
+ text-align: center;
141
133
  }
142
134
 
143
- .nhsuk-bp-classification-slightlyraised, .nhsuk-bp-legend-key-classification-slightlyraised {
144
- background: #ffb81c;
135
+ .nhsuk-bmi-chart-marker {
136
+ position: absolute;
137
+ z-index: 4;
138
+ height: 24px;
139
+ width: 24px;
140
+ margin: 2px 0 -12px -12px;
141
+ }
142
+ @media (min-width: 320px) and (max-width: 641px) {
143
+ .nhsuk-bmi-chart-marker {
144
+ height: 20px;
145
+ width: 20px;
146
+ margin: 2px 0 -10px -10px;
147
+ }
145
148
  }
146
149
 
147
- .nhsuk-bp-classification-high, .nhsuk-bp-legend-key-classification-high {
148
- background: repeating-linear-gradient(45deg, #e1746b, #e1746b 4.5px, #dd5349 4.5px, #dd5349 9px);
150
+ .nhsuk-bp-graph {
151
+ position: relative;
152
+ margin-left: 20px;
153
+ margin-right: 20px;
154
+ outline: 2px solid black;
155
+ display: flex;
156
+ flex-direction: column;
157
+ height: 350px;
158
+ }
159
+ @media (max-width: 320px) {
160
+ .nhsuk-bp-graph {
161
+ height: 225px;
162
+ }
163
+ }
164
+ @media (min-width: 320px) and (max-width: 641px) {
165
+ .nhsuk-bp-graph {
166
+ height: 275px;
167
+ }
149
168
  }
150
169
 
151
- #nhsuk-bp-chart > figure {
152
- margin: 0;
170
+ .nhsuk-bp-graph-row {
171
+ flex-grow: 1;
172
+ display: flex;
153
173
  }
154
174
 
155
- .nhsuk-bp-legend-key-wrapper {
175
+ .nhsuk-bp-systolic-legend-wrapper {
156
176
  display: flex;
177
+ align-items: flex-end;
178
+ margin-bottom: 10px;
157
179
  }
158
- .nhsuk-bp-legend-key-wrapper:last-child {
159
- margin-top: 5px;
180
+
181
+ .nhsuk-bp-diastolic-legend-wrapper {
182
+ display: flex;
183
+ align-items: flex-start;
184
+ margin-top: 30px;
185
+ padding-left: 18px;
160
186
  }
161
187
 
162
- .nhsuk-bp-legend-display-card {
163
- margin-top: 50px;
164
- max-width: 300px;
188
+ .nhsuk-bp-diastolic-legend-marker, .nhsuk-bp-systolic-legend-marker {
189
+ height: 16px;
190
+ margin-right: 5px;
191
+ border-left: 2px solid black;
165
192
  }
166
193
 
167
- .nhsuk-bp-legend-key-classification-low {
168
- border-bottom: none;
169
- box-shadow: none;
194
+ .nhsuk-bp-systolic-legend-marker {
195
+ width: 40px;
196
+ border-top: 2px solid black;
170
197
  }
171
198
 
172
- .nhsuk-bp-legend-key-marker {
173
- border-bottom: none;
174
- box-shadow: none;
199
+ .nhsuk-bp-diastolic-legend-marker {
200
+ width: 20px;
201
+ border-bottom: 2px solid black;
175
202
  }
176
203
 
177
204
  .nhsuk-bp-diastolic-axis-marker, .nhsuk-bp-systolic-axis-marker {
@@ -234,58 +261,46 @@
234
261
  text-align: center;
235
262
  }
236
263
 
237
- .nhsuk-bp-graph {
238
- position: relative;
239
- margin-left: 20px;
240
- margin-right: 20px;
241
- outline: 2px solid black;
242
- display: flex;
243
- flex-direction: column;
244
- height: 350px;
264
+ .nhsuk-bp-classification-low, .nhsuk-bp-legend-key-classification-low {
265
+ background: #330072;
245
266
  }
246
- @media (max-width: 320px) {
247
- .nhsuk-bp-graph {
248
- height: 225px;
249
- }
267
+
268
+ .nhsuk-bp-classification-healthy, .nhsuk-bp-legend-key-classification-healthy {
269
+ background: repeating-linear-gradient(-45deg, #59c3bc, #59c3bc 4.5px, #33b6ad 4.5px, #33b6ad 9px);
250
270
  }
251
- @media (min-width: 320px) and (max-width: 641px) {
252
- .nhsuk-bp-graph {
253
- height: 275px;
254
- }
271
+
272
+ .nhsuk-bp-classification-slightlyraised, .nhsuk-bp-legend-key-classification-slightlyraised {
273
+ background: #ffb81c;
255
274
  }
256
275
 
257
- .nhsuk-bp-graph-row {
258
- flex-grow: 1;
259
- display: flex;
276
+ .nhsuk-bp-classification-high, .nhsuk-bp-legend-key-classification-high {
277
+ background: repeating-linear-gradient(45deg, #e1746b, #e1746b 4.5px, #dd5349 4.5px, #dd5349 9px);
260
278
  }
261
279
 
262
- .nhsuk-bp-systolic-legend-wrapper {
263
- display: flex;
264
- align-items: flex-end;
265
- margin-bottom: 10px;
280
+ #nhsuk-bp-chart > figure {
281
+ margin: 0;
266
282
  }
267
283
 
268
- .nhsuk-bp-diastolic-legend-wrapper {
284
+ .nhsuk-bp-legend-key-wrapper {
269
285
  display: flex;
270
- align-items: flex-start;
271
- margin-top: 30px;
272
- padding-left: 18px;
286
+ }
287
+ .nhsuk-bp-legend-key-wrapper:last-child {
288
+ margin-top: 5px;
273
289
  }
274
290
 
275
- .nhsuk-bp-diastolic-legend-marker, .nhsuk-bp-systolic-legend-marker {
276
- height: 16px;
277
- margin-right: 5px;
278
- border-left: 2px solid black;
291
+ .nhsuk-bp-legend-display-card {
292
+ margin-top: 50px;
293
+ max-width: 300px;
279
294
  }
280
295
 
281
- .nhsuk-bp-systolic-legend-marker {
282
- width: 40px;
283
- border-top: 2px solid black;
296
+ .nhsuk-bp-legend-key-classification-low {
297
+ border-bottom: none;
298
+ box-shadow: none;
284
299
  }
285
300
 
286
- .nhsuk-bp-diastolic-legend-marker {
287
- width: 20px;
288
- border-bottom: 2px solid black;
301
+ .nhsuk-bp-legend-key-marker {
302
+ border-bottom: none;
303
+ box-shadow: none;
289
304
  }
290
305
 
291
306
  .nhsuk-bp-graph-marker {
@@ -310,35 +325,6 @@
310
325
  }
311
326
  }
312
327
 
313
- .nhsuk-bp-graph-cell {
314
- flex-grow: 1;
315
- border-bottom: 1px solid white;
316
- border-left: 1px solid white;
317
- background: transparent;
318
- z-index: 4;
319
- }
320
-
321
- .nhsuk-bp-first-in-column {
322
- border-bottom: none;
323
- }
324
-
325
- .nhsuk-bp-first-in-row {
326
- border-left: none;
327
- }
328
-
329
- .nhsuk-bar-slider-graph {
330
- position: relative;
331
- outline: 1px solid black;
332
- margin-top: 20px;
333
- display: flex;
334
- height: 28px;
335
- }
336
- @media (min-width: 320px) and (max-width: 641px) {
337
- .nhsuk-bar-slider-graph {
338
- height: 24px;
339
- }
340
- }
341
-
342
328
  .nhsuk-bp-classification-low, .nhsuk-bp-legend-key-classification-low {
343
329
  background: #330072;
344
330
  }
@@ -390,63 +376,58 @@
390
376
  z-index: 0;
391
377
  }
392
378
 
393
- .nhsuk-bmi-axis-marker {
394
- position: absolute;
395
- outline: 0.5px solid black;
396
- height: 5px;
397
- bottom: -5px;
379
+ .nhsuk-bp-graph-cell {
380
+ flex-grow: 1;
381
+ border-bottom: 1px solid white;
382
+ border-left: 1px solid white;
383
+ background: transparent;
384
+ z-index: 4;
398
385
  }
399
386
 
400
- .nhsuk-bmi-axis-marker-label {
401
- position: absolute;
402
- bottom: -25px;
403
- left: -10px;
404
- width: 20px;
405
- text-align: center;
387
+ .nhsuk-bp-first-in-column {
388
+ border-bottom: none;
406
389
  }
407
390
 
408
- .nhsuk-bar-slider-arrow-marker {
409
- position: absolute;
410
- height: 16px;
411
- width: 16px;
412
- margin: -9px 0 -8px -8px;
391
+ .nhsuk-bp-first-in-row {
392
+ border-left: none;
413
393
  }
414
- @media (min-width: 320px) and (max-width: 641px) {
415
- .nhsuk-bar-slider-arrow-marker {
416
- height: 12px;
417
- width: 12px;
418
- margin: -9px 0 -6px -6px;
419
- }
394
+
395
+ .nhsuk-cbmi-classification-healthy, .nhsuk-cbmi-legend-key-classification-healthy {
396
+ background: repeating-linear-gradient(-45deg, #30b4ab, #30b4ab 4.5px, #00a499 4.5px, #00a499 9px);
420
397
  }
421
398
 
422
- .nhsuk-bar-slider-label-align-left {
423
- display: flex;
424
- justify-content: left;
399
+ .nhsuk-cbmi-classification-overweight, .nhsuk-cbmi-legend-key-classification-overweight {
400
+ background: #ffb81c;
425
401
  }
426
402
 
427
- .nhsuk-bar-slider-label-align-center {
428
- display: flex;
429
- justify-content: center;
403
+ .nhsuk-cbmi-classification-underweight, .nhsuk-cbmi-legend-key-classification-underweight {
404
+ background: #330072;
430
405
  }
431
406
 
432
- .nhsuk-bar-slider-label-align-right {
433
- display: flex;
434
- justify-content: right;
407
+ .nhsuk-cbmi-legend-key-classification-overweight {
408
+ border-bottom: none;
409
+ box-shadow: none;
435
410
  }
436
411
 
437
- .nhsuk-bar-slider-label-marker {
438
- position: relative;
439
- height: 25px;
440
- width: auto;
441
- white-space: nowrap;
442
- margin-top: -30px;
412
+ .nhsuk-cbmi-legend-key, .nhsuk-cbmi-legend-key-classification-underweight, .nhsuk-cbmi-legend-key-classification-healthy, .nhsuk-cbmi-legend-key-classification-overweight {
413
+ border-bottom: 2px solid white;
414
+ margin-bottom: 2px;
443
415
  }
444
416
 
445
- .nhsuk-bar-slider-value-marker {
446
- position: relative;
447
- font-weight: bold;
448
- margin-left: 5px;
449
- margin-right: 2px;
417
+ .nhsuk-cbmi-legend-marker {
418
+ margin-bottom: 2px;
419
+ }
420
+
421
+ .nhsuk-cbmi-classification-underweight-heading {
422
+ border-left: 8px solid #330072;
423
+ }
424
+
425
+ .nhsuk-cbmi-classification-healthy-heading {
426
+ border-left: 8px solid #30b4ab;
427
+ }
428
+
429
+ .nhsuk-cbmi-classification-overweight-heading {
430
+ border-left: 8px solid #ffb81c;
450
431
  }
451
432
 
452
433
  .nhsuk-cbmi-classification-healthy, .nhsuk-cbmi-legend-key-classification-healthy {
@@ -461,19 +442,29 @@
461
442
  background: #330072;
462
443
  }
463
444
 
464
- .nhsuk-cbmi-graph {
465
- position: relative;
466
- outline: 1px solid black;
467
- margin-top: 20px;
468
- display: flex;
469
- height: 28px;
445
+ .nhsuk-cbmi-axis-marker {
446
+ border: 1px solid black;
447
+ position: absolute;
448
+ bottom: -5px;
449
+ margin-left: -0.5px;
450
+ box-shadow: 0px 0px white inset, 1px 0px white, -1px 0px white;
451
+ z-index: 100;
452
+ height: 33px;
470
453
  }
471
454
  @media (min-width: 320px) and (max-width: 641px) {
472
- .nhsuk-cbmi-graph {
473
- height: 24px;
455
+ .nhsuk-cbmi-axis-marker {
456
+ height: 29px;
474
457
  }
475
458
  }
476
459
 
460
+ .nhsuk-cbmi-axis-marker-label {
461
+ position: absolute;
462
+ bottom: -25px;
463
+ left: -10px;
464
+ width: 20px;
465
+ text-align: center;
466
+ }
467
+
477
468
  .nhsuk-cbmi-classification-healthy, .nhsuk-cbmi-legend-key-classification-healthy {
478
469
  background: repeating-linear-gradient(-45deg, #30b4ab, #30b4ab 4.5px, #00a499 4.5px, #00a499 9px);
479
470
  }
@@ -486,30 +477,17 @@
486
477
  background: #330072;
487
478
  }
488
479
 
489
- .nhsuk-cbmi-legend-key-classification-overweight {
490
- border-bottom: none;
491
- box-shadow: none;
492
- }
493
-
494
- .nhsuk-cbmi-legend-key, .nhsuk-cbmi-legend-key-classification-underweight, .nhsuk-cbmi-legend-key-classification-healthy, .nhsuk-cbmi-legend-key-classification-overweight {
495
- border-bottom: 2px solid white;
496
- margin-bottom: 2px;
497
- }
498
-
499
- .nhsuk-cbmi-legend-marker {
500
- margin-bottom: 2px;
501
- }
502
-
503
- .nhsuk-cbmi-classification-underweight-heading {
504
- border-left: 8px solid #330072;
505
- }
506
-
507
- .nhsuk-cbmi-classification-healthy-heading {
508
- border-left: 8px solid #30b4ab;
480
+ .nhsuk-cbmi-graph {
481
+ position: relative;
482
+ outline: 1px solid black;
483
+ margin-top: 20px;
484
+ display: flex;
485
+ height: 28px;
509
486
  }
510
-
511
- .nhsuk-cbmi-classification-overweight-heading {
512
- border-left: 8px solid #ffb81c;
487
+ @media (min-width: 320px) and (max-width: 641px) {
488
+ .nhsuk-cbmi-graph {
489
+ height: 24px;
490
+ }
513
491
  }
514
492
 
515
493
  .nhsuk-cbmi-classification-healthy, .nhsuk-cbmi-legend-key-classification-healthy {
@@ -619,37 +597,59 @@
619
597
  z-index: 1;
620
598
  }
621
599
 
622
- .nhsuk-cbmi-legend-key-classification-healthy, .nhsuk-cbmi-classification-healthy {
623
- background: repeating-linear-gradient(-45deg, #30b4ab, #30b4ab 4.5px, #00a499 4.5px, #00a499 9px);
624
- }
625
-
626
- .nhsuk-cbmi-legend-key-classification-overweight, .nhsuk-cbmi-classification-overweight {
627
- background: #ffb81c;
600
+ .nhsuk-bar-slider-graph {
601
+ position: relative;
602
+ outline: 1px solid black;
603
+ margin-top: 20px;
604
+ display: flex;
605
+ height: 28px;
628
606
  }
629
-
630
- .nhsuk-cbmi-legend-key-classification-underweight, .nhsuk-cbmi-classification-underweight {
631
- background: #330072;
607
+ @media (min-width: 320px) and (max-width: 641px) {
608
+ .nhsuk-bar-slider-graph {
609
+ height: 24px;
610
+ }
632
611
  }
633
612
 
634
- .nhsuk-cbmi-axis-marker {
635
- border: 1px solid black;
613
+ .nhsuk-bar-slider-arrow-marker {
636
614
  position: absolute;
637
- bottom: -5px;
638
- margin-left: -0.5px;
639
- box-shadow: 0px 0px white inset, 1px 0px white, -1px 0px white;
640
- z-index: 100;
641
- height: 33px;
615
+ height: 16px;
616
+ width: 16px;
617
+ margin: -9px 0 -8px -8px;
642
618
  }
643
619
  @media (min-width: 320px) and (max-width: 641px) {
644
- .nhsuk-cbmi-axis-marker {
645
- height: 29px;
620
+ .nhsuk-bar-slider-arrow-marker {
621
+ height: 12px;
622
+ width: 12px;
623
+ margin: -9px 0 -6px -6px;
646
624
  }
647
625
  }
648
626
 
649
- .nhsuk-cbmi-axis-marker-label {
650
- position: absolute;
651
- bottom: -25px;
652
- left: -10px;
653
- width: 20px;
654
- text-align: center;
627
+ .nhsuk-bar-slider-label-align-left {
628
+ display: flex;
629
+ justify-content: left;
630
+ }
631
+
632
+ .nhsuk-bar-slider-label-align-center {
633
+ display: flex;
634
+ justify-content: center;
635
+ }
636
+
637
+ .nhsuk-bar-slider-label-align-right {
638
+ display: flex;
639
+ justify-content: right;
640
+ }
641
+
642
+ .nhsuk-bar-slider-label-marker {
643
+ position: relative;
644
+ height: 25px;
645
+ width: auto;
646
+ white-space: nowrap;
647
+ margin-top: -30px;
648
+ }
649
+
650
+ .nhsuk-bar-slider-value-marker {
651
+ position: relative;
652
+ font-weight: bold;
653
+ margin-left: 5px;
654
+ margin-right: 2px;
655
655
  }
@@ -31,14 +31,17 @@
31
31
  background: repeating-linear-gradient(45deg, #da5147, #da5147 4.5px, #d5281b 4.5px, #d5281b 9px);
32
32
  }
33
33
 
34
- .nhsuk-bmi-legend-key-classification-obese {
35
- border-bottom: none;
36
- box-shadow: none;
34
+ .nhsuk-bmi-graph {
35
+ position: relative;
36
+ outline: 1px solid black;
37
+ display: flex;
38
+ height: 28px;
39
+ margin-bottom: nhsuk-spacing(4);
37
40
  }
38
-
39
- .nhsuk-bmi-legend-key-marker {
40
- border-bottom: none;
41
- box-shadow: none;
41
+ @media (min-width: 320px) and (max-width: 641px) {
42
+ .nhsuk-bmi-graph {
43
+ height: 24px;
44
+ }
42
45
  }
43
46
 
44
47
  .nhsuk-bmi-classification-underweight, .nhsuk-bmi-legend-key-classification-underweight {
@@ -57,17 +60,14 @@
57
60
  background: repeating-linear-gradient(45deg, #da5147, #da5147 4.5px, #d5281b 4.5px, #d5281b 9px);
58
61
  }
59
62
 
60
- .nhsuk-bmi-graph {
61
- position: relative;
62
- outline: 1px solid black;
63
- display: flex;
64
- height: 28px;
65
- margin-bottom: nhsuk-spacing(4);
63
+ .nhsuk-bmi-legend-key-classification-obese {
64
+ border-bottom: none;
65
+ box-shadow: none;
66
66
  }
67
- @media (min-width: 320px) and (max-width: 641px) {
68
- .nhsuk-bmi-graph {
69
- height: 24px;
70
- }
67
+
68
+ .nhsuk-bmi-legend-key-marker {
69
+ border-bottom: none;
70
+ box-shadow: none;
71
71
  }
72
72
 
73
73
  .nhsuk-bmi-chart-marker {
@@ -85,6 +85,53 @@
85
85
  }
86
86
  }
87
87
 
88
+ .nhsuk-bmi-classification-underweight, .nhsuk-bmi-legend-key-classification-underweight {
89
+ background: #330072;
90
+ }
91
+
92
+ .nhsuk-bmi-classification-healthy, .nhsuk-bmi-legend-key-classification-healthy {
93
+ background: repeating-linear-gradient(-45deg, #30b4ab, #30b4ab 4.5px, #00a499 4.5px, #00a499 9px);
94
+ }
95
+
96
+ .nhsuk-bmi-classification-overweight, .nhsuk-bmi-legend-key-classification-overweight {
97
+ background: #ffb81c;
98
+ }
99
+
100
+ .nhsuk-bmi-classification-obese, .nhsuk-bmi-legend-key-classification-obese {
101
+ background: repeating-linear-gradient(45deg, #da5147, #da5147 4.5px, #d5281b 4.5px, #d5281b 9px);
102
+ }
103
+
104
+ .nhsuk-bmi-classification-obese, .nhsuk-bmi-classification-overweight, .nhsuk-bmi-classification-healthy, .nhsuk-bmi-classification-underweight {
105
+ position: absolute;
106
+ bottom: 0%;
107
+ outline: 1px solid black;
108
+ border-right: 1px solid black;
109
+ box-shadow: -1px 0px white inset, 2px 0px white, 0px -2px white;
110
+ height: 28px;
111
+ }
112
+ @media (min-width: 320px) and (max-width: 641px) {
113
+ .nhsuk-bmi-classification-obese, .nhsuk-bmi-classification-overweight, .nhsuk-bmi-classification-healthy, .nhsuk-bmi-classification-underweight {
114
+ height: 24px;
115
+ }
116
+ }
117
+
118
+ .nhsuk-bmi-classification-underweight {
119
+ z-index: 3;
120
+ }
121
+
122
+ .nhsuk-bmi-classification-healthy {
123
+ z-index: 2;
124
+ }
125
+
126
+ .nhsuk-bmi-classification-overweight {
127
+ z-index: 1;
128
+ }
129
+
130
+ .nhsuk-bmi-classification-obese {
131
+ border-right: none;
132
+ box-shadow: none;
133
+ }
134
+
88
135
  .nhsuk-bmi-axis-marker {
89
136
  position: absolute;
90
137
  outline: 0.5px solid black;
@@ -335,22 +382,6 @@
335
382
  }
336
383
  }
337
384
 
338
- .nhsuk-bp-graph-cell {
339
- flex-grow: 1;
340
- border-bottom: 1px solid white;
341
- border-left: 1px solid white;
342
- background: transparent;
343
- z-index: 4;
344
- }
345
-
346
- .nhsuk-bp-first-in-column {
347
- border-bottom: none;
348
- }
349
-
350
- .nhsuk-bp-first-in-row {
351
- border-left: none;
352
- }
353
-
354
385
  .nhsuk-bp-classification-low, .nhsuk-bp-legend-key-classification-low {
355
386
  background: #330072;
356
387
  }
@@ -402,6 +433,22 @@
402
433
  z-index: 0;
403
434
  }
404
435
 
436
+ .nhsuk-bp-graph-cell {
437
+ flex-grow: 1;
438
+ border-bottom: 1px solid white;
439
+ border-left: 1px solid white;
440
+ background: transparent;
441
+ z-index: 4;
442
+ }
443
+
444
+ .nhsuk-bp-first-in-column {
445
+ border-bottom: none;
446
+ }
447
+
448
+ .nhsuk-bp-first-in-row {
449
+ border-left: none;
450
+ }
451
+
405
452
  .nhsuk-cbmi-classification-healthy, .nhsuk-cbmi-legend-key-classification-healthy {
406
453
  background: repeating-linear-gradient(-45deg, #30b4ab, #30b4ab 4.5px, #00a499 4.5px, #00a499 9px);
407
454
  }
@@ -605,51 +652,4 @@
605
652
 
606
653
  .nhsuk-cbmi-classification-overweight {
607
654
  z-index: 1;
608
- }
609
-
610
- .nhsuk-bmi-classification-underweight, .nhsuk-bmi-legend-key-classification-underweight {
611
- background: #330072;
612
- }
613
-
614
- .nhsuk-bmi-classification-healthy, .nhsuk-bmi-legend-key-classification-healthy {
615
- background: repeating-linear-gradient(-45deg, #30b4ab, #30b4ab 4.5px, #00a499 4.5px, #00a499 9px);
616
- }
617
-
618
- .nhsuk-bmi-classification-overweight, .nhsuk-bmi-legend-key-classification-overweight {
619
- background: #ffb81c;
620
- }
621
-
622
- .nhsuk-bmi-classification-obese, .nhsuk-bmi-legend-key-classification-obese {
623
- background: repeating-linear-gradient(45deg, #da5147, #da5147 4.5px, #d5281b 4.5px, #d5281b 9px);
624
- }
625
-
626
- .nhsuk-bmi-classification-obese, .nhsuk-bmi-classification-overweight, .nhsuk-bmi-classification-healthy, .nhsuk-bmi-classification-underweight {
627
- position: absolute;
628
- bottom: 0%;
629
- outline: 1px solid black;
630
- border-right: 1px solid black;
631
- box-shadow: -1px 0px white inset, 2px 0px white, 0px -2px white;
632
- height: 28px;
633
- }
634
- @media (min-width: 320px) and (max-width: 641px) {
635
- .nhsuk-bmi-classification-obese, .nhsuk-bmi-classification-overweight, .nhsuk-bmi-classification-healthy, .nhsuk-bmi-classification-underweight {
636
- height: 24px;
637
- }
638
- }
639
-
640
- .nhsuk-bmi-classification-underweight {
641
- z-index: 3;
642
- }
643
-
644
- .nhsuk-bmi-classification-healthy {
645
- z-index: 2;
646
- }
647
-
648
- .nhsuk-bmi-classification-overweight {
649
- z-index: 1;
650
- }
651
-
652
- .nhsuk-bmi-classification-obese {
653
- border-right: none;
654
- box-shadow: none;
655
655
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nhsuk-tools-chart-components-react",
3
- "version": "1.1.8",
3
+ "version": "1.1.10",
4
4
  "description": "",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "module": "./dist/esm/index.js",