ultimate-jekyll-manager 0.0.47 → 0.0.49

package/dist/defaults/dist/_layouts/main/authentication/account.html

@@ -1,2369 +0,0 @@
----
-### ALL PAGES ###
-layout: main/global/default
-
-### REGULAR PAGES ###
-head:
-  post-bundle-css: '
-    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
-
-    <!-- CSS Implementing Plugins -->
-    <link rel="stylesheet" href="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/bootstrap-icons/font/bootstrap-icons.css">
-
-    <!-- CSS Front Template -->
-
-    <link rel="stylesheet" href="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/css/theme.min.css" data-hs-appearance="default">
-    <link rel="preload" href="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/css/theme-dark.min.css" data-hs-appearance="dark" as="style">
-    <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/regular.min.css" integrity="sha512-aNH2ILn88yXgp/1dcFPt2/EkSNc03f9HBFX0rqX3Kw37+vjipi1pK3L9W08TZLhMg4Slk810sPLdJlNIjwygFw==" crossorigin="anonymous" referrerpolicy="no-referrer" /> -->
-    <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/solid.min.css" integrity="sha512-uj2QCZdpo8PSbRGL/g5mXek6HM/APd7k/B5Hx/rkVFPNOxAQMXD+t+bG4Zv8OAdUpydZTU3UHmyjjiHv2Ww0PA==" crossorigin="anonymous" referrerpolicy="no-referrer" /> -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css" integrity="sha512-xh6O/CkQoPOWDdYTDqeRdPCVd1SpvCA9XXcUnZS2FmJNp1coAFzvtCN9BmamE+4aHK8yyUHUSCcJHgXloTyT2A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
-
-    <style data-hs-appearance-onload-styles>
-      * {
-        transition: unset !important;
-      }
-
-      /*
-      body {
-        opacity: 0;
-      }
-      */
-    </style>
-    <style media="screen">
-      .fs-badge {
-        font-size: 2rem;
-      }
-      a.dropdown-item * {
-        pointer-events: none;
-      }
-
-      /* SET FONT */
-      body {
-        font-family: "Open Sans", sans-serif !important;
-        font-size: 0.875rem;
-        font-weight: 400;
-        line-height: 1.6;
-      }
-    </style>
-  '
-
-foot:
-  post-bundle-script: '
-
-    <!-- Theme  -->
-    {%- include /main/vendor/front-admin/v2/js/theme-prefix.html -%}
-
-    <!-- JS Global Compulsory  -->
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/jquery/dist/jquery.min.js"></script>
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/jquery-migrate/dist/jquery-migrate.min.js"></script>
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
-
-    <!-- JS Implementing Plugins -->
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
-
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/hs-file-attach/dist/hs-file-attach.min.js"></script>
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/hs-sticky-block/dist/hs-sticky-block.min.js"></script>
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/hs-scrollspy/dist/hs-scrollspy.min.js"></script>
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/imask/dist/imask.min.js"></script>
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/tom-select/dist/js/tom-select.complete.min.js"></script>
-
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/vendor/clipboard/dist/clipboard.min.js"></script>
-
-    <!-- JS Front -->
-    <script src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/js/theme.min.js"></script>
-
-    <!-- ITW CW -->
-    <script src="https://cdn.jsdelivr.net/npm/wonderful-fetch@latest/dist/index.min.js?cb={{ site.time | date: "%s" }}"></script>
-    <script src="https://cdn.jsdelivr.net/npm/node-powertools@latest/dist/index.min.js?cb={{ site.time | date: "%s" }}"></script>
-    <script src="https://cdn.jsdelivr.net/npm/blueimp-md5@2.19.0/js/md5.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/countries-list@2.6.1/dist/index.es5.min.js"></script>
-    <script type="text/javascript" src="{{ site.url }}/assets/js/base.js?cb={{ site.time | date: "%s" }}" async defer></script>
-    {%- include /main/misc/embed-manager.html -%}
-
-  '
-
-settings:
-  include-app-foot: false
-  include-app-head: false
-  include-app-footer: false
-  include-app-header: false
-  include-script-bundle: false
-  include-script-core: true
-  include-css-bundle: false
-  manager-configuration: "
-    {
-      auth: {
-        state: 'required',
-        sends: {
-          required: '/signup',
-        },
-      },
-      libraries: {
-        cookieconsent: {
-          enabled: false,
-        },
-        chatsy: {
-          enabled: false,
-        },
-        lazysizes: {
-          enabled: false,
-        },
-      },
-    }
-  "
----
-<main id="content" role="main" class="main">
-  <!-- Content -->
-  <div class="content container-fluid">
-    <!-- Page Header -->
-    <div class="page-header">
-      <div class="d-flex justify-content-between align-items-center">
-        <nav aria-label="breadcrumb">
-          <ol class="breadcrumb breadcrumb-no-gutter">
-            <li class="breadcrumb-item"><a class="breadcrumb-link" href="{{ site.url }}">{{ site.brand.name }}</a></li>
-            <li class="breadcrumb-item active" aria-current="page">Account</li>
-          </ol>
-        </nav>
-        <a class="btn btn-ghost-primary" href="{{ site.url }}">
-          <i class="bi-arrow-left me-1"></i> Return home
-        </a>
-      </div>
-    </div>
-    <!-- End Page Header -->
-
-    <div class="row">
-      <div class="col-lg-3">
-        <!-- Navbar -->
-        <div class="navbar-expand-lg navbar-vertical mb-1 mb-lg-3">
-          <!-- Navbar Toggle -->
-          <!-- Navbar Toggle -->
-          <div class="d-grid">
-            <button type="button" class="navbar-toggler btn btn-white mb-2" data-bs-toggle="collapse" data-bs-target="#navbarVerticalNavMenu" aria-label="Toggle navigation" aria-expanded="false" aria-controls="navbarVerticalNavMenu">
-              <span class="d-flex justify-content-between align-items-center">
-                <span class="text-dark">Menu</span>
-
-                <span class="navbar-toggler-default">
-                  <i class="bi-list"></i>
-                </span>
-
-                <span class="navbar-toggler-toggled">
-                  <i class="bi-x"></i>
-                </span>
-              </span>
-            </button>
-          </div>
-          <!-- End Navbar Toggle -->
-          <!-- End Navbar Toggle -->
-
-          <!-- Navbar Collapse -->
-          <div id="navbarVerticalNavMenu" class="collapse navbar-collapse animation-fade-in">
-            <ul id="navbarSettings" class="js-sticky-block js-scrollspy card card-navbar-nav nav nav-tabs nav-lg nav-vertical" data-hs-sticky-block-options='{
-                   "parentSelector": "#navbarVerticalNavMenu",
-                   "targetSelector": "#header",
-                   "breakpoint": "lg",
-                   "startPoint": "#navbarVerticalNavMenu",
-                   "endPoint": "#stickyBlockEndPoint",
-                   "stickyOffsetTop": 20
-                 }'>
-             <li class="nav-item">
-               <a class="nav-link active" href="#content">
-                 <i class="bi-person nav-icon"></i> Account Details
-               </a>
-             </li>
-              <li class="nav-item">
-                <a class="nav-link" href="#personalInformation">
-                  <i class="bi-person-badge nav-icon"></i> Personal Information
-                </a>
-              </li>
-              <li class="nav-item">
-                <a class="nav-link" href="#billing">
-                  <i class="bi-credit-card nav-icon"></i>
-                  <span class="auth-billing-suspended-message-element" hidden><i class="bi-exclamation-triangle-fill me-1 text-danger"></i></span>
-                  Billing
-                </a>
-              </li>
-
-              <li class="nav-item">
-                <a class="nav-link" href="#referrals">
-                  <i class="bi-people nav-icon"></i> Referrals
-                </a>
-              </li>
-              <li class="nav-item">
-                <a class="nav-link" href="#apiKeys">
-                  <i class="bi-key nav-icon"></i> API Keys
-                </a>
-              </li>
-              <li class="nav-item" hidden>
-                <a class="nav-link" href="#usage">
-                  <i class="bi-activity nav-icon"></i> Usage
-                </a>
-              </li>
-              <li id="changePasswordParent" class="nav-item">
-                <a class="nav-link" href="#changePassword">
-                  <i class="bi-shield-lock nav-icon"></i> Password
-                </a>
-              </li>
-              <li class="nav-item">
-                <a class="nav-link" href="#signinMethods">
-                  <i class="bi-box-arrow-in-right nav-icon"></i> Signin Methods
-                </a>
-              </li>
-              <!-- <li class="nav-item" id="connectedAccountsNav" hidden> -->
-              <li class="nav-item">
-                <a class="nav-link" href="#connectedAccounts">
-                  <i class="bi-link nav-icon"></i> Connected Accounts
-                </a>
-              </li>
-              <li class="nav-item">
-                <a class="nav-link" href="#activeSessions">
-                  <i class="bi-toggle2-on nav-icon"></i> Active Sessions
-                </a>
-              </li>
-              <li class="nav-item" data-hash-trigger="#deleteAccount" hidden>
-                <a class="nav-link" href="#deleteAccount">
-                  <i class="bi-trash3 nav-icon"></i> Delete Account
-                </a>
-              </li>
-              <li class="nav-item">
-                <a class="nav-link link-danger auth-signout-all-btn" href="javascript:;">
-                  <i class="bi-door-open nav-icon" style="pointer-events: none;"></i> Sign Out
-                </a>
-              </li>
-            </ul>
-          </div>
-          <!-- End Navbar Collapse -->
-        </div>
-        <!-- End Navbar -->
-        <!-- <div class="d-grid mb-2">
-          <button class="btn btn-soft-danger auth-signout-all-btn" type="button"><i class="bi-door-open me-1"></i> Sign out</button>
-        </div> -->
-      </div>
-
-      <div class="col-lg-9">
-        <div id="spinner-loader" class="animation-fade-in">
-          <div class="card">
-            <div class="d-flex flex-column align-items-center justify-content-center my-5">
-              <h4>Getting your account details ready...</h4>
-              <div class="spinner-border text-primary" role="status">
-                <span class="visually-hidden">Loading...</span>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div id="account-parent" class="animation-slide-up" hidden>
-          <div class="d-grid gap-3 gap-lg-5">
-
-            <!-- Card -->
-            <div class="card">
-              <!-- Profile Cover -->
-              <div class="profile-cover">
-                <div class="profile-cover-img-wrapper">
-                  <img class="profile-cover-img" src="https://cdn.itwcreativeworks.com/assets/ultimate-jekyll/vendor/front-admin/v2/img/1920x400/img1.jpg" alt="Cover image">
-                </div>
-              </div>
-              <!-- End Profile Cover -->
-
-              <!-- Profile Header -->
-              <div class="text-center mb-5">
-                <!-- Avatar -->
-                <div class="avatar avatar-xxl avatar-circle profile-cover-avatar">
-                  <a id="auth-user-profile-parent" href="javascript:;" rel="nofollow" target="_blank">
-                    <img id="auth-user-profile-img" class="avatar-img" src="" alt="Profile image">
-                  </a>
-                  <span class="avatar-status avatar-status-success"></span>
-                </div>
-                <!-- End Avatar -->
-
-                <h1 class="page-header-title">
-                  <span class="auth-email-element"></span>
-                  <!-- <i class="bi-patch-check-fill fs-2 text-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="" data-bs-original-title="Top endorsed" aria-label="Top endorsed"></i> -->
-                  <span id="premium-badge"></span>
-                </h1>
-
-                <div id="profile-badges" class="mb-2"></div>
-
-                <!-- List -->
-                <ul class="list-inline list-px-2">
-                  <!-- <li class="list-inline-item">
-                    <i class="bi-building me-1"></i>
-                    <span>Htmlstream</span>
-                  </li> -->
-
-                  <!-- <li class="list-inline-item">
-                    <i class="bi-geo-alt me-1"></i>
-                    <a href="#">San Francisco,</a>
-                    <a href="#">US</a>
-                  </li> -->
-
-                  <!-- <li class="list-inline-item">
-                    <i class="bi-star-fill me-1"></i>
-                    <span>Premium</span>
-                  </li> -->
-
-                  <li class="list-inline-item">
-                    <i class="bi-calendar-week me-1"></i>
-                    <span>Joined <span class="auth-created-element"></span> </span>
-                  </li>
-                </ul>
-                <!-- End List -->
-              </div>
-              <!-- End Profile Header -->
-
-              <!-- <div class="position-absolute top-0 end-0">
-                <a href="#" class="btn btn-primary">
-                  <i class="bi-person-dash nav-icon me-1"></i>
-                </a>
-              </div> -->
-            </div>
-            <!-- End Card -->
-
-            <!-- Card -->
-            <div class="card">
-              <div class="card-header">
-                <h2 class="card-title h4"><i class="bi-person nav-icon me-1"></i> Account Details</h2>
-              </div>
-
-              <!-- Body -->
-              <div class="card-body">
-                <!-- Form -->
-                <form>
-                  <!-- Form -->
-                  <div class="mb-3">
-                    <label for="accountDetails_email" class="form-label">Email</label>
-
-                    <div class="input-group input-group-sm input-group-merge table-input-group">
-                      <input id="accountDetails_email" type="text" class="form-control form-control-light auth-email-element" readonly value="">
-                      <a class="js-clipboard input-group-append input-group-text" href="javascript:;" data-bs-toggle="tooltip" title="Copy to clipboard" data-hs-clipboard-options='{
-                          "type": "tooltip",
-                          "successText": "Copied!",
-                          "contentTarget": "#accountDetails_email",
-                          "classChangeTarget": "#accountDetails_emailIcon",
-                          "defaultClass": "bi-clipboard",
-                          "successClass": "bi-check"
-                         }'>
-                        <i id="accountDetails_emailIcon" class="bi-clipboard"></i>
-                      </a>
-                    </div>
-                  </div>
-
-
-                  <div class="mb-3">
-                    <label for="accountDetails_uid" class="form-label">User ID</label>
-
-                    <div class="input-group input-group-sm input-group-merge table-input-group">
-                      <input id="accountDetails_uid" type="text" class="form-control form-control-light auth-uid-element" readonly value="">
-                      <a class="js-clipboard input-group-append input-group-text" href="javascript:;" data-bs-toggle="tooltip" title="Copy to clipboard" data-hs-clipboard-options='{
-                          "type": "tooltip",
-                          "successText": "Copied!",
-                          "contentTarget": "#accountDetails_uid",
-                          "classChangeTarget": "#accountDetails_uidIcon",
-                          "defaultClass": "bi-clipboard",
-                          "successClass": "bi-check"
-                         }'>
-                        <i id="accountDetails_uidIcon" class="bi-clipboard"></i>
-                      </a>
-                    </div>
-                  </div>
-
-
-                  <!-- <div class="d-flex justify-content-end">
-                    <button type="submit" class="btn btn-primary">Save changes</button>
-                  </div> -->
-                </form>
-                <!-- End Form -->
-              </div>
-              <!-- End Body -->
-            </div>
-            <!-- End Card -->
-
-            <!-- Card -->
-            <div id="personalInformation" class="card">
-              <div class="card-header">
-                <h2 class="card-title h4">
-                  <i class="bi-person-badge nav-icon me-1"></i> Personal Information <i class="bi-question-circle text-body ms-1" data-bs-toggle="tooltip" data-bs-placement="top" title="Personal information is not displayed publicly."></i>
-                </h2>
-              </div>
-
-              <!-- Body -->
-              <div class="card-body">
-                <!-- Form -->
-                <form id="personal-information-form" data-allow-resubmit="true">
-                  <!-- Form -->
-                  <div class="row mb-3">
-                    <p class="text-dark mb-0">Name</p>
-                    <div class="col-6">
-                      <label for="firstNameLabel" class="form-label text-muted">First name</label>
-
-                      <input type="text" class="form-control" name="name.first" id="firstNameLabel" placeholder="Jon" aria-label="Jon" value="" autocomplete="given-name">
-                    </div>
-                    <div class="col-6">
-                      <label for="lastNameLabel" class="form-label text-muted">Last name</label>
-
-                      <input type="text" class="form-control" name="name.last" id="lastNameLabel" placeholder="Snow" aria-label="Snow" value="" autocomplete="family-name">
-                    </div>
-                  </div>
-                  <!-- End Form -->
-
-                  <!-- <div class="mb-3">
-                    <label for="phoneNumberLabel" class="form-label">Phone</label>
-
-                    <div class="input-group input-group-xs-vertical">
-                      <input type="text" class="js-input-mask form-control" name="telephone.countryCode" placeholder="+1" aria-label="+1" value="" style="max-width: 5rem;" autocomplete="tel-country-code" data-hs-mask-options='{
-                               "mask": "+0000"
-                             }'>
-                      <input type="text" class="js-input-mask form-control" name="telephone.national" id="phoneNumberLabel" placeholder="(xxx) xxx-xxxx" aria-label="(xxx) xxx-xxxx" value="" autocomplete="tel-national" data-hs-mask-options='{
-                               "mask": "(000) 000-0000"
-                             }'>
-                   </div>
-                  </div> -->
-                  <!-- End Form -->
-
-                  <div class="row mb-3">
-                    <div class="col-6">
-                      <label for="birthdayLabel" class="form-label">Birthday</label>
-
-                      <input type="date" class="form-control" name="birthday.timestamp" id="birthdayLabel" placeholder="" aria-label="now" value="" autocomplete="bday">
-                    </div>
-                    <div class="col-6">
-                      <label for="genderLabel" class="form-label">Gender</label>
-
-                      <select id="genderLabel" name="gender" class="form-select" autocomplete="sex">
-                        <option value="">Choose a gender</option>
-                        <option value="male">Male</option>
-                        <option value="female">Female</option>
-                        <option value="other">Other</option>
-                      </select>
-                    </div>
-                  </div>
-
-                  <div class="row">
-                    <div class="col">
-                      <div class="mb-3">
-                        <label for="countryLabel" class="form-label">Country</label>
-                        <select id="countryLabel" name="location.country" class="form-select" autocomplete="country">
-                        </select>
-                      </div>
-                    </div>
-                    <div class="col">
-                      <div class="mb-3">
-                        <label for="regionLabel" class="form-label">Region</label>
-                        <input type="text" id="regionLabel" name="location.region" class="form-control" autocomplete="region" placeholder="State, Province, or Region">
-                      </div>
-                    </div>
-                  </div>
-
-                  <!-- Form -->
-                  <div class="row mb-3">
-                    <div class="col">
-                      <div class="mb-3">
-                        <label for="cityLabel" class="form-label">City</label>
-                        <input type="text" id="cityLabel" name="location.city" class="form-control" autocomplete="city" placeholder="City">
-                      </div>
-                    </div>
-
-                    <div class="col">
-                      <label for="nationalNumberLabel" class="form-label">Phone</label>
-
-                      <div class="input-group mb-3">
-                        <select id="countryCodes" class="form-select flex-grow-0" name="telephone.countryCode" autocomplete="tel-country-code" style="min-width: 4rem; max-width: 8rem; width: 50%;">
-                        </select>
-                        <input type="text" id="nationalNumberLabel" class="js-input-mask form-control" name="telephone.national" placeholder="(xxx) xxx-xxxx" aria-label="(xxx) xxx-xxxx" value="" autocomplete="tel-national" data-hs-mask-options='{
-                                "mask": "(000) 000-0000"
-                              }'>
-                      </div>
-                      <!-- <div class="col-3 pe-0">
-                        <label for="countryCodeLabel" class="form-label text-muted">Country code</label>
-                        <input type="text" id="countryCodeLabel" class="js-input-mask form-control" name="telephone.countryCode" placeholder="+x" aria-label="+1" value="" style="max-width: 5rem;" autocomplete="tel-country-code" data-hs-mask-options='{
-                                "mask": "+0000"
-                              }'>
-                      </div>
-                      <div class="col-9 ps-0">
-                        <label for="nationalNumberLabel" class="form-label text-muted">Number</label>
-
-                        <input type="text" id="nationalNumberLabel" class="js-input-mask form-control" name="telephone.national" placeholder="(xxx) xxx-xxxx" aria-label="(xxx) xxx-xxxx" value="" autocomplete="tel-national" data-hs-mask-options='{
-                                "mask": "(000) 000-0000"
-                              }'>
-                      </div> -->
-                    </div>
-                  </div>
-
-                  <!-- Form -->
-                  <!-- <div class="row align-items-center mb-4">
-                    <label class="col-sm-3 col-form-label form-label">Disable ads <span class="badge bg-primary text-uppercase ms-1">PRO</span></label>
-
-                    <div class="col-sm-9">
-                      <div class="form-check">
-                        <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault">
-                        <label class="form-check-label" for="flexCheckDefault">
-                          With your Pro account, you can disable ads across the site.
-                        </label>
-                      </div>
-                    </div>
-                  </div> -->
-                  <!-- End Form -->
-
-                  <div class="alert alert-soft-success" role="alert" hidden>
-                    <h4 class="alert-heading">Account saved!</h4>
-                    <p>You have successfully updated your account.</p>
-                  </div>
-                  <div class="alert alert-soft-danger" role="alert" hidden>
-                    <h4 class="alert-heading">Error</h4>
-                    <p></p>
-                  </div>
-
-                  <!-- <div class="d-flex justify-content-end">
-                    <button type="submit" class="btn btn-primary">Save changes</button>
-                  </div> -->
-
-                  <div id="personal-information-save-popup" class="position-fixed start-50 bottom-0 translate-middle-x w-100 zi-99 mb-3" style="max-width: 40rem;" hidden>
-                    <!-- Card -->
-                    <div class="card card-sm bg-dark border-dark mx-2">
-                      <div class="card-body">
-                        <div class="row justify-content-center justify-content-sm-between">
-                          <div class="col d-flex align-items-center text-white">
-                            <!-- <button type="button" class="btn btn-ghost-danger">Delete</button> -->
-                            You have unsaved changes!
-                          </div>
-                          <!-- End Col -->
-
-                          <div class="col-auto">
-                            <div class="d-flex gap-3">
-                              <!-- <button type="button" class="btn btn-ghost-light">Discard</button> -->
-                              <button type="submit" class="btn btn-primary">Save</button>
-                            </div>
-                          </div>
-                          <!-- End Col -->
-                        </div>
-                        <!-- End Row -->
-                      </div>
-                    </div>
-                    <!-- End Card -->
-                  </div>
-
-                </form>
-                <!-- End Form -->
-              </div>
-              <!-- End Body -->
-            </div>
-            <!-- End Card -->
-
-            <!-- Card -->
-            <div id="billing" class="card">
-              <div class="card-header">
-                <div class="d-flex align-items-center">
-                  <h4 class="mb-0"><i class="bi-credit-card nav-icon me-1"></i> Billing</h4>
-                  <!-- <span class="badge bg-soft-danger text-danger ms-2">Disabled</span> -->
-                </div>
-              </div>
-
-              <!-- Body -->
-              <div class="card-body">
-                <div class="row">
-                  <div class="auth-billing-suspended-message-element" hidden>
-                    <div class="alert alert-soft-danger" role="alert">
-                      <h4 class="alert-heading">
-                        <i class="fas fa-exclamation-triangle mr-1"></i>
-                        Action Required!
-                      </h4>
-                      Your <strong>{{ site.brand.name }} Premium</strong> features are temporarily paused due to an issue with your payment method. Your subscription is NOT cancelled.
-                      <br>
-                      <br>
-                      To reactivate your premium features, please
-                      <a href="" class="auth-billing-update-btn" target="_blank">update your payment method <i class="bi bi-box-arrow-up-right me-1"></i></a> at your earliest convenience.
-                    </div>
-                  </div>
-                </div>
-
-                <div class="row">
-                  <!-- <div class="col-md mb-4 mb-md-0"> -->
-                  <div class="col-md mb-0 mb-md-0">
-                    <div class="mb-1">
-                      <h3 class="mb-1">
-                        <span class="auth-billing-plan-id-element"></span> Plan <span class="badge auth-billing-status-element auth-billing-status-color-element">Pending</span>
-                      </h3>
-                      <div class="text-muted mb-1">
-                        Renews <span class="auth-billing-frequency-element"></span> beginning <span class="auth-billing-start-date-element"></span>
-                      </div>
-                      <span class="card-subtitle">
-
-                      </span>
-
-                    </div>
-                    <div class="mb-1">
-                      <small class="text-cap text-danger auth-billing-expiration-date-element mb-0" hidden></small>
-                      <small class="text-cap text-success auth-billing-trial-expiration-date-element mb-0" hidden></small>
-                    </div>
-
-                    <div class="mb-1">
-                      <span class="">
-                        You can view your plan benefits from the <a href="{{ site.url }}/pricing" target="_blank"><u>pricing page</u> <i class="bi bi-box-arrow-up-right me-1"></i></a>
-                      </span>
-                    </div>
-
-                    <!-- <div>
-                      <span class="card-subtitle">Total per year</span>
-                      <h1 class="text-primary">$264 USD</h1>
-                    </div> -->
-                  </div>
-                  <!-- End Col -->
-
-                  <div class="col-md-auto">
-                    <div class="d-grid d-md-flex gap-3">
-                      <a class="btn btn-soft-primary auth-billing-update-btn" href="javascript:;" target="_blank" rel="nofollow" hidden>Manage plan</a>
-                      <a class="btn btn-success auth-billing-subscribe-btn" href="{{ site.url }}/pricing" target="_blank" hidden><i class="bi-star-fill me-1"></i> Subscribe</a>
-                    </div>
-                  </div>
-                  <!-- End Col -->
-                </div>
-
-                <!-- <div class="row">
-                  <p class="mb-0">
-                    You can view your plan benefits from the <a href="{{ site.url }}/pricing" target="_blank">pricing page</a>.
-                  </p>
-                </div> -->
-                <!-- End Row -->
-              </div>
-              <!-- End Body -->
-            </div>
-            <!-- End Card -->
-
-            <div id="referrals" class="card">
-              <div class="card-header">
-                <div class="d-flex justify-content-between align-items-center">
-                  <h4 class="card-title"><i class="bi-people nav-icon me-1"></i> Referrals</h4>
-                  <span class="">
-                    <i class="bi-gift-fill"></i>
-                    <span class="auth-referral-count-element"></span>
-                    <span class="">referrals</span>
-                  </span>
-                </div>
-              </div>
-
-              <div class="card-body">
-
-                <div class="row">
-                  <div class="col-12">
-
-                    <h5 class="card-title">My referral code</h5>
-
-                    <form>
-                      <div class="mb-3">
-                        <label for="referrals_code" class="form-label">Referral link</label>
-
-                        <div class="input-group input-group-sm input-group-merge table-input-group">
-                          <input id="referrals_code" type="text" class="form-control form-control-light auth-referral-code-element" readonly value="">
-                          <a class="js-clipboard input-group-append input-group-text" href="javascript:;" data-bs-toggle="tooltip" title="Copy to clipboard" data-hs-clipboard-options='{
-                              "type": "tooltip",
-                              "successText": "Copied!",
-                              "contentTarget": "#referrals_code",
-                              "classChangeTarget": "#referrals_codeIcon",
-                              "defaultClass": "bi-clipboard",
-                              "successClass": "bi-check"
-                             }'>
-                            <i id="referrals_codeIcon" class="bi-clipboard"></i>
-                          </a>
-                        </div>
-                      </div>
-                    </form>
-
-                  </div>
-                </div>
-
-                <hr>
-
-                <div class="row">
-                  <div class="col-12">
-
-                    <h5 class="card-title">Share on socials</h5>
-                    <p>Sharing your referral link on social media is a great way to get <strong>referral points</strong>!</p>
-                    <div class="d-flex _justify-content-center justify-content-start">
-                      <a class="auth-referral-social-link" href="#" data-provider="facebook">
-                        <img class="avatar avatar-md me-2" src="https://cdn.itwcreativeworks.com/assets/general/images/brands/color/facebook.svg" alt="Facebook Logo">
-                      </a>
-                      <a class="auth-referral-social-link" href="#" data-provider="twitter">
-                        <img class="avatar avatar-md me-2" src="https://cdn.itwcreativeworks.com/assets/general/images/brands/color/twitter.svg" alt="Twitter Logo">
-                      </a>
-                      <a class="auth-referral-social-link" href="#" data-provider="reddit">
-                        <img class="avatar avatar-md me-2" src="https://cdn.itwcreativeworks.com/assets/general/images/brands/color/reddit.svg" alt="Reddit Logo">
-                      </a>
-                      <a class="auth-referral-social-link" href="#" data-provider="tumblr">
-                        <img class="avatar avatar-md me-2" src="https://cdn.itwcreativeworks.com/assets/general/images/brands/color/tumblr.svg" alt="Tumblr Logo">
-                      </a>
-                      <a class="auth-referral-social-link" href="#" data-provider="pinterest">
-                        <img class="avatar avatar-md me-2" src="https://cdn.itwcreativeworks.com/assets/general/images/brands/color/pinterest.svg" alt="Pinterest Logo">
-                      </a>
-                      <a class="auth-referral-social-link" href="#" data-provider="linkedin">
-                        <img class="avatar avatar-md me-2" src="https://cdn.itwcreativeworks.com/assets/general/images/brands/color/linkedin.svg" alt="Linkedin Logo">
-                      </a>
-                    </div>
-                  </div>
-                </div>
-
-                <hr>
-
-                <div class="row">
-                  <div class="col-12">
-
-                    <h5 class="card-title">My referrals</h5>
-
-                    <div class="" style="_height: 21.25rem; max-height: 16rem; overflow: hidden; overflow-y: auto;">
-                      <ul id="referrals-parent" class="step step-icon-xs mb-0">
-                        <li class="step-item">
-                          <div class="step-content-wrapper">
-                            <span class="step-icon step-icon-pseudo step-icon-soft-dark"></span>
-
-                            <div class="step-content">
-                              <h5 class="step-title">
-                                <span class="text-dark">You have no referrals :(</span>
-                              </h5>
-
-                              <p class="fs-5 mb-1">Try sharing your referral link with your friends!</p>
-
-                              <!-- <span class="text-muted small text-uppercase">{date}</span> -->
-                            </div>
-
-                          </div>
-                        </li>
-                      </ul>
-                    </div>
-
-                  </div>
-                </div>
-
-              </div>
-            </div>
-
-            <div id="apiKeys" class="card">
-              <div class="card-header">
-                <h4 class="card-title"><i class="bi-key nav-icon me-1"></i> API Keys</h4>
-              </div>
-
-              <!-- Body -->
-              <div class="card-body">
-
-                <form id="api-keys-form">
-                  <!-- Form -->
-                  <div class="mb-3">
-                    <label for="apiKeys_private" class="form-label">Private key</label>
-
-                    <div class="input-group input-group-sm input-group-merge table-input-group">
-                      <input id="apiKeys_private" type="text" class="form-control form-control-light auth-apikey-element" readonly value="">
-                      <a class="js-clipboard input-group-append input-group-text" href="javascript:;" data-bs-toggle="tooltip" title="Copy to clipboard" data-hs-clipboard-options='{
-                          "type": "tooltip",
-                          "successText": "Copied!",
-                          "contentTarget": "#apiKeys_private",
-                          "classChangeTarget": "#apiKeys_privateIcon",
-                          "defaultClass": "bi-clipboard",
-                          "successClass": "bi-check"
-                         }'>
-                        <i id="apiKeys_privateIcon" class="bi-clipboard"></i>
-                      </a>
-                    </div>
-                  </div>
-
-                  <!-- <div class="mb-3">
-                    <label for="apiKeys_client" class="form-label">Client key</label>
-
-                    <div class="input-group input-group-sm input-group-merge table-input-group">
-                      <input id="apiKeys_client" type="text" class="form-control form-control-light auth-apikey-element" readonly value="">
-                      <a class="js-clipboard input-group-append input-group-text" href="javascript:;" data-bs-toggle="tooltip" title="Copy to clipboard" data-hs-clipboard-options='{
-                          "type": "tooltip",
-                          "successText": "Copied!",
-                          "contentTarget": "#apiKeys_client",
-                          "classChangeTarget": "#apiKeys_clientIcon",
-                          "defaultClass": "bi-clipboard",
-                          "successClass": "bi-check"
-                         }'>
-                        <i id="apiKeys_clientIcon" class="bi-clipboard"></i>
-                      </a>
-                    </div>
-                  </div>                   -->
-                  <!-- End Form -->
-
-                  <div class="alert alert-soft-danger" role="alert" hidden>
-                    <h4 class="alert-heading">Error</h4>
-                    <p></p>
-                  </div>
-
-                  <div class="d-flex justify-content-end">
-                    <button type="submit" class="btn btn-soft-primary">Regenerate keys</button>
-                  </div>
-                </form>
-
-
-
-              </div>
-              <!-- End Body -->
-            </div>
-
-            <!-- Card -->
-            <div id="usage" class="card" hidden>
-              <div class="card-header">
-                <div class="d-flex align-items-center">
-                  <h4 class="mb-0"><i class="bi-activity nav-icon me-1"></i> Usage</h4>
-                </div>
-              </div>
-
-              <div class="card-body">
-                <p class="card-text">
-                  View and manage your account usage. <span hidden>Usage resets on <strong id="usage-reset"></strong>. </span>
-                </p>
-              </div>
-
-              <div class="table-responsive">
-                <table class="table table-thead-bordered table-nowrap table-align-middle card-table">
-                  <thead class="thead-light">
-                    <tr>
-                      <th>Metric</th>
-                      <th>Used</th>
-                      <th>Allowed</th>
-                    </tr>
-                  </thead>
-
-                  <tbody id="usage-table">
-
-                  </tbody>
-                </table>
-              </div>
-              <!-- End Body -->
-            </div>
-            <!-- End Card -->
-
-            <!-- Card -->
-            <div id="changePassword" class="card">
-              <div class="card-header">
-                <div class="d-flex align-items-center">
-                  <h4 class="mb-0"><i class="bi-shield-lock nav-icon me-1"></i> Change Password</h4>
-                  <!-- <span class="badge bg-soft-danger text-danger ms-2">Disabled</span> -->
-                </div>
-              </div>
-
-              <!-- Body -->
-              <div class="card-body">
-                <!-- <p class="card-text">Start by entering your password so that we know it's you. Then we'll send you a password reset email.</p> -->
-                <p class="card-text">We'll send you a password reset email.</p>
-
-                <form id="change-password-form">
-                  <!-- Form -->
-                  <!-- <div class="mb-3">
-                    <label for="accountPasswordLabel" class="form-label">Account password</label>
-
-                    <input type="password" class="form-control" name="password" id="accountPasswordLabel" placeholder="Enter current password" aria-label="Enter current password" autocomplete="current-password" minlength="6" required>
-                    <small class="form-text">This is the password you use to log in to your {{ site.brand.name }} account.</small>
-                  </div> -->
-                  <div class="mb-3">
-                    <label for="accountEmailLabel" class="form-label">Confirm email</label>
-
-                    <input type="email" class="form-control" name="email" id="accountEmailLabel" placeholder="Enter account email" aria-label="Enter account email" autocomplete="email" required>
-                    <small class="form-text">Confirm the email you use to log in to to your {{ site.brand.name }} account.</small>
-                  </div>
-                  <!-- End Form -->
-
-                  <div class="alert alert-soft-success" role="alert" hidden>
-                    <h4 class="alert-heading">Password email sent</h4>
-                    <p>Please check <strong class="auth-email-element"></strong> for a password reset email</p>
-                  </div>
-                  <div class="alert alert-soft-danger" role="alert" hidden>
-                    <h4 class="alert-heading">Error</h4>
-                    <p></p>
-                  </div>
-
-                  <div class="d-flex justify-content-end">
-                    <button type="submit" class="btn btn-soft-primary">Change password</button>
-                  </div>
-                </form>
-              </div>
-              <!-- End Body -->
-            </div>
-            <!-- End Card -->
-
-            <!-- Card -->
-
-            <!-- Card -->
-            <div id="signinMethods" class="card">
-              <div class="card-header">
-                <h4 class="card-title"><i class="bi-box-arrow-in-right nav-icon me-1"></i> Signin Methods</h4>
-              </div>
-
-              <!-- Body -->
-              <div class="card-body">
-                <form>
-                  <div id="signin-methods-parent" class="list-group list-group-lg list-group-flush list-group-no-gutters">
-
-                  </div>
-                </form>
-              </div>
-              <!-- End Body -->
-            </div>
-            <!-- End Card -->
-
-            <!-- Card -->
-            <!-- <div id="connectedAccounts" class="card" hidden> -->
-            <div id="connectedAccounts" class="card">
-              <div class="card-header">
-                <h4 class="card-title"><i class="bi-link nav-icon me-1"></i> Connected Accounts</h4>
-              </div>
-
-              <!-- Body -->
-              <div class="card-body">
-                <p class="card-text">Connect other apps you use and integrate their features into {{ site.brand.name }}.</p>
-
-                <!-- Form -->
-                <form>
-
-                  <div id="connectedAccountsParent" class="list-group list-group-lg list-group-flush list-group-no-gutters">
-                    <!-- List Item -->
-
-                    <!-- End List Item -->
-                  </div>
-                </form>
-                <!-- End Form -->
-              </div>
-              <!-- End Body -->
-            </div>
-            <!-- End Card -->
-
-            <!-- Card -->
-            <div id="activeSessions" class="card">
-              <!-- <div class="card-header">
-                <div class="d-flex align-items-center">
-                  <h4 class="mb-0">Active sessions</h4>
-                </div>
-              </div> -->
-
-              <div class="card-header card-header-content-between">
-                <h4 class="card-header-title"><i class="bi-toggle2-on nav-icon me-1"></i> Active Sessions</h4>
-
-                <!-- Dropdown -->
-                <div class="dropdown">
-                  <button type="button" class="btn btn-ghost-secondary btn-icon btn-sm rounded-circle" id="activeSessionsDropdown" data-bs-toggle="dropdown" aria-expanded="false">
-                    <i class="bi-three-dots-vertical"></i>
-                  </button>
-
-                  <div class="dropdown-menu dropdown-menu-end mt-1" aria-labelledby="activeSessionsDropdown">
-                    <a class="dropdown-item text-danger auth-signout-all-sessions-btn" href="javascript:;">
-                      <i class="bi-door-open-fill me-1"></i> Sign out of all sessions
-                    </a>
-                  </div>
-                </div>
-                <!-- End Dropdown -->
-              </div>
-
-
-              <!-- Body -->
-              <div class="card-body">
-                <p class="card-text">View and manage devices where you're currently logged in. </p>
-              </div>
-              <!-- End Body -->
-
-              <!-- Table -->
-              <div class="table-responsive">
-                <table class="table table-thead-bordered table-nowrap table-align-middle card-table">
-                  <thead class="thead-light">
-                    <tr>
-                      <!-- <th>Browser</th> -->
-                      <th>Device</th>
-                      <th>IP</th>
-                      <th>Initial activity</th>
-                    </tr>
-                  </thead>
-
-                  <tbody id="active-sessions-parent">
-
-                  </tbody>
-                </table>
-              </div>
-              <!-- End Table -->
-            </div>
-            <!-- End Card -->
-
-
-            <!-- Card -->
-            <div id="deleteAccount" class="card" data-hash-trigger="#deleteAccount">
-              <div class="card-header">
-                <h4 class="card-title"><i class="bi-trash3 nav-icon me-1"></i> Delete Account</h4>
-              </div>
-
-              <!-- Body -->
-              <div class="card-body">
-                <p class="card-text">When you delete your account, you lose access to all {{ site.brand.name }} services and all your personal data is permanently deleted. This action is <strong>irreversible</strong>.</p>
-
-                <div class="mb-4">
-                  <!-- Form Check -->
-                  <div class="form-check">
-                    <input class="form-check-input auth-delete-account-confirmation-input" type="checkbox" value="" id="deleteAccountCheckbox">
-                    <label class="form-check-label" for="deleteAccountCheckbox">
-                      I confirm that I want to permanently delete my account.
-                    </label>
-                  </div>
-                  <!-- End Form Check -->
-                </div>
-
-                <div class="alert alert-soft-danger auth-delete-account-error-message-element" role="alert" hidden>
-                  <h4 class="alert-heading">Error</h4>
-                  <p></p>
-                </div>
-
-                <div class="d-flex justify-content-end gap-3">
-                  <a class="btn btn-white" href="{{ site.url }}/privacy">Learn more</a>
-                  <button type="submit" class="btn btn-danger auth-delete-account-btn">Delete</button>
-                </div>
-              </div>
-              <!-- End Body -->
-            </div>
-            <!-- End Card -->
-
-          </div>
-
-
-        </div>
-
-        <!-- Sticky Block End Point -->
-        <div id="stickyBlockEndPoint"></div>
-      </div>
-    </div>
-    <!-- End Row -->
-  </div>
-  <!-- End Content -->
-</main>
-<!-- ========== END MAIN CONTENT ========== -->
-
-<!-- TOAST -->
-<div class="toast-container position-fixed p-3 top-0 start-50 translate-middle-x" style="z-index: 1003; _min-width: 50vw;">
-  <div id="toast-main" class="toast bg-danger text-white">
-    <div class="d-flex">
-      <div class="toast-body">
-        <!-- Dynamically filled -->
-      </div>
-      <button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-    </div>
-  </div>
-</div>
-
-<!-- TEMPLATES -->
-<div id="referrals-html-template" hidden
-  data-template='
-    <li class="step-item">
-      <div class="step-content-wrapper">
-        <span class="step-icon step-icon-pseudo step-icon-soft-dark"></span>
-
-        <div class="step-content">
-          <h5 class="step-title">
-            <!-- <span class="text-dark">Referred <code>{uid}</code> </span> -->
-            <span class="text-dark">New referral! </span>
-          </h5>
-
-          <!-- <p class="fs-5 mb-1">Earned <a class="text-uppercase" href="#"><i class="bi-gift-fill"></i> +1 </a> as <span class="badge bg-soft-primary text-primary rounded-pill"><span class="legend-indicator bg-primary"></span>"In progress"</span></p> -->
-          <p class="fs-5 mb-1">Earned <a class="text-uppercase" href="javascript:;"><i class="bi-gift-fill"></i> +1 </a> <strong>Referral Point</strong> </p>
-
-          <span class="text-muted small text-uppercase">{date}</span>
-        </div>
-      </div>
-    </li>
-'></div>
-<div id="signin-methods-template" hidden
-  data-template='
-    <div class="list-group-item">
-      <div class="d-flex">
-        <div class="flex-shrink-0">
-          {icon}
-        </div>
-
-        <div class="flex-grow-1">
-          <div class="row align-items-center">
-            <div class="col-sm mb-2 mb-sm-0">
-              <h4 class="mb-0">{name}</h4>
-              <a class="fs-5" href="{urlFull}" target="_blank" rel="nofollow">{urlShort}</a>
-            </div>
-            <!-- End Col -->
-
-            <div class="col-sm-auto">
-              <!-- <a class="btn btn-white btn-sm auth-signin-provider-btn {disabled}" href="javascript:;" data-provider="{provider}" {disabled}>{buttonText}</a> -->
-              <!-- <a class="btn btn-white btn-sm {disabled}" href="{urlAuth}" {disabled}>{buttonText}</a> -->
-              <a class="btn btn-white btn-sm {classAction} {disabled}" data-provider="{provider}" {disabled}>{buttonText}</a>
-            </div>
-            <!-- End Col -->
-          </div>
-          <!-- End Row -->
-        </div>
-      </div>
-    </div>
-'></div>
-<div id="active-sessions-template" hidden
-  data-template='
-    <tr>
-      <td class="align-items-center" hidden>
-        {icon}
-      </td>
-      <td>
-        <div class="flex-shrink-0">
-          {icon} {platform} {online}
-        </div>
-
-      </td>
-      <td>
-        <a href="{ipUrl}" target="_blank" rel="nofollow">{ip} <i class="bi-box-arrow-up-right ms-1"></i></a>
-      </td>
-      <td>{date}</td>
-    </tr>
-'></div>
-
-<div id="connected-accounts-template" hidden
-  data-template='
-  <div class="list-group-item connect-account-parent" data-provider="{id}">
-    <div class="d-flex">
-      <div class="flex-shrink-0">
-        <!-- <i class="bi-{icon} list-group-icon"></i> -->
-        <!-- <img class="avatar avatar-xs me-3" src="{icon}" alt="{identity}"> -->
-        <img class="avatar avatar-s me-2" src="{icon}" alt="{identity}">
-      </div>
-
-      <div class="flex-grow-1 me-3">
-        <div class="row align-items-center">
-          <div class="col">
-            <h4 class="mb-0">{name} <span class="connect-account-identity text-muted" data-provider="{id}">{identity}</span> </h4>
-            <p class="fs-5 text-body mb-0">{description} <a href="{homepage}" target="_blank" rel="nofollow">Learn more</a> </p>
-          </div>
-          <!-- End Col -->
-
-          <div class="col-auto">
-            <!-- Form Switch -->
-            <!-- <div class="form-check form-switch">
-              <input class="form-check-input disabled" type="checkbox" id="connectedAccounts_{id}" disabled>
-              <label class="form-check-label" for="connectedAccounts_{id}"></label>
-            </div> -->
-            <a href="javascript:;" class="btn btn-white btn-sm connect-account-btn disabled" data-provider="{id}" data-action="connect" data-scope="{scope}" disabled>Connect</a>
-            <!-- End Form Switch -->
-          </div>
-          <!-- End Col -->
-        </div>
-        <!-- End Row -->
-      </div>
-    </div>
-  </div>
-'></div>
-
-<div id="usage-template" hidden
-  data-template='
-  <tr>
-    <td class="align-items-center">{metric}</td>
-    <td>{used}</td>
-    <td>{allowed}</td>
-  </tr>
-'></div>
-
-<script>
-  (function() {
-    window.onload = function () {
-
-
-      // INITIALIZATION OF NAVBAR VERTICAL ASIDE
-      // =======================================================
-      new HSSideNav('.js-navbar-vertical-aside').init()
-
-
-      // INITIALIZATION OF FORM SEARCH
-      // =======================================================
-      new HSFormSearch('.js-form-search')
-
-
-      // INITIALIZATION OF BOOTSTRAP DROPDOWN
-      // =======================================================
-      HSBsDropdown.init()
-
-
-      // INITIALIZATION OF SELECT
-      // =======================================================
-      // HSCore.components.HSTomSelect.init('.js-select')
-
-
-      // INITIALIZATION OF INPUT MASK
-      // =======================================================
-      // HSCore.components.HSMask.init('.js-input-mask')
-
-
-      // INITIALIZATION OF FILE ATTACHMENT
-      // =======================================================
-      new HSFileAttach('.js-file-attach')
-
-
-      // INITIALIZATION OF STICKY BLOCKS
-      // =======================================================
-      new HSStickyBlock('.js-sticky-block', {
-        // targetSelector: document.getElementById('header').classList.contains('navbar-fixed') ? '#header' : null
-        targetSelector: null
-      })
-
-    }
-  })()
-</script>
-
-
-<script type="text/javascript">
-  Manager.auth().ready(function () {
-    var select = Manager.dom().select;
-    var _ = Manager.utilities();
-    var currentURL = new URL(window.location.href);
-    var qsTestAccount = currentURL.searchParams.get('testAccount');
-
-    var user = firebase.auth().currentUser;
-    var email = user ? user.email : '';
-    var gravatar = 'https://secure.gravatar.com/avatar/' + md5(email) + '?size=' + 200 + '&d=retro';
-
-    var $spinner = document.getElementById('spinner-loader');
-    var $accountParent = document.getElementById('account-parent');
-    var $premiumBadge = document.getElementById('premium-badge')
-    var $profileBadges = document.getElementById('profile-badges')
-    var $countries = document.getElementById('countryLabel')
-    var $countryCodes = document.getElementById('countryCodes')
-    var $referralsParent = document.getElementById('referrals-parent')
-    var $signinMethods = document.getElementById('signin-methods-parent')
-
-    var referralsTemplate = document.getElementById('referrals-html-template').dataset.template;
-    var signinMethodsTemplate = document.getElementById('signin-methods-template').dataset.template;
-    var activeSessionsTemplate = document.getElementById('active-sessions-template').dataset.template;
-    var connectedAccountsTemplate = document.getElementById('connected-accounts-template').dataset.template;
-    var usageTemplate = document.getElementById('usage-template').dataset.template;
-
-    var $usageTable = document.getElementById('usage-table')
-    var $usageReset = document.getElementById('usage-reset')
-
-    var $authUserProfileParent = document.getElementById('auth-user-profile-parent')
-    var $authUserProfileImg = document.getElementById('auth-user-profile-img')
-
-    var $activeSessionsParent = document.getElementById('active-sessions-parent')
-
-    var $personalInformationSavePopup = document.getElementById('personal-information-save-popup')
-    var $personalInformationForm = document.getElementById('personal-information-form');
-
-    // var $connectedAccountsTab = document.getElementById('connectedAccountsNav');
-    // var $connectedAccountsSection = document.getElementById('connectedAccounts');
-    var $connectedAccountsParent = document.getElementById('connectedAccountsParent');
-
-    var qsDevelopment = Manager.properties.page.queryString.get('development');
-
-    var serverApiURL = (
-        qsDevelopment === 'true'
-        ? 'http://localhost:5001/PROJECT_ID/us-central1/bm_api'
-        : 'https://us-central1-PROJECT_ID.cloudfunctions.net/bm_api'
-      )
-      .replace(/PROJECT_ID/g, _.get(Manager, 'properties.options.libraries.firebase_app.config.projectId'))
-    var token;
-    var appData = {};
-    var providerData = {};
-    var accountData = {};
-    var resolvedPlanData = {};
-    var oauth2Map = {
-      google: {
-        // icon: 'google',
-        icon: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/google.svg',
-        name: 'Google',
-        description: 'Search and social.',
-        homepage: 'https://google.com',
-        identity: 'email',
-      },
-      discord: {
-        // icon: 'discord',
-        icon: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/discord.svg',
-        name: 'Discord',
-        description: 'Chat and community.',
-        homepage: 'https://discord.com',
-        identity: 'username',
-      }
-    }
-    var signinMethodMap = {
-      password: 'https://cdn.itwcreativeworks.com/assets/general/images/font-awesome/svg/black/user-solid.svg',
-      google: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/google.svg',
-      facebook: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/facebook.svg',
-      twitter: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/twitter.svg',
-      github: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/github.svg',
-      apple: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/apple.svg',
-      microsoft: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/microsoft.svg',
-      yahoo: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/yahoo-y.svg',
-    }
-    var sessionsMap = {
-      mac: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/apple.svg',
-      windows: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/microsoft.svg',
-      linux: 'https://cdn.itwcreativeworks.com/assets/general/images/brands/color/linux.svg',
-    }
-
-    $authUserProfileImg.setAttribute('onerror', '');
-    $authUserProfileImg.src = gravatar;
-    $authUserProfileParent.href = 'https://gravatar.com';
-
-    // Process
-    if (!user) {
-      return
-    }
-
-    function getIdToken() {
-      return new Promise(function(resolve, reject) {
-        user.getIdToken(true)
-        .then(function (response) {
-          token = response;
-
-          return resolve(token);
-        })
-        .catch(function (e) {
-          return reject(e);
-        })
-      });
-    }
-
-    function getAppData() {
-      return new Promise(function(resolve, reject) {
-        WonderfulFetch('https://us-central1-itw-creative-works.cloudfunctions.net/getApp', {
-          method: 'POST',
-          timeout: 30000,
-          tries: 2,
-          response: 'json',
-          body: {
-            id: Manager.properties.global.app,
-          },
-        })
-        .then(function (response) {
-          appData = response;
-          appData.products = appData.products || {};
-
-          console.log('appData', appData);
-
-          return resolve(appData);
-        })
-        .catch(function (e) {
-          return reject(e);
-        })
-      });
-    }
-
-    function resolveAccount() {
-      return new Promise(function(resolve, reject) {
-        Manager.account().import()
-        .then(function (Account) {
-          var account = new Account();
-          var testAccount = getTestAccount();
-
-          account.resolve(testAccount.account, testAccount.options)
-          .then(function (properties) {
-            accountData = properties;
-
-            console.log('.account().resolve()', accountData);
-
-            return resolve(accountData)
-          })
-          .catch(function (e) {
-            return reject(e);
-          })
-        })
-        .catch(function (e) {
-          return reject(e);
-        })
-      });
-    }
-
-    function getTestAccount() {
-      var presentDate = new Date();
-      var futureDate = new Date((new Date().setDate(new Date().getDate() + 7)));
-      var pastDate = new Date((new Date().setDate(new Date().getDate() - 7)));
-      var zeroDate = '1970-01-01T00:00:00.000Z';
-
-      var dates = {
-        present: {
-          t: presentDate.toISOString(),
-          u: presentDate.getTime(),
-        },
-        future: {
-          t: futureDate.toISOString(),
-          u: futureDate.getTime(),
-        },
-        past: {
-          t: pastDate.toISOString(),
-          u: pastDate.getTime(),
-        },
-        zero: {
-          t: zeroDate,
-          u: 0,
-        },
-      }
-
-      var result = {
-        account: undefined,
-        options: {
-          fetchNewAccount: true,
-        },
-      }
-
-      if (qsTestAccount) {
-        result.options.fetchNewAccount = false;
-        result.account = {
-          auth: {
-            uid: 'uid-' + qsTestAccount,
-            email: 'email-' + qsTestAccount + '@gmail.com',
-          },
-          plan: {
-            id: 'premium',
-            expires: {
-              timestamp: undefined,
-              timestampUNIX: undefined,
-            },
-            status: undefined,
-            trial: {
-              activated: undefined,
-              expires: {
-                timestamp: undefined,
-                timestampUNIX: undefined,
-              }
-            },
-            payment: {
-              startDate: {
-                timestamp: undefined,
-                timestampUNIX: undefined,
-              },
-              frequency: 'monthly',
-              orderId: 'order-id-' + qsTestAccount,
-              resourceId: 'resource-id-' + qsTestAccount,
-              active: undefined,
-            }
-          }
-        }
-      }
-
-      // Active
-      if (qsTestAccount === 'active') {
-        result.account.plan.expires.timestamp = dates.future.t;
-        result.account.plan.expires.timestampUNIX = dates.future.u;
-
-        result.account.plan.status = 'active';
-
-        result.account.plan.trial.activated = false;
-
-        result.account.plan.trial.expires.timestamp = dates.future.t;
-        result.account.plan.trial.expires.timestampUNIX = dates.future.u;
-
-        result.account.plan.payment.startDate.timestamp = dates.present.t;
-        result.account.plan.payment.startDate.timestampUNIX = dates.present.u;
-        result.account.plan.payment.active = true;
-      }
-
-      // Trial
-      if (qsTestAccount === 'trial') {
-        result.account.plan.expires.timestamp = dates.future.t;
-        result.account.plan.expires.timestampUNIX = dates.future.u;
-
-        result.account.plan.status = 'active';
-
-        result.account.plan.trial.activated = true;
-
-        result.account.plan.trial.expires.timestamp = dates.future.t;
-        result.account.plan.trial.expires.timestampUNIX = dates.future.u;
-
-        result.account.plan.payment.startDate.timestamp = dates.present.t;
-        result.account.plan.payment.startDate.timestampUNIX = dates.present.u;
-        result.account.plan.payment.active = true;
-      }
-
-      // Expired
-      if (qsTestAccount === 'expired') {
-        result.account.plan.expires.timestamp = dates.zero.t;
-        result.account.plan.expires.timestampUNIX = dates.zero.u;
-
-        result.account.plan.status = 'active';
-
-        result.account.plan.trial.activated = false;
-
-        result.account.plan.trial.expires.timestamp = dates.zero.t;
-        result.account.plan.trial.expires.timestampUNIX = dates.zero.u;
-
-        result.account.plan.payment.startDate.timestamp = dates.present.t;
-        result.account.plan.payment.startDate.timestampUNIX = dates.present.u;
-        result.account.plan.payment.active = false;
-      }
-
-      // Suspended
-      if (qsTestAccount === 'suspended') {
-        result.account.plan.expires.timestamp = dates.zero.t;
-        result.account.plan.expires.timestampUNIX = dates.zero.u;
-
-        result.account.plan.status = 'suspended';
-
-        result.account.plan.trial.activated = false;
-
-        result.account.plan.trial.expires.timestamp = dates.zero.t;
-        result.account.plan.trial.expires.timestampUNIX = dates.zero.u;
-
-        result.account.plan.payment.startDate.timestamp = dates.present.t;
-        result.account.plan.payment.startDate.timestampUNIX = dates.present.u;
-        result.account.plan.payment.active = false;
-      }
-
-      // Cancelled
-      if (qsTestAccount === 'cancelled') {
-        result.account.plan.expires.timestamp = dates.zero.t;
-        result.account.plan.expires.timestampUNIX = dates.zero.u;
-
-        result.account.plan.status = 'cancelled';
-
-        result.account.plan.trial.activated = false;
-
-        result.account.plan.trial.expires.timestamp = dates.zero.t;
-        result.account.plan.trial.expires.timestampUNIX = dates.zero.u;
-
-        result.account.plan.payment.startDate.timestamp = dates.present.t;
-        result.account.plan.payment.startDate.timestampUNIX = dates.present.u;
-        result.account.plan.payment.active = false;
-      }
-
-      return result;
-    }
-
-    Promise.all([
-      getIdToken(),
-      getAppData(),
-      getAvailableProviders(),
-      resolveAccount(),
-    ])
-    .then(function (response) {
-      // console.log('---response', response);
-
-      getSessions()
-      .then(function (sessionData) {
-        // properties.plan.id = 'premium'
-        var providersArray = Object.keys(providerData);
-        var sessionsArray = Object.keys(sessionData);
-
-        var devicesCount = sessionsArray.length;
-
-        var premiumbadgeHtml = '';
-        var badgesHtml = '';
-        var countriesHtml = '<option value="">Choose a country</option>';
-        var countryCodesHtml = '<option value="">Country code</option>';
-        var referralsHtml = '';
-        var signinMethodsHtml = '';
-        var activeSessionsHtml = '';
-        var connectedAccountsHtml = ''
-        var usageHtml = ''
-
-        // Resolve plan
-        Object.keys(appData.products)
-        .forEach(function (id) {
-          var plan = appData.products[id];
-          if (plan.planId === accountData.plan.id) {
-            resolvedPlanData = plan;
-          }
-        });
-
-        if (qsDevelopment) {
-          accountData.plan.id = 'premium';
-          accountData.roles = {
-            admin: true,
-            developer: true,
-            moderator: true,
-            blogger: true,
-            betaTester: true,
-            vip: true,
-          }
-        }
-
-        if (accountData.plan.id !== 'basic') {
-          // premiumbadgeHtml += '<i class="bi-star-fill fs-2 text-primary me-1" data-bs-toggle="tooltip" data-bs-placement="top" title="' + uppercase(accountData.plan.id) + ' plan"></i>';
-          premiumbadgeHtml += '<i class="fa-solid fa-star fs-2 text-success me-1" data-bs-toggle="tooltip" data-bs-placement="top" title="' + accountData.plan.id + ' plan"></i>';
-        }
-
-        if (accountData.roles.admin) {
-          // badgesHtml += '<i class="bi-magic fs-badge text-danger me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Admin"></i>';
-          // badgesHtml += '<i class="fa-solid fa-fire-flame-curved fs-badge text-danger me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Admin"></i>';
-          // badgesHtml += '<i class="fa-solid fa-crown fs-badge text-danger me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Admin"></i>';
-          badgesHtml += '<i class="fa-solid fa-hat-wizard fs-badge text-danger me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Admin"></i>';
-        }
-
-        if (accountData.roles.developer) {
-          // badgesHtml += '<i class="bi-code-square fs-badge text-info me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Developer"></i>';
-          badgesHtml += '<i class="fa-solid fa-code fs-badge text-info me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Developer"></i>';
-        }
-
-        if (accountData.roles.moderator) {
-          badgesHtml += '<i class="fa-solid fa-shield-halved fs-badge text-warning me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Moderator"></i>';
-        }
-
-        if (accountData.roles.blogger) {
-          // badgesHtml += '<i class="fa-solid fa-book fs-badge text-info me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Blogger"></i>';
-          badgesHtml += '<i class="fa-solid fa-pen-clip fs-badge text-info me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Blogger"></i>';
-        }
-
-        if (accountData.roles.betaTester) {
-          // badgesHtml += '<i class="bi-lightning-fill fs-badge me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Beta tester" style="color: #6f42c1"></i>';
-          badgesHtml += '<i class="fa-solid fa-bolt fs-badge me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Beta tester" style="color: #6f42c1"></i>';
-        }
-
-        if (accountData.roles.vip) {
-          // badgesHtml += '<i class="bi-award-fill fs-badge text-warning me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="VIP"></i>';
-          badgesHtml += '<i class="fa-solid fa-award fs-badge text-warning me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="VIP"></i>';
-        }
-
-
-        // if (Manager.accountData.meta.environment === 'development') {
-        //   accountData.affiliate.referrals = [
-        //     {uid: '1vzZdTI5PHphyeKbjYFzHoApm0Bj2', timestamp: '2020-09-15T00:36:26.177Z'},
-        //     {uid: '1vzZdTI5PHphyeKbjYFzHoApm0Bj2', timestamp: '2021-05-03T00:36:26.177Z'},
-        //     {uid: '2vzZdTI5PHphyeKbjYFzHoApm0Bj2', timestamp: '2022-07-14T00:36:26.177Z'},
-        //   ]
-        // }
-
-        // Add countries
-        Object.keys(Countries.countries)
-        .forEach(function (code, i) {
-          var country = Countries.countries[code]
-          countriesHtml += '<option value="' + code + '">' + country.name + '</option>'
-          countryCodesHtml += '<option value="' + country.phone + '">' + country.name + '  (+' + country.phone + ')</option>'
-        });
-
-        accountData.affiliate.referrals.reverse()
-        .forEach(function (referral, i) {
-          referralsHtml += referralsTemplate
-            .replace(/{uid}/, referral.uid)
-            .replace(/{date}/, new Date(referral.timestamp).toLocaleDateString(undefined, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }))
-        });
-
-        console.log('user.providerData', user.providerData);
-
-        // Fill signin methods
-        user.providerData
-        .forEach(function (provider, i) {
-          if (provider.providerId === 'password') {
-            // providers.password = true;
-            // providersArray.unshift('password')
-          } else if (provider.providerId === 'google.com') {
-            $authUserProfileImg.setAttribute('onerror', 'this.onerror=null;this.src="' + gravatar + '";')
-            $authUserProfileImg.src = provider.photoURL;
-            $authUserProfileParent.href = 'javascript:;'
-            $authUserProfileParent.setAttribute('target', '')
-          }
-        });
-
-        console.log('providersArray', providersArray);
-
-        // Fill signin methods
-        providersArray
-        .forEach(function (provider, i) {
-          var plainId = provider.replace('.com', '');
-          var icon;
-          var url;
-          var classAction;
-          var shouldEnable;
-          var appHasEnabled = providerData[provider];
-          var userHasEnabled = user.providerData.some(function (item) {
-            return item.providerId === provider;
-          });
-          var authUrl = new URL('{{ site.url }}/signin');
-          authUrl.searchParams.set('signout', true)
-          authUrl.searchParams.set('provider', provider)
-          authUrl.searchParams.set('destination', window.location.href)
-
-          console.log('Provider', provider, appHasEnabled, userHasEnabled);
-
-          if (!appHasEnabled) {
-            console.log('Skipping', provider);
-            return
-          }
-
-          // if (provider === 'password') {
-          //   // icon = '<i class="bi-person-fill _list-group-icon me-3 display-5"></i>';
-          //   icon = '<i class="bi-person-fill _list-group-icon me-1 display-4"></i>';
-          //   url = new URL('{{ site.url }}');
-          //   classAction = '';
-          //   shouldEnable = false;
-          // } else {
-          //   // icon = '<img class="avatar avatar-xs me-3" src="' + signinMethodMap[plainId] + '" alt="' + provider + '">';
-          //   icon = '<img class="avatar avatar-s me-2" src="' + signinMethodMap[plainId] + '" alt="' + provider + '">';
-          //   url = new URL('https://' + provider);
-          //   classAction = userHasEnabled ? 'auth-unlink-provider-btn' : 'auth-link-provider-btn';
-          //   shouldEnable = true;
-          // }
-
-          // Get icon
-          icon = '<img class="avatar avatar-s me-2" src="' + signinMethodMap[plainId] + '" alt="' + provider + '">';
-
-          // Format other things
-          if (provider === 'password') {
-            url = new URL('{{ site.url }}');
-            classAction = '';
-            shouldEnable = false;
-          } else {
-            url = new URL('https://' + provider);
-            classAction = userHasEnabled ? 'auth-unlink-provider-btn' : 'auth-link-provider-btn';
-            shouldEnable = true;
-          }
-
-          signinMethodsHtml += signinMethodsTemplate
-            .replace(/{classAction}/g, classAction)
-            .replace(/{provider}/g, provider)
-            .replace(/{name}/g, uppercase(plainId))
-            .replace(/{urlShort}/g, url.host)
-            .replace(/{urlFull}/g, url.toString())
-            .replace(/{urlAuth}/g, authUrl.toString())
-            .replace(/{icon}/g, icon)
-            .replace(/{disabled}/g, shouldEnable ? '' : 'disabled')
-            .replace(/{buttonText}/g, userHasEnabled ? 'Disconnect' : 'Connect')
-        });
-
-        // Active sessions
-        sessionsArray.unshift('now');
-        sessionData.now = {
-          _current: true,
-          timestampUNIX: new Date(),
-          platform: getNavigatorPlatform(),
-          ip: 'This device',
-        }
-
-        // console.log('---sessionData.now', sessionData.now);
-
-        sessionsArray
-        .forEach(function (id) {
-          var session = sessionData[id] || {};
-          var isCurrent = !!session._current;
-          var timestamp = new Date(session.timestampUNIX || session.timestamp);
-          var ip = session.ip;
-          var platform = (session.platform || 'unkown').toLowerCase();
-          var platformHuman;
-          var icon;
-          var iconHtml = '<img class="avatar avatar-s me-2" src="{icon}" alt="' + platformHuman + '">'
-          var iconFont = '<i class="bi-{icon} _list-group-icon me-3 display-5"></i> ';
-
-          if (platform.match(/(mac|darwin)/ig)) {
-            platformHuman = 'macOS';
-            icon = iconHtml.replace(/{icon}/ig, sessionsMap.mac);
-          } else if (platform.match(/win/ig)) {
-            platformHuman = 'Windows';
-            icon = iconHtml.replace(/{icon}/ig, sessionsMap.windows);
-          } else if (platform.match(/linux/ig)) {
-            platformHuman = 'Linux';
-            icon = iconHtml.replace(/{icon}/ig, sessionsMap.linux);
-          } else {
-            platformHuman = 'Unknown';
-            icon = iconFont.replace(/{icon}/ig, 'question-octagon-fill');
-          }
-          // console.log('---session', session);
-          activeSessionsHtml += activeSessionsTemplate
-            .replace(/{icon}/g, icon)
-            .replace(/{platform}/g, platformHuman)
-            .replace(/{online}/g, isCurrent ? '<span class="badge bg-soft-success text-success ms-1">Current</span>' : '')
-            .replace(/{ipUrl}/g, 'https://tools.keycdn.com/geo?host=' + (isCurrent ? '' : encodeURIComponent(ip)))
-            .replace(/{ip}/g, ip)
-            .replace(/{date}/g, isCurrent ? 'Now' : timestamp.toLocaleDateString(undefined, { weekday: 'short', year: 'numeric', month: 'long', day: 'numeric' }) + ', ' + timestamp.toLocaleTimeString());
-        })
-
-
-        // Fill connected accounts
-        var oauth2EnabledArray = [];
-        appData.oauth2 = appData.oauth2 || {};
-
-        // appData.oauth2.google = {enabled: true}
-        // appData.oauth2.discord = {enabled: true}
-
-        Object.keys(appData.oauth2)
-        .forEach(function (provider, i) {
-          // console.log('--appData.oauth2[provider]', appData.oauth2[provider]);
-          if (!appData.oauth2[provider] || !appData.oauth2[provider].enabled) {
-            return;
-          }
-
-          var details = oauth2Map[provider];
-          if (!details) {
-            return;
-          }
-
-          var identity = _.get(accountData.oauth2[provider] || {}, 'identity.' + details.identity, '');
-          if (identity) {
-            identity = '- ' + identity;
-          }
-
-          oauth2EnabledArray = oauth2EnabledArray.concat(provider);
-          connectedAccountsHtml += connectedAccountsTemplate
-            .replace(/{id}/img, provider)
-            .replace(/{icon}/img, details.icon)
-            .replace(/{name}/img, details.name)
-            .replace(/{identity}/img, identity)
-            .replace(/{homepage}/img, details.homepage)
-            .replace(/{description}/img, details.description)
-            .replace(/{scope}/img, encodeURIComponent(JSON.stringify(appData.oauth2[provider].scope || [])))
-        });
-
-        if (oauth2EnabledArray.length === 0) {
-          connectedAccountsHtml = '<i>No providers are available to connect at the moment</i>'
-        }
-
-        // usage
-        accountData.usage = accountData.usage || {};
-        accountData.usage.devices = accountData.usage.devices || {};
-        accountData.usage.devices.count = accountData.usage.devices.count || devicesCount;
-        // resolvedPlanData.limits.submissions = 99
-
-        Object.keys(accountData.usage)
-        .forEach(function (metric) {
-
-          accountData.usage[metric] = accountData.usage[metric] || {};
-
-          usageHtml += usageTemplate
-            .replace(/{metric}/ig, capitalizeFirstLetter(metric))
-            .replace(/{used}/ig, _.get(accountData, 'usage.' + metric + '.count', 0))
-            .replace(/{allowed}/ig, _.get(resolvedPlanData, 'limits.' + metric, 'Unlimited'))
-        });
-
-
-        var nowDate = new Date();
-        var resetDate = new Date(nowDate.getFullYear(), nowDate.getMonth() + 1, 1);
-        var Difference_In_Time = resetDate.getTime() - nowDate.getTime();
-        var Difference_In_Days = Math.round(Difference_In_Time / (1000 * 3600 * 24));
-        var isAnS = Difference_In_Days === 1 ? '' : 's';
-        $usageReset.innerHTML = resetDate.toLocaleDateString(undefined, { year: 'numeric', month: 'long', day: 'numeric' }) + ' (' + Difference_In_Days + ' day' + isAnS + ')'
-
-
-        // Update HTML
-        display('success')
-        $premiumBadge.innerHTML = premiumbadgeHtml;
-        $profileBadges.innerHTML = badgesHtml;
-        $countries.innerHTML = countriesHtml;
-        $countryCodes.innerHTML = countryCodesHtml;
-        $signinMethods.innerHTML = signinMethodsHtml;
-        $activeSessionsParent.innerHTML = activeSessionsHtml;
-        $connectedAccountsParent.innerHTML = connectedAccountsHtml;
-        $usageTable.innerHTML = usageHtml;
-        if (accountData.affiliate.referrals.length > 0) {
-          $referralsParent.innerHTML = referralsHtml
-        }
-
-        // Set personal data ib form
-        Powertools.getKeys(accountData.personal)
-        .forEach(function (key, i) {
-          var val = _.get(accountData.personal, key);
-          var $el = select('*[name="' + key + '"]');
-          // console.log('---', key, val, $el.get(0));
-          if ($el) {
-            if (
-              (key === 'birthday.timestamp' && val === '1970-01-01T00:00:00.000Z')
-              || (key === 'telephone.countryCode' && val === 0)
-              || (key === 'telephone.national' && val === 0)
-            ) {
-              return
-            }
-            $el.setValue(val)
-          }
-        });
-
-        if (!providerData.password) {
-          select('#changePassword, #changePasswordParent')
-          .each(function (el) {
-            el.setAttribute('hidden', true)
-          })
-        }
-
-        if (oauth2EnabledArray.length !== 0) {
-          oauth2EnabledArray
-          .forEach(function (provider, i) {
-            checkOAuth2Connection(provider);
-          });
-        }
-
-        document.addEventListener('submit', function (event) {
-          handleSubmit(event);
-        })
-
-        document.addEventListener('click', function (event) {
-          handleClick(event);
-        })
-
-        $('#personalInformation input, #personalInformation textarea, #personalInformation select').on('change keydown paste cut', function (event) {
-          $personalInformationSavePopup.removeAttribute('hidden')
-        })
-
-        // TODO: REMOVE TRY/CATCH WHEN CDN.ITWCREATIVEWORKS.COM IS FIXED
-        try {
-          new bootstrap.ScrollSpy(document.body, {
-            target: '#navbarSettings',
-            offset: 100,
-            // offset: 0,
-          })
-        } catch (e) {
-          console.error('ScrollSpy', e);
-        }
-
-        new HSScrollspy('#navbarVerticalNavMenu', {
-          breakpoint: 'lg',
-          scrollOffset: -20,
-          // scrollOffset: 0,
-        })
-
-        HSCore.components.HSClipboard.init('.js-clipboard')
-
-        HSCore.components.HSMask.init('.js-input-mask')
-
-        // accountResultEl.setInnerHTML(JSON.stringify(accountData, null, 2));
-
-        // TODO: REMOVE TRY/CATCH WHEN CDN.ITWCREATIVEWORKS.COM IS FIXED
-        try {
-          var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
-          var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
-            return bootstrap.Tooltip.getOrCreateInstance(tooltipTriggerEl)
-          })
-        } catch (e) {
-          console.error('Tooltip', e);
-        }
-
-        // Handle hash
-        var $hashBtn = document.querySelector('*[href="' + currentURL.hash + '"]');
-        var $hashTrigger = select('*[data-hash-trigger]');
-
-        // Unhide hash trigger
-        $hashTrigger.each(function ($el) {
-          if ($el.getAttribute('data-hash-trigger') === currentURL.hash) {
-            $el.removeAttribute('hidden');
-          } else {
-            $el.setAttribute('hidden', true);
-          }
-        })
-
-        // Click hash trigger
-        if ($hashBtn) {
-          $hashBtn.click();
-        }
-
-      })
-    })
-    .catch(function (e) {
-      Manager.sentry().captureException(e);
-      display(e);
-    })
-
-    // helpers
-    function handleSubmit(event) {
-      var $submitBtn = select(event.target.querySelector('button[type="submit"]'));
-      var $alertSuccess = select(event.target.querySelector('.alert-soft-success'));
-      var $alertDanger = select(event.target.querySelector('.alert-soft-danger'));
-      var allowResubmit = event.target.dataset.allowResubmit || 'false';
-
-      if (allowResubmit === 'true') {
-        allowResubmit = true;
-      } else {
-        allowResubmit = false;
-      }
-
-      event.preventDefault();
-
-      console.log('Submit', event);
-
-      // helpers
-      function _result(e) {
-        if (e instanceof Error) {
-          $submitBtn.removeAttribute('disabled', true);
-
-          if ($alertDanger.exists()) {
-            $alertDanger.removeAttribute('hidden');
-            $alertDanger.get(0).querySelector('p').innerHTML = e;
-          }
-        } else {
-          if (allowResubmit) {
-            $submitBtn.removeAttribute('disabled', true);
-          }
-
-          if ($alertSuccess.exists()) {
-            $alertSuccess.removeAttribute('hidden');
-          }
-        }
-      }
-
-      function value(selector) {
-        return select(event.target.querySelector(selector)).getValue();
-      }
-
-      var data = {};
-      select(event.target.querySelectorAll('input, select, textarea'))
-      .each(function (el) {
-        var $el = select(el);
-        _.set(data, $el.getAttribute('name'), $el.getValue() || null)
-      })
-
-      console.log('Data', data);
-
-      $submitBtn.setAttribute('disabled', true);
-      $alertSuccess.setAttribute('hidden', true);
-      $alertDanger.setAttribute('hidden', true);
-
-      if (event.target.matches('#change-password-form')) {
-        if ((
-          (data.password || '').length >= 6)
-          || (data.email === user.email)
-        ) {
-          firebase.auth().sendPasswordResetEmail(user.email)
-            .then(function () {
-              _result()
-            })
-            .catch(function (e) {
-              _result(e)
-            });
-        } else {
-          _result(new Error('The email you entered does not match'))
-        }
-      } else if (event.target === $personalInformationForm) {
-        if (data.birthday.timestamp) {
-          data.birthday.timestampUNIX = Math.round(new Date(data.birthday.timestamp).getTime() / 1000)
-        }
-        if (data.telephone.countryCode) {
-          data.telephone.countryCode = parseInt(data.telephone.countryCode.replace(/[^0-9]/g, ''));
-        }
-        if (data.telephone.national) {
-          data.telephone.national = parseInt(data.telephone.national.replace(/[^0-9]/g, ''));
-        }
-        firebase.firestore().doc('users/' + user.uid)
-        .set({personal: data}, {merge: true})
-        .then(function () {
-          _result()
-          $personalInformationSavePopup.setAttribute('hidden', true);
-        })
-        .catch(function (e) {
-          _result(e)
-        })
-      } else if (event.target.matches('#api-keys-form')) {
-        WonderfulFetch(serverApiURL, {
-          method: 'POST',
-          timeout: 30000,
-          response: 'json',
-          tries: 2,
-          body: {
-            authenticationToken: token,
-            command: 'user:regenerate-api-keys',
-          },
-        })
-        .then(function (data) {
-          console.log('Api keys', data);
-          document.getElementById('apiKeys_private').value = data.privateKey;
-          HSCore.components.HSClipboard.init('.js-clipboard')
-          _result()
-          setTimeout(function () {
-            alert('Your API keys have been regenerated. Make sure to use the new keys in your applications.')
-          }, 10);
-        })
-        .catch(function (e) {
-          _result(e)
-        })
-      }
-    }
-
-    function toast(type, message) {
-      var $el = document.getElementById('toast-main');
-      $el.classList.remove('bg-primary', 'bg-danger', 'bg-success');
-      var $toast;
-
-      // TODO: REMOVE TRY/CATCH WHEN CDN.ITWCREATIVEWORKS.COM IS FIXED
-      try {
-        $toast = bootstrap.Toast.getOrCreateInstance($el, {
-          delay: 5000,
-          autohide: false,
-        })
-      } catch (e) {
-        console.error('Toast', e);
-      }
-
-      var $body = $el.querySelector('.toast-body')
-
-      $toast.hide();
-
-      if (type instanceof Error) {
-        $el.classList.add('bg-danger')
-        $body.innerHTML = type;
-        console.error('Error', type);
-      } else {
-        $body.innerHTML = message;
-        console.log('Toast', message);
-        if (type === 'success') {
-          $el.classList.add('bg-success')
-        } else {
-          $el.classList.add('bg-primary')
-        }
-      }
-
-      setTimeout(function () {
-        $toast.show();
-      }, 300);
-
-    }
-
-    function handleClick(event) {
-      // if (event.target.getAttribute('href') === 'javascript:;' && event.target.getAttribute('target') === '_blank') {
-      //   event.preventDefault();
-      // }
-      var user = firebase.auth().currentUser;
-
-      if (event.target.matches('.auth-link-provider-btn')) {
-        var $el = select(event.target);
-        var provider = event.target.dataset.provider;
-
-        console.log('Linking', provider);
-
-        if (!user) {return}
-
-        user.linkWithPopup(new firebase.auth.OAuthProvider(provider))
-        .then(function (result) {
-          $el.removeClass('auth-link-provider-btn').addClass('auth-unlink-provider-btn').setInnerHTML('Disconnect')
-          toast('success', 'Successfully connected ' + provider + '!')
-        })
-        .catch(function (e) {
-          toast(new Error('Failed to connect ' + provider + ': ' + e.message))
-        })
-      } else if (event.target.matches('.auth-unlink-provider-btn')) {
-        var $el = select(event.target);
-        var provider = event.target.dataset.provider;
-
-        console.log('Unlinking', provider);
-
-        if (!user) {return}
-
-        if (user.providerData.length <= 1) {
-          return toast(new Error('You must have at least one signin method linked to your account'))
-        }
-
-        user.unlink(provider)
-        .then(function (result) {
-          $el.removeClass('auth-unlink-provider-btn').addClass('auth-link-provider-btn').setInnerHTML('Connect')
-          toast('success', 'Successfully disconnected ' + provider + '!')
-        })
-        .catch(function (e) {
-          toast(new Error('Failed to disconnect ' + provider + ': ' + e.message))
-        })
-      } else if (event.target.matches('.auth-signout-all-sessions-btn')) {
-        // console.log('----');
-        var $el = select(event.target);
-
-        $el.setAttribute('disabled', true).addClass('disabled').addClass('text-muted');
-
-        WonderfulFetch(serverApiURL, {
-          method: 'POST',
-          timeout: 30000,
-          response: 'json',
-          tries: 2,
-          body: {
-            authenticationToken: token,
-            command: 'user:sign-out-all-sessions',
-          },
-        })
-        .then(function (data) {
-          window.location.reload();
-          // alert('Successfully signed out of all sessions');
-        })
-        .catch(function (e) {
-          alert('Failed to sign out of all sessions: ' + e.message);
-          $el.removeAttribute('disabled').removeClass('disabled').removeClass('text-muted');
-        })
-      } else if (event.target.matches('.connect-account-btn')) {
-        var provider = event.target.dataset.provider;
-        var action = event.target.dataset.action;
-        var scope = event.target.dataset.scope;
-        var $el = select(event.target);
-        var $identity = select('.connect-account-identity[data-provider="' + provider + '"]');
-
-        try {
-          scope = JSON.parse(decodeURIComponent(scope))
-        } catch (e) {
-          console.warn('Could not parse scopes', scope, e);
-          scope = []
-        }
-
-        $el.setAttribute('disabled', true).addClass('disabled');
-
-        function _enable() {
-          $el.removeAttribute('disabled').removeClass('disabled')
-        }
-
-        console.log('Building url:', provider, action, scope);
-
-        WonderfulFetch(serverApiURL, {
-          method: 'POST',
-          timeout: 30000,
-          response: 'json',
-          tries: 2,
-          body: {
-            authenticationToken: token,
-            command: 'user:oauth2',
-            payload: {
-              redirect: false,
-              provider: provider,
-              state: action === 'connect' ? 'authorize' : 'deauthorize',
-              scope: scope,
-              serverUrl: serverApiURL,
-              referrer: window.location.href,
-            }
-          },
-        })
-        .then(function (response) {
-          console.log('response', response);
-          if (action === 'connect') {
-            console.log('response.url', response.url);
-            setTimeout(function () {
-              window.location.href = response.url;
-            }, 1000);
-          } else {
-            $el.setAttribute('data-action', 'connect').setInnerHTML('Connect')
-            $identity.setInnerHTML('')
-            _enable()
-          }
-        })
-        .catch(function (e) {
-          console.error('Fetch failed', e);
-          alert('Fetch failed:' + e)
-          _enable()
-        })
-
-      }
-    }
-
-    function getAvailableProviders() {
-      return new Promise(function(resolve, reject) {
-          WonderfulFetch(serverApiURL, {
-            method: 'POST',
-            timeout: 30000,
-            response: 'json',
-            tries: 2,
-            body: {
-              command: 'firebase:get-providers',
-              payload: {},
-            },
-          })
-          .then(function (data) {
-            providerData = data;
-
-            console.log('Providers', providerData);
-
-            return resolve(data)
-          })
-          .catch(function (e) {
-            console.error('Failed to get providers', e);
-
-            return resolve({});
-          })
-      });
-    }
-
-    function getSessions() {
-      var user = Manager.auth().getUser();
-      return new Promise(function(resolve, reject) {
-        WonderfulFetch(serverApiURL, {
-          method: 'POST',
-          timeout: 30000,
-          response: 'json',
-          tries: 2,
-          body: {
-            authenticationToken: token,
-            command: 'user:get-active-sessions',
-            payload: {
-              // id: 'app',
-            },
-          },
-        })
-        .then(function (data) {
-          sessionData = data;
-
-          console.log('Session', sessionData);
-
-          return resolve(data)
-        })
-        .catch(function (e) {
-          console.error('Failed to get sessions', e);
-
-          return resolve({});
-        })
-      });
-    }
-
-    function checkOAuth2Connection(provider) {
-      var $button = document.querySelector('.connect-account-btn[data-provider="' + provider + '"]');
-      if (!$button) {
-        return
-      }
-      $button.setAttribute('disabled', true);
-      $button.classList.add('disabled');
-
-      WonderfulFetch(serverApiURL, {
-        method: 'POST',
-        timeout: 30000,
-        response: 'json',
-        tries: 2,
-        body: {
-          authenticationToken: token,
-          command: 'user:oauth2',
-          payload: {
-            removeInvalidTokens: true,
-            provider: provider,
-            state: 'status',
-          }
-        },
-      })
-      .then(function (status) {
-        console.log('provider status', provider, status);
-
-        $button.removeAttribute('disabled');
-        $button.classList.remove('disabled');
-
-        if (status.status === 'connected') {
-          $button.innerText = 'Disconnect'
-          $button.dataset.action = 'disconnect';
-        } else {
-          $button.innerText = 'Connect'
-          $button.dataset.action = 'connect';
-        }
-
-      })
-      .catch(function (e) {
-        console.error('Fetch failed', e);
-      })
-    }
-
-    function display(type, message) {
-      if (type instanceof Error) {
-        console.error(type);
-        toast(type);
-        $spinner.setAttribute('hidden', true);
-      } else if (type === 'success') {
-        $spinner.setAttribute('hidden', true);
-        $accountParent.removeAttribute('hidden');
-      } else {
-        console.log(message);
-      }
-    }
-
-
-  })
-
-  function uppercase(str) {
-    return str.charAt(0).toUpperCase() + str.slice(1);
-  }
-
-  function getNavigatorPlatform() {
-    try {
-      if (navigator.userAgentData && navigator.userAgentData.platform) {
-        return navigator.userAgentData.platform;
-      } else {
-        if (navigator.userAgent.match(/Mac/i)) {
-          return 'mac'
-        } else if (navigator.userAgent.match(/Windows/i)) {
-          return 'windows'
-        } else {
-          return 'linux'
-        }
-      }
-    } catch (e) {
-      console.error('Unable to determine user platform', e);
-      return 'unknown'
-    }
-  }
-
-  function capitalizeFirstLetter(string) {
-    return string.charAt(0).toUpperCase() + string.slice(1);
-  }
-
-  // document.addEventListener('click', function (event) {
-  //   console.log('---1');
-  //   if (event.target.matches('#navbarSettings .nav-link')) {
-  //     console.log('---2');
-  //     event.target.scrollIntoView()
-  //   }
-  // })
-</script>