diff --git a/src/app/pages/dashboard/electricity/electricity.component.html b/src/app/pages/dashboard/electricity/electricity.component.html
index 91ccb120..a9dd3c08 100644
--- a/src/app/pages/dashboard/electricity/electricity.component.html
+++ b/src/app/pages/dashboard/electricity/electricity.component.html
@@ -34,7 +34,6 @@
Value
- $
91
USD
diff --git a/src/app/pages/dashboard/electricity/electricity.component.scss b/src/app/pages/dashboard/electricity/electricity.component.scss
index 66294965..90747d70 100644
--- a/src/app/pages/dashboard/electricity/electricity.component.scss
+++ b/src/app/pages/dashboard/electricity/electricity.component.scss
@@ -1,6 +1,8 @@
@import '../../../@theme/styles/themes';
@import '~@nebular/theme/components/card/card.component.theme';
@import '~@nebular/theme/styles/global/typography/typography';
+@import '~bootstrap/scss/mixins/breakpoints';
+@import '~@nebular/theme/styles/global/bootstrap/breakpoints';
@include nb-install-component() {
@@ -151,7 +153,7 @@
display: flex;
align-items: center;
justify-content: space-between;
- padding: 1rem 2rem;
+ padding: 1rem 1.75rem;
}
.header-stats {
@@ -160,11 +162,15 @@
}
.stats-block {
- margin-right: 3rem;
+ margin-right: 1rem;
color: nb-theme(color-fg);
+ &:first-child {
+ margin-right: 2.5rem;
+ }
+
.subtitle {
- font-size: 1.125rem;
+ font-size: 1.125rem;
}
.value {
@@ -172,10 +178,6 @@
font-size: 2rem;
font-weight: nb-theme(font-weight-bolder);
color: nb-theme(color-fg-heading);
-
- &.dollar {
- color: nb-theme(color-fg-highlight);
- }
}
.unit {
@@ -199,4 +201,43 @@
}
}
}
+
+ @include media-breakpoint-between(md, xl) {
+ .consumption-table {
+ display: none;
+ }
+ }
+ @include media-breakpoint-down(md) {
+ .chart-header {
+ padding: 1rem;
+ }
+ .stats-block:first-child {
+ margin-right: 1rem;
+ }
+ .dropdown {
+ min-width: 100px;
+ button {
+ padding-left: 0.75rem;
+ padding-right: 0.75rem;
+ }
+ }
+ }
+ @include media-breakpoint-down(sm) {
+ .consumption-table {
+ display: none;
+ }
+ }
+ @include media-breakpoint-down(xs) {
+ .stats-block {
+ .subtitle {
+ font-size: 1rem;
+ }
+ .value {
+ font-size: 1.5rem;
+ }
+ .unit {
+ display: none;
+ }
+ }
+ }
}