1 files changed, 13 insertions, 7 deletions
diff --git a/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue b/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue
index b0bcfb2b..1a41a334 100644
--- a/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue
+++ b/src/views/Operations/VirtualMedia/ModalConfigureConnection.vue
@@ -9,7 +9,7 @@
     <template #modal-title>
       {{ $t('pageVirtualMedia.modal.title') }}
     </template>
-    <b-form>
+    <b-form style="width: 100%">
       <b-form-group
         :label="$t('pageVirtualMedia.modal.serverUri')"
         label-for="serverUri"
@@ -43,12 +43,14 @@
         :label="$t('pageVirtualMedia.modal.password')"
         label-for="password"
       >
-        <b-form-input
-          id="password"
-          v-model="form.password"
-          type="password"
-          data-test-id="configureConnection-input-password"
-        />
+        <input-password-toggle>
+          <b-form-input
+            id="password"
+            v-model="form.password"
+            type="password"
+            data-test-id="configureConnection-input-password"
+          />
+        </input-password-toggle>
       </b-form-group>
       <b-form-group>
         <b-form-checkbox
@@ -72,8 +74,12 @@
 <script>
 import { required } from 'vuelidate/lib/validators';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
+import InputPasswordToggle from '@/components/Global/InputPasswordToggle';
 
 export default {
+  components: {
+    InputPasswordToggle,
+  },
   mixins: [VuelidateMixin],
   props: {
     connection: {