diff --git a/app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs b/app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs
index 22e8fcb60a3..f8f8ea1cc2e 100644
--- a/app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs
+++ b/app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs
@@ -10,7 +10,6 @@
     </div>
 
     <div class="separator">
-      <hr class="left" />
       <span class="text">
         {{i18n "topic.progress.jump_prompt_or"}}
       </span>
diff --git a/app/assets/stylesheets/common/base/history.scss b/app/assets/stylesheets/common/base/history.scss
index 25154353f91..a17ad25490d 100644
--- a/app/assets/stylesheets/common/base/history.scss
+++ b/app/assets/stylesheets/common/base/history.scss
@@ -15,11 +15,10 @@
     display: inline-block;
     margin-bottom: 5px;
   }
-
+  table.markdown > tbody > tr > td,
   .revision-content {
     width: 47.5%;
     float: left;
-    max-width: 500px; // Safari needs a max-width to prevent overflow issues
 
     &:nth-of-type(2) {
       margin-left: 5%;
diff --git a/app/assets/stylesheets/common/base/modal.scss b/app/assets/stylesheets/common/base/modal.scss
index fbe69ed619e..1e4d8d177ad 100644
--- a/app/assets/stylesheets/common/base/modal.scss
+++ b/app/assets/stylesheets/common/base/modal.scss
@@ -1,3 +1,33 @@
+// Modal wrappers
+
+.modal-outer-container {
+  width: 100%;
+  height: 100%;
+}
+
+.modal-middle-container {
+  display: flex;
+  height: 100%;
+  align-items: center;
+}
+
+.modal-inner-container {
+  box-sizing: border-box;
+  flex: 0 1 auto;
+  margin: 0 auto;
+  max-width: 700px;
+  background-color: $secondary;
+  box-shadow: shadow("modal");
+
+  .select-kit {
+    width: 220px;
+
+    &.tag-chooser {
+      width: 100%;
+    }
+  }
+}
+
 .modal-open {
   .dropdown-menu {
     z-index: z("modal", "dropdown");
@@ -45,6 +75,10 @@
     align-self: flex-start;
     order: 2;
     margin-left: auto;
+    padding-left: 2em;
+    .close {
+      color: $primary-high;
+    }
   }
 }
 
@@ -88,38 +122,6 @@
   }
 }
 
-.modal-outer-container {
-  display: table;
-  table-layout: fixed;
-  width: 100%;
-  height: 100%;
-}
-
-.modal-inner-container {
-  display: table;
-  width: 100%;
-  min-width: 320px;
-  max-width: 700px;
-  margin: 0 auto;
-  background-color: $secondary;
-  background-clip: padding-box;
-  box-shadow: shadow("modal");
-  padding: 1px;
-  box-sizing: border-box;
-
-  @media screen and (min-width: 475px) {
-    min-width: 475px;
-    width: auto;
-  }
-
-  .select-kit {
-    width: 220px;
-
-    &.tag-chooser {
-      width: 100%;
-    }
-  }
-}
 
 .create-account.in .modal-inner-container,
 .login-modal.in .modal-inner-container {
@@ -158,16 +160,6 @@
   }
 }
 
-.modal-footer:before,
-.modal-footer:after {
-  display: table;
-  content: "";
-}
-
-.modal-footer:after {
-  clear: both;
-}
-
 .modal.edit-category-modal {
   .modal-body {
     textarea {
@@ -200,6 +192,7 @@
     width: 100%;
     overflow-y: auto;
     max-height: 400px;
+
     &.full-height-modal {
       max-height: calc(100vh - 150px);
     }
@@ -216,65 +209,8 @@
     .warning {
       color: $danger !important;
     }
-    .json-uploader {
-      .jsfu-shade-container {
-        display: table-row;
-        width: 100%;
-        height: 100%;
-        position: relative;
-      }
-      .jsfu-shade {
-        z-index: z("base");
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background-color: rgba(0, 0, 0, 0.5);
-        .text {
-          color: rgb(255, 255, 255);
-          position: absolute;
-          top: 40%;
-          font-size: $font-up-6;
-          text-align: center;
-          line-height: $line-height-medium;
-          margin-left: auto;
-          margin-right: auto;
-          left: 0;
-          right: 0;
-        }
-      }
-      .jsfu-file {
-        display: table-cell;
-        vertical-align: middle;
-        min-width: 120px;
-      }
-      .jsfu-separator {
-        vertical-align: middle;
-        display: table-cell;
-        font-size: 2.571em;
-        padding-left: 10px;
-        padding-right: 10px;
-      }
-      .jsfu-paste {
-        display: table-cell;
-        width: 100%;
-        textarea {
-          margin-bottom: 0;
-          margin-top: 4px;
-        }
-      }
-    }
-
-    pre {
-      background-color: blend-primary-secondary(5%);
-      max-height: 300px;
-      padding: 0.5em;
-      code {
-        max-height: none;
-      }
-    }
   }
+
   .password-confirmation {
     display: none;
   }
@@ -306,26 +242,17 @@
       display: block;
     }
     .d-modal-cancel {
-      margin-top: 1em;
+      margin: 1em 0 .5em;
     }
     .btn {
       text-align: left;
       font-size: $font-up-2;
       line-height: $line-height-medium;
-      width: auto;
       margin-bottom: 10px;
-      display: block;
-      margin-left: 0 !important; // override needed
       font-weight: bold;
       .topic-title {
-        font-size: $font-0;
         font-weight: normal;
       }
-      &.btn-reply-here {
-        background: $primary-low;
-        text-shadow: none;
-        color: $primary;
-      }
     }
   }
 }
@@ -341,13 +268,7 @@
 .delete-user-modal {
   .modal-footer {
     .btn {
-      font-weight: normal;
-      text-align: left;
-      font-size: $font-0;
-      line-height: $line-height-large;
-      margin-bottom: 10px;
-      display: inline-block;
-      margin-left: 0;
+      line-height: $line-height-medium;
     }
   }
 }
@@ -371,20 +292,7 @@
   }
 }
 
-#invite-modal {
-  overflow: visible;
-
-  label {
-    margin-top: 7px;
-    max-width: 450px;
-  }
-
-  .optional {
-    color: #9e9ea6;
-  }
-}
-
-.permission-list {
+.permission-list { // Category security tab
   list-style: none;
   margin: 0 0 30px;
   padding: 0;
@@ -398,6 +306,7 @@
   }
   .d-icon-times-circle {
     margin-left: 5px;
+    color: $danger;
   }
   li {
     margin-bottom: 10px;
@@ -515,16 +424,9 @@
   }
 }
 
-.modal-button-bar {
-  margin-top: 1em;
-
-  button {
-    margin-right: 0.5em;
-  }
-}
-
 .change-timestamp,
 .poll-ui-builder {
+  max-width: 420px;
   .date-picker {
     min-width: 8em;
   }
@@ -551,67 +453,55 @@
   max-height: 450px;
   .flag-action-type-details {
     width: 100%;
+    max-width: 500px;
     line-height: $line-height-large;
   }
 }
 
 .flag-message {
-  width: 95% !important;
   margin: 0;
 }
 
 .custom-message-length {
-  color: dark-light-choose($primary-low-mid, $secondary-high);
+  color: $primary-medium;
   font-size: $font-down-1;
 }
 
-.edit-category-modal {
-  .secure-category-options {
-    margin: 10px 0 0 16px;
-    .badge-list {
-      margin: 10px 0;
-      li {
-        margin: 0 4px 8px 0;
-        a {
-          color: dark-light-choose($primary-medium, $secondary-medium);
-          cursor: pointer;
-        }
-        a:hover {
-          color: dark-light-choose($primary-medium, $secondary-medium);
-        }
-      }
-    }
-  }
-}
-
 .jump-to-post-modal {
+  .modal-inner-container {
+    max-width: 350px;
+  }
   .modal-body {
+    overflow-y: visible;
     #post-jump,
     .date-picker {
       margin: 0;
       width: 100px;
     }
 
-    .pika-single {
-      position: relative !important;
+    .input-hint-text {
+      color: $primary;
     }
 
     .jump-to-post-control .index {
       color: $primary-medium;
     }
 
+    .jump-to-date-control .input-hint-text {
+        margin-left: 0;
+    }
+
     .separator {
       display: flex;
       align-items: center;
-      margin: 1em auto;
+      margin: .5em auto;
 
-      .left,
-      .right {
+      hr {
         flex: 1 0 0px;
       }
 
       .text {
-        margin: 0 0.5em;
+        margin: 0 0.5em 0 0;
         color: $primary-medium;
       }
     }
@@ -634,13 +524,6 @@
   }
 }
 
-.tabbed-modal {
-  .modal-body {
-    position: relative;
-    height: 350px;
-  }
-}
-
 .modal:not(.has-tabs) {
   .modal-tab {
     position: absolute;
diff --git a/app/assets/stylesheets/desktop/history.scss b/app/assets/stylesheets/desktop/history.scss
index afb62814f6d..196c1b307ca 100644
--- a/app/assets/stylesheets/desktop/history.scss
+++ b/app/assets/stylesheets/desktop/history.scss
@@ -2,7 +2,7 @@
 
 .modal.history-modal {
   .modal-inner-container {
-    max-width: 960px;
+    max-width: $large-width;
   }
   .modal-body {
     height: 70vh;
diff --git a/app/assets/stylesheets/desktop/modal.scss b/app/assets/stylesheets/desktop/modal.scss
index 4d02cb592a8..91b81a66f0a 100644
--- a/app/assets/stylesheets/desktop/modal.scss
+++ b/app/assets/stylesheets/desktop/modal.scss
@@ -1,10 +1,3 @@
-// base styles for every modal popup used in Discourse
-
-.modal-middle-container {
-  display: table-cell;
-  vertical-align: middle;
-}
-
 // Hardcode to be the same as before for now. I would recommend not using bootbox, or finding a way so the html structure can be the same
 .bootbox.modal {
   top: 50%;
@@ -29,10 +22,6 @@
   float: right;
 }
 
-.modal-footer .btn-group .btn + .btn {
-  margin-left: -1px;
-}
-
 .modal-header {
   h3 {
     font-size: $font-up-3;
@@ -42,7 +31,6 @@
 .close {
   font-size: $font-up-3;
   text-decoration: none;
-  color: $primary-high;
   &:visited {
     color: $primary-high;
   }
@@ -56,23 +44,17 @@
   .category-chooser {
     width: 50%;
   }
-
-  .category-combobox {
-    width: 430px;
-  }
 }
 
 .edit-category-modal {
   .modal-body {
     position: relative;
     height: 420px;
-    max-height: 420px;
-    padding-bottom: 0;
   }
 
   .disable_info_wrap {
     .cannot_delete_reason {
-      top: -74px;
+      top: -100px;
       right: 4px;
       max-width: 380px;
       min-width: 300px;
@@ -123,7 +105,7 @@
   }
 
   #move-selected {
-    // prevents content from moving when user selects differnt move options 525px
+    // prevents content from moving when user selects different move options 525px
     // is the same width we set on category edit modal
     width: 525px;
 
@@ -172,17 +154,3 @@
     }
   }
 }
-
-.upload-options {
-  margin-left: 20px;
-  margin-top: 20px;
-}
-.uploaded-avatar {
-  margin-top: 20px;
-}
-
-.uploaded-image-preview {
-  width: 400px;
-  max-height: 150px;
-  margin-bottom: 10px;
-}
diff --git a/app/assets/stylesheets/mobile/modal.scss b/app/assets/stylesheets/mobile/modal.scss
index d46ce0ecd84..cc62fbfbb94 100644
--- a/app/assets/stylesheets/mobile/modal.scss
+++ b/app/assets/stylesheets/mobile/modal.scss
@@ -42,7 +42,6 @@
 
 .close {
   font-size: $font-up-4;
-  color: $primary;
 }
 
 #move-selected {
@@ -81,7 +80,6 @@
 
 .edit-category-modal {
   .modal-body {
-    box-sizing: border-box;
     position: relative;
     height: 350px;
   }