feat: NoJs Admin View (#3059)

Adds a nojs blade template to be able to enable/disable extensions when one of them misbehaves.

framework/core/less/admin.less

@@ -10,4 +10,5 @@
 @import "admin/ExtensionWidget";
 @import "admin/AppearancePage";
 @import "admin/MailPage";
+@import "admin/NoJs";
 @import "admin/UsersListPage.less";

framework/core/less/admin/NoJs.less

@@ -0,0 +1,17 @@
+// Minimal NoJs specific styles
+.NoJs-ExtensionsTable {
+  td&-icon {
+    padding-top: 0;
+    padding-bottom: 0;
+  }
+
+  .ExtensionListItem-Dot {
+    position: relative;
+    right: 0;
+    margin: 0;
+  }
+
+  .ExtensionIcon {
+    --size: 25px;
+  }
+}

framework/core/less/common/Table.less

@@ -0,0 +1,69 @@
+.Table {
+  background: @control-bg;
+  border-radius: @border-radius;
+  border-collapse: collapse;
+  border-spacing: 0;
+
+  caption {
+    text-align: start;
+  }
+
+  td, th {
+    border-bottom: 1px solid @body-bg;
+    color: @control-color;
+  }
+
+  td, th, .Checkbox, &-controls-item {
+    padding: 10px 15px;
+  }
+
+  & &-checkbox, & &-controls {
+    padding: 0;
+  }
+
+  thead {
+    th {
+      text-align: center;
+      padding: 15px 25px;
+    }
+
+    .icon {
+      display: block;
+      font-size: 14px;
+      width: auto;
+      margin-bottom: 5px;
+    }
+  }
+
+  &-groupToggle {
+    cursor: pointer;
+
+    .icon {
+      font-size: 14px;
+      margin-right: 2px;
+      .fa-fw();
+    }
+  }
+
+  &-checkbox {
+    .Checkbox {
+      display: block;
+    }
+
+    .Checkbox-display {
+      text-align: center;
+      cursor: pointer;
+    }
+
+    &.highlighted .Checkbox, .Checkbox:hover {
+      &:not(.disabled) {
+        background: darken(@control-bg, 4%);
+      }
+    }
+  }
+
+  &-controls-item {
+    width: 100%;
+    border-radius: 0;
+  }
+}

framework/core/less/common/common.less

@@ -27,6 +27,7 @@
 @import "Placeholder";
 @import "Search";
 @import "Select";
+@import "Table";
 @import "TextEditor";
 @import "Tooltip";
 @import "ValidationError";

framework/core/less/forum/NotificationGrid.less

@@ -1,52 +1,3 @@
 .NotificationGrid {
-  background: @control-bg;
-  border-radius: @border-radius;
-  border-collapse: collapse;
-  border-spacing: 0;
-
-  td, th {
-    border-bottom: 1px solid @body-bg;
-    color: @control-color;
-  }
-  td, th, .Checkbox {
-    padding: 10px 15px;
-  }
-  .NotificationGrid-checkbox {
-    padding: 0;
-  }
-  thead {
-    th {
-      text-align: center;
-      padding: 15px 25px;
-    }
-    .icon {
-      display: block;
-      font-size: 14px;
-      width: auto;
-      margin-bottom: 5px;
-    }
-  }
-}
-.NotificationGrid-groupToggle {
-  cursor: pointer;
-
-  .icon {
-    font-size: 14px;
-    margin-right: 2px;
-    .fa-fw();
-  }
-}
-.NotificationGrid-checkbox {
-  .Checkbox {
-    display: block;
-  }
-  .Checkbox-display {
-    text-align: center;
-    cursor: pointer;
-  }
-  &.highlighted .Checkbox, .Checkbox:hover {
-    &:not(.disabled) {
-      background: darken(@control-bg, 4%);
-    }
-  }
+  .Table();
 }