Use help-url in Checkbox

dashboard/src/components/DomainProviderForm.vue

@@ -235,8 +235,7 @@ function onGcdnsFileInputChange(event) {
       <TextInput id="cloudflareEmailInput" type="email" v-model="dnsConfig.email" :required="dnsConfig.tokenType === 'GlobalApiKey'" />
     </FormGroup>
     <div v-if="provider === 'cloudflare'">
-      <Checkbox v-model="dnsConfig.defaultProxyStatus" :label="$t('domains.domainDialog.cloudflareDefaultProxyStatus')" style="display: inline-flex; margin-top: 10px" />
-      <sup><a href="https://docs.cloudron.io/domains/#cloudflare-dns" class="help" target="_blank" tabIndex="-1"><i class="fa fa-question-circle"></i></a></sup>
+      <Checkbox v-model="dnsConfig.defaultProxyStatus" :label="$t('domains.domainDialog.cloudflareDefaultProxyStatus')" help-url="https://docs.cloudron.io/domains/#cloudflare-dns" style="margin-top: 10px" />
     </div>
 
     <!-- Linode -->

dashboard/src/components/UserDialog.vue

@@ -292,7 +292,7 @@ defineExpose({
           <MultiSelect v-if="allLocalGroups.length" v-model="localGroups" option-key="id" :options="allLocalGroups" :search-threshold="20" />
         </FormGroup>
 
-        <Checkbox v-model="active" :disabled="isSelf" :label="$t('users.user.activeCheckbox')" style="display: inline-flex; margin-right: 6px;" /><sup><a href="https://docs.cloudron.io/user-management/#disable-user" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup><br/>
+        <Checkbox v-model="active" :disabled="isSelf" :label="$t('users.user.activeCheckbox')" help-url="https://docs.cloudron.io/user-management/#disable-user"/>
         <Checkbox v-if="!user" v-model="sendInvite" :label="$t('users.addUserDialog.sendInviteCheckbox')" />
       </fieldset>
     </form>

dashboard/src/components/app/Security.vue

@@ -61,7 +61,7 @@ onMounted(() => {
           <textarea id="cspInput" style="white-space: pre-wrap; font-family: monospace;" v-model="csp" placeholder="default-src 'self'; frame-ancestors 'none';" rows="2"></textarea>
         </FormGroup>
 
-        <Checkbox v-model="hstsPreload" style="display: inline-flex;" :label="$t('app.security.hstsPreload')"/> <sup><a href="https://docs.cloudron.io/apps/#hsts-preload" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup>
+        <Checkbox v-model="hstsPreload" style="display: inline-flex;" :label="$t('app.security.hstsPreload')" help-url="https://docs.cloudron.io/apps/#hsts-preload"/>
 
         <br/>
 

dashboard/src/views/ActivationView.vue

@@ -114,11 +114,7 @@ onMounted(async () => {
             <small class="text-danger">{{ formError.password }}</small>
           </FormGroup>
 
-          <Checkbox v-model="acceptLicense" id="acceptLicenseInput" style="display: inline-flex;" required>
-            <label for="acceptLicenseInput" class="pankow-checkbox-input-label">Accept Cloudron License
-              <sup style="margin-left: 4px"><a href="https://www.cloudron.io/legal/terms.html" target="_blank"><i class="fa fa-question-circle"></i></a></sup>
-            </label>
-          </Checkbox>
+          <Checkbox v-model="acceptLicense" helpUrl="https://www.cloudron.io/legal/terms.html" required />
         </fieldset>
 
         <div class="actions">

dashboard/src/views/UserDirectoryLdapServerView.vue

@@ -85,7 +85,7 @@ onMounted(async () => {
         <fieldset :disabled="busy">
           <input style="display: none" type="submit" :disabled="busy || !isValid" />
 
-          <Checkbox v-model="enabled" :label="$t('users.exposedLdap.enabled')" style="display: inline-flex; margin-right: 6px;"/><sup><a href="https://docs.cloudron.io/user-directory/#ldap-directory-server" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup>
+          <Checkbox v-model="enabled" :label="$t('users.exposedLdap.enabled')" help-url="https://docs.cloudron.io/user-directory/#ldap-directory-server"/>
 
           <FormGroup>
             <label for="ldapUrlInput">{{ $t('users.exposedLdap.secret.url') }}</label>