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 ef80863a3a..678079f5e8 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Dimmer.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Dimmer.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="entity dimmer-container">
-    <div class="head" :class="{expanded: expanded}">
+    <div class="head" :class="{collapsed: collapsed}">
       <div class="col-1 icon">
         <EntityIcon
           :icon="this.value.meta?.icon || {}"
@@ -13,9 +13,9 @@
       </div>
 
       <div class="col-s-3 col-m-2 buttons pull-right">
-        <button @click.stop="expanded = !expanded">
+        <button @click.stop="collapsed = !collapsed">
           <i class="fas"
-            :class="{'fa-angle-up': expanded, 'fa-angle-down': !expanded}" />
+            :class="{'fa-angle-up': !collapsed, 'fa-angle-down': collapsed}" />
         </button>
         <span class="value-percent"
           v-text="parsedValue"
@@ -23,7 +23,7 @@
       </div>
     </div>
 
-    <div class="body" v-if="expanded" @click.stop="prevent">
+    <div class="body" v-if="!collapsed" @click.stop="prevent">
       <div class="row">
         <div class="input" v-if="value?.min != null && value?.max != null">
           <div class="col-10">
@@ -56,7 +56,7 @@ export default {
 
   data() {
     return {
-      expanded: false,
+      collapsed: true,
     }
   },
 
diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/EnumSwitch.vue b/platypush/backend/http/webapp/src/components/panels/Entities/EnumSwitch.vue
index c47bdc1132..c354eb775b 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/EnumSwitch.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/EnumSwitch.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="entity switch-container">
-    <div class="head" :class="{expanded: expanded}">
+    <div class="head" :class="{collapsed: collapsed}">
       <div class="col-1 icon">
         <EntityIcon
           :icon="this.value.meta?.icon || {}"
@@ -13,9 +13,9 @@
       </div>
 
       <div class="col-s-3 col-m-2 buttons pull-right">
-        <button @click.stop="expanded = !expanded" v-if="hasValues">
+        <button @click.stop="collapsed = !collapsed" v-if="hasValues">
           <i class="fas"
-            :class="{'fa-angle-up': expanded, 'fa-angle-down': !expanded}" />
+            :class="{'fa-angle-up': !collapsed, 'fa-angle-down': collapsed}" />
         </button>
         <span class="value"
           v-text="value.values[value.value] || value.value"
@@ -23,7 +23,7 @@
       </div>
     </div>
 
-    <div class="body" v-if="expanded" @click.stop="prevent">
+    <div class="body" v-if="!collapsed" @click.stop="prevent">
       <div class="row">
         <div class="input">
           <select @input="setValue" ref="values" :disabled="loading">
@@ -53,7 +53,7 @@ export default {
 
   data() {
     return {
-      expanded: false,
+      collapsed: true,
     }
   },
 
diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Light.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Light.vue
index 3d33deeaf2..6e31933298 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Light.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Light.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="entity light-container">
-    <div class="head" :class="{expanded: expanded}">
+    <div class="head" :class="{collapsed: collapsed}">
       <div class="col-1 icon">
         <EntityIcon :icon="icon" :hasColorFill="true"
           :loading="loading" :error="error" />
@@ -14,14 +14,14 @@
         <ToggleSwitch :value="value.on" @input="toggle"
           @click.stop :disabled="loading || value.is_read_only" />
 
-        <button @click.stop="expanded = !expanded">
+        <button @click.stop="collapsed = !collapsed">
           <i class="fas"
-            :class="{'fa-angle-up': expanded, 'fa-angle-down': !expanded}" />
+            :class="{'fa-angle-up': !collapsed, 'fa-angle-down': collapsed}" />
         </button>
       </div>
     </div>
 
-    <div class="body" v-if="expanded" @click.stop="prevent">
+    <div class="body" v-if="!collapsed" @click.stop="prevent">
       <div class="row" v-if="cssColor">
         <div class="icon">
           <i class="fas fa-palette" />
@@ -78,7 +78,7 @@ export default {
 
   data() {
     return {
-      expanded: false,
+      collapsed: true,
       colorConverter: null,
     }
   },