From cbf0ea8a191ba495a0bce654c0b234af9f8613e7 Mon Sep 17 00:00:00 2001
From: Fabio Manganiello <fabio@manganiello.tech>
Date: Sat, 29 Apr 2023 22:45:10 +0200
Subject: [PATCH] Style fixes for mobile screens.

---
 .../webapp/src/components/panels/Entities/Index.vue   |  4 ++--
 .../src/components/panels/Entities/VariableModal.vue  | 11 ++++++++++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue
index 2a3ff90121..152c85b17f 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue
@@ -3,11 +3,11 @@
     <Loading v-if="loading" />
 
     <header>
-      <div class="col-11 left">
+      <div class="col-s-10 col-m-11 left">
         <Selector :entity-groups="entityGroups" :value="selector" @input="selector = $event" />
       </div>
 
-      <div class="col-1 actions-container right">
+      <div class="col-s-2 col-m-1 actions-container right">
         <Dropdown title="Actions" icon-class="fas fa-ellipsis">
           <DropdownItem  icon-class="fa fa-sync-alt" text="Refresh" @click="refresh" />
           <DropdownItem  icon-class="fa fa-square-root-variable"
diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/VariableModal.vue b/platypush/backend/http/webapp/src/components/panels/Entities/VariableModal.vue
index 976571f4bf..ce350d0a82 100644
--- a/platypush/backend/http/webapp/src/components/panels/Entities/VariableModal.vue
+++ b/platypush/backend/http/webapp/src/components/panels/Entities/VariableModal.vue
@@ -1,5 +1,6 @@
 <template>
-  <Modal :visible="visible" title="Set Variable" ref="modal" @open="onOpen">
+  <Modal :visible="visible" title="Set Variable" ref="modal"
+      @open="onOpen" @close="$emit('close', $event)">
     <div class="variable-modal-container">
       <form @submit.prevent="setValue">
         <div class="row">
@@ -114,6 +115,14 @@ export default {
       padding: 0.25em 1em;
       display: flex;
       align-items: center;
+
+      @include until($tablet) {
+        flex-direction: column;
+      }
+
+      input[type=text] {
+        width: 100%;
+      }
     }
 
     .button-container {