revil-O/platypush
1
0
Fork 0
forked from platypush/platypush
Code Pull requests Activity

Better .pull-right class implementation.

Browse source
This commit is contained in:
Fabio Manganiello 2023-03-20 01:26:48 +01:00
parent 2b5596820b
commit a011de890b
Signed by untrusted user: blacklight
GPG key ID: D90FBA7F76362774
6 changed files with 26 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
platypush/backend/http/webapp/src/components/elements/Slider.vue
View file

@ -121,13 +121,19 @@ $label-width: 3em;
.range-labels { .range-labels {
width: 100%; width: 100%;
display: flex;
&.with-label { &.with-label {
width: calc(100% - $label-width); width: calc(100% - $label-width);
} }
.left {
text-align: left;
}
.right { .right {
@extend .pull-right; @extend .pull-right;
flex-grow: 1;
} }
} }

2
platypush/backend/http/webapp/src/components/panels/Entities/Device.vue
View file

@ -8,7 +8,7 @@
:error="error" /> :error="error" />
</div> </div>
<div class="col-12 label"> <div class="col-11 label">
<div class="name" v-text="value.name" /> <div class="name" v-text="value.name" />
</div> </div>
</div> </div>

6
platypush/backend/http/webapp/src/components/panels/Entities/Dimmer.vue
View file

@ -13,13 +13,13 @@
</div> </div>
<div class="col-s-4 col-m-3 buttons pull-right"> <div class="col-s-4 col-m-3 buttons pull-right">
<span class="value-percent"
v-text="parsedValue"
v-if="parsedValue != null" />
<button @click.stop="collapsed = !collapsed"> <button @click.stop="collapsed = !collapsed">
<i class="fas" <i class="fas"
:class="{'fa-angle-up': !collapsed, 'fa-angle-down': collapsed}" /> :class="{'fa-angle-up': !collapsed, 'fa-angle-down': collapsed}" />
</button> </button>
<span class="value-percent"
v-text="parsedValue"
v-if="parsedValue != null" />
</div> </div>
</div> </div>

2
platypush/backend/http/webapp/src/components/panels/Entities/Sensor.vue
View file

@ -14,9 +14,9 @@
<div class="col-s-3 col-m-2 pull-right" <div class="col-s-3 col-m-2 pull-right"
v-if="value.value != null"> v-if="value.value != null">
<span class="value" v-text="value.value" />
<span class="unit" v-text="value.unit" <span class="unit" v-text="value.unit"
v-if="value.unit != null" /> v-if="value.unit != null" />
<span class="value" v-text="value.value" />
</div> </div>
</div> </div>
</div> </div>

4
platypush/backend/http/webapp/src/components/panels/Entities/common.scss
View file

@ -21,12 +21,10 @@
} }
.pull-right { .pull-right {
display: inline-flex;
align-items: center;
direction: rtl;
padding-right: 0.5em; padding-right: 0.5em;
:deep(.power-switch) { :deep(.power-switch) {
@include pull-right;
margin-top: 0.25em; margin-top: 0.25em;
} }
} }

23
platypush/backend/http/webapp/src/style/layout.scss
View file

@ -150,21 +150,26 @@ $widths: (
} }
.vertical-center { .vertical-center {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.horizontal-center { .horizontal-center {
display: flex; display: flex;
justify-content: center; justify-content: center;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
}
@mixin pull-right {
display: inline-flex;
text-align: right;
justify-content: right;
flex-grow: 1;
} }
.pull-right { .pull-right {
text-align: right; @include pull-right;
float: right;
justify-content: right;
} }
.hidden { .hidden {