-
Notifications
You must be signed in to change notification settings - Fork 1
/
Farm Analytic HTMl
105 lines (99 loc) · 4.32 KB
/
Farm Analytic HTMl
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
<!-- https://codepen.io/jlalovi/details/bIyAr -->
<div class="container">
<!-- DONUT CHART BLOCK (LEFT-CONTAINER) -->
<div class="donut-chart-block block">
<h2 class="titular">Farm Analytic</h2>
<div class="donut-chart">
<!-- PORCIONES GRAFICO CIRCULAR
ELIMINADO #donut-chart
MODIFICADO CSS de .donut-chart -->
<div id="porcion1" class="recorte"><div class="quesito ios" data-rel="21"></div></div>
<div id="porcion2" class="recorte"><div class="quesito mac" data-rel="39"></div></div>
<div id="porcion3" class="recorte"><div class="quesito win" data-rel="31"></div></div>
<div id="porcionFin" class="recorte"><div class="quesito linux" data-rel="9"></div></div>
<!-- FIN AÑADIDO GRÄFICO -->
<p class="center-date">January<br><span class="scnd-font-color">2021</span></p>
</div>
<ul class="os-percentages horizontal-list">
<li>
<p class="ios os scnd-font-color">Not Dosed</p>
<p class="os-percentage">31<sup>%</sup></p>
</li>
<li>
<p class="mac os scnd-font-color">Dosed</p>
<p class="os-percentage">39<sup>%</sup></p>
</li>
<li>
<p class="linux os scnd-font-color">Remaining</p>
<p class="os-percentage">25<sup>%</sup></p>
</li>
<li>
<p class="win os scnd-font-color">Not Counted</p>
<p class="os-percentage">5<sup>%</sup></p>
</li>
</ul>
</div>
<!-- LINE CHART BLOCK (LEFT-CONTAINER) -->
<div class="line-chart-block block">
<div class="line-chart">
<div class='grafico'>
<ul class='eje-y'>
<li data-ejeY='30'></li>
<li data-ejeY='20'></li>
<li data-ejeY='10'></li>
<li data-ejeY='0'></li>
</ul>
<ul class='eje-x'>
<li>Apr</li>
<li>May</li>
<li>Jun</li>
</ul>
<span data-valor='25'>
<span data-valor='8'>
<span data-valor='13'>
<span data-valor='5'>
<span data-valor='23'>
<span data-valor='12'>
<span data-valor='15'>
</span></span></span></span></span></span></span>
</div>
</div>
<ul class="time-lenght horizontal-list">
<li><a class="time-lenght-btn" href="#14">Week</a></li>
<li><a class="time-lenght-btn" href="#15">Month</a></li>
<li><a class="time-lenght-btn" href="#16">Year</a></li>
</ul>
<ul class="month-data clear">
<li>
<p>APR<span class="scnd-font-color"> 2021</span></p>
<p><span class="entypo-plus increment"> </span>21<sup>%</sup></p>
</li>
<li>
<p>MAY<span class="scnd-font-color"> 2021</span></p>
<p><span class="entypo-plus increment"> </span>48<sup>%</sup></p>
</li>
<li>
<p>JUN<span class="scnd-font-color"> 2021</span></p>
<p><span class="entypo-plus increment"> </span>35<sup>%</sup></p>
</li>
</ul>
</div>
<div class="bar-chart-block block">
<h2 class='titular'>Livestock <span>2020</span></h2>
<div class='grafico bar-chart'>
<ul class='eje-y'>
<li data-ejeY='20'></li>
<li data-ejeY='15'></li>
<li data-ejeY='10'></li>
<li data-ejeY='5'></li>
<li data-ejeY='0'></li>
</ul>
<ul class='eje-x'>
<li data-ejeX='10'><i>Dosed</i></li>
<li data-ejeX='5'><i>Remaining</i></li>
<li data-ejeX='1'><i>Not Counted</i></li>
<li data-ejeX='7'><i>Not Dosed</i></li>
</ul>
</div>
</div>
</div>