Style tweaks

src/plugins/controlbox/loginform.js

@@ -1,4 +1,3 @@
-import Popover from 'bootstrap/js/src/popover.js';
 import { _converse, api, converse, constants } from '@converse/headless';
 import { CustomElement } from 'shared/components/element.js';
 import { updateSettingsWithFormData, validateJID } from './utils.js';

src/plugins/controlbox/styles/loginform.scss

@@ -12,6 +12,12 @@
             height: 100%;
             padding-bottom: 0;
             padding-top: 0;
+
+            .login-trusted {
+                .form-check-input {
+                    margin-top: 0.35em;
+                }
+            }
         }
 
         .toggle-register-login {

src/plugins/modal/styles/_modal.scss

@@ -35,6 +35,7 @@ $prefix: 'converse-';
             background-color: var(--error-color);
         }
         .modal-title {
+            line-break: anywhere;
             color: var(--background-color);
             a {
                 color: var(--background-color);

src/plugins/modal/templates/prompt.js

@@ -6,8 +6,8 @@ import { __ } from 'i18n';
  */
 function tplField(f) {
     return f.type === 'checkbox'
-        ? html` <div class="form-check">
-              <input name="${f.name}" class="form-check-input" type="checkbox" value="" id="${f.name}" />
+        ? html`<div class="form-check">
+              <input name="${f.name}" class="form-check-input" type="checkbox" id="${f.name}" />
               <label class="form-check-label" for="${f.name}">${f.label}</label>
           </div>`
         : html`<div class="mb-3">

src/shared/autocomplete/styles/_autocomplete.scss

@@ -122,7 +122,7 @@
     }
 
     .suggestion-box > ul > li[aria-selected="true"] {
-        background: var(--primary-color);
+        background: var(--secondary-color);
         color: var(--foreground-color);
     }
 

src/shared/styles/forms.scss

@@ -7,7 +7,7 @@
     form {
         .form-check {
             .form-check-input {
-                margin-top: 0.35em;
+                margin-top: 0;
             }
         }