From e0db1ac4988aa8eb69d775b973bd25cf7c628255 Mon Sep 17 00:00:00 2001
From: Robert <treboryx@gmail.com>
Date: Sun, 2 Oct 2022 19:08:02 +0300
Subject: [PATCH] fix: styling

---
 .../generators/conf/security.conf.js          |  50 +++------
 .../templates/global_sections/security.vue    | 105 ++++--------------
 2 files changed, 34 insertions(+), 121 deletions(-)

diff --git a/src/nginxconfig/generators/conf/security.conf.js b/src/nginxconfig/generators/conf/security.conf.js
index b87f223..524c70a 100644
--- a/src/nginxconfig/generators/conf/security.conf.js
+++ b/src/nginxconfig/generators/conf/security.conf.js
@@ -32,16 +32,10 @@ export default (domains, global) => {
     config.push(['# security headers', '']);
     config.push(['add_header X-XSS-Protection', '"1; mode=block" always']);
     config.push(['add_header X-Content-Type-Options', '"nosniff" always']);
-    config.push([
-        'add_header Referrer-Policy',
-        `"${global.security.referrerPolicy.computed}" always`,
-    ]);
+    config.push(['add_header Referrer-Policy', `"${global.security.referrerPolicy.computed}" always`]);
 
     if (global.security.contentSecurityPolicy.computed)
-        config.push([
-            'add_header Content-Security-Policy',
-            `"${global.security.contentSecurityPolicy.computed}" always`,
-        ]);
+        config.push(['add_header Content-Security-Policy', `"${global.security.contentSecurityPolicy.computed}" always`]);
 
     if (global.security.permissionsPolicy.computed)
         config.push([
@@ -51,43 +45,27 @@ export default (domains, global) => {
 
     // Every domain has HSTS enabled, and they all have same hstsSubdomains/hstsPreload settings
     if (commonHsts(domains)) {
-        const commonHSTSSubdomains =
-            domains.length && domains[0].https.hstsSubdomains.computed;
-        const commonHSTSPreload =
-            domains.length && domains[0].https.hstsPreload.computed;
-        config.push([
-            'add_header Strict-Transport-Security',
-            `"max-age=31536000${
-                commonHSTSSubdomains ? '; includeSubDomains' : ''
-            }${commonHSTSPreload ? '; preload' : ''}" always`,
-        ]);
+        const commonHSTSSubdomains = domains.length && domains[0].https.hstsSubdomains.computed;
+        const commonHSTSPreload = domains.length && domains[0].https.hstsPreload.computed;
+        config.push(['add_header Strict-Transport-Security', `"max-age=31536000${commonHSTSSubdomains ? '; includeSubDomains' : ''}${commonHSTSPreload ? '; preload' : ''}" always`]);
     }
 
     config.push(['# . files', '']);
-    config.push([
-        'location ~ /\\.(?!well-known)',
-        {
-            deny: 'all',
-        },
-    ]);
+    config.push(['location ~ /\\.(?!well-known)', {
+        deny: 'all',
+    }]);
 
     // Security.txt
     if (global.security.securityTxt.computed) {
         config.push(['# security.txt', '']);
-        config.push([
-            'location /security.txt',
-            {
-                return: '301 /.well-known/security.txt',
-            },
-        ]);
+        config.push(['location /security.txt', {
+            return: '301 /.well-known/security.txt',
+        }]);
 
         // Custom security.txt path
-        config.push([
-            'location = /.well-known/security.txt',
-            {
-                alias: `${global.security.securityTxtPath.value}`,
-            },
-        ]);
+        config.push(['location = /.well-known/security.txt', {
+            alias: `${global.security.securityTxtPath.value}`,
+        }]);
     }
 
     if (global.security.blockCommonExploits.computed) {
diff --git a/src/nginxconfig/templates/global_sections/security.vue b/src/nginxconfig/templates/global_sections/security.vue
index 6451b48..8215bf6 100644
--- a/src/nginxconfig/templates/global_sections/security.vue
+++ b/src/nginxconfig/templates/global_sections/security.vue
@@ -26,19 +26,13 @@ THE SOFTWARE.
 
 <template>
     <div>
-        <div class="field is-horizontal">
+           <div class="field is-horizontal">
             <div class="field-label">
                 <label class="label">Referrer-Policy</label>
             </div>
             <div class="field-body">
                 <div class="field">
-                    <div
-                        :class="
-                            `control${
-                                referrerPolicyChanged ? ' is-changed' : ''
-                            }`
-                        "
-                    >
+                    <div :class="`control${referrerPolicyChanged ? ' is-changed' : ''}`">
                         <VueSelect
                             v-model="referrerPolicy"
                             :options="$props.data.referrerPolicy.options"
@@ -49,48 +43,25 @@ THE SOFTWARE.
             </div>
         </div>
 
-        <div
-            :class="
-                `field is-horizontal${
-                    hasWordPress && !hasUnsafeEval ? ' is-aligned-top' : ''
-                }`
-            "
-        >
+        <div :class="`field is-horizontal${hasWordPress && !hasUnsafeEval ? ' is-aligned-top' : ''}`">
             <div class="field-label">
                 <label class="label">Content-Security-Policy</label>
             </div>
             <div class="field-body">
                 <div class="field">
-                    <div
-                        :class="
-                            `control${
-                                contentSecurityPolicyChanged
-                                    ? ' is-changed'
-                                    : ''
-                            }`
-                        "
-                    >
+                    <div :class="`control${contentSecurityPolicyChanged ? ' is-changed' : ''}`">
                         <input
                             v-model="contentSecurityPolicy"
                             class="input"
                             type="text"
-                            :placeholder="
-                                $props.data.contentSecurityPolicy.default
-                            "
+                            :placeholder="$props.data.contentSecurityPolicy.default"
                         />
                     </div>
-                    <div
-                        v-if="hasWordPress && !hasWordPressUnsafeEval"
-                        class="control"
-                    >
+                    <div v-if="hasWordPress && !hasWordPressUnsafeEval" class="control">
                         <label class="text message is-warning">
                             <span
                                 class="message-body"
-                                v-html="
-                                    $t(
-                                        'templates.globalSections.security.whenUsingWordPressUnsafeEvalIsOftenRequiredToAllowFunctionality'
-                                    )
-                                "
+                                v-html="$t('templates.globalSections.security.whenUsingWordPressUnsafeEvalIsOftenRequiredToAllowFunctionality')"
                             ></span>
                         </label>
                     </div>
@@ -104,13 +75,7 @@ THE SOFTWARE.
             </div>
             <div class="field-body">
                 <div class="field">
-                    <div
-                        :class="
-                            `control${
-                                permissionsPolicyChanged ? ' is-changed' : ''
-                            }`
-                        "
-                    >
+                    <div :class="`control${permissionsPolicyChanged ? ' is-changed' : ''}`">
                         <input
                             v-model="permissionsPolicy"
                             class="input"
@@ -128,17 +93,10 @@ THE SOFTWARE.
             </div>
             <div class="field-body">
                 <div class="field">
-                    <div
-                        :class="
-                            `control${serverTokensChanged ? ' is-changed' : ''}`
-                        "
-                    >
+                    <div :class="`control${serverTokensChanged ? ' is-changed' : ''}`">
                         <div class="checkbox">
-                            <PrettyCheck
-                                v-model="serverTokens"
-                                class="p-default p-curve p-fill p-icon"
-                            >
-                                {{ $t("common.enable") }}
+                            <PrettyCheck v-model="serverTokens" class="p-default p-curve p-fill p-icon">
+                                {{ $t('common.enable') }}
                             </PrettyCheck>
                         </div>
                     </div>
@@ -152,17 +110,10 @@ THE SOFTWARE.
             </div>
             <div class="field-body">
                 <div class="field">
-                    <div
-                        :class="
-                            `control${limitReqChanged ? ' is-changed' : ''}`
-                        "
-                    >
+                    <div :class="`control${limitReqChanged ? ' is-changed' : ''}`">
                         <div class="checkbox">
-                            <PrettyCheck
-                                v-model="limitReq"
-                                class="p-default p-curve p-fill p-icon"
-                            >
-                                {{ $t("common.enable") }}
+                            <PrettyCheck v-model="limitReq" class="p-default p-curve p-fill p-icon">
+                                {{ $t('common.enable') }}
                             </PrettyCheck>
                         </div>
                     </div>
@@ -178,11 +129,8 @@ THE SOFTWARE.
                 <div class="field">
                     <div :class="`control${securityTxt ? ' is-changed' : ''}`">
                         <div class="checkbox">
-                            <PrettyCheck
-                                v-model="securityTxt"
-                                class="p-default p-curve p-fill p-icon"
-                            >
-                                {{ $t("common.enable") }}
+                            <PrettyCheck v-model="securityTxt" class="p-default p-curve p-fill p-icon">
+                                {{ $t('common.enable') }}
                             </PrettyCheck>
                         </div>
                     </div>
@@ -190,20 +138,13 @@ THE SOFTWARE.
             </div>
         </div>
 
-        <div
-            v-if="$props.data.securityTxt.computed"
-            class="field is-horizontal"
-        >
+        <div v-if="$props.data.securityTxt.computed" class="field is-horizontal">
             <div class="field-label">
                 <label class="label">security.txt path</label>
             </div>
             <div class="field-body">
                 <div class="field">
-                    <div
-                        :class="
-                            `control${securityTxtChanged ? ' is-changed' : ''}`
-                        "
-                    >
+                    <div :class="`control${securityTxtChanged ? ' is-changed' : ''}`">
                         <input
                             v-model="securityTxtPath"
                             class="input"
@@ -222,15 +163,9 @@ THE SOFTWARE.
             <div class="field-body">
                 <div class="field">
                     <div
-                        :class="
-                            `control${blockCommonExploits ? ' is-changed' : ''}`
-                        "
-                    >
+                        :class="`control${blockCommonExploits ? ' is-changed' : ''}`">
                         <div class="checkbox">
-                            <PrettyCheck
-                                v-model="blockCommonExploits"
-                                class="p-default p-curve p-fill p-icon"
-                            >
+                            <PrettyCheck  v-model="blockCommonExploits" class="p-default p-curve p-fill p-icon">
                                 {{ $t("common.enable") }}
                             </PrettyCheck>
                         </div>