diff --git a/platypush/backend/http/webapp/src/components/elements/Slider.vue b/platypush/backend/http/webapp/src/components/elements/Slider.vue
index edd81a0dc..a6573d074 100644
--- a/platypush/backend/http/webapp/src/components/elements/Slider.vue
+++ b/platypush/backend/http/webapp/src/components/elements/Slider.vue
@@ -121,13 +121,19 @@ $label-width: 3em;
.range-labels {
width: 100%;
+ display: flex;
&.with-label {
width: calc(100% - $label-width);
}
+ .left {
+ text-align: left;
+ }
+
.right {
@extend .pull-right;
+ flex-grow: 1;
}
}
diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Device.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Device.vue
index 57d74bd9e..b599e53d6 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Device.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Device.vue
@@ -8,7 +8,7 @@
:error="error" />
-
diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Dimmer.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Dimmer.vue
index b80328015..9f9f5ffc3 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Dimmer.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Dimmer.vue
@@ -13,13 +13,13 @@
+
-
diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Sensor.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Sensor.vue
index 3e17c9530..c4861af61 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Sensor.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Sensor.vue
@@ -14,9 +14,9 @@
+
-
diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/common.scss b/platypush/backend/http/webapp/src/components/panels/Entities/common.scss
index 289b1ec85..f89de230d 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/common.scss
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/common.scss
@@ -21,12 +21,10 @@
}
.pull-right {
- display: inline-flex;
- align-items: center;
- direction: rtl;
padding-right: 0.5em;
:deep(.power-switch) {
+ @include pull-right;
margin-top: 0.25em;
}
}
diff --git a/platypush/backend/http/webapp/src/style/layout.scss b/platypush/backend/http/webapp/src/style/layout.scss
index f6c326840..256e51083 100644
--- a/platypush/backend/http/webapp/src/style/layout.scss
+++ b/platypush/backend/http/webapp/src/style/layout.scss
@@ -150,21 +150,26 @@ $widths: (
}
.vertical-center {
- display: flex;
- align-items: center;
+ display: flex;
+ align-items: center;
}
.horizontal-center {
- display: flex;
- justify-content: center;
- margin-left: auto;
- margin-right: auto;
+ display: flex;
+ justify-content: center;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+@mixin pull-right {
+ display: inline-flex;
+ text-align: right;
+ justify-content: right;
+ flex-grow: 1;
}
.pull-right {
- text-align: right;
- float: right;
- justify-content: right;
+ @include pull-right;
}
.hidden {