mirror of
https://github.com/mempool/mempool.git
synced 2024-11-20 10:21:52 +01:00
Invert graph legends order. (#532)
* Invert graph legends order. * Reorder graph legends if inverted-graph is true.
This commit is contained in:
parent
d055fabfeb
commit
4dcda2cf47
@ -1,6 +1,11 @@
|
|||||||
.ct-legend{
|
.ct-legend{
|
||||||
top: 130px;
|
top: 130px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column-reverse;
|
||||||
@media (min-width: 653px) {
|
@media (min-width: 653px) {
|
||||||
top: 90px;
|
top: 90px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.ct-legend.inverted{
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
@ -367,6 +367,10 @@ Chartist.plugins.legend = function (options: any) {
|
|||||||
function createLegendElement() {
|
function createLegendElement() {
|
||||||
const legendElement = document.createElement('ul');
|
const legendElement = document.createElement('ul');
|
||||||
legendElement.className = 'ct-legend';
|
legendElement.className = 'ct-legend';
|
||||||
|
const inverted = localStorage.getItem('inverted-graph') === 'true';
|
||||||
|
if (inverted){
|
||||||
|
legendElement.classList.add('inverted');
|
||||||
|
}
|
||||||
if (chart instanceof Chartist.Pie) {
|
if (chart instanceof Chartist.Pie) {
|
||||||
legendElement.classList.add('ct-legend-inside');
|
legendElement.classList.add('ct-legend-inside');
|
||||||
}
|
}
|
||||||
|
@ -69,6 +69,8 @@
|
|||||||
}
|
}
|
||||||
:host ::ng-deep .ct-legend {
|
:host ::ng-deep .ct-legend {
|
||||||
top: 20px !important;
|
top: 20px !important;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column-reverse;
|
||||||
@media(min-height: 800px){
|
@media(min-height: 800px){
|
||||||
padding-top: 40px !important;
|
padding-top: 40px !important;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user