diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts
index 729a650f7..de67559b3 100644
--- a/frontend/src/app/app.module.ts
+++ b/frontend/src/app/app.module.ts
@@ -47,7 +47,7 @@ import { NgbTypeaheadModule } from '@ng-bootstrap/ng-bootstrap';
import { FeesBoxComponent } from './components/fees-box/fees-box.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
-import { faAngleDown, faAngleUp, faAngleRight, faAngleLeft, faBolt, faChartArea, faCogs, faCubes, faDatabase, faExchangeAlt, faInfoCircle,
+import { faFilter, faAngleDown, faAngleUp, faAngleRight, faAngleLeft, faBolt, faChartArea, faCogs, faCubes, faDatabase, faExchangeAlt, faInfoCircle,
faLink, faList, faSearch, faCaretUp, faCaretDown, faTachometerAlt, faThList, faTint, faTv, faAngleDoubleDown, faSortUp, faAngleDoubleUp, faChevronDown, faFileAlt, faRedoAlt, faArrowAltCircleRight, faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons';
import { ApiDocsComponent } from './components/api-docs/api-docs.component';
import { CodeTemplateComponent } from './components/api-docs/code-template.component';
@@ -140,6 +140,7 @@ export class AppModule {
library.addIcons(faLink);
library.addIcons(faBolt);
library.addIcons(faTint);
+ library.addIcons(faFilter);
library.addIcons(faAngleDown);
library.addIcons(faAngleUp);
library.addIcons(faExchangeAlt);
diff --git a/frontend/src/app/components/statistics/statistics.component.html b/frontend/src/app/components/statistics/statistics.component.html
index 6f3a2d4d4..ec12da928 100644
--- a/frontend/src/app/components/statistics/statistics.component.html
+++ b/frontend/src/app/components/statistics/statistics.component.html
@@ -38,33 +38,37 @@
-
+
-
-
-
+
+
+
+ -
+
+
+
+
+
+
+ 0 - {{ fee }}
+
+
+
+ -
+ {{feeLevels[i - 1]}} - {{ fee }}
-
+
+ {{feeLevels[i + 1]}} - {{ fee }}
- 0 - {{ fee }}
-
-
- -
-
-
- {{feeLevels[i - 1]}} - {{ fee }}
-
-
- {{feeLevels[i + 1]}} - {{ fee }}
-
-
-
+
diff --git a/frontend/src/app/components/statistics/statistics.component.scss b/frontend/src/app/components/statistics/statistics.component.scss
index 39d5de1b1..ca367bf17 100644
--- a/frontend/src/app/components/statistics/statistics.component.scss
+++ b/frontend/src/app/components/statistics/statistics.component.scss
@@ -67,6 +67,14 @@
padding: 10px 0px;
min-width: 130px;
padding: 2px 20px 0px;
+ left: -38px !important;
+ position: absolute !important;
+
+ ul {
+ list-style: none;
+ padding: 0px;
+ margin-bottom: 0px;
+ }
li {
width: 100%;
font-size: 14px;
@@ -90,10 +98,11 @@
}
.inactive {
.square {
- background-color: #aaa !important;
+ background-color: #ffffff66 !important;
}
.fee-text {
text-decoration: line-through;
+ color: #777;
}
}
}
diff --git a/frontend/src/app/components/statistics/statistics.component.ts b/frontend/src/app/components/statistics/statistics.component.ts
index 9302d8d0d..c55b9b4e1 100644
--- a/frontend/src/app/components/statistics/statistics.component.ts
+++ b/frontend/src/app/components/statistics/statistics.component.ts
@@ -25,7 +25,8 @@ export class StatisticsComponent implements OnInit {
spinnerLoading = false;
feeLevels = feeLevels;
chartColors = chartColors;
- filterFeeIndex = 200;
+ filterFeeIndex = 500;
+ dropDownOpen = false;
mempoolStats: OptimizedMempoolStats[] = [];
@@ -143,4 +144,8 @@ export class StatisticsComponent implements OnInit {
filterFees(index: number) {
this.filterFeeIndex = index;
}
+
+ filterClick() {
+ this.dropDownOpen = !this.dropDownOpen;
+ }
}
diff --git a/frontend/src/app/components/television/television.component.html b/frontend/src/app/components/television/television.component.html
index 4e1a588cc..3644c4d6a 100644
--- a/frontend/src/app/components/television/television.component.html
+++ b/frontend/src/app/components/television/television.component.html
@@ -10,7 +10,7 @@
[template]="'advanced'"
[limitFee]="500"
[height]="600"
- [left]="75"
+ [left]="60"
[right]="10"
[data]="mempoolStats"
[showZoom]="false"