diff --git a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss index ec1755e7d..47c87a45c 100644 --- a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss +++ b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,17 +21,19 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { - width: 100%; + display: flex; + flex: 1; height: 100%; padding-bottom: 20px; padding-right: 10px; diff --git a/frontend/src/app/components/block-fees-graph/block-fees-graph.component.scss b/frontend/src/app/components/block-fees-graph/block-fees-graph.component.scss index 65447419a..fae81952b 100644 --- a/frontend/src/app/components/block-fees-graph/block-fees-graph.component.scss +++ b/frontend/src/app/components/block-fees-graph/block-fees-graph.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,18 +21,20 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { + display: flex; + flex: 1; width: 100%; - height: 100%; padding-bottom: 20px; padding-right: 10px; @media (max-width: 992px) { diff --git a/frontend/src/app/components/block-prediction-graph/block-prediction-graph.component.scss b/frontend/src/app/components/block-prediction-graph/block-prediction-graph.component.scss index 65447419a..f8403bad5 100644 --- a/frontend/src/app/components/block-prediction-graph/block-prediction-graph.component.scss +++ b/frontend/src/app/components/block-prediction-graph/block-prediction-graph.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,17 +21,19 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { - width: 100%; + display: flex; + flex: 1; height: 100%; padding-bottom: 20px; padding-right: 10px; diff --git a/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.scss b/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.scss index 65447419a..f8403bad5 100644 --- a/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.scss +++ b/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,17 +21,19 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { - width: 100%; + display: flex; + flex: 1; height: 100%; padding-bottom: 20px; padding-right: 10px; diff --git a/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.scss b/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.scss index 65447419a..f8403bad5 100644 --- a/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.scss +++ b/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,17 +21,19 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { - width: 100%; + display: flex; + flex: 1; height: 100%; padding-bottom: 20px; padding-right: 10px; diff --git a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.scss b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.scss index 2c9a4447c..0caa35f33 100644 --- a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.scss +++ b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,16 +21,19 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { + display: flex; + flex: 1; width: 100%; height: 100%; padding-bottom: 20px; diff --git a/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.scss b/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.scss index 8f619aa85..3b1083505 100644 --- a/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.scss +++ b/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,18 +21,20 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { + display: flex; + flex: 1; width: 100%; - height: 100%; padding-bottom: 20px; padding-right: 10px; @media (max-width: 992px) { diff --git a/frontend/src/app/components/master-page/master-page.component.html b/frontend/src/app/components/master-page/master-page.component.html index a5efeeea2..6da59197c 100644 --- a/frontend/src/app/components/master-page/master-page.component.html +++ b/frontend/src/app/components/master-page/master-page.component.html @@ -64,8 +64,7 @@ -
-
+
diff --git a/frontend/src/app/components/pool-ranking/pool-ranking.component.html b/frontend/src/app/components/pool-ranking/pool-ranking.component.html index 57909c74f..7b7fbfae0 100644 --- a/frontend/src/app/components/pool-ranking/pool-ranking.component.html +++ b/frontend/src/app/components/pool-ranking/pool-ranking.component.html @@ -75,7 +75,7 @@ -
+
@@ -136,7 +136,6 @@
-
diff --git a/frontend/src/app/components/pool-ranking/pool-ranking.component.scss b/frontend/src/app/components/pool-ranking/pool-ranking.component.scss index b10fb66a8..fc58909f8 100644 --- a/frontend/src/app/components/pool-ranking/pool-ranking.component.scss +++ b/frontend/src/app/components/pool-ranking/pool-ranking.component.scss @@ -10,6 +10,7 @@ padding: 0px 15px; width: 100%; height: calc(100% - 140px); + padding-bottom: 20px; @media (max-width: 992px) { height: calc(100% - 190px); }; @@ -33,15 +34,6 @@ } } -.bottom-padding { - @media (max-width: 992px) { - padding-bottom: 65px - }; - @media (max-width: 576px) { - padding-bottom: 65px - }; -} - @media (max-width: 767.98px) { .pools-table th, .pools-table td { diff --git a/frontend/src/app/components/statistics/statistics.component.scss b/frontend/src/app/components/statistics/statistics.component.scss index 200b3c34f..91b007134 100644 --- a/frontend/src/app/components/statistics/statistics.component.scss +++ b/frontend/src/app/components/statistics/statistics.component.scss @@ -1,5 +1,5 @@ .container-graph { - padding: 0px 15px 60px; + padding: 0px 15px 10px; } .card-header { diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html index e4dc0f8cc..5580c8ea4 100644 --- a/frontend/src/app/components/transaction/transaction.component.html +++ b/frontend/src/app/components/transaction/transaction.component.html @@ -461,8 +461,6 @@ -
- diff --git a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.html b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.html index b262f58fd..095ae6f8e 100644 --- a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.html +++ b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.html @@ -19,4 +19,4 @@
- \ No newline at end of file + diff --git a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss index ca51dc6a2..6db0f27b0 100644 --- a/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss +++ b/frontend/src/app/lightning/nodes-channels-map/nodes-channels-map.component.scss @@ -4,6 +4,9 @@ &.widget { height: 250px; } + &.graph { + margin-bottom: 20px; + } } .card-header { diff --git a/frontend/src/app/lightning/nodes-map/nodes-map.component.scss b/frontend/src/app/lightning/nodes-map/nodes-map.component.scss index 7a67e4eb4..d49b68957 100644 --- a/frontend/src/app/lightning/nodes-map/nodes-map.component.scss +++ b/frontend/src/app/lightning/nodes-map/nodes-map.component.scss @@ -4,17 +4,20 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - height: 100%; - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .full-container.widget { min-height: 240px; @@ -34,8 +37,10 @@ } .chart { - width: 100%; + display: flex; + flex: 1; height: 100%; + padding-top: 30px; padding-bottom: 20px; padding-right: 10px; @media (max-width: 992px) { diff --git a/frontend/src/app/lightning/nodes-networks-chart/nodes-networks-chart.component.scss b/frontend/src/app/lightning/nodes-networks-chart/nodes-networks-chart.component.scss index d44c90956..bb8f2cd87 100644 --- a/frontend/src/app/lightning/nodes-networks-chart/nodes-networks-chart.component.scss +++ b/frontend/src/app/lightning/nodes-networks-chart/nodes-networks-chart.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,17 +21,19 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { - width: 100%; + display: flex; + flex: 1; height: 100%; padding-bottom: 20px; padding-right: 10px; diff --git a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html index 8279a2d5f..ed42595ef 100644 --- a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html +++ b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html @@ -10,7 +10,7 @@ (Tor nodes excluded) -
+
@@ -54,5 +54,4 @@
-
\ No newline at end of file diff --git a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.scss b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.scss index 70b01d8b3..f127d88cd 100644 --- a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.scss +++ b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.scss @@ -32,15 +32,6 @@ } } -.bottom-padding { - @media (max-width: 992px) { - padding-bottom: 65px - }; - @media (max-width: 576px) { - padding-bottom: 65px - }; -} - .rank { width: 8%; @media (max-width: 576px) { diff --git a/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.html b/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.html index e2c4553b8..9318e925b 100644 --- a/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.html +++ b/frontend/src/app/lightning/nodes-per-country/nodes-per-country.component.html @@ -117,5 +117,4 @@
-
diff --git a/frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.html b/frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.html index 356674f14..259c3503a 100644 --- a/frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.html +++ b/frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.html @@ -38,7 +38,7 @@ -
+
@@ -74,7 +74,6 @@
-
diff --git a/frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.scss b/frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.scss index f1d39081d..7879c18b1 100644 --- a/frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.scss +++ b/frontend/src/app/lightning/nodes-per-isp-chart/nodes-per-isp-chart.component.scss @@ -16,6 +16,7 @@ @media (max-width: 575px) { height: calc(100% - 230px); }; + margin-bottom: 25px; } .chart { @@ -34,15 +35,6 @@ } } -.bottom-padding { - @media (max-width: 992px) { - padding-bottom: 65px - }; - @media (max-width: 576px) { - padding-bottom: 65px - }; -} - @media (max-width: 767.98px) { .pools-table th, .pools-table td { diff --git a/frontend/src/app/lightning/nodes-per-isp/nodes-per-isp.component.html b/frontend/src/app/lightning/nodes-per-isp/nodes-per-isp.component.html index 6e402e945..3daafe4db 100644 --- a/frontend/src/app/lightning/nodes-per-isp/nodes-per-isp.component.html +++ b/frontend/src/app/lightning/nodes-per-isp/nodes-per-isp.component.html @@ -114,5 +114,4 @@ - diff --git a/frontend/src/app/lightning/statistics-chart/lightning-statistics-chart.component.scss b/frontend/src/app/lightning/statistics-chart/lightning-statistics-chart.component.scss index da8da11f4..0d692a6c8 100644 --- a/frontend/src/app/lightning/statistics-chart/lightning-statistics-chart.component.scss +++ b/frontend/src/app/lightning/statistics-chart/lightning-statistics-chart.component.scss @@ -4,6 +4,9 @@ @media (min-width: 465px) { font-size: 20px; } + @media (min-width: 992px) { + height: 40px; + } } .main-title { @@ -18,17 +21,19 @@ } .full-container { + display: flex; + flex-direction: column; padding: 0px 15px; width: 100%; - min-height: 500px; - height: calc(100% - 150px); - @media (max-width: 992px) { - padding-bottom: 100px; - }; + height: calc(100vh - 250px); + @media (min-width: 992px) { + height: calc(100vh - 150px); + } } .chart { - width: 100%; + display: flex; + flex: 1; height: 100%; padding-bottom: 20px; padding-right: 10px;