From 3375d5ae968ec64d0d3347e7bbfa1888045ee43b Mon Sep 17 00:00:00 2001
From: kei5uke <keisuke.konno@ntnu.no>
Date: Mon, 22 Dec 2025 15:56:45 +0100
Subject: [PATCH] feat: prettier and added flebible skippers

---
 .../components/lab-access/LinuxJourney.vue    |  864 +++++++----
 .../components/lab-access/MacJourney.vue      |  988 +++++++-----
 .../theme/components/lab-access/TotpGuide.vue |    9 +-
 .../components/lab-access/WindowsJourney.vue  | 1363 ++++++++++-------
 4 files changed, 2025 insertions(+), 1199 deletions(-)

diff --git a/docs/.vitepress/theme/components/lab-access/LinuxJourney.vue b/docs/.vitepress/theme/components/lab-access/LinuxJourney.vue
index d46359a713d..0d568996628 100644
--- a/docs/.vitepress/theme/components/lab-access/LinuxJourney.vue
+++ b/docs/.vitepress/theme/components/lab-access/LinuxJourney.vue
@@ -1,10 +1,10 @@
 <script setup>
-import { ref, computed, onMounted, getCurrentInstance } from 'vue'
+import { ref, computed, onMounted, getCurrentInstance } from "vue"
 
 const ISSERVER = typeof window === "undefined"
 
 defineOptions({
-  name: "LinuxJourney"
+  name: "LinuxJourney",
 })
 
 // Get route information safely
@@ -15,7 +15,7 @@ const getRouteQuery = () => {
       return instance.appContext.app.config.globalProperties.$route.query
     }
   } catch (error) {
-    console.warn('Vue Router not available, checking URL parameters directly')
+    console.warn("Vue Router not available, checking URL parameters directly")
   }
 
   let urlParams = []
@@ -68,15 +68,15 @@ const passChangedHome = ref(`passwd: Password updated successfully
 Connection to home closed.`)
 
 const guidingOptions = ref([
-  { text: 'New user', value: 'new_user' },
-  { text: 'User to new lab', value: 'new_lab' },
-  { text: 'New computer', value: 'new_computer' },
-  { text: 'SSH reset', value: 'ssh_reset' },
-  { text: 'VPN reset', value: 'vpn_reset' },
-  { text: 'TOTP reset (Google authenticator)', value: 'totp_reset' },
-  { text: 'Workbench reissue', value: 'workbench_reissue' },
-  { text: 'Reissue all', value: 'reissue_all' },
-  { text: 'Lab Migration', value: 'lab_migration' },
+  { text: "New user", value: "new_user" },
+  { text: "User to new lab", value: "new_lab" },
+  { text: "New computer", value: "new_computer" },
+  { text: "SSH reset", value: "ssh_reset" },
+  { text: "VPN reset", value: "vpn_reset" },
+  { text: "TOTP reset (Google authenticator)", value: "totp_reset" },
+  { text: "Workbench reissue", value: "workbench_reissue" },
+  { text: "Reissue all", value: "reissue_all" },
+  { text: "Lab Migration", value: "lab_migration" },
 ])
 
 const filterGuidesByType = ref(null)
@@ -114,7 +114,7 @@ const hostsChangeColor = computed(() => {
 })
 
 const tlsClientIssuer = computed(() => {
-  return props.labName ? `LAB-${props.labName.toUpperCase()} CA` : ''
+  return props.labName ? `LAB-${props.labName.toUpperCase()} CA` : ""
 })
 
 // Methods
@@ -124,11 +124,11 @@ const updateFilter = (value, update = false) => {
   localStorage.labAccessGuideFilter = val && val.value ? val.value : null
 }
 
-const wrap = (template) => {
+const wrap = template => {
   let text = template
-  text = text.replaceAll('{ip_address}', props.ipAddress)
-  text = text.replaceAll('{lab_name}', props.labName)
-  text = text.replaceAll('{username}', props.username)
+  text = text.replaceAll("{ip_address}", props.ipAddress)
+  text = text.replaceAll("{lab_name}", props.labName)
+  text = text.replaceAll("{username}", props.username)
   return text
 }
 
@@ -199,7 +199,11 @@ const getNextItem = (groupId, reset = false) => {
 
 // Lifecycle
 onMounted(() => {
-  if (!filterGuidesByType.value && localStorage.hasOwnProperty('labAccessGuideFilter') && localStorage.labAccessGuideFilter) {
+  if (
+    !filterGuidesByType.value &&
+    localStorage.hasOwnProperty("labAccessGuideFilter") &&
+    localStorage.labAccessGuideFilter
+  ) {
     updateFilter(localStorage.labAccessGuideFilter, true)
   }
 
@@ -235,9 +239,23 @@ onMounted(() => {
 
     <v-card class="mt-6" elevation="1">
       <v-expansion-panels v-model="mainExpansionPanel" elevation="0">
-
         <!-- 1. Fetch secrets -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'ssh_reset', 'vpn_reset', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            [
+              'new_user',
+              'new_computer',
+              'new_lab',
+              'ssh_reset',
+              'vpn_reset',
+              'workbench_reissue',
+              'reissue_all',
+            ].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#fetch-secrets" class="header-anchor">#</a> {{ fetchSecretsId }}. Fetch secrets</h3>
           </v-expansion-panel-title>
@@ -245,8 +263,15 @@ onMounted(() => {
             You have received a link to an encrypted file archive (7-ZIP file).
 
             <ol>
-              <li>Click on the filesender link in the email to download the file and save this on your local computer.</li>
-              <li>Unpack (extract) the file only with <a href="/do-science/tools/transfer/7z/#detail-2-ubuntu" target="_blank">software that supports the 7-ZIP archive format</a>.</li>
+              <li>
+                Click on the filesender link in the email to download the file and save this on your local computer.
+              </li>
+              <li>
+                Unpack (extract) the file only with
+                <a href="/do-science/tools/transfer/7z/#detail-2-ubuntu" target="_blank"
+                  >software that supports the 7-ZIP archive format</a
+                >.
+              </li>
               <li>Use the key named 7-ZIP file key from your Signal transfer to decrypt the 7z archive.</li>
             </ol>
 
@@ -255,7 +280,14 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 2. VPN Access -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'vpn_reset', 'totp_reset', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'vpn_reset', 'totp_reset', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#vpn-config" class="header-anchor">#</a> {{ vpnConfId }}. VPN Access</h3>
           </v-expansion-panel-title>
@@ -283,7 +315,12 @@ onMounted(() => {
               persistent
               scrollable
               max-width="960px"
-              @keydown.esc="vpnDialog = false; vpnStepper = 1"
+              @keydown.esc="
+                () => {
+                  vpnDialog = false
+                  vpnStepper = 1
+                }
+              "
             >
               <v-card>
                 <v-toolbar color="#00509e" theme="dark">
@@ -300,11 +337,14 @@ onMounted(() => {
                       title="Install OpenVPN"
                       value="1"
                       :complete="vpnStepper > 1"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         We use OpenVPN to ensure encrypted communication between your local computer and HUNT Cloud.<br /><br />
 
-                        Install the openvpn and network-manager-openvpn-gnome packages from the standard repositories:<br />
+                        Install the openvpn and network-manager-openvpn-gnome packages from the standard
+                        repositories:<br />
 
                         <CopyTextField
                           :model-value="`sudo apt update && sudo apt install openvpn network-manager-openvpn-gnome`"
@@ -313,12 +353,25 @@ onMounted(() => {
                         />
                         <br />
 
-                        <details><summary style="cursor: pointer;"><b>Other linux distributions</b></summary>
+                        <details>
+                          <summary style="cursor: pointer"><b>Other linux distributions</b></summary>
                           <br />You have a few options on how to install OpenVPN clients in other distributions:<br /><br />
                           <ul>
                             <li>Install the <code>openvpn</code> package from the official distribution repository.</li>
-                            <li>Add the <a href="https://community.openvpn.net/openvpn/wiki/OpenvpnSoftwareRepos" target="_blank">OpenVPN community repository</a> and install the <code>openvpn</code> package.</li>
-                            <li>Download the latest <a href="https://openvpn.net/index.php/open-source/downloads.html" target="_blank">source tarball</a> from OpenVPN and install.</li>
+                            <li>
+                              Add the
+                              <a href="https://community.openvpn.net/openvpn/wiki/OpenvpnSoftwareRepos" target="_blank"
+                                >OpenVPN community repository</a
+                              >
+                              and install the <code>openvpn</code> package.
+                            </li>
+                            <li>
+                              Download the latest
+                              <a href="https://openvpn.net/index.php/open-source/downloads.html" target="_blank"
+                                >source tarball</a
+                              >
+                              from OpenVPN and install.
+                            </li>
                           </ul>
                           <br />
                           After the installation, follow the "Ubuntu Linux" guides below on how to setup and connect.
@@ -335,6 +388,8 @@ onMounted(() => {
                       title="Setup the VPN profile"
                       value="2"
                       :complete="vpnStepper > 2"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         <ol>
@@ -342,10 +397,19 @@ onMounted(() => {
                           <li>Select <i>Edit Connections...</i></li>
                           <li>Click <i>Add</i>.</li>
                           <li>Choose <i>Import a saved VPN configuration</i> and click <i>Create</i>.</li>
-                          <li>Select the OpenVPN profile named <code>{{ username }}.ovpn</code> that you collected in Step 1.</li>
+                          <li>
+                            Select the OpenVPN profile named <code>{{ username }}.ovpn</code> that you collected in Step
+                            1.
+                          </li>
                           <li>Enter your user name (same as the OpenVPN profile file name).</li>
-                          <li>Click on the person icon in the Password field and select <code>Ask for this password every time</code>.</li>
-                          <li>Enter the <i>Private Key Password</i> with the <code>VPN passphrase</code> sent to you from HUNT over Signal.</li>
+                          <li>
+                            Click on the person icon in the Password field and select
+                            <code>Ask for this password every time</code>.
+                          </li>
+                          <li>
+                            Enter the <i>Private Key Password</i> with the <code>VPN passphrase</code> sent to you from
+                            HUNT over Signal.
+                          </li>
                           <li>Click on the IPv4 Settings tab.</li>
                           <li>Click <i>Routes...</i></li>
                           <li>Select the <i>Use this connection only for resources on its network</i> and click OK.</li>
@@ -363,12 +427,17 @@ onMounted(() => {
                       title="Connect to the VPN"
                       value="3"
                       :complete="vpnStepper > 3"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         <ol>
                           <li>Click on the <i>Network Manager</i> icon in the task bar.</li>
                           <li>Choose <i>VPN Connections</i> and select the name of your profile.</li>
-                          <li>In the Authenticate VPN window, enter the <code>verification code</code> from TOTP (Google Authenticator) app into the Password field.</li>
+                          <li>
+                            In the Authenticate VPN window, enter the <code>verification code</code> from TOTP (Google
+                            Authenticator) app into the Password field.
+                          </li>
                           <li>Click <i>OK</i> to connect.</li>
                         </ol>
                         <br /><br />
@@ -385,25 +454,34 @@ onMounted(() => {
                       title="Verify your VPN connection"
                       value="4"
                       :complete="vpnStepper > 4"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
-                        <v-alert
-                          border="start"
-                          border-color="success"
-                          elevation="2"
-                        >
+                        <v-alert border="start" border-color="success" elevation="2">
                           <template v-slot:prepend>
                             <v-icon>mdi-chevron-right</v-icon>
                           </template>
                           <b>Status notification.</b>
                           <hr class="mt-1 mb-2" />
-                          If you received the notification that <code>VPN connection has been successfully established</code>,<br />
+                          If you received the notification that
+                          <code>VPN connection has been successfully established</code>,<br />
                           then you are good to go.
                         </v-alert>
                       </v-card>
 
                       <template v-slot:actions>
-                        <v-btn color="success" class="mx-2 mb-1" @click="vpnDialog = false; vpnStepper = 1;">Finish</v-btn>
+                        <v-btn
+                          color="success"
+                          class="mx-2 mb-1"
+                          @click="
+                            () => {
+                              vpnDialog = false
+                              vpnStepper = 1
+                            }
+                          "
+                          >Finish</v-btn
+                        >
                         <v-btn color="primary" class="mx-2 mb-1" @click="vpnStepper = 1">Start again</v-btn>
                         <v-btn color="warning" class="mx-2 mb-1" @click="vpnStepper = 5">Troubleshooting</v-btn>
                         <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="vpnStepper = 3">Back</v-btn>
@@ -414,18 +492,27 @@ onMounted(() => {
                       title="Troubleshooting VPN"
                       subtitle="Optional tips to try in case of issues"
                       value="5"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         <br />
-                        <h3 id="authenticate-vpn"><a href="#authenticate-vpn" class="header-anchor">#</a> Authenticate VPN</h3>
+                        <h3 id="authenticate-vpn">
+                          <a href="#authenticate-vpn" class="header-anchor">#</a> Authenticate VPN
+                        </h3>
                         <div>
-                          If the <em>Authenticate VPN</em> prompt pops up again, then try to log in again with a new <strong><code>verification code</code></strong>.
+                          If the <em>Authenticate VPN</em> prompt pops up again, then try to log in again with a new
+                          <strong><code>verification code</code></strong
+                          >.
                         </div>
 
                         <br />
-                        <h3 id="vpn-connection-failed"><a href="#vpn-connection-failed" class="header-anchor">#</a> VPN connection failed</h3>
+                        <h3 id="vpn-connection-failed">
+                          <a href="#vpn-connection-failed" class="header-anchor">#</a> VPN connection failed
+                        </h3>
                         <div>
-                          If you received the notification VPN Connection Failed after 60 seconds, please check the following:
+                          If you received the notification VPN Connection Failed after 60 seconds, please check the
+                          following:
                           <ul>
                             <li>Verify that you have an active internet connection.</li>
                             <li>Verify that the Private Key Password is correct.</li>
@@ -433,48 +520,71 @@ onMounted(() => {
                         </div>
 
                         <br />
-                        <h3 id="unable-to-apply-changes"><a href="#unable-to-apply-changes" class="header-anchor">#</a> Unable to apply changes</h3>
+                        <h3 id="unable-to-apply-changes">
+                          <a href="#unable-to-apply-changes" class="header-anchor">#</a> Unable to apply changes
+                        </h3>
                         <div>
-                          If you are unable to click <i>Apply</i> after your changes, try to re-enter your <code>Private Key Password</code> using your VPN passphrase that you received in Signal message.
+                          If you are unable to click <i>Apply</i> after your changes, try to re-enter your
+                          <code>Private Key Password</code> using your VPN passphrase that you received in Signal
+                          message.
                         </div>
 
                         <br />
-                        <h3 id="totp-wrong-credentials"><a href="#totp-wrong-credentials" class="header-anchor">#</a> TOTP wrong credentials</h3>
+                        <h3 id="totp-wrong-credentials">
+                          <a href="#totp-wrong-credentials" class="header-anchor">#</a> TOTP wrong credentials
+                        </h3>
                         <div>
                           If you received an error "wrong credentials" after using your TOTP authenticator:
                           <ul>
-                            <li>Make sure your phone is connected to internet for time synchronization. Time zone between phone and your machine should match.</li>
+                            <li>
+                              Make sure your phone is connected to internet for time synchronization. Time zone between
+                              phone and your machine should match.
+                            </li>
                           </ul>
                         </div>
 
                         <br />
-                        <h3 id="could-not-read-auth-error"><a href="#could-not-read-auth-error" class="header-anchor">#</a> Could not read Auth error</h3>
+                        <h3 id="could-not-read-auth-error">
+                          <a href="#could-not-read-auth-error" class="header-anchor">#</a> Could not read Auth error
+                        </h3>
                         <div>
-                          The error messages below indicates that TOTP (Google Auth) code is not accepted.
-                          You should try to setup your TOTP one more time or request a TOTP reset in Service desk.
-                          <div class="language- extra-class"><pre class="language-text">
+                          The error messages below indicates that TOTP (Google Auth) code is not accepted. You should
+                          try to setup your TOTP one more time or request a TOTP reset in Service desk.
+                          <div class="language- extra-class">
+                            <pre class="language-text">
                             <code v-text="`ERROR: could not read Auth username/password/ok/string from management interface`"></code>
-                          </pre></div>
-
+                          </pre>
+                          </div>
                         </div>
 
                         <br />
-                        <h3 id="could-not-read-private-key-error"><a href="#could-not-read-private-key-error" class="header-anchor">#</a> Could not read Private Key error</h3>
+                        <h3 id="could-not-read-private-key-error">
+                          <a href="#could-not-read-private-key-error" class="header-anchor">#</a> Could not read Private
+                          Key error
+                        </h3>
                         <div>
-                          The error messages below indicates that there is a typo in the Private Key Password (step 2.3.5) and you need to type it in again.
-                          <div class="language- extra-class"><pre class="language-text">
+                          The error messages below indicates that there is a typo in the Private Key Password (step
+                          2.3.5) and you need to type it in again.
+                          <div class="language- extra-class">
+                            <pre class="language-text">
                             <code v-text="`ERROR: could not read Private Key username/password/ok/string from management interface`"></code>
-                          </pre></div>
+                          </pre>
+                          </div>
 
-                          <div class="language- extra-class"><pre class="language-text">
+                          <div class="language- extra-class">
+                            <pre class="language-text">
                             <code v-text="`Cannot load private key file`"></code>
-                          </pre></div>
+                          </pre>
+                          </div>
                         </div>
 
                         <br />
-                        <h3 id="test-firewall"><a href="#test-firewall" class="header-anchor">#</a> Detect firewall blocks</h3>
+                        <h3 id="test-firewall">
+                          <a href="#test-firewall" class="header-anchor">#</a> Detect firewall blocks
+                        </h3>
                         <div>
-                          If you want to check whether your VPN connection is blocked by the firewall, install nmap using: <code>sudo apt install nmap</code> and then run:
+                          If you want to check whether your VPN connection is blocked by the firewall, install nmap
+                          using: <code>sudo apt install nmap</code> and then run:
                         </div>
                         <CopyTextField
                           :model-value="`sudo nmap -sU -Pn --traceroute -p U:1194 129.241.176.121`"
@@ -483,23 +593,33 @@ onMounted(() => {
                           placeholder=""
                         />
                         <div class="mt-2">
-                          If traceroute ends with <code>129.241.176.121</code> no blocking was detected. Although if tracing seems stuck send us a screenshot in service desk.
+                          If traceroute ends with <code>129.241.176.121</code> no blocking was detected. Although if
+                          tracing seems stuck send us a screenshot in service desk.
                         </div>
 
-                        <v-alert
-                          border="start"
-                          border-color="info"
-                          class="mt-6"
-                          elevation="2"
-                        >
+                        <v-alert border="start" border-color="info" class="mt-6" elevation="2">
                           <template v-slot:title><b>TIP</b></template>
-                          If nothing works, please head over to our main <a href="/do-science/troubleshooting/connection/#vpn" target="_blank">troubleshooting section</a> for more information on how to troubleshoot connections.
+                          If nothing works, please head over to our main
+                          <a href="/do-science/troubleshooting/connection/#vpn" target="_blank"
+                            >troubleshooting section</a
+                          >
+                          for more information on how to troubleshoot connections.
                         </v-alert>
                       </v-card>
 
                       <template v-slot:actions>
                         <v-btn color="primary" class="mx-2 mb-1" @click="vpnStepper = 1">Start again</v-btn>
-                        <v-btn color="success" class="mx-2 mb-1" @click="vpnDialog = false; vpnStepper = 1;">Finish</v-btn>
+                        <v-btn
+                          color="success"
+                          class="mx-2 mb-1"
+                          @click="
+                            () => {
+                              vpnDialog = false
+                              vpnStepper = 1
+                            }
+                          "
+                          >Finish</v-btn
+                        >
                         <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="vpnStepper = 4">Back</v-btn>
                       </template>
                     </v-stepper-vertical-item>
@@ -513,7 +633,14 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 3. SSH Passphrase change -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_lab', 'ssh_reset', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_lab', 'ssh_reset', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#ssh-passphrase" class="header-anchor">#</a> {{ passChangeId }}. SSH Passphrase change</h3>
           </v-expansion-panel-title>
@@ -527,12 +654,8 @@ onMounted(() => {
               Ensure that you are logged into VPN.
             </v-alert>
 
-            <v-col cols="12">
-              {{ getNextItem(passChangeId, true) }} Design <DesignNewPassphrase />.
-            </v-col>
-            <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Start Terminal application.
-            </v-col>
+            <v-col cols="12"> {{ getNextItem(passChangeId, true) }} Design <DesignNewPassphrase />. </v-col>
+            <v-col cols="12"> {{ getNextItem(passChangeId) }} Start Terminal application. </v-col>
             <v-col cols="12">
               {{ getNextItem(passChangeId) }} Login to entry machine.
               <CopyTextField
@@ -543,28 +666,34 @@ onMounted(() => {
               />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} You should then be prompted to enter a password. Enter your <code>SSH temporary key</code> from Signal message.
-              <div class="language- extra-class"><pre class="language-text">
+              {{ getNextItem(passChangeId) }} You should then be prompted to enter a password. Enter your
+              <code>SSH temporary key</code> from Signal message.
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="`${username}@${ipAddress}'s password:`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} When asked for current UNIX password type in your <code>SSH temporary key</code> from Signal message.
-              <div class="language- extra-class"><pre class="language-text">
+              {{ getNextItem(passChangeId) }} When asked for current UNIX password type in your
+              <code>SSH temporary key</code> from Signal message.
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="passExpiredText"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Enter your new passphrase and retype for verification. You will be kicked off the entry machine right after your password is changed.
-              <div class="language- extra-class"><pre class="language-text">
+              {{ getNextItem(passChangeId) }} Enter your new passphrase and retype for verification. You will be kicked
+              off the entry machine right after your password is changed.
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="passSetNew"></code>
-              </pre></div>
-              <v-alert
-                border="start"
-                border-color="warning"
-                elevation="2"
-              >
-                If you are getting an <code>Authentication token manipulation error</code> check strength requirements for passphrase in step {{ passChangeId }}.1.
+              </pre>
+              </div>
+              <v-alert border="start" border-color="warning" elevation="2">
+                If you are getting an <code>Authentication token manipulation error</code> check strength requirements
+                for passphrase in step {{ passChangeId }}.1.
               </v-alert>
             </v-col>
             <v-col cols="12">
@@ -578,12 +707,15 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Expected result:
-              <div class="language- extra-class"><pre class="language-text">
+              <div class="language- extra-class">
+                <pre class="language-text">
                   <code v-text="`${username}@${labName}-entry:~$`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} When logged into your <code>entry</code> machine, connect to your <code>home</code> machine.
+              {{ getNextItem(passChangeId) }} When logged into your <code>entry</code> machine, connect to your
+              <code>home</code> machine.
               <CopyTextField
                 :model-value="`ssh -o StrictHostKeyChecking=accept-new home`"
                 label=""
@@ -592,19 +724,25 @@ onMounted(() => {
               />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} You will be prompted to type your <code>SSH temporary key</code> from Signal message.
+              {{ getNextItem(passChangeId) }} You will be prompted to type your <code>SSH temporary key</code> from
+              Signal message.
               <!-- <div class="language- extra-class"><pre class="language-text">
                   <code v-text="`${username}@home's password:`"></code>
               </pre></div> -->
-              <div class="language- extra-class"><pre class="language-text">
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="passExpiredText"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Similar to above, you will be asked for a new password. Type your new passphrase two times.
-              <div class="language- extra-class"><pre class="language-text">
+              {{ getNextItem(passChangeId) }} Similar to above, you will be asked for a new password. Type your new
+              passphrase two times.
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="passSetNew"></code>
-              </pre></div>
+              </pre>
+              </div>
               <!-- Expected result:
               <div class="language- extra-class"><pre class="language-text">
                 <code v-text="passChangedHome"></code>
@@ -621,15 +759,24 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Expected result:
-              <div class="language- extra-class"><pre class="language-text">
+              <div class="language- extra-class">
+                <pre class="language-text">
                   <code v-text="`${username}@${labName}-home:~$`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
               {{ getNextItem(passChangeId) }} Close Terminal window to make sure you are disconnected from your lab.
             </v-col>
 
-            <v-btn v-if="['lab_migration'].includes(filterGuidesByType)" color="primary" class="mx-2 my-2" size="small" @click="nextPanel(2)">Next</v-btn>
+            <v-btn
+              v-if="['lab_migration'].includes(filterGuidesByType)"
+              color="primary"
+              class="mx-2 my-2"
+              size="small"
+              @click="nextPanel(2)"
+              >Next</v-btn
+            >
             <v-btn v-else color="primary" class="mx-2 my-2" size="small" @click="nextPanel()">Next</v-btn>
           </v-expansion-panel-text>
         </v-expansion-panel>
@@ -638,17 +785,27 @@ onMounted(() => {
         <!-- For brevity, I'll include a few more key panels and indicate where the rest would go -->
 
         <!-- 4. SSH Passwordless access -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
-            <h3><a href="#passwordless-access" class="header-anchor">#</a> {{ passLessId }}. SSH Passwordless access</h3>
+            <h3>
+              <a href="#passwordless-access" class="header-anchor">#</a> {{ passLessId }}. SSH Passwordless access
+            </h3>
           </v-expansion-panel-title>
 
           <v-expansion-panel-text id="passwordless-access" ref="passwordlessAccessRef" class="mt-2">
             <v-row>
               <v-col cols="12">
-                {{ getNextItem(passLessId, true) }} Open new Terminal window (<code>CTRL + ALT + T</code>) and generate ssh key. If command reports that id_rsa key already exists, to avoid overwriting your existing keys press <code>n</code> and skip to next step.
+                {{ getNextItem(passLessId, true) }} Open new Terminal window (<code>CTRL + ALT + T</code>) and generate
+                ssh key. If command reports that id_rsa key already exists, to avoid overwriting your existing keys
+                press <code>n</code> and skip to next step.
                 <CopyTextField
-                  :value='`ssh-keygen -q -t rsa -b 4096 -f ~/.ssh/id_rsa -N ""`'
+                  :value="`ssh-keygen -q -t rsa -b 4096 -f ~/.ssh/id_rsa -N &quot;&quot;`"
                   class="my-0"
                   label=""
                   prefix="$"
@@ -659,7 +816,7 @@ onMounted(() => {
               <v-col cols="12">
                 {{ getNextItem(passLessId) }} Start ssh-agent.
                 <CopyTextField
-                  :value='`eval "$(ssh-agent -s)"`'
+                  :value="`eval &quot;$(ssh-agent -s)&quot;`"
                   class="my-0"
                   label=""
                   prefix="$"
@@ -724,15 +881,22 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 5. SSH Config file -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#ssh-config" class="header-anchor">#</a> {{ sshConfId }}. SSH Config file</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="ssh-config" ref="sshConfigRef" class="mt-2">
-
             <!-- Place in <code>~/.ssh/config</code>. -->
             <v-col cols="12">
-              {{ getNextItem(sshConfId, true) }} Open new Terminal window (<code>CTRL + ALT + T</code>) and assure SSH Config file exists. No output is expected.
+              {{ getNextItem(sshConfId, true) }} Open new Terminal window (<code>CTRL + ALT + T</code>) and assure SSH
+              Config file exists. No output is expected.
               <CopyTextField
                 :model-value="`touch ~/.ssh/config`"
                 class="my-2"
@@ -752,7 +916,8 @@ onMounted(() => {
               />
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
-              {{ getNextItem(sshConfId) }} Replace old lab configuration in SSH Config opened in Text Editor and then save changes.
+              {{ getNextItem(sshConfId) }} Replace old lab configuration in SSH Config opened in Text Editor and then
+              save changes.
               <CopyTextArea
                 :model-value="configText"
                 class="my-2"
@@ -762,7 +927,8 @@ onMounted(() => {
               />
             </v-col>
             <v-col v-else cols="12">
-              {{ getNextItem(sshConfId) }} Add lab configuration into SSH Config opened in Text Editor and then save changes.
+              {{ getNextItem(sshConfId) }} Add lab configuration into SSH Config opened in Text Editor and then save
+              changes.
               <CopyTextArea
                 :model-value="configText"
                 class="my-2"
@@ -800,37 +966,31 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 6. Hosts file -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#hosts-file" class="header-anchor">#</a> {{ hostsFileId }}. Workbench - hosts file</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="hosts-file" ref="hostsFileRef" class="mt-2">
             Let's set up your hosts file on your local computer. <br />
-            This allows you to connect to HUNT Workbench in your lab using a domain name {{ fqdn }}.
-            <br /><br />
+            This allows you to connect to HUNT Workbench in your lab using a domain name {{ fqdn }}. <br /><br />
             <v-col cols="12">
-              {{ getNextItem(hostsFileId, true) }} On your local computer, open your /etc/hosts file in your preferred text editor.
-              You will be asked for administrator password of your local computer.
-              <br /><br />
+              {{ getNextItem(hostsFileId, true) }} On your local computer, open your /etc/hosts file in your preferred
+              text editor. You will be asked for administrator password of your local computer. <br /><br />
               Use this command if prefer graphical editor <strong>Gedit</strong>:
-              <CopyTextField
-                :value="`sudo gedit /etc/hosts`"
-                class="my-2"
-                label=""
-                prefix="$"
-                placeholder=""
-              />
+              <CopyTextField :value="`sudo gedit /etc/hosts`" class="my-2" label="" prefix="$" placeholder="" />
               If you prefer terminal editor <strong>vim</strong> simply run:
-              <CopyTextField
-                :value="`sudo vim /etc/hosts`"
-                class="my-2"
-                label=""
-                prefix="$"
-                placeholder=""
-              />
+              <CopyTextField :value="`sudo vim /etc/hosts`" class="my-2" label="" prefix="$" placeholder="" />
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
-              {{ getNextItem(hostsFileId) }} Make sure the line with the old hosts record is removed. <strong>Search and remove lines</strong> containing domain name:<br />
+              {{ getNextItem(hostsFileId) }} Make sure the line with the old hosts record is removed.
+              <strong>Search and remove lines</strong> containing domain name:<br />
               <CopyTextField
                 :value="fqdn"
                 class="my-2"
@@ -840,7 +1000,8 @@ onMounted(() => {
               />
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
-              {{ getNextItem(hostsFileId) }} Add (append) the new <strong>hosts record</strong> below to the text file:<br />
+              {{ getNextItem(hostsFileId) }} Add (append) the new <strong>hosts record</strong> below to the text
+              file:<br />
               <CopyTextField
                 :value="hostsWorkbench"
                 class="my-2"
@@ -861,21 +1022,32 @@ onMounted(() => {
               />
               Make sure to avoid duplicate records.
             </v-col>
-            <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} Save the changes and close your text editor.
-            </v-col>
-            <v-btn v-if="['lab_migration'].includes(filterGuidesByType)" color="primary" class="mx-2 my-2" size="small" @click="nextPanel(2)">Next</v-btn>
+            <v-col cols="12"> {{ getNextItem(hostsFileId) }} Save the changes and close your text editor. </v-col>
+            <v-btn
+              v-if="['lab_migration'].includes(filterGuidesByType)"
+              color="primary"
+              class="mx-2 my-2"
+              size="small"
+              @click="nextPanel(2)"
+              >Next</v-btn
+            >
             <v-btn v-else color="primary" class="mx-2 my-2" size="small" @click="nextPanel()">Next</v-btn>
           </v-expansion-panel-text>
         </v-expansion-panel>
 
         <!-- 7. Workbench -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#workbench" class="header-anchor">#</a> {{ workbenchId }}. Workbench - certificate</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="workbench" class="mt-2">
-
             <v-row class="my-1 mx-1">
               <v-col cols="12">
                 <strong>Follow installation of Workbench certificate to configure your access:</strong>
@@ -895,7 +1067,8 @@ onMounted(() => {
                 </v-btn>
               </v-col>
               <v-col cols="12">
-                <a href="/do-science/hunt-workbench/" target="_blank">HUNT Workbench</a> provides you with web-based access to modern data science tools such as Jupyter Notebooks, Python, RStudio, R and MATLAB.
+                <a href="/do-science/hunt-workbench/" target="_blank">HUNT Workbench</a> provides you with web-based
+                access to modern data science tools such as Jupyter Notebooks, Python, RStudio, R and MATLAB.
               </v-col>
             </v-row>
 
@@ -904,7 +1077,12 @@ onMounted(() => {
               persistent
               scrollable
               max-width="960px"
-              @keydown.esc="workbenchDialog = false; workbenchStepper = 1"
+              @keydown.esc="
+                () => {
+                  workbenchDialog = false
+                  workbenchStepper = 1
+                }
+              "
             >
               <v-card elevation="0">
                 <v-card-title class="pa-0">
@@ -919,28 +1097,14 @@ onMounted(() => {
 
                 <v-card-text class="pa-0">
                   <v-stepper-vertical v-model="workbenchStepper">
-                    <v-stepper-vertical-item
-                      :complete="workbenchStepper > 1"
-                      value="1"
-                      title="Checks"
-                    >
-                      <v-card
-                        class="mb-12 pr-4"
-                        elevation="0"
-                      >
-                        <v-alert
-                          border="start"
-                          border-color="warning"
-                          elevation="2"
-                          class="mb-4"
-                        >
-                          Make sure you have received your Workbench certificate (<code>{{ labName }}-{{ username }}.p12</code>).
+                    <v-stepper-vertical-item :complete="workbenchStepper > 1" value="1" title="Checks">
+                      <v-card class="mb-12 pr-4" elevation="0">
+                        <v-alert border="start" border-color="warning" elevation="2" class="mb-4">
+                          Make sure you have received your Workbench certificate (<code
+                            >{{ labName }}-{{ username }}.p12</code
+                          >).
                         </v-alert>
-                        <v-alert
-                          border="start"
-                          border-color="warning"
-                          elevation="2"
-                        >
+                        <v-alert border="start" border-color="warning" elevation="2">
                           Assure working VPN connection.
                         </v-alert>
                       </v-card>
@@ -956,48 +1120,54 @@ onMounted(() => {
                       value="2"
                       title="Install your certificates"
                     >
-                      <v-card
-                        class="mb-8 pr-4"
-                        elevation="0"
-                      >
-                        <v-alert
-                          border="start"
-                          border-color="info"
-                          elevation="2"
-                        >
-                          We recommend that you use <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all HUNT Workbench applications to work correctly.
+                      <v-card class="mb-8 pr-4" elevation="0">
+                        <v-alert border="start" border-color="info" elevation="2">
+                          We recommend that you use
+                          <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all
+                          HUNT Workbench applications to work correctly.
                         </v-alert>
 
                         <ol>
+                          <li>Open <strong>Google Chrome</strong> on your local computer.</li>
                           <li>
-                            Open <strong>Google Chrome</strong> on your local computer.
-                          </li>
-                          <li>
-                            Download our public CA certificate from <a href="https://pki.hdc.ntnu.no/hctsca1.crt" target="_blank">https://pki.hdc.ntnu.no/hctsca1.crt</a>
+                            Download our public CA certificate from
+                            <a href="https://pki.hdc.ntnu.no/hctsca1.crt" target="_blank"
+                              >https://pki.hdc.ntnu.no/hctsca1.crt</a
+                            >
                           </li>
                           <li>
-                            In Google Chrome, open the URL <a href="chrome://settings/certificates" target="_blank">chrome://settings/certificates</a> and navigate to section <code>Authorities</code>.
+                            In Google Chrome, open the URL
+                            <a href="chrome://settings/certificates" target="_blank">chrome://settings/certificates</a>
+                            and navigate to section <code>Authorities</code>.
                           </li>
                           <li>
-                            Click the <strong>Import</strong> button on the right side of the screen to import <code>hctsca1.crt</code> certificate file.
+                            Click the <strong>Import</strong> button on the right side of the screen to import
+                            <code>hctsca1.crt</code> certificate file.
                           </li>
                           <li>
                             Select first option Trust this certificate for identifying websites.
                             <br />
-                            <img class="pa-2" alt="import-ca-trust-websites" src="/img/workbench/import-ca-trust-websites.png" style="max-width: 500px;" />
+                            <img
+                              class="pa-2"
+                              alt="import-ca-trust-websites"
+                              src="/img/workbench/import-ca-trust-websites.png"
+                              style="max-width: 500px"
+                            />
                             <br />
                           </li>
                           <li>
-                            Within <a href="chrome://settings/certificates" target="_blank">chrome://settings/certificates</a> navigate to section <code>Your certificates</code>
-                            and click the <strong>Import</strong> button on the right side of the screen.
-                          </li>
-                          <li>
-                            Browse and select your <code style="font-weight: bold;">{{ labName}}-{{ username }}.p12</code> file that you downloaded to your local computer,
-                            and enter the <strong>TLS passphrase</strong> that we sent you on Signal.
+                            Within
+                            <a href="chrome://settings/certificates" target="_blank">chrome://settings/certificates</a>
+                            navigate to section <code>Your certificates</code> and click the
+                            <strong>Import</strong> button on the right side of the screen.
                           </li>
                           <li>
-                            Restart <strong>Google Chrome</strong>.
+                            Browse and select your
+                            <code style="font-weight: bold">{{ labName }}-{{ username }}.p12</code> file that you
+                            downloaded to your local computer, and enter the <strong>TLS passphrase</strong> that we
+                            sent you on Signal.
                           </li>
+                          <li>Restart <strong>Google Chrome</strong>.</li>
                         </ol>
                       </v-card>
 
@@ -1007,54 +1177,49 @@ onMounted(() => {
                       </template>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="workbenchStepper > 3"
-                      value="3"
-                      title="Login to Workbench"
-                    >
-                      <v-card
-                        class="mb-8 pr-16"
-                        elevation="0"
-                      >
-                        <v-alert
-                          border="start"
-                          border-color="warning"
-                          elevation="2"
-                          class="mb-4"
-                        >
+                    <v-stepper-vertical-item :complete="workbenchStepper > 3" value="3" title="Login to Workbench">
+                      <v-card class="mb-8 pr-16" elevation="0">
+                        <v-alert border="start" border-color="warning" elevation="2" class="mb-4">
                           <strong>Make sure you are connected to the VPN before you access your HUNT Workbench.</strong>
                         </v-alert>
-                        <v-alert
-                          border="start"
-                          border-color="info"
-                          elevation="2"
-                        >
-                          We recommend to use <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all HUNT Workbench applications to work correctly.
+                        <v-alert border="start" border-color="info" elevation="2">
+                          We recommend to use
+                          <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all
+                          HUNT Workbench applications to work correctly.
                         </v-alert>
 
                         <ol>
-                          <li>
-                            Open your web browser.
-                          </li>
+                          <li>Open your web browser.</li>
                           <li>
                             Open the URL address below to access your lab in your web browser:
                             <br />
-                            <strong><a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a></strong>
+                            <strong
+                              ><a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a></strong
+                            >
                             <br /><br />
                             You may get a User Identification Request for your new certificate.<br />
                             Verify that the certificates are issued by HUNT Cloud:
                             <br />
-                            <div class="language- extra-class"><pre class="language-text">
+                            <div class="language- extra-class">
+                              <pre class="language-text">
                               <code v-html='`Issuer: "${tlsClientIssuer}"\nOrganization: "HUNT Cloud"\nIssued Under: "HUNT Cloud Trust Services"`'></code>
-                            </pre></div>
+                            </pre>
+                            </div>
                             <br />
-                            Ensure that the <code>Remember this decision</code> box is checked, and click <code>OK</code>.
+                            Ensure that the <code>Remember this decision</code> box is checked, and click
+                            <code>OK</code>.
                             <br />
-                            <img class="pa-2" alt="chrome_select_certificate_confirm" src="/img/workbench/chrome_select_certificate_confirm.png" style="max-width: 300px;" />
+                            <img
+                              class="pa-2"
+                              alt="chrome_select_certificate_confirm"
+                              src="/img/workbench/chrome_select_certificate_confirm.png"
+                              style="max-width: 300px"
+                            />
                             <br />
                           </li>
                           <li class="mb-2">
-                            Sign in with your HUNT Cloud <strong>username</strong> and <strong>lab passphrase</strong>.<br />
+                            Sign in with your HUNT Cloud <strong>username</strong> and
+                            <strong>lab passphrase</strong>.<br />
                             Lab passphrase is the same passphrase that you created yourself on your first SSH login.<br />
                             <CopyTextField
                               :value="username"
@@ -1066,12 +1231,19 @@ onMounted(() => {
                             If you did not create a lab passphrase yet use a temporary SSH passphrase that you received
                             from us on Signal message to login and then follow passphrase change flow.
                             <br />
-                            <img class="pa-2" alt="workbench-login-form" src="/img/workbench/workbench-login-form.png" style="max-width: 250px;" />
+                            <img
+                              class="pa-2"
+                              alt="workbench-login-form"
+                              src="/img/workbench/workbench-login-form.png"
+                              style="max-width: 250px"
+                            />
                             <br />
                           </li>
                           <li>
-                            With a little bit of luck you should now see your new HUNT Workbench.
-                            Feel free to read our <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guide</a>.
+                            With a little bit of luck you should now see your new HUNT Workbench. Feel free to read our
+                            <a href="/do-science/hunt-workbench/getting-started/" target="_blank"
+                              >getting started guide</a
+                            >.
                             <br />
                             <strong>Click around and explore your new world!</strong>
                           </li>
@@ -1080,20 +1252,25 @@ onMounted(() => {
 
                         <img class="pa-2" alt="JupyterLab" src="/img/workbench/JupyterLab.png" />
 
-                        <v-alert
-                          border="start"
-                          border-color="info"
-                          elevation="2"
-                        >
+                        <v-alert border="start" border-color="info" elevation="2">
                           <b>Remember to bookmark your Lab address</b>
                           <hr class="mt-1 mb-2" />
-                          <code>https://{{fqdn}}</code>
+                          <code>https://{{ fqdn }}</code>
                         </v-alert>
-
                       </v-card>
 
                       <template v-slot:actions>
-                        <v-btn color="success" class="mx-2 mb-1" @click="workbenchDialog = false; workbenchStepper = 1;">Finish</v-btn>
+                        <v-btn
+                          color="success"
+                          class="mx-2 mb-1"
+                          @click="
+                            () => {
+                              workbenchDialog = false
+                              workbenchStepper = 1
+                            }
+                          "
+                          >Finish</v-btn
+                        >
                         <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 1">Start again</v-btn>
                         <v-btn color="warning" class="mx-2 mb-1" @click="workbenchStepper++">Troubleshooting</v-btn>
                         <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper--">Back</v-btn>
@@ -1106,115 +1283,162 @@ onMounted(() => {
                       title="Troubleshooting"
                       subtitle="Optional tips to try in case of issues"
                     >
-                      <v-card
-                        class="mb-8 pr-4 ml-0 pl-0"
-                        elevation="0"
-                      >
-                      This section includes issues that you might encounter during your first setup.
-                      See our <a href="/do-science/hunt-workbench/faq/" target="_blank">HUNT Workbench FAQ</a> and <a href="/do-science/hunt-workbench/troubleshooting/" target="_blank">HUNT Workbench Troubleshooting</a> if you do not find your answers below.
-
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>This site can't be reached</strong></summary>
+                      <v-card class="mb-8 pr-4 ml-0 pl-0" elevation="0">
+                        This section includes issues that you might encounter during your first setup. See our
+                        <a href="/do-science/hunt-workbench/faq/" target="_blank">HUNT Workbench FAQ</a> and
+                        <a href="/do-science/hunt-workbench/troubleshooting/" target="_blank"
+                          >HUNT Workbench Troubleshooting</a
+                        >
+                        if you do not find your answers below.
+
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>This site can't be reached</strong></summary>
                           <div class="pl-4 pr-16 py-2">
-                            1. If you are getting <code>DNS_PROBE_FINISHED_NXDOMAIN</code> error you need to repeat the <code style="font-size: 90% !important;">{{ hostsFileId }}. Workbench - hosts file</code> guide.
-                            <br/>
-                            2. If you are getting <code>ERR_CONNECTION_TIMED_OUT</code> error you need to make sure that you are connected to VPN. If you are able to ssh into lab your VPN is fine, and you need to repeat the <code>6. Workbench - hosts file</code> guide.
+                            1. If you are getting <code>DNS_PROBE_FINISHED_NXDOMAIN</code> error you need to repeat the
+                            <code style="font-size: 90% !important">{{ hostsFileId }}. Workbench - hosts file</code>
+                            guide.
+                            <br />
+                            2. If you are getting <code>ERR_CONNECTION_TIMED_OUT</code> error you need to make sure that
+                            you are connected to VPN. If you are able to ssh into lab your VPN is fine, and you need to
+                            repeat the <code>6. Workbench - hosts file</code> guide.
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>I don't remember my passphrase</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>I don't remember my passphrase</strong></summary>
                           <div class="pl-4 pr-16 py-2">
-                            Don't worry. Request a <a href="/do-science/service-desk/#ssh-passphrase-reset" target="_blank">reset of SSH passphrase</a> in our "do-science" Service desk.
+                            Don't worry. Request a
+                            <a href="/do-science/service-desk/#ssh-passphrase-reset" target="_blank"
+                              >reset of SSH passphrase</a
+                            >
+                            in our "do-science" Service desk.
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>Nginx error - 403 Forbidden</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>Nginx error - 403 Forbidden</strong></summary>
                           <div class="pl-4 pr-16 py-2">
                             This error means that you are attempting to connect without client certificate.
-                            <br /><br/>
+                            <br /><br />
                             There are 3 different causes each requires a different approach
                             <ol>
                               <li>
-                                If you have just installed a fresh client certificate, <strong>restart your computer</strong> to make sure certificates are applied.
+                                If you have just installed a fresh client certificate,
+                                <strong>restart your computer</strong> to make sure certificates are applied.
                               </li>
                               <br />
                               <li>
-                                If you have not yet installed a fresh client certificate on this computer, review the section <strong>Install your certificates</strong> above. Start by click on blue button <code>Start again</code>.
+                                If you have not yet installed a fresh client certificate on this computer, review the
+                                section <strong>Install your certificates</strong> above. Start by click on blue button
+                                <code>Start again</code>.
                               </li>
                               <br />
                               <li>
-                                If you have used Workbench in {{ labName }} lab before, this error means that your certificate expired and you can follow this link to <a href="/do-science/service-desk/#hunt-workbench-reissue" target="_blank">request Workbench reissue</a>. Once your request is processed we will send you a fresh certificate.
+                                If you have used Workbench in {{ labName }} lab before, this error means that your
+                                certificate expired and you can follow this link to
+                                <a href="/do-science/service-desk/#hunt-workbench-reissue" target="_blank"
+                                  >request Workbench reissue</a
+                                >. Once your request is processed we will send you a fresh certificate.
                               </li>
                             </ol>
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>Firefox - Did Not Connect</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>Firefox - Did Not Connect</strong></summary>
                           <div class="pl-4 pr-16 py-2">
-                            <v-alert
-                              border="start"
-                              border-color="info"
-                              elevation="2"
-                            >
-                              We recommend to use <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all HUNT Workbench applications to work correctly.
+                            <v-alert border="start" border-color="info" elevation="2">
+                              We recommend to use
+                              <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all
+                              HUNT Workbench applications to work correctly.
                             </v-alert>
 
-                            Firefox may require that you manually import the HUNT Cloud Certificate Authority to consider it trusted.
-
-                            If you see Error code: <code>SEC_ERROR_UNKNOWN_ISSUER</code> when accessing Workbench follow these steps:
+                            Firefox may require that you manually import the HUNT Cloud Certificate Authority to
+                            consider it trusted. If you see Error code: <code>SEC_ERROR_UNKNOWN_ISSUER</code> when
+                            accessing Workbench follow these steps:
 
                             <ol>
                               <li>
-                                Download our public CA certificate from <a href="https://pki.hdc.ntnu.no/hctsca1.crt" target="_blank">https://pki.hdc.ntnu.no/hctsca1.crt</a>
-                              </li>
-                              <li>
-                                Open the following Firefox URL: <code>about:preferences#privacy</code>.
+                                Download our public CA certificate from
+                                <a href="https://pki.hdc.ntnu.no/hctsca1.crt" target="_blank"
+                                  >https://pki.hdc.ntnu.no/hctsca1.crt</a
+                                >
                               </li>
+                              <li>Open the following Firefox URL: <code>about:preferences#privacy</code>.</li>
                               <li>
-                                Scroll down to section <code>Certificates</code> and click on <code>View Certificates</code>.
+                                Scroll down to section <code>Certificates</code> and click on
+                                <code>View Certificates</code>.
                                 <br />
-                                <img class="pa-2" alt="mac-firefox-certificates" src="/img/workbench/mac-firefox-certificates.png" />
+                                <img
+                                  class="pa-2"
+                                  alt="mac-firefox-certificates"
+                                  src="/img/workbench/mac-firefox-certificates.png"
+                                />
                                 <br />
                               </li>
                               <li>
                                 Switch to tab <code>Authorities</code> and click on <code>Import</code>.
                                 <br />
-                                <img class="pa-2" alt="mac-firefox-import-cert" src="/img/workbench/mac-firefox-import-cert.png" />
+                                <img
+                                  class="pa-2"
+                                  alt="mac-firefox-import-cert"
+                                  src="/img/workbench/mac-firefox-import-cert.png"
+                                />
                                 <br />
                               </li>
                               <li>
-                                Select <code>hctsca1.crt</code> and check option <code>Trust this CA to identify websites</code>.
+                                Select <code>hctsca1.crt</code> and check option
+                                <code>Trust this CA to identify websites</code>.
                                 <br />
-                                <img class="pa-2" alt="mac-firefox-trust-ca" src="/img/workbench/mac-firefox-trust-ca.png" />
+                                <img
+                                  class="pa-2"
+                                  alt="mac-firefox-trust-ca"
+                                  src="/img/workbench/mac-firefox-trust-ca.png"
+                                />
                                 <br />
                               </li>
                             </ol>
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>Chrome on Ubuntu</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>Chrome on Ubuntu</strong></summary>
                           <div class="pl-4 pr-16 py-2">
                             <ol>
                               <li>
-                                In Google Chrome, open the URL <a href="chrome://settings/certificates" target="_blank">chrome://settings/certificates</a> and navigate to section <code>Authorities</code>.
+                                In Google Chrome, open the URL
+                                <a href="chrome://settings/certificates" target="_blank"
+                                  >chrome://settings/certificates</a
+                                >
+                                and navigate to section <code>Authorities</code>.
                               </li>
+                              <li>Search for HUNT Cloud certificates (<code>org-HUNT Cloud Trust Services</code>).</li>
                               <li>
-                                Search for HUNT Cloud certificates (<code>org-HUNT Cloud Trust Services</code>).
-                              </li>
-                              <li>
-                                Edit the HCTS CA 1 certificate and select first option <code>Trust this certificate for identifying websites</code>.
+                                Edit the HCTS CA 1 certificate and select first option
+                                <code>Trust this certificate for identifying websites</code>.
                                 <br />
-                                <img class="pa-2" alt="import-ca-trust-websites" src="/img/workbench/import-ca-trust-websites.png" />
+                                <img
+                                  class="pa-2"
+                                  alt="import-ca-trust-websites"
+                                  src="/img/workbench/import-ca-trust-websites.png"
+                                />
                                 <br />
                               </li>
                             </ol>
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>502 Bad gateway</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>502 Bad gateway</strong></summary>
                           <div class="pl-4 pr-16 py-2">
-                            A 502 Bad gateway error when accessing <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a>
-                            is an indication that something is wrong with the configuration on the server side.<br />
-                            Contact us in your lab channel on Slack (#lab-{{ labName }}) or <a href="/do-science/service-desk/#general-service-request" target="_blank">Service desk email</a> further investigations.
+                            A 502 Bad gateway error when accessing
+                            <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a> is an
+                            indication that something is wrong with the configuration on the server side.<br />
+                            Contact us in your lab channel on Slack (#lab-{{ labName }}) or
+                            <a href="/do-science/service-desk/#general-service-request" target="_blank"
+                              >Service desk email</a
+                            >
+                            further investigations.
                           </div>
                         </details>
 
@@ -1227,22 +1451,33 @@ onMounted(() => {
 
                       <template v-slot:actions>
                         <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 1">Start again</v-btn>
-                        <v-btn color="success" class="mx-2 mb-1" @click="workbenchDialog = false; workbenchStepper = 1;">Finish</v-btn>
+                        <v-btn
+                          color="success"
+                          class="mx-2 mb-1"
+                          @click="
+                            () => {
+                              workbenchDialog = false
+                              workbenchStepper = 1
+                            }
+                          "
+                          >Finish</v-btn
+                        >
                         <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper--">Back</v-btn>
                       </template>
                     </v-stepper-vertical-item>
-
                   </v-stepper-vertical>
                 </v-card-text>
               </v-card>
             </v-dialog>
 
             <v-col cols="12">
-              After you have successfully completed all the steps, you can start using your Workbench environment by opening this URL address: <a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a>
+              After you have successfully completed all the steps, you can start using your Workbench environment by
+              opening this URL address: <a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a>
             </v-col>
 
             <v-col cols="12">
-              <details class="my-2"><summary style="cursor: pointer;"><strong>Workbench Control panel</strong></summary>
+              <details class="my-2">
+                <summary style="cursor: pointer"><strong>Workbench Control panel</strong></summary>
                 <div class="pl-4 pr-16 py-2">
                   You can access Control panel on this URL address:
                   <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a>
@@ -1260,28 +1495,31 @@ onMounted(() => {
             <h3><a href="#where-to-go-next" class="header-anchor">#</a> Where to go next</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="where-to-go-next" class="mt-2">
-            <v-sheet
-              rounded="lg"
-              width="100%"
-              class="pa-4 text-center mx-auto"
-            >
-              <v-icon
-                class="mb-5"
-                color="success"
-                size="100"
-              >mdi-check-circle</v-icon>
+            <v-sheet rounded="lg" width="100%" class="pa-4 text-center mx-auto">
+              <v-icon class="mb-5" color="success" size="100">mdi-check-circle</v-icon>
 
               <h2 class="text-h5 mb-6">You have configured your lab access</h2>
 
               <p class="mb-4 text-medium-emphasis text-body-2">
-                Feel free to continue reading our <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guides</a> and figure out which <a href="/do-science/tools/" target="_blank">tools</a> do you need for your work.
-                <br>
+                Feel free to continue reading our
+                <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guides</a> and
+                figure out which <a href="/do-science/tools/" target="_blank">tools</a> do you need for your work.
+                <br />
                 Otherwise, you're done!
               </p>
               <v-row>
                 <v-col cols="12">
-                  <v-btn color="success" class="mx-2 mb-1" :href="`https://${fqdn}`" target="_blank" elevation="3">Open Workbench</v-btn>
-                  <v-btn color="primary" class="mx-2 mb-1" :href="`https://${fqdn}/hub/home`" target="_blank" elevation="3">Control panel</v-btn>
+                  <v-btn color="success" class="mx-2 mb-1" :href="`https://${fqdn}`" target="_blank" elevation="3"
+                    >Open Workbench</v-btn
+                  >
+                  <v-btn
+                    color="primary"
+                    class="mx-2 mb-1"
+                    :href="`https://${fqdn}/hub/home`"
+                    target="_blank"
+                    elevation="3"
+                    >Control panel</v-btn
+                  >
                 </v-col>
               </v-row>
             </v-sheet>
@@ -1291,20 +1529,15 @@ onMounted(() => {
     </v-card>
 
     <v-card elevation="1" class="mt-4">
-      <v-card-title class="pt-3 pb-2" style="font-weight: 400;">
-        Optional guides
-      </v-card-title>
+      <v-card-title class="pt-3 pb-2" style="font-weight: 400"> Optional guides </v-card-title>
       <v-expansion-panels v-model="extrasExpansionPanel" elevation="0">
-
         <!-- Copy SSH Public key -->
         <v-expansion-panel>
           <v-expansion-panel-title>
             <h3><a href="#copypubkey" class="header-anchor">#</a> Copy SSH Public key</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="copypubkey" class="mt-2">
-            <v-col cols="12">
-              1. Open new Terminal window (<code>CTRL + ALT + T</code>).
-            </v-col>
+            <v-col cols="12"> 1. Open new Terminal window (<code>CTRL + ALT + T</code>). </v-col>
             <v-col cols="10">
               2. If you don't have xclip installed yet run installation.
               <CopyTextField
@@ -1325,9 +1558,7 @@ onMounted(() => {
                 placeholder="Your link is missing access token"
               />
             </v-col>
-            <v-col cols="12">
-              3. Paste (CTRL+V) your SSH Public key where needed.
-            </v-col>
+            <v-col cols="12"> 3. Paste (CTRL+V) your SSH Public key where needed. </v-col>
           </v-expansion-panel-text>
         </v-expansion-panel>
 
@@ -1337,12 +1568,9 @@ onMounted(() => {
             <h3><a href="#troubleshooting" class="header-anchor">#</a> Troubleshooting</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="troubleshooting" class="mt-2">
-            <v-col cols="12">
-              WIP
-            </v-col>
+            <v-col cols="12"> WIP </v-col>
           </v-expansion-panel-text>
         </v-expansion-panel>
-
       </v-expansion-panels>
     </v-card>
   </v-sheet>
@@ -1371,24 +1599,24 @@ pre code {
   background-color: unset;
   color: rgba(204, 204, 204, 1) !important;
 }
-pre[class*=language-] {
-  margin: .85rem 0;
+pre[class*="language-"] {
+  margin: 0.85rem 0;
   padding-bottom: 4px !important;
   padding-top: 4px !important;
 }
-div[class*=language-] {
+div[class*="language-"] {
   position: relative;
   background-color: #282c34;
   border-radius: 6px;
   overflow-x: unset;
 }
-div[class*=language-]:before {
+div[class*="language-"]:before {
   position: absolute;
   z-index: 3;
-  top: .8em;
+  top: 0.8em;
   right: 1em;
-  font-size: .75rem;
-  color: hsla(0, 0%, 100%, .4);
+  font-size: 0.75rem;
+  color: hsla(0, 0%, 100%, 0.4);
 }
 
 .v-overlay__content ul {
@@ -1404,7 +1632,7 @@ div[class*=language-]:before {
   background-color: rgba(0, 0, 0, 0.05) !important;
   padding: 0.2em 0.4em;
 }
-.v-overlay__content pre[class*=language-] {
+.v-overlay__content pre[class*="language-"] {
   padding-bottom: 8px !important;
   padding-top: 8px !important;
 }
diff --git a/docs/.vitepress/theme/components/lab-access/MacJourney.vue b/docs/.vitepress/theme/components/lab-access/MacJourney.vue
index 0b8e122bdab..fe51949d594 100644
--- a/docs/.vitepress/theme/components/lab-access/MacJourney.vue
+++ b/docs/.vitepress/theme/components/lab-access/MacJourney.vue
@@ -1,10 +1,10 @@
 <script setup>
-import { ref, computed, onMounted, getCurrentInstance } from 'vue'
+import { ref, computed, onMounted, getCurrentInstance } from "vue"
 
 const ISSERVER = typeof window === "undefined"
 
 defineOptions({
-  name: "MacJourney"
+  name: "MacJourney",
 })
 
 // Props definition
@@ -23,7 +23,7 @@ const getRouteQuery = () => {
       return instance.appContext.app.config.globalProperties.$route.query
     }
   } catch (error) {
-    console.warn('Vue Router not available, checking URL parameters directly')
+    console.warn("Vue Router not available, checking URL parameters directly")
   }
 
   let urlParams = []
@@ -63,15 +63,15 @@ Connection to {ip_address} closed.`)
 const passChangedHome = ref(`passwd: Password updated successfully
 Connection to home closed.`)
 const guidingOptions = ref([
-  { text: 'New user', value: 'new_user' },
-  { text: 'User to new lab', value: 'new_lab' },
-  { text: 'New computer', value: 'new_computer' },
-  { text: 'SSH reset', value: 'ssh_reset' },
-  { text: 'VPN reset', value: 'vpn_reset' },
-  { text: 'TOTP reset (Google authenticator)', value: 'totp_reset' },
-  { text: 'Workbench reissue', value: 'workbench_reissue' },
-  { text: 'Reissue all', value: 'reissue_all' },
-  { text: 'Lab Migration', value: 'lab_migration' },
+  { text: "New user", value: "new_user" },
+  { text: "User to new lab", value: "new_lab" },
+  { text: "New computer", value: "new_computer" },
+  { text: "SSH reset", value: "ssh_reset" },
+  { text: "VPN reset", value: "vpn_reset" },
+  { text: "TOTP reset (Google authenticator)", value: "totp_reset" },
+  { text: "Workbench reissue", value: "workbench_reissue" },
+  { text: "Reissue all", value: "reissue_all" },
+  { text: "Lab Migration", value: "lab_migration" },
 ])
 const filterGuidesByType = ref(null)
 
@@ -96,9 +96,11 @@ const hostsWorkbench = computed(() => {
 })
 
 const hostsCyberduck = computed(() => {
-  return props.ipAddress && props.labName ? `10.5.5.12    home
+  return props.ipAddress && props.labName
+    ? `10.5.5.12    home
 ${props.ipAddress}    ${props.labName}-entry
-` : null
+`
+    : null
 })
 
 const fqdn = computed(() => {
@@ -106,7 +108,7 @@ const fqdn = computed(() => {
 })
 
 const tlsClientIssuer = computed(() => {
-  return props.labName ? `LAB-${props.labName.toUpperCase()} CA` : ''
+  return props.labName ? `LAB-${props.labName.toUpperCase()} CA` : ""
 })
 
 // Methods
@@ -116,35 +118,35 @@ const updateFilter = (value, update = false) => {
   localStorage.labAccessGuideFilter = val && val.value ? val.value : null
 }
 
-const wrap = (template) => {
+const wrap = template => {
   let text = template
-  text = text.replaceAll('{ip_address}', props.ipAddress)
-  text = text.replaceAll('{lab_name}', props.labName)
-  text = text.replaceAll('{username}', props.username)
+  text = text.replaceAll("{ip_address}", props.ipAddress)
+  text = text.replaceAll("{lab_name}", props.labName)
+  text = text.replaceAll("{username}", props.username)
   return text
 }
 
-const copyText = async (text) => {
+const copyText = async text => {
   try {
     if (navigator.clipboard && window.isSecureContext) {
-      await navigator.clipboard.writeText(text || '')
+      await navigator.clipboard.writeText(text || "")
     } else {
-      console.warn('Clipboard API not available')
+      console.warn("Clipboard API not available")
     }
   } catch (error) {
-    console.error('Failed to copy text:', error)
+    console.error("Failed to copy text:", error)
   }
 }
 
-const copyTextArea = async (text) => {
+const copyTextArea = async text => {
   try {
     if (navigator.clipboard && window.isSecureContext) {
-      await navigator.clipboard.writeText(text || '')
+      await navigator.clipboard.writeText(text || "")
     } else {
-      console.warn('Clipboard API not available')
+      console.warn("Clipboard API not available")
     }
   } catch (error) {
-    console.error('Failed to copy text:', error)
+    console.error("Failed to copy text:", error)
   }
 }
 
@@ -163,7 +165,11 @@ const getNextItem = (groupId, reset = false) => {
 
 // Lifecycle
 onMounted(() => {
-  if (!filterGuidesByType.value && localStorage.hasOwnProperty('labAccessGuideFilter') && localStorage.labAccessGuideFilter) {
+  if (
+    !filterGuidesByType.value &&
+    localStorage.hasOwnProperty("labAccessGuideFilter") &&
+    localStorage.labAccessGuideFilter
+  ) {
     updateFilter(localStorage.labAccessGuideFilter, true)
   }
 
@@ -199,9 +205,23 @@ onMounted(() => {
 
     <v-card class="mt-6" elevation="1">
       <v-expansion-panels v-model="mainExpansionPanel" elevation="0">
-
         <!-- 1. Fetch secrets -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'ssh_reset', 'vpn_reset', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            [
+              'new_user',
+              'new_computer',
+              'new_lab',
+              'ssh_reset',
+              'vpn_reset',
+              'workbench_reissue',
+              'reissue_all',
+            ].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#fetch-secrets" class="header-anchor">#</a> {{ fetchSecretsId }}. Fetch secrets</h3>
           </v-expansion-panel-title>
@@ -209,8 +229,15 @@ onMounted(() => {
             You have received a link to an encrypted file archive (7-ZIP file).
 
             <ol>
-              <li>Click on the filesender link in the email to download the file and save this on your local computer.</li>
-              <li>Unpack (extract) the file only with <a href="/do-science/tools/transfer/7z/#detail-2-macos" target="_blank">software that supports the 7-ZIP archive format</a>.</li>
+              <li>
+                Click on the filesender link in the email to download the file and save this on your local computer.
+              </li>
+              <li>
+                Unpack (extract) the file only with
+                <a href="/do-science/tools/transfer/7z/#detail-2-macos" target="_blank"
+                  >software that supports the 7-ZIP archive format</a
+                >.
+              </li>
               <li>Use the key named 7-ZIP file key from your Signal transfer to decrypt the 7z archive.</li>
             </ol>
 
@@ -226,12 +253,20 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 2. VPN Access -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'vpn_reset', 'totp_reset', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'vpn_reset', 'totp_reset', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#vpn-config" class="header-anchor">#</a> {{ vpnConfId }}. VPN Access</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="vpn-config" class="mt-2">
-            If you have not setup <b>HUNT Cloud VPN</b> yet follow <i>TOTP</i> and <i>Tunnelblick</i> configuration guides:
+            If you have not setup <b>HUNT Cloud VPN</b> yet follow <i>TOTP</i> and <i>Tunnelblick</i> configuration
+            guides:
 
             <TotpGuide />
 
@@ -254,7 +289,12 @@ onMounted(() => {
               persistent
               scrollable
               max-width="960px"
-              @keydown.esc="vpnDialog = false; vpnStepper = 1"
+              @keydown.esc="
+                () => {
+                  vpnDialog = false
+                  vpnStepper = 1
+                }
+              "
             >
               <v-card>
                 <v-card-title class="pa-0">
@@ -268,19 +308,29 @@ onMounted(() => {
                 </v-card-title>
 
                 <v-card-text class="pa-0">
-                  <v-stepper-vertical v-model="vpnStepper" hide-actions>
+                  <v-stepper-vertical v-model="vpnStepper" :mandatory="false" hide-actions>
                     <v-stepper-vertical-item
                       :complete="vpnStepper > 1"
                       value="1"
                       title="Install Tunnelblick"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         <v-card-text>
-                          We use <code>Tunnelblick</code> to ensure encrypted communication between your local computer and HUNT Cloud.<br /><br />
+                          We use <code>Tunnelblick</code> to ensure encrypted communication between your local computer
+                          and HUNT Cloud.<br /><br />
 
-                          <a href="https://tunnelblick.net/iprelease/Latest_Tunnelblick_Stable.dmg" target="_blank">Download and install Tunnelblick from this page.</a>
+                          <a href="https://tunnelblick.net/iprelease/Latest_Tunnelblick_Stable.dmg" target="_blank"
+                            >Download and install Tunnelblick from this page.</a
+                          >
                           <br /><br />
-                          In case the link above does not start download <a href="https://tunnelblick.net/downloads.html#:~:text=GnuPG%20v2%20signature-,Stable,-Tunnelblick" target="_blank">lookup the 'Stable' release from this download page (opens new window).</a>
+                          In case the link above does not start download
+                          <a
+                            href="https://tunnelblick.net/downloads.html#:~:text=GnuPG%20v2%20signature-,Stable,-Tunnelblick"
+                            target="_blank"
+                            >lookup the 'Stable' release from this download page (opens new window).</a
+                          >
                           <br /><br />
                         </v-card-text>
                       </v-card>
@@ -295,6 +345,8 @@ onMounted(() => {
                       :complete="vpnStepper > 2"
                       value="2"
                       title="Setup the VPN profile"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         <v-card-text>
@@ -303,20 +355,38 @@ onMounted(() => {
                           <ol>
                             <li>Select I have configuration files.</li>
                             <li>In the Welcome to Tunnelblick prompt, select I have configuration files.</li>
-                            <li>When prompted for which type of configuration you have, select OpenVPN Configurations.</li>
-                            <li>Select the OpenVPN profile named <code>{{ username }}.ovpn</code> in the collection of credentials given from HUNT Cloud.</li>
+                            <li>
+                              When prompted for which type of configuration you have, select OpenVPN Configurations.
+                            </li>
+                            <li>
+                              Select the OpenVPN profile named <code>{{ username }}.ovpn</code> in the collection of
+                              credentials given from HUNT Cloud.
+                            </li>
                             <li>Continue with the Connecting to the VPN section below.</li>
                           </ol>
 
                           <br />
-                          <b>If you 'do not' get prompted with the Welcome to Tunnelblick message, follow these steps:</b>
+                          <b
+                            >If you 'do not' get prompted with the Welcome to Tunnelblick message, follow these
+                            steps:</b
+                          >
 
                           <ol>
-                            <li>Find the OpenVPN profile named <code>{{ username }}.ovpn</code> that you collected in Step 1.</li>
-                            <li>Right-click the file OpenVPN profile named <code>{{ username }}.ovpn</code>.</li>
+                            <li>
+                              Find the OpenVPN profile named <code>{{ username }}.ovpn</code> that you collected in Step
+                              1.
+                            </li>
+                            <li>
+                              Right-click the file OpenVPN profile named <code>{{ username }}.ovpn</code>.
+                            </li>
                             <li>Select <code>Open With</code> -> <code>Tunnelblick</code>.</li>
-                            <li>When prompted for <code>Install Configuration For All Users</code>, select <code>Only Me</code>.</li>
-                            <li>Enter your macOS password to allow Tunnelblick to install the OpenVPN configuration.</li>
+                            <li>
+                              When prompted for <code>Install Configuration For All Users</code>, select
+                              <code>Only Me</code>.
+                            </li>
+                            <li>
+                              Enter your macOS password to allow Tunnelblick to install the OpenVPN configuration.
+                            </li>
                             <li>Continue with the <code>Connecting to the VPN section</code> below.</li>
                           </ol>
                         </v-card-text>
@@ -332,6 +402,8 @@ onMounted(() => {
                       :complete="vpnStepper > 3"
                       value="3"
                       title="Connect to the VPN"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         <v-card-text>
@@ -353,14 +425,18 @@ onMounted(() => {
                               <img alt="tunnelblick-login" src="/img/vpn/tunnelblick-login.png" /> <br />
                             </li>
                             <li>
-                              When prompted for a Private Key Password or Passphrase, insert the VPN passphrase from Signal message.
+                              When prompted for a Private Key Password or Passphrase, insert the VPN passphrase from
+                              Signal message.
+                              <br />
+                              <img alt="tunnelblick-long-passphrase" src="/img/vpn/tunnelblick-long-passphrase.png" />
                               <br />
-                              <img alt="tunnelblick-long-passphrase" src="/img/vpn/tunnelblick-long-passphrase.png" /> <br />
                               Your authentication will fail when you complete your passphrase above.<br />
                               This is expected since your verification code timed out while you typed your passphrase.
                               <br /><br />
                             </li>
-                            <li>Now try again to connect with a fresh verification code from Google Authenticator (TOTP).</li>
+                            <li>
+                              Now try again to connect with a fresh verification code from Google Authenticator (TOTP).
+                            </li>
                           </ol>
                           <br /><br />
                           You should now be connected to the VPN.
@@ -377,28 +453,37 @@ onMounted(() => {
                       :complete="vpnStepper > 4"
                       value="4"
                       title="Verify your VPN connection"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-16" elevation="0">
                         <v-card-text>
-                          <v-alert
-                            border="start"
-                            border-color="success"
-                            elevation="2"
-                            icon="mdi-chevron-right"
-                          >
+                          <v-alert border="start" border-color="success" elevation="2" icon="mdi-chevron-right">
                             <b>Tunnelblick window should state "Connected".</b>
                             <hr class="mt-1 mb-2" />
-                            A small Tunnelblick window should state <b>"Connected"</b> in green letters
-                            with a timer that count the connection length.
-                            <br /><br />
-                            You should also see it by hovering your mouse over Tunnelblick icon
-                            in <a href="https://support.apple.com/en-ie/guide/mac-help/mchlp1446/mac" target="_blank">the menu bar</a>.
+                            A small Tunnelblick window should state <b>"Connected"</b> in green letters with a timer
+                            that count the connection length. <br /><br />
+                            You should also see it by hovering your mouse over Tunnelblick icon in
+                            <a href="https://support.apple.com/en-ie/guide/mac-help/mchlp1446/mac" target="_blank"
+                              >the menu bar</a
+                            >.
                           </v-alert>
                         </v-card-text>
                       </v-card>
 
                       <template v-slot:actions>
-                        <v-btn color="success" class="mx-2 mb-1" @click="vpnDialog = false; vpnStepper = 1;">Finish</v-btn>
+                        <v-btn
+                          color="success"
+                          class="mx-2 mb-1"
+                          @click="
+                            () => {
+                              vpnDialog = false
+                              vpnStepper = 1
+                            }
+                          "
+                        >
+                          Fin
+                        </v-btn>
                         <v-btn color="primary" class="mx-2 mb-1" @click="vpnStepper = 1">Start again</v-btn>
                         <v-btn color="warning" class="mx-2 mb-1" @click="vpnStepper = 5">Troubleshooting</v-btn>
                         <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="vpnStepper = 3">Back</v-btn>
@@ -409,19 +494,28 @@ onMounted(() => {
                       value="5"
                       title="Troubleshooting VPN"
                       subtitle="Optional tips to try in case of issues"
+                      editable
+                      edit-icon
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         <v-card-text>
                           <br />
-                          <h3 id="authenticate-vpn"><a href="#authenticate-vpn" class="header-anchor">#</a> Authenticate VPN</h3>
+                          <h3 id="authenticate-vpn">
+                            <a href="#authenticate-vpn" class="header-anchor">#</a> Authenticate VPN
+                          </h3>
                           <div>
-                            If the <em>Authenticate VPN</em> prompt pops up again, then try to log in again with a new <strong><code>verification code</code></strong>.
+                            If the <em>Authenticate VPN</em> prompt pops up again, then try to log in again with a new
+                            <strong><code>verification code</code></strong
+                            >.
                           </div>
 
                           <br />
-                          <h3 id="vpn-connection-failed"><a href="#vpn-connection-failed" class="header-anchor">#</a> VPN connection failed</h3>
+                          <h3 id="vpn-connection-failed">
+                            <a href="#vpn-connection-failed" class="header-anchor">#</a> VPN connection failed
+                          </h3>
                           <div>
-                            If you received the notification VPN Connection Failed after 60 seconds, please check the following:
+                            If you received the notification VPN Connection Failed after 60 seconds, please check the
+                            following:
                             <ul>
                               <li>Verify that you have an active internet connection.</li>
                               <li>Verify that the Private Key Password is correct.</li>
@@ -429,72 +523,114 @@ onMounted(() => {
                           </div>
 
                           <br />
-                          <h3 id="totp-wrong-credentials"><a href="#totp-wrong-credentials" class="header-anchor">#</a> TOTP wrong credentials</h3>
+                          <h3 id="totp-wrong-credentials">
+                            <a href="#totp-wrong-credentials" class="header-anchor">#</a> TOTP wrong credentials
+                          </h3>
                           <div>
                             If you received an error "wrong credentials" after using your TOTP authenticator:
                             <ul>
-                              <li>Make sure your phone is connected to internet for time synchronization. Time zone between phone and your machine should match.</li>
+                              <li>
+                                Make sure your phone is connected to internet for time synchronization. Time zone
+                                between phone and your machine should match.
+                              </li>
                             </ul>
                           </div>
 
                           <br />
-                          <h3 id="could-not-read-auth-error"><a href="#could-not-read-auth-error" class="header-anchor">#</a> Could not read Auth error</h3>
+                          <h3 id="could-not-read-auth-error">
+                            <a href="#could-not-read-auth-error" class="header-anchor">#</a> Could not read Auth error
+                          </h3>
                           <div>
-                            The error messages below indicates that TOTP (Google Auth) code is not accepted.
-                            You should try to setup your TOTP one more time or request a TOTP reset in Service desk.
-                            <div class="language- extra-class"><pre class="language-text">
+                            The error messages below indicates that TOTP (Google Auth) code is not accepted. You should
+                            try to setup your TOTP one more time or request a TOTP reset in Service desk.
+                            <div class="language- extra-class">
+                              <pre class="language-text">
                               <code v-text="`ERROR: could not read Auth username/password/ok/string from management interface`"></code>
-                            </pre></div>
+                            </pre>
+                            </div>
                           </div>
 
-                          <h3 id="could-not-read-private-key-error"><a href="#could-not-read-private-key-error" class="header-anchor">#</a> Could not read Private Key error</h3>
+                          <h3 id="could-not-read-private-key-error">
+                            <a href="#could-not-read-private-key-error" class="header-anchor">#</a> Could not read
+                            Private Key error
+                          </h3>
                           <div>
-                            The error messages below indicates that there is a typo in the Private Key Password (step 2.3.5) and you need to type it in again.
-                            <div class="language- extra-class"><pre class="language-text">
+                            The error messages below indicates that there is a typo in the Private Key Password (step
+                            2.3.5) and you need to type it in again.
+                            <div class="language- extra-class">
+                              <pre class="language-text">
                               <code v-text="`ERROR: could not read Private Key username/password/ok/string from management interface`"></code>
-                            </pre></div>
+                            </pre>
+                            </div>
 
-                            <div class="language- extra-class"><pre class="language-text">
+                            <div class="language- extra-class">
+                              <pre class="language-text">
                               <code v-text="`Cannot load private key file`"></code>
-                            </pre></div>
+                            </pre>
+                            </div>
                           </div>
 
                           <br />
-                          <h3 id="remove-passphrase"><a href="#remove-passphrase" class="header-anchor">#</a> Remove saved passphrase</h3>
-                          <p>
-                            If you need to remove your passphrase because of typo or SSH reissue.
-                          </p>
+                          <h3 id="remove-passphrase">
+                            <a href="#remove-passphrase" class="header-anchor">#</a> Remove saved passphrase
+                          </h3>
+                          <p>If you need to remove your passphrase because of typo or SSH reissue.</p>
                           <p>
                             1. Click on running Tunnelblick icon in upper menu bar and select VPN details...
-                            <img alt="VPN passphrase removal - step 1" src="/img/vpn/VPNremovalstep1.png" style="height: 150px;" />
+                            <img
+                              alt="VPN passphrase removal - step 1"
+                              src="/img/vpn/VPNremovalstep1.png"
+                              style="height: 150px"
+                            />
                           </p>
                           <p>
-                            2. Select your VPN profile on the left side of the window. Then, in the bottom left corner, select expansion window marked with 3 dots in a circle.
-                            <img alt="VPN passphrase removal - step 2" src="/img/vpn/VPNremovalstep2.png" style="height: 150px;" />
+                            2. Select your VPN profile on the left side of the window. Then, in the bottom left corner,
+                            select expansion window marked with 3 dots in a circle.
+                            <img
+                              alt="VPN passphrase removal - step 2"
+                              src="/img/vpn/VPNremovalstep2.png"
+                              style="height: 150px"
+                            />
                           </p>
                           <p>
-                            3. At the very bottom of the newly opened widow, select <code>Delete configuration's credentials in keychain</code>
-                            <img alt="VPN passphrase removal - step 3" src="/img/vpn/VPNremovalstep3.png" style="height: 250px;" />
+                            3. At the very bottom of the newly opened widow, select
+                            <code>Delete configuration's credentials in keychain</code>
+                            <img
+                              alt="VPN passphrase removal - step 3"
+                              src="/img/vpn/VPNremovalstep3.png"
+                              style="height: 250px"
+                            />
                           </p>
 
                           <br />
-                          <h3 id="remove-vpn-config"><a href="#remove-vpn-config" class="header-anchor">#</a> Remove VPN config</h3>
-                          <p>
-                            If you need to remove your VPN config because SSH reissue or reactivation.
-                          </p>
+                          <h3 id="remove-vpn-config">
+                            <a href="#remove-vpn-config" class="header-anchor">#</a> Remove VPN config
+                          </h3>
+                          <p>If you need to remove your VPN config because SSH reissue or reactivation.</p>
                           <p>
                             1. Click on running Tunnelblick icon in upper menu bar and select VPN details...
-                            <img alt="VPN config removal - step 1" src="/img/vpn/VPNremovalstep1.png" style="height: 150px;" />
+                            <img
+                              alt="VPN config removal - step 1"
+                              src="/img/vpn/VPNremovalstep1.png"
+                              style="height: 150px"
+                            />
                           </p>
                           <p>
                             2. Afterwards, select your VPN profile and delete it from Tunnelblick app.
-                            <img alt="VPN config removal - step 2" src="/img/vpn/VPNconfigremove1.png" style="height: 250px;"/>
+                            <img
+                              alt="VPN config removal - step 2"
+                              src="/img/vpn/VPNconfigremove1.png"
+                              style="height: 250px"
+                            />
                           </p>
 
                           <br />
-                          <h3 id="test-firewall"><a href="#test-firewall" class="header-anchor">#</a> Detect firewall blocks</h3>
+                          <h3 id="test-firewall">
+                            <a href="#test-firewall" class="header-anchor">#</a> Detect firewall blocks
+                          </h3>
                           <p>
-                            If you want to check whether your VPN connection is blocked by the firewall, install nmap using: <code>brew install nmap</code> and then run:
+                            If you want to check whether your VPN connection is blocked by the firewall, install nmap
+                            using: <code>brew install nmap</code> and then run:
                           </p>
                           <CopyTextField
                             :model-value="`sudo nmap -sU -Pn --traceroute -p U:1194 129.241.176.121`"
@@ -503,24 +639,34 @@ onMounted(() => {
                             placeholder=""
                           />
                           <div class="mt-2">
-                            If traceroute ends with <code>129.241.176.121</code> no blocking was detected. Although if tracing seems stuck send us a screenshot in service desk.
+                            If traceroute ends with <code>129.241.176.121</code> no blocking was detected. Although if
+                            tracing seems stuck send us a screenshot in service desk.
                           </div>
 
-                          <v-alert
-                            border="start"
-                            border-color="info"
-                            elevation="2"
-                            class="mt-6"
-                          >
+                          <v-alert border="start" border-color="info" elevation="2" class="mt-6">
                             <template v-slot:title><b>TIP</b></template>
-                            If nothing works, please head over to our main <a href="/do-science/troubleshooting/connection/#vpn" target="_blank">troubleshooting section</a> for more information on how to troubleshoot connections.
+                            If nothing works, please head over to our main
+                            <a href="/do-science/troubleshooting/connection/#vpn" target="_blank"
+                              >troubleshooting section</a
+                            >
+                            for more information on how to troubleshoot connections.
                           </v-alert>
                         </v-card-text>
                       </v-card>
 
                       <template v-slot:actions>
                         <v-btn color="primary" class="mx-2 mb-1" @click="vpnStepper = 1">Start again</v-btn>
-                        <v-btn color="success" class="mx-2 mb-1" @click="vpnDialog = false; vpnStepper = 1;">Finish</v-btn>
+                        <v-btn
+                          color="success"
+                          class="mx-2 mb-1"
+                          @click="
+                            () => {
+                              vpnDialog = false
+                              vpnStepper = 1
+                            }
+                          "
+                          >Finish</v-btn
+                        >
                         <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="vpnStepper = 4">Back</v-btn>
                       </template>
                     </v-stepper-vertical-item>
@@ -541,12 +687,18 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 3. SSH Passphrase change -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_lab', 'ssh_reset', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_lab', 'ssh_reset', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
-              <h3><a href="#ssh-passphrase" class="header-anchor">#</a> {{ passChangeId }}. SSH Passphrase change</h3>
+            <h3><a href="#ssh-passphrase" class="header-anchor">#</a> {{ passChangeId }}. SSH Passphrase change</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="ssh-passphrase" class="mt-2">
-
             <v-alert
               v-show="filterGuidesByType && ['new_lab', 'ssh_reset', 'lab_migration'].includes(filterGuidesByType)"
               border="start"
@@ -563,12 +715,8 @@ onMounted(() => {
               poster="/img/video-covers/lab-access-macOS-ssh-passphrase-v1.jpg"
             />
 
-            <v-col cols="12">
-              {{ getNextItem(passChangeId, true) }} Design <DesignNewPassphrase />.
-            </v-col>
-            <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Start Terminal application.
-            </v-col>
+            <v-col cols="12"> {{ getNextItem(passChangeId, true) }} Design <DesignNewPassphrase />. </v-col>
+            <v-col cols="12"> {{ getNextItem(passChangeId) }} Start Terminal application. </v-col>
             <v-col cols="12">
               {{ getNextItem(passChangeId) }} Login to entry machine.
               <CopyTextField
@@ -579,7 +727,8 @@ onMounted(() => {
               />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} You should then be prompted to enter a password. Enter your <code>SSH temporary key</code> from Signal message.
+              {{ getNextItem(passChangeId) }} You should then be prompted to enter a password. Enter your
+              <code>SSH temporary key</code> from Signal message.
               <div class="language- extra-class">
                 <pre class="language-text">
                   <code v-text="`${username}@${ipAddress}'s password:`"></code>
@@ -587,22 +736,25 @@ onMounted(() => {
               </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} When asked for current UNIX password type in your <code>SSH temporary key</code> from Signal message.
-              <div class="language- extra-class"><pre class="language-text">
+              {{ getNextItem(passChangeId) }} When asked for current UNIX password type in your
+              <code>SSH temporary key</code> from Signal message.
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="passExpiredText"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Enter your new passphrase and retype for verification. You will be kicked off the entry machine right after your password is changed.
-              <div class="language- extra-class"><pre class="language-text">
+              {{ getNextItem(passChangeId) }} Enter your new passphrase and retype for verification. You will be kicked
+              off the entry machine right after your password is changed.
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="passSetNew"></code>
-              </pre></div>
-              <v-alert
-                border="start"
-                border-color="warning"
-                elevation="2"
-              >
-                If you are getting an <code>Authentication token manipulation error</code> check strength requirements for passphrase in <b>Step {{ passChangeId }}.1</b>.
+              </pre>
+              </div>
+              <v-alert border="start" border-color="warning" elevation="2">
+                If you are getting an <code>Authentication token manipulation error</code> check strength requirements
+                for passphrase in <b>Step {{ passChangeId }}.1</b>.
               </v-alert>
             </v-col>
             <v-col cols="12">
@@ -616,12 +768,15 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Expected result:
-              <div class="language- extra-class"><pre class="language-text">
+              <div class="language- extra-class">
+                <pre class="language-text">
                   <code v-text="`${username}@${labName}-entry:~$`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} When logged into your <code>entry</code> machine, connect to your <code>home</code> machine.
+              {{ getNextItem(passChangeId) }} When logged into your <code>entry</code> machine, connect to your
+              <code>home</code> machine.
               <CopyTextField
                 :model-value="`ssh -o StrictHostKeyChecking=accept-new home`"
                 label=""
@@ -630,19 +785,26 @@ onMounted(() => {
               />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} You will be prompted to type your <code>SSH temporary key</code> from Signal message.
-              <div class="language- extra-class"><pre class="language-text">
+              {{ getNextItem(passChangeId) }} You will be prompted to type your <code>SSH temporary key</code> from
+              Signal message.
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="passExpiredText"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Similar to above, you will be asked for a new password. Type your new passphrase two times.
-              <div class="language- extra-class"><pre class="language-text">
+              {{ getNextItem(passChangeId) }} Similar to above, you will be asked for a new password. Type your new
+              passphrase two times.
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="passSetNew"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Verify a successful passphrase update by logging into your home machine.<CopyTextField
+              {{ getNextItem(passChangeId) }} Verify a successful passphrase update by logging into your home
+              machine.<CopyTextField
                 :model-value="`ssh home`"
                 label=""
                 :prefix="`${username}@${labName}-entry:~$`"
@@ -651,26 +813,43 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Expected result:
-              <div class="language- extra-class"><pre class="language-text">
+              <div class="language- extra-class">
+                <pre class="language-text">
                   <code v-text="`${username}@${labName}-home:~$`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
               {{ getNextItem(passChangeId) }} Close Terminal window to make sure you are disconnected from your lab.
             </v-col>
 
-            <v-btn v-if="['lab_migration'].includes(filterGuidesByType)" color="primary" class="mx-2 my-2" size="small" @click="nextPanel(2)">Next</v-btn>
+            <v-btn
+              v-if="['lab_migration'].includes(filterGuidesByType)"
+              color="primary"
+              class="mx-2 my-2"
+              size="small"
+              @click="nextPanel(2)"
+              >Next</v-btn
+            >
             <v-btn v-else color="primary" class="mx-2 my-2" size="small" @click="nextPanel()">Next</v-btn>
           </v-expansion-panel-text>
         </v-expansion-panel>
 
         <!-- 4. SSH Passwordless access -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'reissue_all', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'reissue_all', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
-            <h3><a href="#passwordless-access" class="header-anchor">#</a> {{ passLessId }}. SSH Passwordless access</h3>
+            <h3>
+              <a href="#passwordless-access" class="header-anchor">#</a> {{ passLessId }}. SSH Passwordless access
+            </h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="passwordless-access" class="mt-2">
-
             <VideoGuide
               v-model="mainExpansionPanel"
               title="SSH Passwordless access"
@@ -679,11 +858,11 @@ onMounted(() => {
             />
 
             <v-col cols="12">
-              {{ getNextItem(passLessId, true) }} Open new Terminal window and generate ssh key.
-              If command reports that id_rsa key already exists,
-              to avoid overwriting your existing keys press <code>n</code> and skip to next step.
+              {{ getNextItem(passLessId, true) }} Open new Terminal window and generate ssh key. If command reports that
+              id_rsa key already exists, to avoid overwriting your existing keys press <code>n</code> and skip to next
+              step.
               <CopyTextField
-                :model-value='`ssh-keygen -q -t rsa -b 4096 -f ~/.ssh/id_rsa -N ""`'
+                :model-value="`ssh-keygen -q -t rsa -b 4096 -f ~/.ssh/id_rsa -N &quot;&quot;`"
                 class="my-2"
                 label=""
                 prefix="~"
@@ -693,7 +872,7 @@ onMounted(() => {
             <v-col cols="12">
               {{ getNextItem(passLessId) }} Start ssh-agent. Note: Output of this command is only informational.
               <CopyTextField
-                :model-value='`eval "$(ssh-agent -s)"`'
+                :model-value="`eval &quot;$(ssh-agent -s)&quot;`"
                 class="my-2"
                 label=""
                 prefix="~"
@@ -723,9 +902,11 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               You will be asked for your SSH passphrase:
-              <div class="language- extra-class"><pre class="language-text">
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="`${username}@${ipAddress}'s password:`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
               {{ getNextItem(passLessId) }} Confirm passwordless access.
@@ -739,9 +920,11 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Expected result:
-              <div class="language- extra-class"><pre class="language-text">
+              <div class="language- extra-class">
+                <pre class="language-text">
                 <code v-text="`${username}@${labName}-entry:`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
               {{ getNextItem(passLessId) }} Close Terminal window to make sure you are disconnected from your lab.
@@ -752,12 +935,18 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 5. SSH Config file -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#ssh-config" class="header-anchor">#</a> {{ sshConfId }}. SSH Config file</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="ssh-config" class="mt-2">
-
             <VideoGuide
               v-model="mainExpansionPanel"
               title="SSH Config file"
@@ -766,7 +955,8 @@ onMounted(() => {
             />
 
             <v-col cols="12">
-              {{ getNextItem(sshConfId, true) }} Open new Terminal window and assure SSH Config file exists. No output is expected.
+              {{ getNextItem(sshConfId, true) }} Open new Terminal window and assure SSH Config file exists. No output
+              is expected.
               <CopyTextField
                 :model-value="`touch ~/.ssh/config`"
                 class="my-2"
@@ -786,7 +976,8 @@ onMounted(() => {
               />
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
-              {{ getNextItem(sshConfId) }} Replace old lab configuration in SSH Config opened in Text Editor and then save changes.
+              {{ getNextItem(sshConfId) }} Replace old lab configuration in SSH Config opened in Text Editor and then
+              save changes.
               <CopyTextArea
                 :model-value="configText"
                 class="my-2"
@@ -813,7 +1004,8 @@ onMounted(() => {
               </v-textarea>
             </v-col>
             <v-col v-else cols="12">
-              {{ getNextItem(sshConfId) }} Add lab configuration into SSH Config opened in Text Editor and then save changes.
+              {{ getNextItem(sshConfId) }} Add lab configuration into SSH Config opened in Text Editor and then save
+              changes.
               <CopyTextArea
                 :model-value="configText"
                 label="SSH Config file"
@@ -849,7 +1041,14 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 6. Hosts file -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#hosts-file" class="header-anchor">#</a> {{ hostsFileId }}. Workbench - hosts file</h3>
           </v-expansion-panel-title>
@@ -866,12 +1065,11 @@ onMounted(() => {
 
             <br /><br />
             <v-col cols="12">
-              {{ getNextItem(hostsFileId, true) }} On your local computer, open your /etc/hosts file in your preferred text editor.
-              You will be asked for password that you use to login into your MacOS account.
-              <br /><br />
+              {{ getNextItem(hostsFileId, true) }} On your local computer, open your /etc/hosts file in your preferred
+              text editor. You will be asked for password that you use to login into your MacOS account. <br /><br />
               <div class="pl-8">
-                Use this command if you prefer graphical <strong>Text editor</strong> app,
-                and remeber to close the editor for the change to come into effect:
+                Use this command if you prefer graphical <strong>Text editor</strong> app, and remeber to close the
+                editor for the change to come into effect:
                 <CopyTextField
                   :model-value="`EDITOR='open -Wne' sudo -e /etc/hosts`"
                   class="my-2"
@@ -880,24 +1078,19 @@ onMounted(() => {
                   placeholder=""
                 />
                 If you prefer terminal editor <strong>vim</strong>, simply run:
-                <CopyTextField
-                  :model-value="`sudo vim /etc/hosts`"
-                  class="my-2"
-                  label=""
-                  prefix="$"
-                  placeholder=""
-                />
+                <CopyTextField :model-value="`sudo vim /etc/hosts`" class="my-2" label="" prefix="$" placeholder="" />
               </div>
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
-              {{ getNextItem(hostsFileId) }} Make sure the line with the old hosts record is removed. <strong>Search and remove lines</strong> containing domain name:<br />
-                <CopyTextField
-                  :model-value="fqdn"
-                  class="my-2"
-                  label=""
-                  prefix=""
-                  placeholder="Your link is missing access token"
-                />
+              {{ getNextItem(hostsFileId) }} Make sure the line with the old hosts record is removed.
+              <strong>Search and remove lines</strong> containing domain name:<br />
+              <CopyTextField
+                :model-value="fqdn"
+                class="my-2"
+                label=""
+                prefix=""
+                placeholder="Your link is missing access token"
+              />
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
               {{ getNextItem(hostsFileId) }} Add (append) the new <strong>hosts record</strong> below to the text file:
@@ -927,21 +1120,32 @@ onMounted(() => {
                 Make sure to avoid duplicate records.
               </div>
             </v-col>
-            <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} Save the changes and close your text editor.
-            </v-col>
-            <v-btn v-if="['lab_migration'].includes(filterGuidesByType)" color="primary" class="mx-2 my-2" size="small" @click="nextPanel(2)">Next</v-btn>
+            <v-col cols="12"> {{ getNextItem(hostsFileId) }} Save the changes and close your text editor. </v-col>
+            <v-btn
+              v-if="['lab_migration'].includes(filterGuidesByType)"
+              color="primary"
+              class="mx-2 my-2"
+              size="small"
+              @click="nextPanel(2)"
+              >Next</v-btn
+            >
             <v-btn v-else color="primary" class="mx-2 my-2" size="small" @click="nextPanel()">Next</v-btn>
           </v-expansion-panel-text>
         </v-expansion-panel>
 
         <!-- 7. Workbench -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#workbench" class="header-anchor">#</a> {{ workbenchId }}. Workbench - certificate</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="workbench" class="mt-2">
-
             <v-row class="my-0 pa-0 mx-1">
               <v-col cols="12 ma-0 py-0">
                 <VideoGuide
@@ -972,7 +1176,8 @@ onMounted(() => {
                 </v-btn>
               </v-col>
               <v-col cols="12">
-                <a href="/do-science/hunt-workbench/" target="_blank">HUNT Workbench</a> provides you with web-based access to modern data science tools such as Jupyter Notebooks, Python, RStudio, R and MATLAB.
+                <a href="/do-science/hunt-workbench/" target="_blank">HUNT Workbench</a> provides you with web-based
+                access to modern data science tools such as Jupyter Notebooks, Python, RStudio, R and MATLAB.
               </v-col>
             </v-row>
 
@@ -981,7 +1186,12 @@ onMounted(() => {
               persistent
               scrollable
               max-width="960px"
-              @keydown.esc="workbenchDialog = false; workbenchStepper = 1"
+              @keydown.esc="
+                () => {
+                  workbenchDialog = false
+                  workbenchStepper = 1
+                }
+              "
             >
               <v-card elevation="0">
                 <v-card-title class="pa-0">
@@ -996,26 +1206,13 @@ onMounted(() => {
 
                 <v-card-text class="pa-0">
                   <v-stepper-vertical v-model="workbenchStepper">
-                    <v-stepper-vertical-item
-                      :complete="workbenchStepper > 1"
-                      value="1"
-                      title="Checks"
-                    >
+                    <v-stepper-vertical-item :complete="workbenchStepper > 1" value="1" title="Checks">
                       <v-card class="mb-12 pr-4" elevation="0">
                         <v-card-text>
-                          <v-alert
-                            border="start"
-                          border-color="warning"
-                          elevation="2"
-                          class="mb-4"
-                          >
+                          <v-alert border="start" border-color="warning" elevation="2" class="mb-4">
                             Make sure you have received your Workbench certificate (<code>.mobileconfig</code>).
                           </v-alert>
-                          <v-alert
-                            border="start"
-                          border-color="warning"
-                          elevation="2"
-                          >
+                          <v-alert border="start" border-color="warning" elevation="2">
                             Assure working VPN connection.
                           </v-alert>
                         </v-card-text>
@@ -1023,7 +1220,9 @@ onMounted(() => {
 
                       <template v-slot:actions>
                         <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 2">Continue</v-btn>
-                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 4">Skip to Troubleshooting</v-btn>
+                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 4"
+                          >Skip to Troubleshooting</v-btn
+                        >
                       </template>
                     </v-stepper-vertical-item>
 
@@ -1034,31 +1233,33 @@ onMounted(() => {
                     >
                       <v-card class="mb-8 pr-4" elevation="0">
                         <v-card-text>
-                          <v-alert
-                            border="start"
-                            border-color="warning"
-                            elevation="2"
-                            class="mb-4"
-                          >
+                          <v-alert border="start" border-color="warning" elevation="2" class="mb-4">
                             <strong>Permissions to add system profiles required.</strong>
                             <hr class="mt-1 mb-2" />
-                            If you do not see Profiles section in your System settings make sure to ask
-                            IT department in your organization for assistance.
+                            If you do not see Profiles section in your System settings make sure to ask IT department in
+                            your organization for assistance.
                           </v-alert>
 
-                          Let's install the certificates that are required to allow traffic with HUNT Workbench that is located in your lab.
+                          Let's install the certificates that are required to allow traffic with HUNT Workbench that is
+                          located in your lab.
                           <br /><br />
                           <ol>
                             <li>
-                              Open your system profile config file that you got from FileSender (<code>{{ labName }}-{{ username }}.mobileconfig</code>).
+                              Open your system profile config file that you got from FileSender (<code
+                                >{{ labName }}-{{ username }}.mobileconfig</code
+                              >).
                             </li>
+                            <li>Open <code style="font-weight: bold">System settings</code></li>
                             <li>
-                              Open <code style="font-weight: bold;">System settings</code>
-                            </li>
-                            <li>
-                              Open section <code style="font-weight: bold;">General</code>, scroll to the bottom of the section and select subsection <code style="font-weight: bold;">Device management</code>.
+                              Open section <code style="font-weight: bold">General</code>, scroll to the bottom of the
+                              section and select subsection <code style="font-weight: bold">Device management</code>.
                               <br />
-                              <img class="pa-2" alt="device-management" src="/img/workbench/macos-device-management.png" style="max-width: 500px;" />
+                              <img
+                                class="pa-2"
+                                alt="device-management"
+                                src="/img/workbench/macos-device-management.png"
+                                style="max-width: 500px"
+                              />
                               <br />
                               <!-- (On MacOS Sonoma or older open section <code style="font-weight: bold;">Privacy & Security</code>, scroll to the bottom of the section and select <code style="font-weight: bold;">Profiles</code>)
                               <br />
@@ -1066,27 +1267,48 @@ onMounted(() => {
                               <br /> -->
                             </li>
                             <li>
-                              Select certificate required for installation ({{  labName }}-{{ username }}-client).
+                              Select certificate required for installation ({{ labName }}-{{ username }}-client).
                               <br />
-                              <img class="pa-2" alt="macventura2" src="/img/workbench/macventura2.png" style="max-width: 300px;" />
+                              <img
+                                class="pa-2"
+                                alt="macventura2"
+                                src="/img/workbench/macventura2.png"
+                                style="max-width: 300px"
+                              />
                               <br />
                             </li>
                             <li>
-                              Click Install when prompted. Then enter the TLS passphrase that you received on Signal and confirm.
+                              Click Install when prompted. Then enter the TLS passphrase that you received on Signal and
+                              confirm.
                               <br />
-                              <img class="pa-2" alt="macventura3" src="/img/workbench/macventura3.png" style="max-width: 400px;" />
+                              <img
+                                class="pa-2"
+                                alt="macventura3"
+                                src="/img/workbench/macventura3.png"
+                                style="max-width: 400px"
+                              />
                               <br />
                             </li>
                             <li>
-                              Now quit your internet browser <code style="font-weight: bold;">CMD + Q</code> (we recommend <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a>).<br />
+                              Now quit your internet browser <code style="font-weight: bold">CMD + Q</code> (we
+                              recommend
+                              <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a>).<br />
                               and restart it for the certificate to get recognized.
                             </li>
                             <li>
-                              When you open your HUNT Workbench for the first time you will be asked for your local macOS password.
-                              This allows the browser to access your client certificate stored in your local Keychain. <br />
-                              After filling in the password, confirm by clicking <code style="font-weight: bold;">Always allow</code> / <code style="font-weight: bold;">Tillat alltid</code>.
+                              When you open your HUNT Workbench for the first time you will be asked for your local
+                              macOS password. This allows the browser to access your client certificate stored in your
+                              local Keychain. <br />
+                              After filling in the password, confirm by clicking
+                              <code style="font-weight: bold">Always allow</code> /
+                              <code style="font-weight: bold">Tillat alltid</code>.
                               <br />
-                              <img class="pa-2" alt="macos_chrome" src="/img/workbench/macos_chrome.png" style="max-width: 400px;" />
+                              <img
+                                class="pa-2"
+                                alt="macos_chrome"
+                                src="/img/workbench/macos_chrome.png"
+                                style="max-width: 400px"
+                              />
                               <br />
                             </li>
                           </ol>
@@ -1094,32 +1316,24 @@ onMounted(() => {
                       </v-card>
                       <template v-slot:actions>
                         <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 3">Continue</v-btn>
-                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 1">Back</v-btn>
+                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 1"
+                          >Back</v-btn
+                        >
                       </template>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="workbenchStepper > 3"
-                      value="3"
-                      title="Login to Workbench"
-                    >
+                    <v-stepper-vertical-item :complete="workbenchStepper > 3" value="3" title="Login to Workbench">
                       <v-card class="mb-8 pr-16" elevation="0">
                         <v-card-text>
-                          <v-alert
-                            border="start"
-                            border-color="warning"
-                            elevation="2"
-                            class="mb-4"
-                          >
-                            <strong>Make sure you are connected to the VPN before you access your HUNT Workbench.</strong>
+                          <v-alert border="start" border-color="warning" elevation="2" class="mb-4">
+                            <strong
+                              >Make sure you are connected to the VPN before you access your HUNT Workbench.</strong
+                            >
                           </v-alert>
-                          <v-alert
-                            border="start"
-                            border-color="info"
-                            elevation="2"
-                            class="mb-4"
-                          >
-                            We recommend to use <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all HUNT Workbench applications to work correctly.
+                          <v-alert border="start" border-color="info" elevation="2" class="mb-4">
+                            We recommend to use
+                            <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all
+                            HUNT Workbench applications to work correctly.
                           </v-alert>
 
                           <ol>
@@ -1127,23 +1341,35 @@ onMounted(() => {
                             <li>
                               Open the URL address below to access your lab in your web browser:
                               <br />
-                              <strong><a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a></strong>
+                              <strong
+                                ><a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a></strong
+                              >
                               <br /><br />
                               You may get a User Identification Request for your new certificate.<br />
                               Verify that the certificates are issued by HUNT Cloud:
                               <br />
-                              <div class="language- extra-class"><pre class="language-text">
+                              <div class="language- extra-class">
+                                <pre class="language-text">
                                 <code v-html='`Issuer: "${tlsClientIssuer}"\nOrganization: "HUNT Cloud"\nIssued Under: "HUNT Cloud Trust Services"`'></code>
-                              </pre></div>
+                              </pre>
+                              </div>
                               <br />
-                              Ensure that the <code>Remember this decision</code> box is checked, and click <code>OK</code>.
+                              Ensure that the <code>Remember this decision</code> box is checked, and click
+                              <code>OK</code>.
                               <br />
-                              <img class="pa-2" alt="chrome_select_certificate_confirm" src="/img/workbench/chrome_select_certificate_confirm.png" style="max-width: 300px;" />
+                              <img
+                                class="pa-2"
+                                alt="chrome_select_certificate_confirm"
+                                src="/img/workbench/chrome_select_certificate_confirm.png"
+                                style="max-width: 300px"
+                              />
                               <br />
                             </li>
                             <li class="mb-2">
-                              Sign in with your HUNT Cloud <strong>username</strong> and <strong>lab passphrase</strong>.<br />
-                              Lab passphrase is the same passphrase that you created yourself on your first SSH login.<br />
+                              Sign in with your HUNT Cloud <strong>username</strong> and
+                              <strong>lab passphrase</strong>.<br />
+                              Lab passphrase is the same passphrase that you created yourself on your first SSH
+                              login.<br />
                               <CopyTextField
                                 :model-value="username"
                                 class="my-2"
@@ -1151,15 +1377,23 @@ onMounted(() => {
                                 prefix=""
                                 placeholder="Your link is missing access token"
                               />
-                              If you did not create a lab passphrase yet use a temporary SSH passphrase that you received
-                              from us on Signal message to login and then follow passphrase change flow.
+                              If you did not create a lab passphrase yet use a temporary SSH passphrase that you
+                              received from us on Signal message to login and then follow passphrase change flow.
                               <br />
-                              <img class="pa-2" alt="workbench-login-form" src="/img/workbench/workbench-login-form.png" style="max-width: 250px;" />
+                              <img
+                                class="pa-2"
+                                alt="workbench-login-form"
+                                src="/img/workbench/workbench-login-form.png"
+                                style="max-width: 250px"
+                              />
                               <br />
                             </li>
                             <li>
-                              With a little bit of luck you should now see your new HUNT Workbench.
-                              Feel free to read our <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guide</a>.
+                              With a little bit of luck you should now see your new HUNT Workbench. Feel free to read
+                              our
+                              <a href="/do-science/hunt-workbench/getting-started/" target="_blank"
+                                >getting started guide</a
+                              >.
                               <br />
                               <strong>Click around and explore your new world!</strong>
                             </li>
@@ -1168,117 +1402,165 @@ onMounted(() => {
 
                           <img class="pa-2" alt="JupyterLab" src="/img/workbench/JupyterLab.png" />
 
-                          <v-alert
-                            border="start"
-                            border-color="info"
-                            elevation="2"
-                          >
+                          <v-alert border="start" border-color="info" elevation="2">
                             <b>Remember to bookmark your Lab address</b>
                             <hr class="mt-1 mb-2" />
-                            <code>https://{{fqdn}}</code>
+                            <code>https://{{ fqdn }}</code>
                           </v-alert>
                         </v-card-text>
                       </v-card>
                       <template v-slot:actions>
-                        <v-btn color="success" class="mx-2 mb-1" @click="workbenchDialog = false; workbenchStepper = 1;">Finish</v-btn>
+                        <v-btn
+                          color="success"
+                          class="mx-2 mb-1"
+                          @click="
+                            () => {
+                              workbenchDialog = false
+                              workbenchStepper = 1
+                            }
+                          "
+                          >Finish</v-btn
+                        >
                         <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 1">Start again</v-btn>
                         <v-btn color="warning" class="mx-2 mb-1" @click="workbenchStepper = 4">Troubleshooting</v-btn>
-                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 2">Back</v-btn>
+                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 2"
+                          >Back</v-btn
+                        >
                       </template>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      value="4"
-                      title="Troubleshooting"
-                    >
+                    <v-stepper-vertical-item value="4" title="Troubleshooting">
                       <v-card class="mb-8 pr-4 ml-0 pl-0" elevation="0">
                         <v-card-text>
-                          This section includes issues that you might encounter during your first setup.
-                          See our <a href="/do-science/hunt-workbench/faq/" target="_blank">HUNT Workbench FAQ</a> and <a href="/do-science/hunt-workbench/troubleshooting/" target="_blank">HUNT Workbench Troubleshooting</a> if you do not find your answers below.
+                          This section includes issues that you might encounter during your first setup. See our
+                          <a href="/do-science/hunt-workbench/faq/" target="_blank">HUNT Workbench FAQ</a> and
+                          <a href="/do-science/hunt-workbench/troubleshooting/" target="_blank"
+                            >HUNT Workbench Troubleshooting</a
+                          >
+                          if you do not find your answers below.
 
-                          <details class="my-2"><summary style="cursor: pointer;"><strong>This site can't be reached</strong></summary>
+                          <details class="my-2">
+                            <summary style="cursor: pointer"><strong>This site can't be reached</strong></summary>
                             <div class="pl-4 pr-16 py-2">
-                              1. If you are getting <code>DNS_PROBE_FINISHED_NXDOMAIN</code> error you need to repeat the <code style="font-size: 90% !important;">{{ hostsFileId }}. Workbench - hosts file</code> guide.
-                              <br/>
-                              2. If you are getting <code>ERR_CONNECTION_TIMED_OUT</code> error you need to make sure that you are connected to VPN. If you are able to ssh into lab your VPN is fine, and you need to repeat the <code>6. Workbench - hosts file</code> guide.
+                              1. If you are getting <code>DNS_PROBE_FINISHED_NXDOMAIN</code> error you need to repeat
+                              the
+                              <code style="font-size: 90% !important">{{ hostsFileId }}. Workbench - hosts file</code>
+                              guide.
+                              <br />
+                              2. If you are getting <code>ERR_CONNECTION_TIMED_OUT</code> error you need to make sure
+                              that you are connected to VPN. If you are able to ssh into lab your VPN is fine, and you
+                              need to repeat the <code>6. Workbench - hosts file</code> guide.
                             </div>
                           </details>
 
-                          <details class="my-2"><summary style="cursor: pointer;"><strong>I don't remember my passphrase</strong></summary>
+                          <details class="my-2">
+                            <summary style="cursor: pointer"><strong>I don't remember my passphrase</strong></summary>
                             <div class="pl-4 pr-16 py-2">
-                              Don't worry. Request a <a href="/do-science/service-desk/#ssh-passphrase-reset" target="_blank">reset of SSH passphrase</a> in our "do-science" Service desk.
+                              Don't worry. Request a
+                              <a href="/do-science/service-desk/#ssh-passphrase-reset" target="_blank"
+                                >reset of SSH passphrase</a
+                              >
+                              in our "do-science" Service desk.
                             </div>
                           </details>
 
-                          <details class="my-2"><summary style="cursor: pointer;"><strong>Nginx error - 403 Forbidden</strong></summary>
+                          <details class="my-2">
+                            <summary style="cursor: pointer"><strong>Nginx error - 403 Forbidden</strong></summary>
                             <div class="pl-4 pr-16 py-2">
                               This error means that you are attempting to connect without client certificate.
-                              <br /><br/>
+                              <br /><br />
                               There are 3 different causes each requires a different approach
                               <ol>
                                 <li>
-                                  If you have just installed a fresh client certificate, <strong>restart your computer</strong> to make sure certificates are applied.
+                                  If you have just installed a fresh client certificate,
+                                  <strong>restart your computer</strong> to make sure certificates are applied.
                                 </li>
                                 <br />
                                 <li>
-                                  If you have not yet installed a fresh client certificate on this computer, review the section <strong>Install your certificates</strong> above. Start by click on blue button <code>Start again</code>.
+                                  If you have not yet installed a fresh client certificate on this computer, review the
+                                  section <strong>Install your certificates</strong> above. Start by click on blue
+                                  button <code>Start again</code>.
                                 </li>
                                 <br />
                                 <li>
-                                  If you have used Workbench in {{ labName }} lab before, this error means that your certificate expired and you can follow this link to <a href="/do-science/service-desk/#hunt-workbench-reissue" target="_blank">request Workbench reissue</a>. Once your request is processed we will send you a fresh certificate.
+                                  If you have used Workbench in {{ labName }} lab before, this error means that your
+                                  certificate expired and you can follow this link to
+                                  <a href="/do-science/service-desk/#hunt-workbench-reissue" target="_blank"
+                                    >request Workbench reissue</a
+                                  >. Once your request is processed we will send you a fresh certificate.
                                 </li>
                               </ol>
                             </div>
                           </details>
 
-                          <details class="my-2"><summary style="cursor: pointer;"><strong>Firefox - Did Not Connect</strong></summary>
+                          <details class="my-2">
+                            <summary style="cursor: pointer"><strong>Firefox - Did Not Connect</strong></summary>
                             <div class="pl-4 pr-16 py-2">
-                              <v-alert
-                                border="start"
-                                border-color="info"
-                                elevation="2"
-                              >
-                                We recommend to use <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all HUNT Workbench applications to work correctly.
+                              <v-alert border="start" border-color="info" elevation="2">
+                                We recommend to use
+                                <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for
+                                all HUNT Workbench applications to work correctly.
                               </v-alert>
 
-                              Firefox may require that you manually import the HUNT Cloud Certificate Authority to consider it trusted.
-
-                              If you see Error code: <code>SEC_ERROR_UNKNOWN_ISSUER</code> when accessing Workbench follow these steps:
+                              Firefox may require that you manually import the HUNT Cloud Certificate Authority to
+                              consider it trusted. If you see Error code: <code>SEC_ERROR_UNKNOWN_ISSUER</code> when
+                              accessing Workbench follow these steps:
 
                               <ol>
                                 <li>
-                                  Download our public CA certificate from <a href="https://pki.hdc.ntnu.no/hctsca1.crt" target="_blank">https://pki.hdc.ntnu.no/hctsca1.crt</a>
+                                  Download our public CA certificate from
+                                  <a href="https://pki.hdc.ntnu.no/hctsca1.crt" target="_blank"
+                                    >https://pki.hdc.ntnu.no/hctsca1.crt</a
+                                  >
                                 </li>
+                                <li>Open the following Firefox URL: <code>about:preferences#privacy</code>.</li>
                                 <li>
-                                  Open the following Firefox URL: <code>about:preferences#privacy</code>.
-                                </li>
-                                <li>
-                                  Scroll down to section <code>Certificates</code> and click on <code>View Certificates</code>.
+                                  Scroll down to section <code>Certificates</code> and click on
+                                  <code>View Certificates</code>.
                                   <br />
-                                  <img class="pa-2" alt="mac-firefox-certificates" src="/img/workbench/mac-firefox-certificates.png" />
+                                  <img
+                                    class="pa-2"
+                                    alt="mac-firefox-certificates"
+                                    src="/img/workbench/mac-firefox-certificates.png"
+                                  />
                                   <br />
                                 </li>
                                 <li>
                                   Switch to tab <code>Authorities</code> and click on <code>Import</code>.
                                   <br />
-                                  <img class="pa-2" alt="mac-firefox-import-cert" src="/img/workbench/mac-firefox-import-cert.png" />
+                                  <img
+                                    class="pa-2"
+                                    alt="mac-firefox-import-cert"
+                                    src="/img/workbench/mac-firefox-import-cert.png"
+                                  />
                                   <br />
                                 </li>
                                 <li>
-                                  Select <code>hctsca1.crt</code> and check option <code>Trust this CA to identify websites</code>.
+                                  Select <code>hctsca1.crt</code> and check option
+                                  <code>Trust this CA to identify websites</code>.
                                   <br />
-                                  <img class="pa-2" alt="mac-firefox-trust-ca" src="/img/workbench/mac-firefox-trust-ca.png" />
+                                  <img
+                                    class="pa-2"
+                                    alt="mac-firefox-trust-ca"
+                                    src="/img/workbench/mac-firefox-trust-ca.png"
+                                  />
                                   <br />
                                 </li>
                               </ol>
                             </div>
                           </details>
 
-                          <details class="my-2"><summary style="cursor: pointer;"><strong>502 Bad gateway</strong></summary>
+                          <details class="my-2">
+                            <summary style="cursor: pointer"><strong>502 Bad gateway</strong></summary>
                             <div class="pl-4 pr-16 py-2">
-                              A 502 Bad gateway error when accessing <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a>
-                              is an indication that something is wrong with the configuration on the server side.<br />
-                              Contact us in your lab channel on Slack (#lab-{{ labName }}) or <a href="/do-science/service-desk/#general-service-request" target="_blank">Service desk email</a> further investigations.
+                              A 502 Bad gateway error when accessing
+                              <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a> is
+                              an indication that something is wrong with the configuration on the server side.<br />
+                              Contact us in your lab channel on Slack (#lab-{{ labName }}) or
+                              <a href="/do-science/service-desk/#general-service-request" target="_blank"
+                                >Service desk email</a
+                              >
+                              further investigations.
                             </div>
                           </details>
                         </v-card-text>
@@ -1286,8 +1568,21 @@ onMounted(() => {
 
                       <template v-slot:actions>
                         <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 1">Start again</v-btn>
-                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 3">Back</v-btn>
-                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchDialog = false; workbenchStepper = 1;">Close</v-btn>
+                        <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 3"
+                          >Back</v-btn
+                        >
+                        <v-btn
+                          color="primary"
+                          variant="text"
+                          class="mx-2 mb-1"
+                          @click="
+                            () => {
+                              workbenchDialog = false
+                              workbenchStepper = 1
+                            }
+                          "
+                          >Close</v-btn
+                        >
                       </template>
                     </v-stepper-vertical-item>
                   </v-stepper-vertical>
@@ -1296,11 +1591,13 @@ onMounted(() => {
             </v-dialog>
 
             <v-col cols="12">
-              After you have successfully completed all the steps, you can start using your Workbench environment by opening this URL address: <a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a>
+              After you have successfully completed all the steps, you can start using your Workbench environment by
+              opening this URL address: <a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a>
             </v-col>
 
             <v-col cols="12">
-              <details class="my-2"><summary style="cursor: pointer;"><strong>Workbench Control panel</strong></summary>
+              <details class="my-2">
+                <summary style="cursor: pointer"><strong>Workbench Control panel</strong></summary>
                 <div class="pl-4 pr-16 py-2">
                   You can access Control panel on this URL address:
                   <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a>
@@ -1318,28 +1615,31 @@ onMounted(() => {
             <h3><a href="#where-to-go-next" class="header-anchor">#</a> Where to go next</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="where-to-go-next" class="mt-2">
-            <v-sheet
-              rounded="lg"
-              width="100%"
-              class="pa-4 text-center mx-auto"
-            >
-              <v-icon
-                class="mb-5"
-                color="success"
-                size="100"
-              >mdi-check-circle</v-icon>
+            <v-sheet rounded="lg" width="100%" class="pa-4 text-center mx-auto">
+              <v-icon class="mb-5" color="success" size="100">mdi-check-circle</v-icon>
 
               <h2 class="text-h5 mb-6">You have configured your lab access</h2>
 
               <p class="mb-4 text-medium-emphasis text-body-2">
-                Feel free to continue reading our <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guides</a> and figure out which <a href="/do-science/tools/" target="_blank">tools</a> do you need for your work.
-                <br>
+                Feel free to continue reading our
+                <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guides</a> and
+                figure out which <a href="/do-science/tools/" target="_blank">tools</a> do you need for your work.
+                <br />
                 Otherwise, you're done!
               </p>
               <v-row>
                 <v-col cols="12">
-                  <v-btn color="success" class="mx-2 mb-1" :href="`https://${fqdn}`" target="_blank" elevation="3">Open Workbench</v-btn>
-                  <v-btn color="primary" class="mx-2 mb-1" :href="`https://${fqdn}/hub/home`" target="_blank" elevation="3">Control panel</v-btn>
+                  <v-btn color="success" class="mx-2 mb-1" :href="`https://${fqdn}`" target="_blank" elevation="3"
+                    >Open Workbench</v-btn
+                  >
+                  <v-btn
+                    color="primary"
+                    class="mx-2 mb-1"
+                    :href="`https://${fqdn}/hub/home`"
+                    target="_blank"
+                    elevation="3"
+                    >Control panel</v-btn
+                  >
                 </v-col>
               </v-row>
             </v-sheet>
@@ -1349,23 +1649,16 @@ onMounted(() => {
     </v-card>
 
     <v-card elevation="1" class="mt-4">
-      <v-card-title class="pt-3 pb-2" style="font-weight: 400;">
-        Optional guides
-      </v-card-title>
+      <v-card-title class="pt-3 pb-2" style="font-weight: 400"> Optional guides </v-card-title>
       <v-expansion-panels v-model="extrasExpansionPanel" elevation="0">
-
         <!-- Cyberduck (MacOS only) -->
         <v-expansion-panel>
           <v-expansion-panel-title>
             <h3><a href="#cyberduck" class="header-anchor">#</a> Cyberduck</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="cyberduck" class="mt-2">
-            <v-col cols="12">
-              Cyberduck is an SFTP client with graphical user interface.
-            </v-col>
-            <v-col cols="12">
-              1. Add the hosts records below to your <code>/etc/hosts</code> file.
-            </v-col>
+            <v-col cols="12"> Cyberduck is an SFTP client with graphical user interface. </v-col>
+            <v-col cols="12"> 1. Add the hosts records below to your <code>/etc/hosts</code> file. </v-col>
             <v-col cols="12">
               <v-textarea
                 :model-value="hostsCyberduck"
@@ -1399,9 +1692,7 @@ onMounted(() => {
             <h3><a href="#copypubkey" class="header-anchor">#</a> Copy SSH Public key</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="copypubkey" class="mt-2">
-            <v-col cols="12">
-              1. Open new Terminal window.
-            </v-col>
+            <v-col cols="12"> 1. Open new Terminal window. </v-col>
             <v-col cols="10">
               2. Run this command to copy SSH Public key created in Step 3 into clipboard.
               <CopyTextField
@@ -1411,9 +1702,7 @@ onMounted(() => {
                 placeholder="Your link is missing access token"
               />
             </v-col>
-            <v-col cols="12">
-              3. Paste (CMD+V) your SSH Public key where needed.
-            </v-col>
+            <v-col cols="12"> 3. Paste (CMD+V) your SSH Public key where needed. </v-col>
           </v-expansion-panel-text>
         </v-expansion-panel>
 
@@ -1423,17 +1712,14 @@ onMounted(() => {
             <h3><a href="#troubleshooting" class="header-anchor">#</a> Troubleshooting</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="troubleshooting" class="mt-2">
-
             <v-col cols="12">
               <h3>Keka cannot open 7-zip archive</h3>
               <img alt="tunnelblick-login" src="/img/7-zip/keka2.png" /> <br />
               Make sure to allow Keka access to your home folder in <b>File Access</b> section of Keka.
               <img alt="tunnelblick-login" src="/img/7-zip/keka1.png" /> <br />
             </v-col>
-
           </v-expansion-panel-text>
         </v-expansion-panel>
-
       </v-expansion-panels>
     </v-card>
   </v-sheet>
@@ -1462,24 +1748,24 @@ pre code {
   background-color: unset;
   color: rgba(204, 204, 204, 1) !important;
 }
-pre[class*=language-] {
-  margin: .85rem 0;
+pre[class*="language-"] {
+  margin: 0.85rem 0;
   padding-bottom: 4px !important;
   padding-top: 4px !important;
 }
-div[class*=language-] {
+div[class*="language-"] {
   position: relative;
   background-color: #282c34;
   border-radius: 6px;
   overflow-x: unset;
 }
-div[class*=language-]:before {
+div[class*="language-"]:before {
   position: absolute;
   z-index: 3;
-  top: .8em;
+  top: 0.8em;
   right: 1em;
-  font-size: .75rem;
-  color: hsla(0, 0%, 100%, .4);
+  font-size: 0.75rem;
+  color: hsla(0, 0%, 100%, 0.4);
 }
 
 .v-overlay__content ul {
@@ -1495,7 +1781,7 @@ div[class*=language-]:before {
   background-color: rgba(0, 0, 0, 0.05) !important;
   padding: 0.2em 0.4em;
 }
-.v-overlay__content pre[class*=language-] {
+.v-overlay__content pre[class*="language-"] {
   padding-bottom: 8px !important;
   padding-top: 8px !important;
 }
diff --git a/docs/.vitepress/theme/components/lab-access/TotpGuide.vue b/docs/.vitepress/theme/components/lab-access/TotpGuide.vue
index 212cd91d82b..3e590e77f21 100644
--- a/docs/.vitepress/theme/components/lab-access/TotpGuide.vue
+++ b/docs/.vitepress/theme/components/lab-access/TotpGuide.vue
@@ -34,7 +34,7 @@ const totpStepper = ref("1")
 
         <v-card-text class="pa-0">
           <v-stepper-vertical v-model="totpStepper" class="mt-16" hide-actions>
-            <v-stepper-vertical-item :complete="totpStepper > 1" value="1">
+            <v-stepper-vertical-item :complete="totpStepper > 1" value="1" editable edit-icon>
               <template v-slot:title> Install TOTP application on your phone </template>
 
               <v-card class="mb-12" elevation="0">
@@ -61,7 +61,7 @@ const totpStepper = ref("1")
               <v-btn color="primary" class="mx-2 mb-1" @click="totpStepper = 2">Continue</v-btn>
             </v-stepper-vertical-item>
 
-            <v-stepper-vertical-item :complete="totpStepper > 2" value="2">
+            <v-stepper-vertical-item :complete="totpStepper > 2" value="2" editable edit-icon>
               <template v-slot:title> Add new TOTP account </template>
 
               <v-card class="mb-12" elevation="0">
@@ -190,7 +190,7 @@ const totpStepper = ref("1")
               <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="totpStepper = 1">Back</v-btn>
             </v-stepper-vertical-item>
 
-            <v-stepper-vertical-item value="3">
+            <v-stepper-vertical-item value="3" editable edit-icon>
               <template v-slot:title> Check your TOTP codes </template>
 
               <v-card class="mb-12" elevation="0">
@@ -200,7 +200,8 @@ const totpStepper = ref("1")
                 <br /><br />
 
                 <v-alert border="start" border-color="info" elevation="2">
-                  Phone might need to be connected to internet to assure precise synchronization of time. Time zone between phone and your machine should match.
+                  Phone might need to be connected to internet to assure precise synchronization of time. Time zone
+                  between phone and your machine should match.
                 </v-alert>
               </v-card>
               <v-btn color="primary" class="mx-2 mb-1" @click="totpStepper = 1">Start again</v-btn>
diff --git a/docs/.vitepress/theme/components/lab-access/WindowsJourney.vue b/docs/.vitepress/theme/components/lab-access/WindowsJourney.vue
index 6da3a3dbc79..4f9f9d92aa4 100644
--- a/docs/.vitepress/theme/components/lab-access/WindowsJourney.vue
+++ b/docs/.vitepress/theme/components/lab-access/WindowsJourney.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed, onMounted, getCurrentInstance } from 'vue'
+import { ref, computed, onMounted, getCurrentInstance } from "vue"
 
 const ISSERVER = typeof window === "undefined"
 
@@ -41,15 +41,15 @@ Connection to home closed.`)
 const hostsChangeSuccess = ref(null)
 const hostsChangeLoading = ref(false)
 const guidingOptions = ref([
-  { text: 'New user', value: 'new_user' },
-  { text: 'User to new lab', value: 'new_lab' },
-  { text: 'New computer', value: 'new_computer' },
-  { text: 'SSH reset', value: 'ssh_reset' },
-  { text: 'VPN reset', value: 'vpn_reset' },
-  { text: 'TOTP reset (Google authenticator)', value: 'totp_reset' },
-  { text: 'Workbench reissue', value: 'workbench_reissue' },
-  { text: 'Reissue all', value: 'reissue_all' },
-  { text: 'Lab migration', value: 'lab_migration' },
+  { text: "New user", value: "new_user" },
+  { text: "User to new lab", value: "new_lab" },
+  { text: "New computer", value: "new_computer" },
+  { text: "SSH reset", value: "ssh_reset" },
+  { text: "VPN reset", value: "vpn_reset" },
+  { text: "TOTP reset (Google authenticator)", value: "totp_reset" },
+  { text: "Workbench reissue", value: "workbench_reissue" },
+  { text: "Reissue all", value: "reissue_all" },
+  { text: "Lab migration", value: "lab_migration" },
 ])
 const filterGuidesByType = ref(null)
 
@@ -60,39 +60,35 @@ const sshConfigRef = ref(null)
 let incIndices = {}
 
 // Computed properties
-const cfgShow = computed(() =>
-  props.ipAddress && props.labName && props.username ? true : false
-)
+const cfgShow = computed(() => (props.ipAddress && props.labName && props.username ? true : false))
 
-const configText = computed(() =>
-  props.ipAddress && props.labName && props.username ? wrap(props.template) : null
-)
+const configText = computed(() => (props.ipAddress && props.labName && props.username ? wrap(props.template) : null))
 
 const passExpiredText = computed(() =>
-  props.ipAddress && props.labName && props.username ? wrap(passExpired.value) : null
+  props.ipAddress && props.labName && props.username ? wrap(passExpired.value) : null,
 )
 
 const hostsWorkbench = computed(() =>
-  props.ipAddress && props.labName ? `${props.ipAddress}    ${props.labName}.lab.hdc.ntnu.no` : null
+  props.ipAddress && props.labName ? `${props.ipAddress}    ${props.labName}.lab.hdc.ntnu.no` : null,
 )
 
-const entryIpUrl = computed(() =>
-  props.ipAddress ? props.ipAddress.replace('.', '%2E') : ''
-)
+const entryIpUrl = computed(() => (props.ipAddress ? props.ipAddress.replace(".", "%2E") : ""))
 
-const homeIpUrl = computed(() => 'home')
+const homeIpUrl = computed(() => "home")
 
 const mobaxtermTerminal = computed(() =>
-  cfgShow.value ? `mobaxterm:${props.labName}%3D%23109%230%25${homeIpUrl.value}%2522%25${props.username}%25%250%250%25%25${entryIpUrl.value}%2522%25${props.username}%25%2D1%250%250%25%5FProfileDir%5F%5C%2Essh%5Cid%5Frsa%25%5FProfileDir%5F%5C%2Essh%5Cid%5Frsa%25%2D1%250%250%250%25%251080%25%250%250%251%23MobaFont%2510%250%250%25%2D1%2515%25236%2C236%2C236%2530%2C30%2C30%25180%2C180%2C192%250%25%2D1%250%25%25xterm%2D256color%25%2D1%25%2D1%25%5FStd%5FColors%5F0%5F%2580%2524%250%251%25%2D1%25%3Cnone%3E%25%250%250%25%2D1%230%23%20%23%2D1` : null
+  cfgShow.value
+    ? `mobaxterm:${props.labName}%3D%23109%230%25${homeIpUrl.value}%2522%25${props.username}%25%250%250%25%25${entryIpUrl.value}%2522%25${props.username}%25%2D1%250%250%25%5FProfileDir%5F%5C%2Essh%5Cid%5Frsa%25%5FProfileDir%5F%5C%2Essh%5Cid%5Frsa%25%2D1%250%250%250%25%251080%25%250%250%251%23MobaFont%2510%250%250%25%2D1%2515%25236%2C236%2C236%2530%2C30%2C30%25180%2C180%2C192%250%25%2D1%250%25%25xterm%2D256color%25%2D1%25%2D1%25%5FStd%5FColors%5F0%5F%2580%2524%250%251%25%2D1%25%3Cnone%3E%25%250%250%25%2D1%230%23%20%23%2D1`
+    : null,
 )
 
 const mobaxtermRdp = computed(() =>
-  cfgShow.value ? `mobaxterm:${props.labName}%2DRDP%3D%2391%234%25${props.labName}%2D${homeIpUrl.value}%253389%25${props.username}%250%250%250%250%25%2D1%250%250%25%2D1%25xfce4%2Dsession%25${entryIpUrl.value}%5F%5FPIPE%5F%5F${homeIpUrl.value}%2522%5F%5FPIPE%5F%5F22%25${props.username}%5F%5FPIPE%5F%5F${props.username}%250%250%25%5FProfileDir%5F%5C%2Essh%5Cid%5Frsa%5F%5FPIPE%5F%5F%5FProfileDir%5F%5C%2Essh%5Cid%5Frsa%25%2D1%25%25%2D1%25%2D1%250%250%250%25%2D1%23MobaFont%2510%250%250%25%2D1%2515%25236%2C236%2C236%2530%2C30%2C30%25180%2C180%2C192%250%25%2D1%250%25%25xterm%25%2D1%25%2D1%25%5FStd%5FColors%5F0%5F%2580%2524%250%251%25%2D1%25%3Cnone%3E%25%250%250%25%2D1%230%23%20%23%2D1` : null
+  cfgShow.value
+    ? `mobaxterm:${props.labName}%2DRDP%3D%2391%234%25${props.labName}%2D${homeIpUrl.value}%253389%25${props.username}%250%250%250%250%25%2D1%250%250%25%2D1%25xfce4%2Dsession%25${entryIpUrl.value}%5F%5FPIPE%5F%5F${homeIpUrl.value}%2522%5F%5FPIPE%5F%5F22%25${props.username}%5F%5FPIPE%5F%5F${props.username}%250%250%25%5FProfileDir%5F%5C%2Essh%5Cid%5Frsa%5F%5FPIPE%5F%5F%5FProfileDir%5F%5C%2Essh%5Cid%5Frsa%25%2D1%25%25%2D1%25%2D1%250%250%250%25%2D1%23MobaFont%2510%250%250%25%2D1%2515%25236%2C236%2C236%2530%2C30%2C30%25180%2C180%2C192%250%25%2D1%250%25%25xterm%25%2D1%25%2D1%25%5FStd%5FColors%5F0%5F%2580%2524%250%251%25%2D1%25%3Cnone%3E%25%250%250%25%2D1%230%23%20%23%2D1`
+    : null,
 )
 
-const fqdn = computed(() =>
-  props.labName ? `${props.labName}.lab.hdc.ntnu.no` : null
-)
+const fqdn = computed(() => (props.labName ? `${props.labName}.lab.hdc.ntnu.no` : null))
 
 const hostsChangeColor = computed(() => {
   if (typeof hostsChangeSuccess.value == "boolean") {
@@ -102,9 +98,7 @@ const hostsChangeColor = computed(() => {
   }
 })
 
-const tlsClientIssuer = computed(() =>
-  props.labName ? `LAB-${props.labName.toUpperCase()} CA` : ''
-)
+const tlsClientIssuer = computed(() => (props.labName ? `LAB-${props.labName.toUpperCase()} CA` : ""))
 
 const instance = getCurrentInstance()
 const getRouteQuery = () => {
@@ -134,24 +128,24 @@ const updateFilter = (value, update = false) => {
   localStorage.labAccessGuideFilter = val && val.value ? val.value : null
 }
 
-const wrap = (template) => {
+const wrap = template => {
   let text = template
-  text = text.replaceAll('{ip_address}', props.ipAddress)
-  text = text.replaceAll('{lab_name}', props.labName)
-  text = text.replaceAll('{username}', props.username)
+  text = text.replaceAll("{ip_address}", props.ipAddress)
+  text = text.replaceAll("{lab_name}", props.labName)
+  text = text.replaceAll("{username}", props.username)
   return text
 }
 
-const copyText = (key) => {
-  const el = document.querySelector(`[data-ref="${key}"]`)?.querySelector('input')
+const copyText = key => {
+  const el = document.querySelector(`[data-ref="${key}"]`)?.querySelector("input")
   if (el) {
     el.select()
     document.execCommand("copy")
   }
 }
 
-const copyTextArea = (key) => {
-  const el = document.querySelector(`[data-ref="${key}"]`)?.querySelector('textarea')
+const copyTextArea = key => {
+  const el = document.querySelector(`[data-ref="${key}"]`)?.querySelector("textarea")
   if (el) {
     el.select()
     document.execCommand("copy")
@@ -176,15 +170,17 @@ const testHosts = () => {
   hostsChangeSuccess.value = null
   hostsChangeLoading.value = true
 
-  fetch(`http://${fqdn.value}`, { redirect: "manual" }).then((item) => {
-    if (item.type === "opaqueredirect") {
-      setTimeout(setHostsChangeSuccess, 500)
-    } else {
+  fetch(`http://${fqdn.value}`, { redirect: "manual" })
+    .then(item => {
+      if (item.type === "opaqueredirect") {
+        setTimeout(setHostsChangeSuccess, 500)
+      } else {
+        setTimeout(setHostsChangeError, 500)
+      }
+    })
+    .catch(err => {
       setTimeout(setHostsChangeError, 500)
-    }
-  }).catch((err) => {
-    setTimeout(setHostsChangeError, 500)
-  })
+    })
 }
 
 const getNextItem = (groupId, reset = false) => {
@@ -237,9 +233,23 @@ onMounted(() => {
     </v-row>
     <v-card class="mt-6" elevation="1">
       <v-expansion-panels accordion v-model="mainExpansionPanel" elevation="0">
-
         <!-- 1. Fetch secrets -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'ssh_reset', 'vpn_reset', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            [
+              'new_user',
+              'new_computer',
+              'new_lab',
+              'ssh_reset',
+              'vpn_reset',
+              'workbench_reissue',
+              'reissue_all',
+            ].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#fetch-secrets" class="header-anchor">#</a> {{ fetchSecretsId }}. Fetch secrets</h3>
           </v-expansion-panel-title>
@@ -247,8 +257,15 @@ onMounted(() => {
             You have received a link to an encrypted file archive (7-ZIP file).
 
             <ol class="mt-2">
-              <li>Click on the filesender link in the email to download the file and save this on your local computer.</li>
-              <li>Unpack (extract) the file only with <a href="/do-science/tools/transfer/7z/#detail-2-windows" target="_blank">software that supports the 7-ZIP archive format</a>.</li>
+              <li>
+                Click on the filesender link in the email to download the file and save this on your local computer.
+              </li>
+              <li>
+                Unpack (extract) the file only with
+                <a href="/do-science/tools/transfer/7z/#detail-2-windows" target="_blank"
+                  >software that supports the 7-ZIP archive format</a
+                >.
+              </li>
               <li>Use the key named 7-ZIP file key from your Signal transfer to decrypt the 7z archive.</li>
             </ol>
 
@@ -264,23 +281,26 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 2. VPN Access -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'vpn_reset', 'totp_reset', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'vpn_reset', 'totp_reset', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#vpn-config" class="header-anchor">#</a> {{ vpnConfId }}. VPN Access</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="vpn-config" ref="#vpn-config" class="mt-2">
-            If you have not setup access to <strong>HUNT Cloud VPN</strong> yet, follow both <i>TOTP</i> and <i>OpenVPN</i> configuration guides:
+            If you have not setup access to <strong>HUNT Cloud VPN</strong> yet, follow both <i>TOTP</i> and
+            <i>OpenVPN</i> configuration guides:
 
             <TotpGuide />
 
             <v-row class="my-1">
               <v-col cols="12">
-                <v-btn
-                  variant="text"
-                  color="primary"
-                  @click.stop="vpnDialog = true"
-                  elevation="2"
-                >
+                <v-btn variant="text" color="primary" @click.stop="vpnDialog = true" elevation="2">
                   <v-icon>mdi-vpn</v-icon>&nbsp;&nbsp;2. OpenVPN Configuration
                 </v-btn>
               </v-col>
@@ -290,7 +310,12 @@ onMounted(() => {
               persistent
               scrollable
               max-width="960px"
-              @keydown.esc="vpnDialog = false; vpnStepper = 1"
+              @keydown.esc="
+                () => {
+                  vpnDialog = false
+                  vpnStepper = 1
+                }
+              "
             >
               <v-card elevation="0">
                 <v-card-title class="pa-0">
@@ -305,73 +330,97 @@ onMounted(() => {
 
                 <v-card-text class="pa-0">
                   <v-stepper-vertical v-model="vpnStepper" class="mt-16" hide-actions>
-                    <v-stepper-vertical-item
-                      :complete="vpnStepper > 1"
-                      value="1"
-                    >
-                      <template v-slot:title>
-                        Install OpenVPN
-                      </template>
+                    <v-stepper-vertical-item :complete="vpnStepper > 1" value="1" editable edit-icon>
+                      <template v-slot:title> Install OpenVPN </template>
 
-                      <v-card
-                        class="mb-12 pr-4"
-                        elevation="0"
-                      >
-                        We use the open-source application <b>OpenVPN GUI</b> to ensure encrypted communication between your local computer and us.<br /><br />
+                      <v-card class="mb-12 pr-4" elevation="0">
+                        We use the open-source application <b>OpenVPN GUI</b> to ensure encrypted communication between
+                        your local computer and us.<br /><br />
 
-                        If you are not an NTNU user <a href="https://openvpn.net/community-downloads/" target="_blank">download and install <b>OpenVPN</b> using the latest stable Windows Installer (Avoid beta/rc versions)</a>
+                        If you are not an NTNU user
+                        <a href="https://openvpn.net/community-downloads/" target="_blank"
+                          >download and install <b>OpenVPN</b> using the latest stable Windows Installer (Avoid beta/rc
+                          versions)</a
+                        >
                         <br /><br />
 
-                        Click on the link above, and look for blue download button named <code style="font-weight: bold;">Download {{ openvpnInstallerName }}</code>,
-                        download the file and follow the on-screen installation instructions until finished.
+                        Click on the link above, and look for blue download button named
+                        <code style="font-weight: bold">Download {{ openvpnInstallerName }}</code
+                        >, download the file and follow the on-screen installation instructions until finished.
                         <br /><br />
 
-                        <v-alert
-                          border="start"
-                          border-color="info"
-                          class="v-alert-custom mb-4"
-                          elevation="2"
-                        >
-                          <template v-slot:title><b><img alt="1-openvpn-icon" src="/img/vpn/ntnu-icon-25.svg" style="display: inline-block; height: 1.2em; margin-bottom: -3px;" /> NTNU Software center</b></template>
-                          Windows <b>users from NTNU</b> can install OpenVPN community edition
-                          using <a href="https://i.ntnu.no/wiki/-/wiki/English/OpenVPN" target="_blank">NTNU Software Center</a> even without administrative rights.
+                        <v-alert border="start" border-color="info" class="v-alert-custom mb-4" elevation="2">
+                          <template v-slot:title
+                            ><b
+                              ><img
+                                alt="1-openvpn-icon"
+                                src="/img/vpn/ntnu-icon-25.svg"
+                                style="display: inline-block; height: 1.2em; margin-bottom: -3px"
+                              />
+                              NTNU Software center</b
+                            ></template
+                          >
+                          Windows <b>users from NTNU</b> can install OpenVPN community edition using
+                          <a href="https://i.ntnu.no/wiki/-/wiki/English/OpenVPN" target="_blank"
+                            >NTNU Software Center</a
+                          >
+                          even without administrative rights.
                         </v-alert>
 
-                        <v-alert
-                          border="start"
-                          border-color="warning"
-                          class="v-alert-custom"
-                          elevation="2"
-                        >
-                          <template v-slot:title><b>You will need administrative rights on your local computer to successfully install OpenVPN</b></template>
-                          Click on the link below if you do not hold administrative rights on your local computer, or don't know if you have such rights.<br /><br />
-
-                          <details style="font-size: 14px"><summary style="cursor: pointer;"><b>Installing OpenVPN without administrative rights</b></summary>
+                        <v-alert border="start" border-color="warning" class="v-alert-custom" elevation="2">
+                          <template v-slot:title
+                            ><b
+                              >You will need administrative rights on your local computer to successfully install
+                              OpenVPN</b
+                            ></template
+                          >
+                          Click on the link below if you do not hold administrative rights on your local computer, or
+                          don't know if you have such rights.<br /><br />
+
+                          <details style="font-size: 14px">
+                            <summary style="cursor: pointer">
+                              <b>Installing OpenVPN without administrative rights</b>
+                            </summary>
 
                             <div class="pl-4 pr-16 py-0">
                               <br />
-                              You can check if you have administrative rights in the Command prompt (<span v-html="cmdPrompt"></span>) on your local computer
-                              by running a command below. See if your local username is listed.
+                              You can check if you have administrative rights in the Command prompt (<span
+                                v-html="cmdPrompt"
+                              ></span
+                              >) on your local computer by running a command below. See if your local username is
+                              listed.
                               <CopyTextField
-                                :model-value='`net localgroup "Administrators"`'
+                                :model-value="`net localgroup &quot;Administrators&quot;`"
                                 class="my-1"
                                 label=""
                                 prefix=""
                                 placeholder=""
                               />
 
-                              <div class="mt-2 mb-1"><strong>Request assistance from your local IT personnel if you do not hold administrative rights on your local computer and request that they:</strong></div>
+                              <div class="mt-2 mb-1">
+                                <strong
+                                  >Request assistance from your local IT personnel if you do not hold administrative
+                                  rights on your local computer and request that they:</strong
+                                >
+                              </div>
 
                               (1) assist you in the OpenVPN installation, or<br />
 
-                              (2) grant you administrative rights on your local computer so you can install OpenVPN yourself.<br />
-
-                              <div class="mt-2 mb-1"><strong>For simplicity, we have outlined the steps they need to perform, which you can attach to your request:</strong></div>
-                              <a href="/do-science/guides/openvpn-admin-group/" target="_blank">https://docs.hdc.ntnu.no/do-science/guides/openvpn-admin-group/</a>
+                              (2) grant you administrative rights on your local computer so you can install OpenVPN
+                              yourself.<br />
+
+                              <div class="mt-2 mb-1">
+                                <strong
+                                  >For simplicity, we have outlined the steps they need to perform, which you can attach
+                                  to your request:</strong
+                                >
+                              </div>
+                              <a href="/do-science/guides/openvpn-admin-group/" target="_blank"
+                                >https://docs.hdc.ntnu.no/do-science/guides/openvpn-admin-group/</a
+                              >
                             </div>
                           </details>
                         </v-alert>
-
                       </v-card>
                       <template v-slot:actions>
                         <v-btn color="primary" class="mx-2 mb-1" @click="vpnStepper = 2">Continue</v-btn>
@@ -379,18 +428,10 @@ onMounted(() => {
                       </template>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="vpnStepper > 2"
-                      value="2"
-                    >
-                      <template v-slot:title>
-                        Setup the VPN profile
-                      </template>
+                    <v-stepper-vertical-item :complete="vpnStepper > 2" value="2" editable edit-icon>
+                      <template v-slot:title> Setup the VPN profile </template>
 
-                      <v-card
-                        class="mb-8 pr-4"
-                        elevation="0"
-                      >
+                      <v-card class="mb-8 pr-4" elevation="0">
                         <v-alert
                           v-show="filterGuidesByType && ['vpn_reset', 'reissue_all'].includes(filterGuidesByType)"
                           border="start"
@@ -400,10 +441,14 @@ onMounted(() => {
                           <template v-slot:title><b>Remove old VPN Configuration</b></template>
                           <ol>
                             <li>
-                              Right click on the OpenVPN notification icon on the taskbar, in the lower right corner of your screen and select. Find <code style="font-weight: bold;">Clear Saved Passwords</code> option and click on it to remove previously used passwords.
+                              Right click on the OpenVPN notification icon on the taskbar, in the lower right corner of
+                              your screen and select. Find
+                              <code style="font-weight: bold">Clear Saved Passwords</code> option and click on it to
+                              remove previously used passwords.
                             </li>
                             <li>
-                              Open your file explorer and manually remove the folder with the old OpenVPN configurations. It's usually located here:
+                              Open your file explorer and manually remove the folder with the old OpenVPN
+                              configurations. It's usually located here:
                               <CopyTextField
                                 :model-value="`%USERPROFILE%\\openvpn\\config\\${username}`"
                                 label=""
@@ -422,20 +467,35 @@ onMounted(() => {
                         <ol>
                           <li>
                             Start the OpenVPN client (if it is not running already) <br />
-                            <img alt="1-openvpn-icon" src="/img/vpn/1-openvpn-icon.png" style="max-width: 80px;" />
+                            <img alt="1-openvpn-icon" src="/img/vpn/1-openvpn-icon.png" style="max-width: 80px" />
                           </li>
                           <li>
                             Click to expand pane on Windows taskbar <br />
-                            <img alt="2-openvpn-expandable-pane-guide" src="/img/vpn/2-openvpn-expandable-pane-guide.png" style="max-width: 140px;" />
+                            <img
+                              alt="2-openvpn-expandable-pane-guide"
+                              src="/img/vpn/2-openvpn-expandable-pane-guide.png"
+                              style="max-width: 140px"
+                            />
                           </li>
                           <li>
                             Right click on the OpenVPN notification icon on the taskbar, <br />
-                            then through <code>Import</code> select <code style="font-weight: bold;">Import file...</code> <br />
-                            <img alt="4-openvpn-import-guide" src="/img/vpn/4-openvpn-import-guide.png" style="max-width: 380px;" />
+                            then through <code>Import</code> select
+                            <code style="font-weight: bold">Import file...</code> <br />
+                            <img
+                              alt="4-openvpn-import-guide"
+                              src="/img/vpn/4-openvpn-import-guide.png"
+                              style="max-width: 380px"
+                            />
                           </li>
                           <li>
-                            Select OpenVPN (OVPN) profile: <code style="font-weight: bold;">{{ username }}.ovpn</code> that you extracted from 7-ZIP archive. <br />
-                            <img alt="5-openvpn-open-file-guide" src="/img/vpn/5-openvpn-open-file-guide.png" style="max-width: 500px;" />
+                            Select OpenVPN (OVPN) profile:
+                            <code style="font-weight: bold">{{ username }}.ovpn</code> that you extracted from 7-ZIP
+                            archive. <br />
+                            <img
+                              alt="5-openvpn-open-file-guide"
+                              src="/img/vpn/5-openvpn-open-file-guide.png"
+                              style="max-width: 500px"
+                            />
                           </li>
                         </ol>
                       </v-card>
@@ -445,25 +505,19 @@ onMounted(() => {
                       </template>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="vpnStepper > 3"
-                      value="3"
-                    >
-                      <template v-slot:title>
-                        Connect to HUNT Cloud VPN
-                      </template>
+                    <v-stepper-vertical-item :complete="vpnStepper > 3" value="3" editable edit-icon>
+                      <template v-slot:title> Connect to HUNT Cloud VPN </template>
 
-                      <v-card
-                        class="mb-8 pr-4"
-                        elevation="0"
-                      >
+                      <v-card class="mb-8 pr-4" elevation="0">
                         <ol>
-                          <li>
-                            Right-click on the OpenVPN notification icon on the taskbar.
-                          </li>
+                          <li>Right-click on the OpenVPN notification icon on the taskbar.</li>
                           <li>
                             Select <i>Connect</i>. <br />
-                            <img alt="7-openvpn-click-connect" src="/img/vpn/7-openvpn-click-connect.png" style="max-width: 240px;" />
+                            <img
+                              alt="7-openvpn-click-connect"
+                              src="/img/vpn/7-openvpn-click-connect.png"
+                              style="max-width: 240px"
+                            />
                           </li>
                           <li>
                             Enter your username:
@@ -476,20 +530,33 @@ onMounted(() => {
                             />
                           </li>
                           <li>
-                            Enter a rotating 6-digit <code style="font-weight: bold;">verification code</code> from Google Authenticator as your password. <br />
-                            <strong>Do not save rotating password.</strong> Make sure that save password box is empty and then click OK.
+                            Enter a rotating 6-digit <code style="font-weight: bold">verification code</code> from
+                            Google Authenticator as your password. <br />
+                            <strong>Do not save rotating password.</strong> Make sure that save password box is empty
+                            and then click OK.
                             <br />
-                            <img alt="8-openvpn-totp-fill-guide" src="/img/vpn/8-openvpn-totp-fill-guide.png" style="max-width: 280px;" />
+                            <img
+                              alt="8-openvpn-totp-fill-guide"
+                              src="/img/vpn/8-openvpn-totp-fill-guide.png"
+                              style="max-width: 280px"
+                            />
                           </li>
                           <li>
-                            When prompted for a Private Key Password, insert the <code style="font-weight: bold;">VPN passphrase</code> from Signal. <br />
+                            When prompted for a Private Key Password, insert the
+                            <code style="font-weight: bold">VPN passphrase</code> from Signal. <br />
                             Make sure to save this long password and then click OK. <br />
-                            Your authentication will fail when you complete your passphrase below.
-                            This is expected since your <code style="font-weight: bold;">verification code</code> timed out while you typed your passphrase. <br />
-                            <img alt="9-openvpn-passphrase-fill-guide" src="/img/vpn/9-openvpn-passphrase-fill-guide.png" style="max-width: 280px;" />
+                            Your authentication will fail when you complete your passphrase below. This is expected
+                            since your <code style="font-weight: bold">verification code</code> timed out while you
+                            typed your passphrase. <br />
+                            <img
+                              alt="9-openvpn-passphrase-fill-guide"
+                              src="/img/vpn/9-openvpn-passphrase-fill-guide.png"
+                              style="max-width: 280px"
+                            />
                           </li>
                           <li>
-                            If the same window as in step 4 pops up try to connect again with a fresh <code style="font-weight: bold;">verification code</code> from Google Authenticator app.
+                            If the same window as in step 4 pops up try to connect again with a fresh
+                            <code style="font-weight: bold">verification code</code> from Google Authenticator app.
                           </li>
                         </ol>
                         <br /><br />
@@ -499,60 +566,57 @@ onMounted(() => {
                       <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="vpnStepper = 2">Back</v-btn>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="vpnStepper > 4"
-                      value="4"
-                    >
-                      <template v-slot:title>
-                        Verify your VPN connection
-                      </template>
+                    <v-stepper-vertical-item :complete="vpnStepper > 4" value="4" editable edit-icon>
+                      <template v-slot:title> Verify your VPN connection </template>
 
-                      <v-card
-                        class="mb-8 pr-16"
-                        elevation="0"
-                      >
-                        <v-alert
-                          border="start"
-                          border-color="success"
-                          elevation="2"
-                          icon="mdi-chevron-right"
-                        >
-                          <template v-slot:title><div class="mb-2">The OpenVPN notification icon on the taskbar should be green.</div></template>
+                      <v-card class="mb-8 pr-16" elevation="0">
+                        <v-alert border="start" border-color="success" elevation="2" icon="mdi-chevron-right">
+                          <template v-slot:title
+                            ><div class="mb-2">
+                              The OpenVPN notification icon on the taskbar should be green.
+                            </div></template
+                          >
                           <img alt="OpenVPN-icon" src="/img/vpn/2.OpenVPN-guide.png" />
                         </v-alert>
                       </v-card>
-                      <v-btn color="success" class="mx-2 mb-1" @click="vpnDialog = false; vpnStepper = 1;">Finish</v-btn>
+                      <v-btn
+                        color="success"
+                        class="mx-2 mb-1"
+                        @click="
+                          () => {
+                            vpnDialog = false
+                            vpnStepper = 1
+                          }
+                        "
+                        >Finish</v-btn
+                      >
                       <v-btn color="primary" class="mx-2 mb-1" @click="vpnStepper = 1">Start again</v-btn>
                       <v-btn color="warning" class="mx-2 mb-1" @click="vpnStepper = 5">Troubleshooting</v-btn>
                       <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="vpnStepper = 3">Back</v-btn>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="vpnStepper > 5"
-                      value="5"
-                    >
-                      <template v-slot:title>
-                        Troubleshooting VPN
-                      </template>
-                      <template v-slot:subtitle>
-                        Optional tips to try in case of issues
-                      </template>
-
-                      <v-card
-                        class="mb-8 pr-4 ml-0 pl-0"
-                        elevation="0"
-                      >
+                    <v-stepper-vertical-item :complete="vpnStepper > 5" value="5" editable edit-icon>
+                      <template v-slot:title> Troubleshooting VPN </template>
+                      <template v-slot:subtitle> Optional tips to try in case of issues </template>
 
+                      <v-card class="mb-8 pr-4 ml-0 pl-0" elevation="0">
                         <br />
-                        <h3 id="authenticate-vpn"><a href="#authenticate-vpn" class="header-anchor">#</a> Authenticate VPN</h3>
+                        <h3 id="authenticate-vpn">
+                          <a href="#authenticate-vpn" class="header-anchor">#</a> Authenticate VPN
+                        </h3>
                         <div>
-                          If the <em>Authenticate VPN</em> prompt pops up again, then try to log in again with a new <strong><code>verification code</code></strong>.
+                          If the <em>Authenticate VPN</em> prompt pops up again, then try to log in again with a new
+                          <strong><code>verification code</code></strong
+                          >.
                         </div>
 
                         <br />
-                        <h3 id="vpn-connection-failed"><a href="#vpn-connection-failed" class="header-anchor">#</a> VPN connection failed</h3>
+                        <h3 id="vpn-connection-failed">
+                          <a href="#vpn-connection-failed" class="header-anchor">#</a> VPN connection failed
+                        </h3>
                         <div>
-                          If you received the notification VPN Connection Failed after 60 seconds, please check the following:
+                          If you received the notification VPN Connection Failed after 60 seconds, please check the
+                          following:
                           <ul>
                             <li>Verify that you have an active internet connection.</li>
                             <li>Verify that the Private Key Password is correct.</li>
@@ -560,28 +624,41 @@ onMounted(() => {
                         </div>
 
                         <br />
-                        <h3 id="totp-wrong-credentials"><a href="#totp-wrong-credentials" class="header-anchor">#</a> TOTP wrong credentials</h3>
+                        <h3 id="totp-wrong-credentials">
+                          <a href="#totp-wrong-credentials" class="header-anchor">#</a> TOTP wrong credentials
+                        </h3>
                         <div>
                           If you received an error "wrong credentials" after using your TOTdiv authenticator:
                           <ul>
-                            <li>Make sure your phone is connected to internet for time synchronization. Time zone between phone and your machine should match.</li>
+                            <li>
+                              Make sure your phone is connected to internet for time synchronization. Time zone between
+                              phone and your machine should match.
+                            </li>
                           </ul>
                         </div>
 
                         <br />
-                        <h3 id="could-not-read-auth-error"><a href="#could-not-read-auth-error" class="header-anchor">#</a> Could not read Auth error</h3>
+                        <h3 id="could-not-read-auth-error">
+                          <a href="#could-not-read-auth-error" class="header-anchor">#</a> Could not read Auth error
+                        </h3>
                         <div>
-                          The error messages below indicates that TOTP (Google Auth) code is not accepted.
-                          You should try to setup your TOTP one more time or request a TOTP reset in Service desk.
-                          <div class="language- extra-class"><pre class="language-text">
+                          The error messages below indicates that TOTP (Google Auth) code is not accepted. You should
+                          try to setup your TOTP one more time or request a TOTP reset in Service desk.
+                          <div class="language- extra-class">
+                            <pre class="language-text">
                             <code v-text="`ERROR: could not read Auth username/password/ok/string from management interface`"></code>
-                          </pre></div>
+                          </pre>
+                          </div>
                         </div>
 
                         <br />
-                        <h3 id="could-not-read-private-key-error"><a href="#could-not-read-private-key-error" class="header-anchor">#</a> Could not read Private Key error</h3>
+                        <h3 id="could-not-read-private-key-error">
+                          <a href="#could-not-read-private-key-error" class="header-anchor">#</a> Could not read Private
+                          Key error
+                        </h3>
                         <div>
-                          The error messages below indicates that there is a typo in the Private Key Password (step 2.3.5) and you need to type it in again.
+                          The error messages below indicates that there is a typo in the Private Key Password (step
+                          2.3.5) and you need to type it in again.
                         </div>
                         <div class="language- extra-class mb-2" style="user-select: none">
                           <pre class="language-text">
@@ -596,22 +673,31 @@ onMounted(() => {
                         </div>
 
                         <br />
-                        <h3 id="remove-passphrase"><a href="#remove-passphrase" class="header-anchor">#</a> Remove saved passphrase</h3>
-                        <div>
-                          If you need to remove your VPN passphrase because of typo or SSH reissue.
-                        </div>
+                        <h3 id="remove-passphrase">
+                          <a href="#remove-passphrase" class="header-anchor">#</a> Remove saved passphrase
+                        </h3>
+                        <div>If you need to remove your VPN passphrase because of typo or SSH reissue.</div>
                         <div>
-                          Right click on the OpenVPN icon <img alt="OpenVPN-icon" src="/img/vpn/2.OpenVPN-guide.png" style="display: inline-block; height: 2em; margin-bottom: -10px;" /> in the task bar in the lower right corner of your screen and select <strong><code>Clear Saved Passwords</code></strong>.
+                          Right click on the OpenVPN icon
+                          <img
+                            alt="OpenVPN-icon"
+                            src="/img/vpn/2.OpenVPN-guide.png"
+                            style="display: inline-block; height: 2em; margin-bottom: -10px"
+                          />
+                          in the task bar in the lower right corner of your screen and select
+                          <strong><code>Clear Saved Passwords</code></strong
+                          >.
                         </div>
 
                         <br />
-                        <h3 id="remove-vpn-config"><a href="#remove-vpn-config" class="header-anchor">#</a> Remove VPN config</h3>
-                        <div>
-                          If you need to remove your VPN config because SSH reissue or reactivation.
-                        </div>
+                        <h3 id="remove-vpn-config">
+                          <a href="#remove-vpn-config" class="header-anchor">#</a> Remove VPN config
+                        </h3>
+                        <div>If you need to remove your VPN config because SSH reissue or reactivation.</div>
                         <div>
                           Open your file explorer and manually remove the folder with the old OpenVPN configurations.
-                          It's usually located in this directory and you should remove the directory <code>{{ username }}</code> including the contents:
+                          It's usually located in this directory and you should remove the directory
+                          <code>{{ username }}</code> including the contents:
                         </div>
                         <CopyTextField
                           :model-value="`%USERPROFILE%\\OpenVPN\\config\\${username}`"
@@ -621,46 +707,70 @@ onMounted(() => {
                         />
 
                         <br />
-                        <h3 id="route-addition-failed"><a href="#route-addition-failed" class="header-anchor">#</a> Route addition failed </h3>
+                        <h3 id="route-addition-failed">
+                          <a href="#route-addition-failed" class="header-anchor">#</a> Route addition failed
+                        </h3>
                         <div>
-                          You should reinstall your OpenVPN with administrative rights if you already installed OpenVPN and are getting errors below:
-                          <div class="language- extra-class mb-2"><pre class="language-text">
+                          You should reinstall your OpenVPN with administrative rights if you already installed OpenVPN
+                          and are getting errors below:
+                          <div class="language- extra-class mb-2">
+                            <pre class="language-text">
                             <code v-text="`ERROR: route addition failed using CreateIpForwardEntry: Ingen tilgang.`"></code>
-                          </pre></div>
+                          </pre>
+                          </div>
 
-                          <div class="language- extra-class mb-2"><pre class="language-text">
+                          <div class="language- extra-class mb-2">
+                            <pre class="language-text">
                             <code v-text="`ERROR: Windows route add command failed [adaptive]: returned error code 1`"></code>
-                          </pre></div>
+                          </pre>
+                          </div>
 
-                          <div class="language- extra-class mb-2"><pre class="language-text">
+                          <div class="language- extra-class mb-2">
+                            <pre class="language-text">
                             <code v-text="`ERROR: Some routes were not successfully added. The connection may not function correctly`"></code>
-                          </pre></div>
+                          </pre>
+                          </div>
                         </div>
 
                         <br />
-                        <h3 id="tls-key-negotiation-timeout"><a href="#tls-key-negotiation-timeout" class="header-anchor">#</a> TLS handshake failed</h3>
+                        <h3 id="tls-key-negotiation-timeout">
+                          <a href="#tls-key-negotiation-timeout" class="header-anchor">#</a> TLS handshake failed
+                        </h3>
                         <div>
-                          If you see the error below the problem might be with your current network (e.g. institution is blocking VPN connections).
-                          <div class="language- extra-class mb-2"><pre class="language-text">
+                          If you see the error below the problem might be with your current network (e.g. institution is
+                          blocking VPN connections).
+                          <div class="language- extra-class mb-2">
+                            <pre class="language-text">
                             <code v-text="`TLS Error: TLS key negotiation failed to occur within 60 seconds (check your network connectivity)`"></code>
-                          </pre></div>
+                          </pre>
+                          </div>
 
                           <ul>
                             <li>
-                              Make sure your IP address is in our <a href="https://docs.hdc.ntnu.no/do-science/troubleshooting/connection/#access-list">Access list</a>.
+                              Make sure your IP address is in our
+                              <a href="https://docs.hdc.ntnu.no/do-science/troubleshooting/connection/#access-list"
+                                >Access list</a
+                              >.
                             </li>
                             <li>
-                              Confirm that your local institution is blocking VPN connecting by connecting from different network (e.g. mobile internet or from home).
-                              For more details see our troubleshooting guide
-                              <a href="https://docs.hdc.ntnu.no/do-science/troubleshooting/connection/#cannot-connect-due-to-local-firewalls">Cannot connect due to local firewalls</a>.
+                              Confirm that your local institution is blocking VPN connecting by connecting from
+                              different network (e.g. mobile internet or from home). For more details see our
+                              troubleshooting guide
+                              <a
+                                href="https://docs.hdc.ntnu.no/do-science/troubleshooting/connection/#cannot-connect-due-to-local-firewalls"
+                                >Cannot connect due to local firewalls</a
+                              >.
                             </li>
                           </ul>
                         </div>
 
                         <br />
-                        <h3 id="test-firewall"><a href="#test-firewall" class="header-anchor">#</a> Detect firewall blocks</h3>
+                        <h3 id="test-firewall">
+                          <a href="#test-firewall" class="header-anchor">#</a> Detect firewall blocks
+                        </h3>
                         <div>
-                          If you want to check whether your VPN connection is blocked by the firewall, download and install [NMAP](https://nmap.org/download.html), and then run:
+                          If you want to check whether your VPN connection is blocked by the firewall, download and
+                          install [NMAP](https://nmap.org/download.html), and then run:
                         </div>
                         <CopyTextField
                           :model-value="`nmap -sU -Pn --traceroute -p U:1194 129.241.176.121`"
@@ -669,24 +779,22 @@ onMounted(() => {
                           placeholder=""
                         />
                         <div class="mt-2">
-                          If traceroute ends with <code>129.241.176.121</code> no blocking was detected. If tracing seems stuck send us a screenshot in service desk.
+                          If traceroute ends with <code>129.241.176.121</code> no blocking was detected. If tracing
+                          seems stuck send us a screenshot in service desk.
                         </div>
 
-                        <v-alert
-                          border="start"
-                          border-color="info"
-                          class="mt-6"
-                          elevation="2"
-                        >
+                        <v-alert border="start" border-color="info" class="mt-6" elevation="2">
                           <template v-slot:title><b>TIP</b></template>
-                          If nothing works, please head over to our main <a href="/do-science/troubleshooting/connection/#vpn" target="_blank">troubleshooting section</a> for more information on how to troubleshoot connections.
+                          If nothing works, please head over to our main
+                          <a href="/do-science/troubleshooting/connection/#vpn" target="_blank"
+                            >troubleshooting section</a
+                          >
+                          for more information on how to troubleshoot connections.
                         </v-alert>
-
                       </v-card>
                       <v-btn color="primary" class="mx-2 mb-1" @click="vpnStepper = 1">Start again</v-btn>
                       <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="vpnStepper = 4">Back</v-btn>
                     </v-stepper-vertical-item>
-
                   </v-stepper-vertical>
                 </v-card-text>
               </v-card>
@@ -704,12 +812,18 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 3. SSH Passphrase change -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_lab', 'ssh_reset', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_lab', 'ssh_reset', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#ssh-passphrase" class="header-anchor">#</a> {{ passChangeId }}. SSH Passphrase change</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="ssh-passphrase" ref="#ssh-passphrase">
-
             <v-alert
               v-show="filterGuidesByType && ['new_lab', 'ssh_reset', 'lab_migration'].includes(filterGuidesByType)"
               border="start"
@@ -726,11 +840,10 @@ onMounted(() => {
               poster="/img/video-covers/lab-access-macOS-ssh-passphrase-v1.jpg"
             />
 
+            <v-col cols="12"> {{ getNextItem(passChangeId, true) }} Design <DesignNewPassphrase />. </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId, true) }} Design <DesignNewPassphrase />.
-            </v-col>
-            <v-col cols="12">
-              {{ getNextItem(passChangeId) }} To start Command Prompt press <code>WIN + R</code> and type <strong><code>cmd.exe</code></strong> then hit <code>Enter</code>.
+              {{ getNextItem(passChangeId) }} To start Command Prompt press <code>WIN + R</code> and type
+              <strong><code>cmd.exe</code></strong> then hit <code>Enter</code>.
             </v-col>
             <!-- Only show for lab migration scenarios -->
             <!-- <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
@@ -752,7 +865,8 @@ onMounted(() => {
               />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} You should then be prompted to enter a password. Enter your <code>SSH temporary key</code> from Signal message.
+              {{ getNextItem(passChangeId) }} You should then be prompted to enter a password. Enter your
+              <code>SSH temporary key</code> from Signal message.
               <div class="language- extra-class">
                 <pre class="language-text pa-0">
                   <code v-text="`${username}@${ipAddress}'s password:`"></code>
@@ -760,7 +874,8 @@ onMounted(() => {
               </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} When asked for current UNIX password type in your <code>SSH temporary key</code> from Signal message.
+              {{ getNextItem(passChangeId) }} When asked for current UNIX password type in your
+              <code>SSH temporary key</code> from Signal message.
               <div class="language- extra-class">
                 <pre class="language-text pa-0">
                   <code v-text="passExpiredText"></code>
@@ -768,18 +883,16 @@ onMounted(() => {
               </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Enter your new passphrase and retype for verification. You will be kicked off the entry machine right after your password is changed.
+              {{ getNextItem(passChangeId) }} Enter your new passphrase and retype for verification. You will be kicked
+              off the entry machine right after your password is changed.
               <div class="language- extra-class">
                 <pre class="language-text pa-0">
                   <code v-text="passSetNew"></code>
                 </pre>
               </div>
-              <v-alert
-                border="start"
-                border-color="warning"
-                elevation="2"
-              >
-                If you are getting an <code>Authentication token manipulation error</code> check strength requirements for passphrase in step {{ passChangeId }}.1.
+              <v-alert border="start" border-color="warning" elevation="2">
+                If you are getting an <code>Authentication token manipulation error</code> check strength requirements
+                for passphrase in step {{ passChangeId }}.1.
               </v-alert>
             </v-col>
             <v-col cols="12">
@@ -800,7 +913,8 @@ onMounted(() => {
               </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} When logged into your <code>entry</code> machine, connect to your <code>home</code> machine.
+              {{ getNextItem(passChangeId) }} When logged into your <code>entry</code> machine, connect to your
+              <code>home</code> machine.
               <CopyTextField
                 :model-value="`ssh -o StrictHostKeyChecking=accept-new home`"
                 label=""
@@ -809,19 +923,25 @@ onMounted(() => {
               />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} You will be prompted to type your <code>SSH temporary key</code> from Signal message.
+              {{ getNextItem(passChangeId) }} You will be prompted to type your <code>SSH temporary key</code> from
+              Signal message.
               <!-- <div class="language- extra-class"><pre class="language-text pa-0">
                   <code v-text="`${username}@home's password:`"></code>
               </pre></div> -->
-              <div class="language- extra-class"><pre class="language-text pa-0">
+              <div class="language- extra-class">
+                <pre class="language-text pa-0">
               <code v-text="passExpiredText"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Similar to above, you will be asked for a new password. Type your new passphrase two times.
-              <div class="language- extra-class"><pre class="language-text pa-0">
+              {{ getNextItem(passChangeId) }} Similar to above, you will be asked for a new password. Type your new
+              passphrase two times.
+              <div class="language- extra-class">
+                <pre class="language-text pa-0">
               <code v-text="passSetNew"></code>
-              </pre></div>
+              </pre>
+              </div>
               <!-- Expected result:
               <div class="language- extra-class"><pre class="language-text pa-0">
               <code v-text="passChangedHome"></code>
@@ -838,26 +958,43 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Expected result:
-              <div class="language- extra-class"><pre class="language-text pa-0">
+              <div class="language- extra-class">
+                <pre class="language-text pa-0">
                   <code v-text="`${username}@${labName}-home:~$`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passChangeId) }} Close Command Prompt window to make sure you are disconnected from your lab.
+              {{ getNextItem(passChangeId) }} Close Command Prompt window to make sure you are disconnected from your
+              lab.
             </v-col>
 
-            <v-btn v-if="['lab_migration'].includes(filterGuidesByType)" color="primary" class="mx-2 my-2" size="small" @click="nextPanel(2)">Next</v-btn>
+            <v-btn
+              v-if="['lab_migration'].includes(filterGuidesByType)"
+              color="primary"
+              class="mx-2 my-2"
+              size="small"
+              @click="nextPanel(2)"
+              >Next</v-btn
+            >
             <v-btn v-else color="primary" class="mx-2 my-2" size="small" @click="nextPanel()">Next</v-btn>
           </v-expansion-panel-text>
         </v-expansion-panel>
 
         <!-- 4. SSH Passwordless access -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
-            <h3><a href="#passwordless-access" class="header-anchor">#</a> {{ passLessId }}. SSH Passwordless access</h3>
+            <h3>
+              <a href="#passwordless-access" class="header-anchor">#</a> {{ passLessId }}. SSH Passwordless access
+            </h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="passwordless-access" ref="#passwordless-access" class="mt-2">
-
             <VideoGuide
               v-model="mainExpansionPanel"
               title="SSH Passwordless access"
@@ -866,7 +1003,9 @@ onMounted(() => {
             />
 
             <v-col cols="12">
-              {{ getNextItem(passLessId, true) }}  Open new Command Prompt window (<code>WIN + R</code> and type <code>cmd.exe</code> then hit <code>Enter</code>) and generate ssh key. If command reports that id_rsa key already exists, to avoid overwriting your existing keys press <code>n</code> and skip to next step.
+              {{ getNextItem(passLessId, true) }} Open new Command Prompt window (<code>WIN + R</code> and type
+              <code>cmd.exe</code> then hit <code>Enter</code>) and generate ssh key. If command reports that id_rsa key
+              already exists, to avoid overwriting your existing keys press <code>n</code> and skip to next step.
               <CopyTextField
                 :model-value="sshKeygenWin"
                 class="my-2"
@@ -876,9 +1015,10 @@ onMounted(() => {
               />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(passLessId) }} Place your public key into the lab. You will be asked for your SSH passphrase.
+              {{ getNextItem(passLessId) }} Place your public key into the lab. You will be asked for your SSH
+              passphrase.
               <CopyTextField
-                :model-value='`type "%USERPROFILE%\\.ssh\\id_rsa.pub" | ssh ${username}@${ipAddress} add-public-key`'
+                :model-value="`type &quot;%USERPROFILE%\\.ssh\\id_rsa.pub&quot; | ssh ${username}@${ipAddress} add-public-key`"
                 class="my-2"
                 label=""
                 prefix="C:\Users\User>"
@@ -887,9 +1027,11 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               You will be asked for your SSH passphrase:
-              <div class="language- extra-class"><pre class="language-text pa-0">
+              <div class="language- extra-class">
+                <pre class="language-text pa-0">
                 <code v-text="`${username}@${ipAddress}'s password:`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
               {{ getNextItem(passLessId) }} Confirm passwordless access.
@@ -903,9 +1045,11 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Expected result:
-              <div class="language- extra-class"><pre class="language-text pa-0">
+              <div class="language- extra-class">
+                <pre class="language-text pa-0">
                 <code v-text="`${username}@${labName}-entry:~$`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
               {{ getNextItem(passLessId) }} Close Command prompt window to make sure you are disconnected from your lab.
@@ -916,12 +1060,18 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 5. SSH Config file -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
-              <h3><a href="#ssh-config" class="header-anchor">#</a> {{ sshConfId }}. SSH Config file</h3>
+            <h3><a href="#ssh-config" class="header-anchor">#</a> {{ sshConfId }}. SSH Config file</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="ssh-config" ref="#ssh-config" class="mt-2">
-
             <VideoGuide
               v-model="mainExpansionPanel"
               title="SSH Config file"
@@ -930,9 +1080,11 @@ onMounted(() => {
             />
 
             <v-col cols="12">
-              {{ getNextItem(sshConfId, true) }} Open new Command Prompt window (<code>WIN + R</code> and type <code>cmd.exe</code> then hit <code>Enter</code>) and assure SSH Config file exists. No output is expected.
+              {{ getNextItem(sshConfId, true) }} Open new Command Prompt window (<code>WIN + R</code> and type
+              <code>cmd.exe</code> then hit <code>Enter</code>) and assure SSH Config file exists. No output is
+              expected.
               <CopyTextField
-                :model-value='`type nul >> "%USERPROFILE%\\.ssh\\config"`'
+                :model-value="`type nul >> &quot;%USERPROFILE%\\.ssh\\config&quot;`"
                 label=""
                 prefix="C:\Users\User>"
                 placeholder="Your link is missing access token"
@@ -941,14 +1093,15 @@ onMounted(() => {
             <v-col cols="12">
               {{ getNextItem(sshConfId) }} Open SSH Config file.
               <CopyTextField
-                :model-value='`Notepad.exe "%USERPROFILE%\\.ssh\\config"`'
+                :model-value="`Notepad.exe &quot;%USERPROFILE%\\.ssh\\config&quot;`"
                 label=""
                 prefix="C:\Users\User>"
                 placeholder="Your link is missing access token"
               />
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
-              {{ getNextItem(sshConfId) }} Replace old lab configuration in SSH Config opened in Notepad and then save changes.
+              {{ getNextItem(sshConfId) }} Replace old lab configuration in SSH Config opened in Notepad and then save
+              changes.
               <v-textarea
                 v-model.trim="configText"
                 :data-ref="'ssh-config-win'"
@@ -968,7 +1121,8 @@ onMounted(() => {
               </v-textarea>
             </v-col>
             <v-col v-else cols="12">
-              {{ getNextItem(sshConfId) }} Add lab configuration into SSH Config opened in Notepad and then save changes.
+              {{ getNextItem(sshConfId) }} Add lab configuration into SSH Config opened in Notepad and then save
+              changes.
               <v-textarea
                 v-model.trim="configText"
                 :data-ref="'ssh-config-win'"
@@ -1014,20 +1168,22 @@ onMounted(() => {
         </v-expansion-panel>
 
         <!-- 6. Hosts file -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'lab_migration', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#hosts-file" class="header-anchor">#</a> {{ hostsFileId }}. Workbench - hosts file</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="hosts-file" ref="#hosts-file">
-            <v-alert
-              border="start"
-              border-color="warning"
-              elevation="2"
-              class="mb-2"
-            >
+            <v-alert border="start" border-color="warning" elevation="2" class="mb-2">
               <template v-slot:title><strong>Administrator permissions are required.</strong></template>
-              If you do not have Administrator permissions on your local workstation make sure to ask
-              IT department in your organization for assistance or permissions.
+              If you do not have Administrator permissions on your local workstation make sure to ask IT department in
+              your organization for assistance or permissions.
             </v-alert>
 
             Let's set up your hosts file on your local computer. <br />
@@ -1040,26 +1196,44 @@ onMounted(() => {
               poster="/img/video-covers/lab-access-macOS-workbench-hosts-v1.jpg"
             />
 
+            <v-col cols="12"> {{ getNextItem(hostsFileId, true) }} Press the Windows key. </v-col>
             <v-col cols="12">
-              {{ getNextItem(hostsFileId, true) }} Press the Windows key.
-            </v-col>
-            <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} Type <code style="font-weight: bold;">Notepad</code> in the search field.
+              {{ getNextItem(hostsFileId) }} Type <code style="font-weight: bold">Notepad</code> in the search field.
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} In the search results, <strong>right-click</strong> Notepad and select <code style="font-weight: bold;">Run as administrator</code>.
+              {{ getNextItem(hostsFileId) }} In the search results, <strong>right-click</strong> Notepad and select
+              <code style="font-weight: bold">Run as administrator</code>.
               <br />
-              <img class="pa-2" alt="notepad-administrator" src="/img/workbench/notepad-administrator.png" style="max-width: 600px;" />
+              <img
+                class="pa-2"
+                alt="notepad-administrator"
+                src="/img/workbench/notepad-administrator.png"
+                style="max-width: 600px"
+              />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} Confirm <strong>administrator permissions</strong> by clicking on <code style="font-weight: bold;">Yes</code>.
+              {{ getNextItem(hostsFileId) }} Confirm <strong>administrator permissions</strong> by clicking on
+              <code style="font-weight: bold">Yes</code>.
               <br />
-              <img class="pa-2" alt="notepad-admin-confirm" src="/img/workbench/notepad-admin-confirm.png" style="max-width: 350px;" />
+              <img
+                class="pa-2"
+                alt="notepad-admin-confirm"
+                src="/img/workbench/notepad-admin-confirm.png"
+                style="max-width: 350px"
+              />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} In Notepad, start by selecting <code style="font-weight: bold;">File</code> > <code style="font-weight: bold;">Open</code> (<code>CTRL + O</code>).
+              {{ getNextItem(hostsFileId) }} In Notepad, start by selecting
+              <code style="font-weight: bold">File</code> > <code style="font-weight: bold">Open</code> (<code
+                >CTRL + O</code
+              >).
               <br />
-              <img class="pa-2" alt="notepad-open-file" src="/img/workbench/notepad-open-file.png" style="max-width: 450px;" />
+              <img
+                class="pa-2"
+                alt="notepad-open-file"
+                src="/img/workbench/notepad-open-file.png"
+                style="max-width: 450px"
+              />
             </v-col>
             <v-col cols="12">
               {{ getNextItem(hostsFileId) }} Find the directory below:<br />
@@ -1070,19 +1244,37 @@ onMounted(() => {
                 prefix=""
                 placeholder="Your link is missing access token"
               />
-              <img class="pa-2" alt="notepad-hosts-base-directory" src="/img/workbench/notepad-hosts-base-directory.png" style="max-width: 500px;" /><br />
+              <img
+                class="pa-2"
+                alt="notepad-hosts-base-directory"
+                src="/img/workbench/notepad-hosts-base-directory.png"
+                style="max-width: 500px"
+              /><br />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} Show hidden files by changing type from <strong>Text documents (*.txt)</strong> to view <strong>All files</strong>.<br />
-              <img class="pa-2" alt="notepad-all-files" src="/img/workbench/notepad-all-files.png" style="max-width: 500px;" /><br />
+              {{ getNextItem(hostsFileId) }} Show hidden files by changing type from
+              <strong>Text documents (*.txt)</strong> to view <strong>All files</strong>.<br />
+              <img
+                class="pa-2"
+                alt="notepad-all-files"
+                src="/img/workbench/notepad-all-files.png"
+                style="max-width: 500px"
+              /><br />
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} When a file named <strong>hosts</strong> appears in the list select it and click <strong>Open</strong>: <br />
-              <img class="pa-2" alt="notepad-selected-hosts" src="/img/workbench/notepad-selected-hosts.png" style="max-width: 500px;" />
+              {{ getNextItem(hostsFileId) }} When a file named <strong>hosts</strong> appears in the list select it and
+              click <strong>Open</strong>: <br />
+              <img
+                class="pa-2"
+                alt="notepad-selected-hosts"
+                src="/img/workbench/notepad-selected-hosts.png"
+                style="max-width: 500px"
+              />
               <br />
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
-              {{ getNextItem(hostsFileId) }} Make sure the line with the old hosts record is removed. <strong>Search and remove lines</strong> containing domain name:<br />
+              {{ getNextItem(hostsFileId) }} Make sure the line with the old hosts record is removed.
+              <strong>Search and remove lines</strong> containing domain name:<br />
               <CopyTextField
                 :model-value="fqdn"
                 class="my-2"
@@ -1092,7 +1284,8 @@ onMounted(() => {
               />
             </v-col>
             <v-col v-if="['lab_migration'].includes(filterGuidesByType)" cols="12">
-              {{ getNextItem(hostsFileId) }} Add (append) the new <strong>hosts record</strong> below to the text file:<br />
+              {{ getNextItem(hostsFileId) }} Add (append) the new <strong>hosts record</strong> below to the text
+              file:<br />
               <CopyTextField
                 :model-value="hostsWorkbench"
                 class="my-2"
@@ -1114,22 +1307,35 @@ onMounted(() => {
               Make sure to avoid duplicate records.
             </v-col>
             <v-col cols="12">
-              {{ getNextItem(hostsFileId) }} Select <code>File</code> > <code>Save</code> to save your changes and close the <code>Notepad</code> application.
+              {{ getNextItem(hostsFileId) }} Select <code>File</code> > <code>Save</code> to save your changes and close
+              the <code>Notepad</code> application.
             </v-col>
 
-            <v-btn v-if="['lab_migration'].includes(filterGuidesByType)" color="primary" class="mx-2 my-2" size="small" @click="nextPanel(2)">Next</v-btn>
+            <v-btn
+              v-if="['lab_migration'].includes(filterGuidesByType)"
+              color="primary"
+              class="mx-2 my-2"
+              size="small"
+              @click="nextPanel(2)"
+              >Next</v-btn
+            >
             <v-btn v-else color="primary" class="mx-2 my-2" size="small" @click="nextPanel()">Next</v-btn>
           </v-expansion-panel-text>
         </v-expansion-panel>
 
-
         <!-- 7. Workbench -->
-        <v-expansion-panel :disabled="!filterGuidesByType || ['new_user', 'new_computer', 'new_lab', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType) ? false : true">
+        <v-expansion-panel
+          :disabled="
+            !filterGuidesByType ||
+            ['new_user', 'new_computer', 'new_lab', 'workbench_reissue', 'reissue_all'].includes(filterGuidesByType)
+              ? false
+              : true
+          "
+        >
           <v-expansion-panel-title>
             <h3><a href="#workbench" class="header-anchor">#</a> {{ workbenchId }}. Workbench - certificate</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="workbench" ref="#workbench" class="mt-2">
-
             <v-row class="my-0 pa-0 mx-1">
               <v-col cols="12 ma-0 py-0">
                 <VideoGuide
@@ -1160,7 +1366,8 @@ onMounted(() => {
                 </v-btn>
               </v-col>
               <v-col cols="12">
-                <a href="/do-science/hunt-workbench/" target="_blank">HUNT Workbench</a> provides you with web-based access to modern data science tools such as Jupyter Notebooks, Python, RStudio, R and MATLAB.
+                <a href="/do-science/hunt-workbench/" target="_blank">HUNT Workbench</a> provides you with web-based
+                access to modern data science tools such as Jupyter Notebooks, Python, RStudio, R and MATLAB.
               </v-col>
             </v-row>
             <v-dialog
@@ -1168,7 +1375,12 @@ onMounted(() => {
               persistent
               scrollable
               max-width="960px"
-              @keydown.esc="workbenchDialog = false; workbenchStepper = 1"
+              @keydown.esc="
+                () => {
+                  workbenchDialog = false
+                  workbenchStepper = 1
+                }
+              "
             >
               <v-card elevation="0">
                 <v-card-title class="pa-0">
@@ -1183,114 +1395,142 @@ onMounted(() => {
 
                 <v-card-text class="pa-0">
                   <v-stepper-vertical v-model="workbenchStepper" class="mt-16" hide-actions>
-                    <v-stepper-vertical-item
-                      :complete="workbenchStepper > 1"
-                      value="1"
-                    >
-                      <template v-slot:title>
-                        Checks
-                      </template>
-
-                      <v-card
-                        class="mb-12 pr-4"
-                        elevation="0"
-                      >
-                        <v-alert
-                          border="start"
-                          border-color="warning"
-                          elevation="2"
-                        >
-                          Make sure you have received your Workbench certificate (<code>{{ labName }}-{{ username }}.p12</code>).
+                    <v-stepper-vertical-item :complete="workbenchStepper > 1" value="1">
+                      <template v-slot:title> Checks </template>
+
+                      <v-card class="mb-12 pr-4" elevation="0">
+                        <v-alert border="start" border-color="warning" elevation="2">
+                          Make sure you have received your Workbench certificate (<code
+                            >{{ labName }}-{{ username }}.p12</code
+                          >).
                         </v-alert>
-                        <v-alert
-                          border="start"
-                          border-color="warning"
-                          elevation="2"
-                        >
+                        <v-alert border="start" border-color="warning" elevation="2">
                           Assure working VPN connection.
                         </v-alert>
                       </v-card>
                       <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 2">Continue</v-btn>
-                      <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 4">Skip to Troubleshooting</v-btn>
+                      <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 4"
+                        >Skip to Troubleshooting</v-btn
+                      >
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="workbenchStepper > 2"
-                      value="2"
-                    >
-                      <template v-slot:title>
-                        Install your certificates
-                      </template>
+                    <v-stepper-vertical-item :complete="workbenchStepper > 2" value="2">
+                      <template v-slot:title> Install your certificates </template>
 
-                      <v-card
-                        class="mb-8 pr-4"
-                        elevation="0"
-                      >
-                        Let's install the certificates that are required to allow traffic with HUNT Workbench that is located in your lab.
+                      <v-card class="mb-8 pr-4" elevation="0">
+                        Let's install the certificates that are required to allow traffic with HUNT Workbench that is
+                        located in your lab.
                         <br /><br />
                         <ol>
                           <li>
-                            Open your <code>.p12 certificate</code> that you downloaded from FileSender.
-                            Make sure the store location is set to <code>Current User</code> and click <code>Next</code>:
+                            Open your <code>.p12 certificate</code> that you downloaded from FileSender. Make sure the
+                            store location is set to <code>Current User</code> and click <code>Next</code>:
                             <br />
-                            <img class="pa-2" alt="1_cert_p12" src="/img/workbench/1_cert_p12.png" style="max-width: 500px;" />
+                            <img
+                              class="pa-2"
+                              alt="1_cert_p12"
+                              src="/img/workbench/1_cert_p12.png"
+                              style="max-width: 500px"
+                            />
                             <br />
                           </li>
                           <li>
                             Click <code>Next</code> one more time.
                             <br />
-                            <img class="pa-2" alt="2_cert_p12" src="/img/workbench/2_cert_p12.png" style="max-width: 500px;" />
+                            <img
+                              class="pa-2"
+                              alt="2_cert_p12"
+                              src="/img/workbench/2_cert_p12.png"
+                              style="max-width: 500px"
+                            />
                             <br />
                           </li>
                           <li>
-                            Fill in the <code>TLS passphrase</code> that you received on signal, and make sure the options are checked exactly as in the image.
-                            Then click <code>Next</code>:
+                            Fill in the <code>TLS passphrase</code> that you received on signal, and make sure the
+                            options are checked exactly as in the image. Then click <code>Next</code>:
                             <br />
-                            <img class="pa-2" alt="3_cert_p12" src="/img/workbench/3_cert_p12.png" style="max-width: 500px;" />
+                            <img
+                              class="pa-2"
+                              alt="3_cert_p12"
+                              src="/img/workbench/3_cert_p12.png"
+                              style="max-width: 500px"
+                            />
                             <br />
                           </li>
                           <li>
-                            Check the first option: <i>Automatically select the certificate store based on the type of certificate</i>.
-                            Click <code>Next</code>:
+                            Check the first option:
+                            <i>Automatically select the certificate store based on the type of certificate</i>. Click
+                            <code>Next</code>:
                             <br />
-                            <img class="pa-2" alt="4_cert_p12" src="/img/workbench/4_cert_p12.png" style="max-width: 500px;" />
+                            <img
+                              class="pa-2"
+                              alt="4_cert_p12"
+                              src="/img/workbench/4_cert_p12.png"
+                              style="max-width: 500px"
+                            />
                             <br />
                           </li>
                           <li>
-                            You should now get a Completing the Certificate Import Wizard message.
-                            Click Finish to complete the import:
+                            You should now get a Completing the Certificate Import Wizard message. Click Finish to
+                            complete the import:
                             <br />
-                            <img class="pa-2" alt="5_cert_p12" src="/img/workbench/5_cert_p12.png" style="max-width: 500px;" />
+                            <img
+                              class="pa-2"
+                              alt="5_cert_p12"
+                              src="/img/workbench/5_cert_p12.png"
+                              style="max-width: 500px"
+                            />
                             <br />
                           </li>
                           <li>
-                            The wizard will require a confirmation to install a certificate from us: HCTS CA 1 (HUNT Cloud Trust Services).
-                            Our certificate is required to safely access your workbench environment.
-                            <br /><br />
-                            You will normally be asked to confirm our certificate only when you set up the HUNT Workbench for the first time.
-                            Thus, if you see <code>LAB</code> instead of <code>HCTS CA 1</code> skip to step 7.
+                            The wizard will require a confirmation to install a certificate from us: HCTS CA 1 (HUNT
+                            Cloud Trust Services). Our certificate is required to safely access your workbench
+                            environment.
                             <br /><br />
+                            You will normally be asked to confirm our certificate only when you set up the HUNT
+                            Workbench for the first time. Thus, if you see <code>LAB</code> instead of
+                            <code>HCTS CA 1</code> skip to step 7. <br /><br />
                             Before clicking <code>YES</code>, confirm that you see our thumbprint (fingerprint):
                             <br />
-                            <div class="language- extra-class"><pre class="language-text">
+                            <div class="language- extra-class">
+                              <pre class="language-text">
                               <code v-text="`ADD9DFEC C998BE44 AC2F254E 75E5EB98 D91879A6`"></code>
-                            </pre></div>
+                            </pre>
+                            </div>
                             <br />
-                            <img class="pa-2" alt="6_confirmCAcertificate" src="/img/workbench/6_confirmCAcertificate.png" style="max-width: 500px;" />
+                            <img
+                              class="pa-2"
+                              alt="6_confirmCAcertificate"
+                              src="/img/workbench/6_confirmCAcertificate.png"
+                              style="max-width: 500px"
+                            />
                             <br />
                           </li>
                           <li>
-                            Similar to Step 6, you will also need to install a certificate for your lab (<code>Lab CA</code>),<br />
+                            Similar to Step 6, you will also need to install a certificate for your lab (<code
+                              >Lab CA</code
+                            >),<br />
                             where your <strong>Lab name should appear</strong>. Click <code>YES</code>.
                             <br />
-                            <img class="pa-2" alt="7_confirmLabCAcertificate" src="/img/workbench/7_confirmLabCAcertificate.png" style="max-width: 500px;" />
+                            <img
+                              class="pa-2"
+                              alt="7_confirmLabCAcertificate"
+                              src="/img/workbench/7_confirmLabCAcertificate.png"
+                              style="max-width: 500px"
+                            />
                             <br />
                           </li>
                           <li>
-                            Now quit your internet browser (we recommend <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a>)<br />
+                            Now quit your internet browser (we recommend
+                            <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a>)<br />
                             and restart it for the certificate to get recognized.
                             <br />
-                            <img class="pa-2" alt="8_import_success" src="/img/workbench/8_import_success.png" style="max-width: 300px;" />
+                            <img
+                              class="pa-2"
+                              alt="8_import_success"
+                              src="/img/workbench/8_import_success.png"
+                              style="max-width: 300px"
+                            />
                             <br />
                           </li>
                         </ol>
@@ -1299,56 +1539,57 @@ onMounted(() => {
                       <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 1">Back</v-btn>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="workbenchStepper > 3"
-                      value="3"
-                    >
-                      <template v-slot:title>
-                        Login to Workbench
-                      </template>
+                    <v-stepper-vertical-item :complete="workbenchStepper > 3" value="3">
+                      <template v-slot:title> Login to Workbench </template>
 
-                      <v-card
-                        class="mb-8 pr-16"
-                        elevation="0"
-                      >
-                        <v-alert
-                          border="start"
-                          border-color="warning"
-                          elevation="2"
-                        >
-                          <template v-slot:title><strong>Make sure you are connected to the VPN before you access your HUNT Workbench.</strong></template>
+                      <v-card class="mb-8 pr-16" elevation="0">
+                        <v-alert border="start" border-color="warning" elevation="2">
+                          <template v-slot:title
+                            ><strong
+                              >Make sure you are connected to the VPN before you access your HUNT Workbench.</strong
+                            ></template
+                          >
                         </v-alert>
-                        <v-alert
-                          border="start"
-                          border-color="info"
-                          elevation="2"
-                        >
-                          <template v-slot:title>We recommend to use <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all HUNT Workbench applications to work correctly.</template>
+                        <v-alert border="start" border-color="info" elevation="2">
+                          <template v-slot:title
+                            >We recommend to use
+                            <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all
+                            HUNT Workbench applications to work correctly.</template
+                          >
                         </v-alert>
 
                         <ol>
-                          <li>
-                            Open your web browser.
-                          </li>
+                          <li>Open your web browser.</li>
                           <li>
                             Open the URL address below to access your lab in your web browser:
                             <br />
-                            <strong><a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a></strong>
+                            <strong
+                              ><a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a></strong
+                            >
                             <br /><br />
                             You may get a User Identification Request for your new certificate.<br />
                             Verify that the certificates are issued by HUNT Cloud:
                             <br />
-                            <div class="language- extra-class"><pre class="language-text">
+                            <div class="language- extra-class">
+                              <pre class="language-text">
                               <code v-html='`Issuer: "${tlsClientIssuer}"\nOrganization: "HUNT Cloud"\nIssued Under: "HUNT Cloud Trust Services"`'></code>
-                            </pre></div>
+                            </pre>
+                            </div>
                             <br />
-                            Ensure that the <code>Remember this decision</code> box is checked, and click <code>OK</code>.
+                            Ensure that the <code>Remember this decision</code> box is checked, and click
+                            <code>OK</code>.
                             <br />
-                            <img class="pa-2" alt="chrome_select_certificate_confirm" src="/img/workbench/chrome_select_certificate_confirm.png" style="max-width: 300px;" />
+                            <img
+                              class="pa-2"
+                              alt="chrome_select_certificate_confirm"
+                              src="/img/workbench/chrome_select_certificate_confirm.png"
+                              style="max-width: 300px"
+                            />
                             <br />
                           </li>
                           <li class="mb-2">
-                            Sign in with your HUNT Cloud <strong>username</strong> and <strong>lab passphrase</strong>.<br />
+                            Sign in with your HUNT Cloud <strong>username</strong> and
+                            <strong>lab passphrase</strong>.<br />
                             Lab passphrase is the same passphrase that you created yourself on your first SSH login.<br />
                             <CopyTextField
                               :model-value="username"
@@ -1360,12 +1601,19 @@ onMounted(() => {
                             If you did not create a lab passphrase yet use a temporary SSH passphrase that you received
                             from us on Signal message to login and then follow passphrase change flow.
                             <br />
-                            <img class="pa-2" alt="workbench-login-form" src="/img/workbench/workbench-login-form.png" style="max-width: 250px;" />
+                            <img
+                              class="pa-2"
+                              alt="workbench-login-form"
+                              src="/img/workbench/workbench-login-form.png"
+                              style="max-width: 250px"
+                            />
                             <br />
                           </li>
                           <li>
-                            With a little bit of luck you should now see your new HUNT Workbench.
-                            Feel free to read our <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guide</a>.
+                            With a little bit of luck you should now see your new HUNT Workbench. Feel free to read our
+                            <a href="/do-science/hunt-workbench/getting-started/" target="_blank"
+                              >getting started guide</a
+                            >.
                             <br />
                             <strong>Click around and explore your new world!</strong>
                           </li>
@@ -1374,89 +1622,120 @@ onMounted(() => {
 
                         <img class="pa-2" alt="JupyterLab" src="/img/workbench/JupyterLab.png" />
 
-                        <v-alert
-                          border="start"
-                          border-color="info"
-                          elevation="2"
-                        >
+                        <v-alert border="start" border-color="info" elevation="2">
                           <template v-slot:title><b>Remember to bookmark your Lab address</b></template>
                           <!-- <code>https://{{fqdn}}</code> -->
-                          <div class="language- extra-class"><pre class="language-text">
+                          <div class="language- extra-class">
+                            <pre class="language-text">
                             <code v-text="`https://${fqdn}`"></code>
-                          </pre></div>
+                          </pre>
+                          </div>
                         </v-alert>
-
                       </v-card>
-                      <v-btn color="success" class="mx-2 mb-1" @click="workbenchDialog = false; workbenchStepper = 1;">Finish</v-btn>
+                      <v-btn
+                        color="success"
+                        class="mx-2 mb-1"
+                        @click="
+                          () => {
+                            workbenchDialog = false
+                            workbenchStepper = 1
+                          }
+                        "
+                        >Finish</v-btn
+                      >
                       <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 1">Start again</v-btn>
                       <v-btn color="warning" class="mx-2 mb-1" @click="workbenchStepper = 4">Troubleshooting</v-btn>
                       <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 2">Back</v-btn>
                     </v-stepper-vertical-item>
 
-                    <v-stepper-vertical-item
-                      :complete="workbenchStepper > 4"
-                      value="4"
-                    >
-                      <template v-slot:title>
-                        Troubleshooting
-                      </template>
+                    <v-stepper-vertical-item :complete="workbenchStepper > 4" value="4">
+                      <template v-slot:title> Troubleshooting </template>
                       <template v-slot:subtitle>
                         Optional tips to try in case of issues when configuring access
                       </template>
 
-                      <v-card
-                        class="mb-8 pr-4 ml-0 pl-0"
-                        elevation="0"
-                      >
-                      This section includes issues that you might encounter during your first setup.
-                      See our <a href="/do-science/hunt-workbench/faq/" target="_blank">HUNT Workbench FAQ</a> and <a href="/do-science/hunt-workbench/troubleshooting/" target="_blank">HUNT Workbench Troubleshooting</a> if you do not find your answers below.
+                      <v-card class="mb-8 pr-4 ml-0 pl-0" elevation="0">
+                        This section includes issues that you might encounter during your first setup. See our
+                        <a href="/do-science/hunt-workbench/faq/" target="_blank">HUNT Workbench FAQ</a> and
+                        <a href="/do-science/hunt-workbench/troubleshooting/" target="_blank"
+                          >HUNT Workbench Troubleshooting</a
+                        >
+                        if you do not find your answers below.
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>This site can't be reached</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>This site can't be reached</strong></summary>
                           <div class="pl-4 pr-16 py-2">
-                            1. If you are getting <code>DNS_PROBE_FINISHED_NXDOMAIN</code> error you need to repeat the <code style="font-size: 90% !important;">{{ hostsFileId }}. Workbench - hosts file</code> guide.
-                            <br/>
-                            2. If you are getting <code>ERR_CONNECTION_TIMED_OUT</code> error you need to make sure that you are connected to VPN. If you are able to ssh into lab your VPN is fine, and you need to repeat the <code>6. Workbench - hosts file</code> guide.
+                            1. If you are getting <code>DNS_PROBE_FINISHED_NXDOMAIN</code> error you need to repeat the
+                            <code style="font-size: 90% !important">{{ hostsFileId }}. Workbench - hosts file</code>
+                            guide.
+                            <br />
+                            2. If you are getting <code>ERR_CONNECTION_TIMED_OUT</code> error you need to make sure that
+                            you are connected to VPN. If you are able to ssh into lab your VPN is fine, and you need to
+                            repeat the <code>6. Workbench - hosts file</code> guide.
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>I don't remember my passphrase</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>I don't remember my passphrase</strong></summary>
                           <div class="pl-4 pr-16 py-2">
-                            Don't worry. Request a <a href="/do-science/service-desk/#ssh-passphrase-reset" target="_blank">reset of SSH passphrase</a> in our "do-science" Service desk.
+                            Don't worry. Request a
+                            <a href="/do-science/service-desk/#ssh-passphrase-reset" target="_blank"
+                              >reset of SSH passphrase</a
+                            >
+                            in our "do-science" Service desk.
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>Nginx error - 403 Forbidden</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>Nginx error - 403 Forbidden</strong></summary>
                           <div class="pl-4 pr-16 py-2">
                             This error means that you are attempting to connect without client certificate.
-                            <br /><br/>
+                            <br /><br />
                             There are 3 different causes each requires a different approach
                             <ol>
                               <li>
-                                If you have just installed a fresh client certificate, <strong>restart your computer</strong> to make sure certificates are applied.
+                                If you have just installed a fresh client certificate,
+                                <strong>restart your computer</strong> to make sure certificates are applied.
                               </li>
                               <br />
                               <li>
-                                If you have not yet installed a fresh client certificate on this computer, review the section <strong>Install your certificates</strong> above. Start by click on blue button <code>Start again</code>.
+                                If you have not yet installed a fresh client certificate on this computer, review the
+                                section <strong>Install your certificates</strong> above. Start by click on blue button
+                                <code>Start again</code>.
                               </li>
                               <br />
                               <li>
-                                If you have used Workbench in {{ labName }} lab before, this error means that your certificate expired and you can follow this link to <a href="/do-science/service-desk/#hunt-workbench-reissue" target="_blank">request Workbench reissue</a>. Once your request is processed we will send you a fresh certificate.
+                                If you have used Workbench in {{ labName }} lab before, this error means that your
+                                certificate expired and you can follow this link to
+                                <a href="/do-science/service-desk/#hunt-workbench-reissue" target="_blank"
+                                  >request Workbench reissue</a
+                                >. Once your request is processed we will send you a fresh certificate.
                               </li>
                             </ol>
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>Firefox - Warning: Potential security risk ahead</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer">
+                            <strong>Firefox - Warning: Potential security risk ahead</strong>
+                          </summary>
                           <div class="pl-4 pr-16 py-2">
-                            Click on the <code style="font-weight: bold;">Advanced</code> button to find the <strong>Error code</strong> (Feilkode).
-                            <br/><br/>
+                            Click on the <code style="font-weight: bold">Advanced</code> button to find the
+                            <strong>Error code</strong> (Feilkode). <br /><br />
                             Continue based on the error code:
                             <ul>
                               <li>
-                                If you see error code: <code style="font-size: 90% !important;">SEC_ERROR_UNKNOWN_ISSUER</code> continue with the next step below.
+                                If you see error code:
+                                <code style="font-size: 90% !important">SEC_ERROR_UNKNOWN_ISSUER</code> continue with
+                                the next step below.
                               </li>
                               <li>
-                                If you see any other error code contacts us on Slack or send us <a href="https://docs.hdc.ntnu.no/do-science/service-desk/#general-service-request" target="_blank">general Service desk request</a>.
+                                If you see any other error code contacts us on Slack or send us
+                                <a
+                                  href="https://docs.hdc.ntnu.no/do-science/service-desk/#general-service-request"
+                                  target="_blank"
+                                  >general Service desk request</a
+                                >.
                                 <br />
                                 Remember to include the error code and screenshot.
                               </li>
@@ -1464,26 +1743,33 @@ onMounted(() => {
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>Firefox - Did Not Connect (SEC_ERROR_UNKNOWN_ISSUER)</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer">
+                            <strong>Firefox - Did Not Connect (SEC_ERROR_UNKNOWN_ISSUER)</strong>
+                          </summary>
                           <div class="pl-4 pr-16 py-2">
-                            <v-alert
-                              border="start"
-                              border-color="info"
-                              elevation="2"
-                            >
-                              <template v-slot:title>We recommend to use <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for all HUNT Workbench applications to work correctly.</template>
+                            <v-alert border="start" border-color="info" elevation="2">
+                              <template v-slot:title
+                                >We recommend to use
+                                <a href="https://www.google.com/chrome/" target="_blank">Google Chrome browser</a> for
+                                all HUNT Workbench applications to work correctly.</template
+                              >
                             </v-alert>
 
-                            Firefox may require that you manually import the HUNT Cloud Certificate Authority to consider it trusted.
-
-                            If you see Error code: <code>SEC_ERROR_UNKNOWN_ISSUER</code> when accessing Workbench follow these steps:
+                            Firefox may require that you manually import the HUNT Cloud Certificate Authority to
+                            consider it trusted. If you see Error code: <code>SEC_ERROR_UNKNOWN_ISSUER</code> when
+                            accessing Workbench follow these steps:
 
                             <ol>
                               <li>
-                                Download our public CA certificate from <a href="https://pki.hdc.ntnu.no/hctsca1.crt" target="_blank">https://pki.hdc.ntnu.no/hctsca1.crt</a>
+                                Download our public CA certificate from
+                                <a href="https://pki.hdc.ntnu.no/hctsca1.crt" target="_blank"
+                                  >https://pki.hdc.ntnu.no/hctsca1.crt</a
+                                >
                               </li>
                               <li>
-                                Open the following Firefox URL: <!-- <code>about:preferences#privacy</code>. -->
+                                Open the following Firefox URL:
+                                <!-- <code>about:preferences#privacy</code>. -->
                                 <CopyTextField
                                   :model-value="`about:preferences#privacy`"
                                   label=""
@@ -1492,70 +1778,110 @@ onMounted(() => {
                                 />
                               </li>
                               <li>
-                                Scroll down to section <code>Certificates</code> and click on <code>View Certificates</code>.
+                                Scroll down to section <code>Certificates</code> and click on
+                                <code>View Certificates</code>.
                                 <br />
-                                <img class="pa-2" alt="mac-firefox-certificates" src="/img/workbench/mac-firefox-certificates.png" />
+                                <img
+                                  class="pa-2"
+                                  alt="mac-firefox-certificates"
+                                  src="/img/workbench/mac-firefox-certificates.png"
+                                />
                                 <br />
                               </li>
                               <li>
                                 Switch to tab <code>Authorities</code> and click on <code>Import</code>.
                                 <br />
-                                <img class="pa-2" alt="mac-firefox-import-cert" src="/img/workbench/mac-firefox-import-cert.png" />
+                                <img
+                                  class="pa-2"
+                                  alt="mac-firefox-import-cert"
+                                  src="/img/workbench/mac-firefox-import-cert.png"
+                                />
                                 <br />
                               </li>
                               <li>
-                                Select <code>hctsca1.crt</code> and check option <code>Trust this CA to identify websites</code>.
+                                Select <code>hctsca1.crt</code> and check option
+                                <code>Trust this CA to identify websites</code>.
                                 <br />
-                                <img class="pa-2" alt="mac-firefox-trust-ca" src="/img/workbench/mac-firefox-trust-ca.png" />
+                                <img
+                                  class="pa-2"
+                                  alt="mac-firefox-trust-ca"
+                                  src="/img/workbench/mac-firefox-trust-ca.png"
+                                />
                                 <br />
                               </li>
                             </ol>
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>Chrome on Ubuntu</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>Chrome on Ubuntu</strong></summary>
                           <div class="pl-4 pr-16 py-2">
                             <ol>
                               <li>
-                                In Google Chrome, open the URL <a href="chrome://settings/certificates" target="_blank">chrome://settings/certificates</a> and navigate to section <code>Authorities</code>.
+                                In Google Chrome, open the URL
+                                <a href="chrome://settings/certificates" target="_blank"
+                                  >chrome://settings/certificates</a
+                                >
+                                and navigate to section <code>Authorities</code>.
                               </li>
+                              <li>Search for HUNT Cloud certificates (<code>org-HUNT Cloud Trust Services</code>).</li>
                               <li>
-                                Search for HUNT Cloud certificates (<code>org-HUNT Cloud Trust Services</code>).
-                              </li>
-                              <li>
-                                Edit the HCTS CA 1 certificate and select first option <code>Trust this certificate for identifying websites</code>.
+                                Edit the HCTS CA 1 certificate and select first option
+                                <code>Trust this certificate for identifying websites</code>.
                                 <br />
-                                <img class="pa-2" alt="import-ca-trust-websites" src="/img/workbench/import-ca-trust-websites.png" />
+                                <img
+                                  class="pa-2"
+                                  alt="import-ca-trust-websites"
+                                  src="/img/workbench/import-ca-trust-websites.png"
+                                />
                                 <br />
                               </li>
                             </ol>
                           </div>
                         </details>
 
-                        <details class="my-2"><summary style="cursor: pointer;"><strong>502 Bad gateway</strong></summary>
+                        <details class="my-2">
+                          <summary style="cursor: pointer"><strong>502 Bad gateway</strong></summary>
                           <div class="pl-4 pr-16 py-2">
-                            A 502 Bad gateway error when accessing <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a>
-                            is an indication that something is wrong with the configuration on the server side.<br />
-                            Contact us in your lab channel on Slack (#lab-{{ labName }}) or <a href="/do-science/service-desk/#general-service-request" target="_blank">Service desk email</a> further investigations.
+                            A 502 Bad gateway error when accessing
+                            <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a> is an
+                            indication that something is wrong with the configuration on the server side.<br />
+                            Contact us in your lab channel on Slack (#lab-{{ labName }}) or
+                            <a href="/do-science/service-desk/#general-service-request" target="_blank"
+                              >Service desk email</a
+                            >
+                            further investigations.
                           </div>
                         </details>
                       </v-card>
                       <v-btn color="primary" class="mx-2 mb-1" @click="workbenchStepper = 1">Start again</v-btn>
                       <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchStepper = 3">Back</v-btn>
-                      <v-btn color="primary" variant="text" class="mx-2 mb-1" @click="workbenchDialog = false; workbenchStepper = 1;">Close</v-btn>
+                      <v-btn
+                        color="primary"
+                        variant="text"
+                        class="mx-2 mb-1"
+                        @click="
+                          () => {
+                            workbenchDialog = false
+                            workbenchStepper = 1
+                          }
+                        "
+                        >Close</v-btn
+                      >
                     </v-stepper-vertical-item>
-
                   </v-stepper-vertical>
                 </v-card-text>
               </v-card>
             </v-dialog>
 
             <v-col cols="12">
-              After you have successfully completed all the steps, you can start using your Workbench environment by opening this URL address: <a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a>
+              After you have successfully completed all the steps, you can start using your Workbench environment by
+              opening this URL address: <a :href="`https://${fqdn}`" target="_blank">https://{{ fqdn }}</a>
             </v-col>
 
             <v-col cols="12">
-              <details class="my-2"><summary style="cursor: pointer;"><strong>Workbench Control panel</strong></summary>
+              <details class="my-2">
+                <summary style="cursor: pointer"><strong>Workbench Control panel</strong></summary>
                 <div class="pl-4 pr-16 py-2">
                   You can access Control panel on this URL address:
                   <a :href="`https://${fqdn}/hub/home`" target="_blank">https://{{ fqdn }}/hub/home</a>
@@ -1573,44 +1899,43 @@ onMounted(() => {
             <h3><a href="#where-to-go-next" class="header-anchor">#</a> Where to go next</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="where-to-go-next" ref="#where-to-go-next" class="mt-2">
-            <v-sheet
-              rounded="lg"
-              width="100%"
-              class="pa-4 text-center mx-auto"
-            >
-              <v-icon
-                class="mb-5"
-                color="success"
-                size="100"
-              >mdi-check-circle</v-icon>
+            <v-sheet rounded="lg" width="100%" class="pa-4 text-center mx-auto">
+              <v-icon class="mb-5" color="success" size="100">mdi-check-circle</v-icon>
 
               <h2 class="text-h5 mb-6">You have configured your lab access</h2>
 
               <p class="mb-4 text-medium-emphasis text-body-2">
-                Feel free to continue reading our <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guides</a> and figure out which <a href="/do-science/tools/" target="_blank">tools</a> do you need for your work.
-                <br>
+                Feel free to continue reading our
+                <a href="/do-science/hunt-workbench/getting-started/" target="_blank">getting started guides</a> and
+                figure out which <a href="/do-science/tools/" target="_blank">tools</a> do you need for your work.
+                <br />
 
                 Otherwise, you're done!
               </p>
               <v-row>
                 <v-col cols="12">
-                  <v-btn color="success" class="mx-2 mb-1" :href="`https://${fqdn}`" target="_blank" elevation="3">Open Workbench</v-btn>
-                  <v-btn color="primary" class="mx-2 mb-1" :href="`https://${fqdn}/hub/home`" target="_blank" elevation="3">Control panel</v-btn>
+                  <v-btn color="success" class="mx-2 mb-1" :href="`https://${fqdn}`" target="_blank" elevation="3"
+                    >Open Workbench</v-btn
+                  >
+                  <v-btn
+                    color="primary"
+                    class="mx-2 mb-1"
+                    :href="`https://${fqdn}/hub/home`"
+                    target="_blank"
+                    elevation="3"
+                    >Control panel</v-btn
+                  >
                 </v-col>
               </v-row>
             </v-sheet>
           </v-expansion-panel-text>
         </v-expansion-panel>
-
       </v-expansion-panels>
     </v-card>
 
     <v-card elevation="1" class="mt-4">
-      <v-card-title class="pt-3 pb-2" style="font-weight: 400;">
-        Optional guides
-      </v-card-title>
+      <v-card-title class="pt-3 pb-2" style="font-weight: 400"> Optional guides </v-card-title>
       <v-expansion-panels accordion v-model="extrasExpansionPanel" elevation="0">
-
         <!-- Mobaxterm (Windows only) -->
         <v-expansion-panel>
           <v-expansion-panel-title>
@@ -1618,24 +1943,10 @@ onMounted(() => {
           </v-expansion-panel-title>
           <v-expansion-panel-text id="mobaxterm" ref="#mobaxterm" class="mt-2">
             <v-col cols="10">
-              <v-btn
-              color="success"
-              block
-              target="_blank"
-              :href="mobaxtermTerminal"
-              >
-              Create terminal session
-              </v-btn>
+              <v-btn color="success" block target="_blank" :href="mobaxtermTerminal"> Create terminal session </v-btn>
             </v-col>
             <v-col cols="10">
-              <v-btn
-              color="primary"
-              block
-              target="_blank"
-              :href="mobaxtermRdp"
-              >
-              Create remote desktop session
-              </v-btn>
+              <v-btn color="primary" block target="_blank" :href="mobaxtermRdp"> Create remote desktop session </v-btn>
             </v-col>
           </v-expansion-panel-text>
         </v-expansion-panel>
@@ -1647,7 +1958,8 @@ onMounted(() => {
           </v-expansion-panel-title>
           <v-expansion-panel-text id="copypubkey" ref="#copypubkey" class="mt-2">
             <v-col cols="12">
-              1. Open new Command Prompt window (<code>WIN + R</code> and type <code>cmd.exe</code> then hit <code>Enter</code>).
+              1. Open new Command Prompt window (<code>WIN + R</code> and type <code>cmd.exe</code> then hit
+              <code>Enter</code>).
             </v-col>
             <v-col cols="10">
               2. Run this command to copy SSH Public key into clipboard.
@@ -1658,9 +1970,7 @@ onMounted(() => {
                 placeholder="Your link is missing access token"
               />
             </v-col>
-            <v-col cols="12">
-              3. Paste (CTRL+V) your SSH Public key where needed.
-            </v-col>
+            <v-col cols="12"> 3. Paste (CTRL+V) your SSH Public key where needed. </v-col>
           </v-expansion-panel-text>
         </v-expansion-panel>
 
@@ -1670,7 +1980,6 @@ onMounted(() => {
             <h3><a href="#troubleshooting" class="header-anchor">#</a> Troubleshooting</h3>
           </v-expansion-panel-title>
           <v-expansion-panel-text id="troubleshooting" ref="#troubleshooting" class="mt-2">
-
             <v-col cols="12">
               Removing saved OpenVPN passphrases and metadata
               <CopyTextField
@@ -1682,9 +1991,11 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Confirm deletion with by typing <code>Yes</code> and then press <code>Enter</code>:
-              <div class="language- extra-class"><pre class="language-text pa-0">
+              <div class="language- extra-class">
+                <pre class="language-text pa-0">
                   <code v-text="`Permanently delete the registry key\nHKEY_CURRENT_USER\\SOFTWARE\\OpenVPN-GUI\\configs\\${username} (Yes/No)? Yes\n\nThe operation completed successfully.`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
             <v-col cols="12">
               Deleting OpenVPN config
@@ -1697,14 +2008,14 @@ onMounted(() => {
             </v-col>
             <v-col cols="12">
               Confirm deletion with by pressing <code>Y</code> and then <code>Enter</code>:
-              <div class="language- extra-class"><pre class="language-text pa-0">
+              <div class="language- extra-class">
+                <pre class="language-text pa-0">
                   <code v-text="`C:\\Users\\User\\OpenVPN\\config\\${username}\\*, Are you sure (Y/N)? Y`"></code>
-              </pre></div>
+              </pre>
+              </div>
             </v-col>
-
           </v-expansion-panel-text>
         </v-expansion-panel>
-
       </v-expansion-panels>
     </v-card>
   </v-sheet>
@@ -1748,23 +2059,23 @@ pre code {
   color: rgba(204, 204, 204, 1) !important;
 }
 
-pre[class*=language-] {
-  margin: .85rem 0;
+pre[class*="language-"] {
+  margin: 0.85rem 0;
 }
 
-div[class*=language-] {
+div[class*="language-"] {
   position: relative;
   background-color: #282c34;
   border-radius: 6px;
 }
 
-div[class*=language-]:before {
+div[class*="language-"]:before {
   position: absolute;
   z-index: 3;
-  top: .8em;
+  top: 0.8em;
   right: 1em;
-  font-size: .75rem;
-  color: hsla(0, 0%, 100%, .4);
+  font-size: 0.75rem;
+  color: hsla(0, 0%, 100%, 0.4);
 }
 
 .v-overlay__content ul {
@@ -1780,7 +2091,7 @@ div[class*=language-]:before {
   background-color: rgba(0, 0, 0, 0.05) !important;
   padding: 0.2em 0.4em;
 }
-.v-overlay__content pre[class*=language-] {
+.v-overlay__content pre[class*="language-"] {
   padding-bottom: 8px !important;
   padding-top: 8px !important;
 }