Component view app bar layout adjustments, adds noopener rel to links

app/assets/stylesheets/app/_editor.scss

@@ -88,7 +88,7 @@ $heading-height: 75px;
       iframe {
         height: 50px;
         width: 100%;
-        position: absolute;
+        position: absolute; // Required for autocomplete window to show
       }
     }
 

app/assets/stylesheets/app/_main.scss

@@ -6,6 +6,8 @@ $z-index-dropdown-menu: 100;
 $z-index-resizer-overlay: 1000;
 $z-index-panel-resizer: 1001;
 
+$z-index-component-view: 1000;
+
 $z-index-footer-bar: 2000;
 $z-index-footer-bar-item: 2000;
 $z-index-footer-bar-item-panel: 2000;
@@ -188,7 +190,6 @@ $footer-height: 32px;
     }
 
     .section-title-bar {
-     font-weight: bold;
 
      .padded {
        padding: 0 14px;

app/assets/stylesheets/app/_modals.scss

@@ -180,6 +180,7 @@
 
   .sn-component {
     min-width: 100%;
+    z-index: $z-index-component-view;
   }
 
   .loading-overlay {

app/assets/stylesheets/app/_stylekit-sub.scss

@@ -19,6 +19,14 @@
 
 
   .sk-app-bar {
+
+    &.dynamic-height {
+      min-height: 2rem !important;
+      height: inherit !important;
+      padding-top: 0.5rem;
+      padding-bottom: 0.5rem;
+    }
+
     &.no-top-edge {
       border-top: 0;
     }

app/assets/templates/directives/account-menu.html.haml

@@ -39,7 +39,7 @@
                 %input.sk-input{"type" => "checkbox", "ng-model" => "formData.strictSignin"}
                   Use strict sign in
                   %span
-                    %a{"href" => "https://standardnotes.org/help/security", "target" => "_blank"} (Learn more)
+                    %a{"href" => "https://standardnotes.org/help/security", "target" => "_blank", "rel" => "noopener"} (Learn more)
 
           .sk-panel-section.form-submit{"ng-if" => "!formData.authenticating"}
             .sk-button-group.stretch
@@ -85,7 +85,7 @@
           .sk-notification.danger{"ng-if" => "syncStatus.error"}
             .sk-notification-title Sync Unreachable
             .sk-notification-text Hmm...we can't seem to sync your account. The reason: {{syncStatus.error.message}}
-            %a.sk-a.info-contrast.sk-bold.sk-panel-row{"href" => "https://standardnotes.org/help", "target" => "_blank"} Need help?
+            %a.sk-a.info-contrast.sk-bold.sk-panel-row{"href" => "https://standardnotes.org/help", "target" => "_blank", "rel" => "noopener"} Need help?
 
           .sk-panel-row
             .sk-panel-column

app/assets/templates/directives/actions-menu.html.haml

@@ -1,7 +1,7 @@
 .sn-component
   .sk-menu-panel.dropdown-menu
 
-    %a.no-decoration{"ng-if" => "extensions.length == 0", "href" => "https://standardnotes.org/extensions", "target" => "blank"}
+    %a.no-decoration{"ng-if" => "extensions.length == 0", "href" => "https://standardnotes.org/extensions", "target" => "blank", "rel" => "noopener"}
       %menu-row{"label" => "'Download Actions'"}
 
     %div{"ng-repeat" => "extension in extensions"}

app/assets/templates/directives/component-view.html.haml

@@ -1,14 +1,15 @@
 .sn-component{"ng-if" => "issueLoading"}
-  .sk-app-bar.no-edges.no-top-edge
+  .sk-app-bar.no-edges.no-top-edge.dynamic-height
     .left
       .sk-app-bar-item
         .sk-label.warning There was an issue loading {{component.name}}.
     .right
       .sk-app-bar-item{"ng-click" => "reloadComponent()"}
-        .sk-label.info Reload
+        .sk-button.info
+          .sk-label Reload
 
 .sn-component{"ng-if" => "showNoThemesMessage"}
-  .sk-app-bar.no-edges.no-top-edge
+  .sk-app-bar.no-edges.no-top-edge.dynamic-height
     .left
       .sk-app-bar-item
         .sk-label.warning This extension does not support themes.
@@ -19,22 +20,25 @@
         .sk-label Disable Active Theme
 
 .sn-component{"ng-if" => "expired"}
-  .sk-app-bar.no-edges.no-top-edge
+  .sk-app-bar.no-edges.no-top-edge.dynamic-height
     .left
       .sk-app-bar-item
         .sk-app-bar-item-column
           .sk-circle.danger.small
         .sk-app-bar-item-column
-          %a.sk-label.sk-base{"href" => "https://dashboard.standardnotes.org", "target" => "_blank"}
+          %div
-            Your Extended subscription expired on {{component.dateToLocalizedString(component.valid_until)}}.
+            %a.sk-label.sk-base{"href" => "https://dashboard.standardnotes.org", "target" => "_blank", "rel" => "noopener"}
-            Extensions are in a read-only state.
+              Your Extended subscription expired on {{component.dateToLocalizedString(component.valid_until)}}.
+            .sk-p
+              Extensions are in a read-only state.
     .right
-      .right
+      .sk-app-bar-item{"ng-click" => "reloadComponent()"}
-        .sk-app-bar-item{"ng-click" => "reloadComponent()"}
+        .sk-button.info
-          .sk-label.info Reload
+          .sk-label Reload
       .sk-app-bar-item
         .sk-app-bar-item-column
-          %a.sk-label{"href" => "https://standardnotes.org/help", "target" => "_blank"} Help
+          .sk-button.warning
+            %a.sk-label{"href" => "https://standardnotes.org/help", "target" => "_blank", "rel" => "noopener"} Help
 
 .sn-component{"ng-if" => "error == 'offline-restricted'"}
   .sk-panel.static

app/assets/templates/directives/editor-menu.html.haml

@@ -13,5 +13,5 @@
           %strong.danger.medium-text{"ng-if" => "editor.content.conflict_of"} Conflicted copy
           .sk-sublabel{"ng-if" => "shouldDisplayRunningLocallyLabel(editor)"} Running Locally
 
-      %a.no-decoration{"ng-if" => "editors.length == 0", "href" => "https://standardnotes.org/extensions", "target" => "blank"}
+      %a.no-decoration{"ng-if" => "editors.length == 0", "href" => "https://standardnotes.org/extensions", "target" => "blank", "rel" => "noopener"}
         %menu-row{"label" => "'Download More Editors'"}

app/assets/templates/directives/password-wizard.html.haml

@@ -22,7 +22,7 @@
                 .sk-panel-row
                   .sk-panel-column
                     %p.sk-p For more information about security updates, please visit
-                    %a.sk-a.info{"href" => "https://standardnotes.org/help/security", "target" => "_blank"} standardnotes.org/help/security.
+                    %a.sk-a.info{"href" => "https://standardnotes.org/help/security", "target" => "_blank", "rel" => "noopener"} standardnotes.org/help/security.
 
               %p.sk-panel-row.sk-p
                 .info Press Continue to proceed.

app/assets/templates/directives/permissions-modal.html.haml

@@ -17,7 +17,7 @@
           .sk-panel-row
             %p.sk-p
               Extensions use an offline messaging system to communicate. Learn more at
-              %a.sk-a.info{"href" => "https://standardnotes.org/permissions", "target" => "_blank"} https://standardnotes.org/permissions.
+              %a.sk-a.info{"href" => "https://standardnotes.org/permissions", "target" => "_blank", "rel" => "noopener"} https://standardnotes.org/permissions.
       .sk-panel-footer
         .sk-button.info.big.block.bold{"ng-click" => "accept()"}
           .sk-label Continue

app/assets/templates/footer.html.haml

@@ -10,7 +10,7 @@
         %account-menu{"ng-click" => "$event.stopPropagation()", "ng-if" => "ctrl.showAccountMenu", "on-successful-auth" => "ctrl.onAuthSuccess", "close-function" => "ctrl.closeAccountMenu"}
 
       .sk-app-bar-item
-        %a.no-decoration.sk-label.title{"href" => "https://standardnotes.org/help", "target" => "_blank"}
+        %a.no-decoration.sk-label.title{"href" => "https://standardnotes.org/help", "target" => "_blank", "rel" => "noopener"}
           Help
 
       .sk-app-bar-item.border