diff --git a/app/assets/javascripts/app/services/actionsManager.js b/app/assets/javascripts/app/services/actionsManager.js
index 1953907c3..f23dfd379 100644
--- a/app/assets/javascripts/app/services/actionsManager.js
+++ b/app/assets/javascripts/app/services/actionsManager.js
@@ -202,7 +202,7 @@ class ActionsManager {
     var scope = this.$rootScope.$new(true);
     scope.uuid = uuid;
     scope.content = content;
-    var el = this.$compile( "<revision-preview-modal uuid='uuid' content='content' class='modal'></revision-preview-modal>" )(scope);
+    var el = this.$compile( "<revision-preview-modal uuid='uuid' content='content' class='sk-modal'></revision-preview-modal>" )(scope);
     angular.element(document.body).append(el);
   }
 
diff --git a/app/assets/javascripts/app/services/componentManager.js b/app/assets/javascripts/app/services/componentManager.js
index 5d8fb15aa..a578fc7d2 100644
--- a/app/assets/javascripts/app/services/componentManager.js
+++ b/app/assets/javascripts/app/services/componentManager.js
@@ -765,14 +765,14 @@ class ComponentManager {
     var permissions = dialog.permissions;
     var component = dialog.component;
     var callback = dialog.callback;
-    var el = this.$compile( "<permissions-modal component='component' permissions='permissions' callback='callback' class='modal'></permissions-modal>" )(dialog);
+    var el = this.$compile( "<permissions-modal component='component' permissions='permissions' callback='callback' class='sk-modal'></permissions-modal>" )(dialog);
     angular.element(document.body).append(el);
   }
 
   openModalComponent(component) {
     var scope = this.$rootScope.$new(true);
     scope.component = component;
-    var el = this.$compile( "<component-modal component='component' class='modal'></component-modal>" )(scope);
+    var el = this.$compile( "<component-modal component='component' class='sk-modal'></component-modal>" )(scope);
     angular.element(document.body).append(el);
   }
 
diff --git a/app/assets/javascripts/app/services/syncManager.js b/app/assets/javascripts/app/services/syncManager.js
index 291eaf50c..02596cf7f 100644
--- a/app/assets/javascripts/app/services/syncManager.js
+++ b/app/assets/javascripts/app/services/syncManager.js
@@ -11,7 +11,7 @@ class SyncManager extends SFSyncManager {
     scope.item1 = items[0];
     scope.item2 = items[1];
     scope.callback = callback;
-    var el = this.$compile( "<conflict-resolution-modal item1='item1' item2='item2' callback='callback' class='modal'></conflict-resolution-modal>" )(scope);
+    var el = this.$compile( "<conflict-resolution-modal item1='item1' item2='item2' callback='callback' class='sk-modal'></conflict-resolution-modal>" )(scope);
     angular.element(document.body).append(el);
   }
 
diff --git a/app/assets/stylesheets/app/_notes.scss b/app/assets/stylesheets/app/_notes.scss
index c880e1057..fb659a42a 100644
--- a/app/assets/stylesheets/app/_notes.scss
+++ b/app/assets/stylesheets/app/_notes.scss
@@ -153,6 +153,19 @@
       opacity: 0.6;
     }
 
+    progress {
+      background-color: var(--sn-stylekit-contrast-background-color);
+      color: var(--sn-stylekit-info-color);
+    }
+
+    progress::-webkit-progress-bar {
+      background-color: var(--sn-stylekit-contrast-background-color);
+    }
+
+    progress::-webkit-progress-value {
+      background-color: var(--sn-stylekit-info-color);
+    }
+
     &.selected {
       background-color: var(--sn-stylekit-info-color);
       color: var(--sn-stylekit-info-contrast-color);
@@ -160,7 +173,19 @@
       .pinned {
         color: var(--sn-stylekit-info-contrast-color);
       }
-    }
 
+      progress {
+        background-color: var(--sn-stylekit-secondary-foreground-color);
+        color: var(--sn-stylekit-secondary-background-color);
+      }
+
+      progress::-webkit-progress-bar {
+        background-color: var(--sn-stylekit-secondary-foreground-color);
+      }
+
+      progress::-webkit-progress-value {
+        background-color: var(--sn-stylekit-secondary-background-color);
+      }
+    }
   }
 }
diff --git a/app/assets/templates/directives/permissions-modal.html.haml b/app/assets/templates/directives/permissions-modal.html.haml
index b8522c27c..dc8fb2af3 100644
--- a/app/assets/templates/directives/permissions-modal.html.haml
+++ b/app/assets/templates/directives/permissions-modal.html.haml
@@ -4,18 +4,18 @@
   .sn-component
     .sk-panel
       .sk-panel-header
-        %h1.sk-panel-header-title Activate Extension
+        .sk-panel-header-title Activate Extension
         %a.sk-a.info.close-button{"ng-click" => "deny()"} Cancel
       .sk-panel-content
         .sk-panel-section
           .sk-panel-row
-            %h3
+            .sk-h3
               %strong {{component.name}}
               would like to interact with your
               {{permissionsString()}}
 
           .sk-panel-row
-            %p
+            %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.
       .sk-panel-footer