problems panel: ack dialog

src/sass/_panel-problems.scss

@@ -217,6 +217,11 @@
         flex-direction: row;
         // max-width: 13rem;
 
+        &.compact .problem-statusbar-item {
+          width: 2.5rem;
+          padding: 0.4rem 0.4rem 0.4rem 0.8rem;
+        }
+
         .problem-statusbar-item {
           width: 3rem;
           height: 2rem;
@@ -246,6 +251,26 @@
         }
       }
 
+      .problem-actions {
+        margin-left: 1.6rem;
+      }
+
+      .problem-action-button {
+        &.btn {
+          width: 3rem;
+          height: 2rem;
+
+          background-image: none;
+          background-color: $action-button-color;
+          border: 1px solid darken($action-button-color, 6%);
+          border-radius: 1px;
+
+          &:hover {
+            background-color: darken($action-button-color, 4%);
+          }
+        }
+      }
+
       .problem-details-middle {
         flex: 1 0 auto;
         padding: 0.6rem 1rem;
@@ -288,6 +313,10 @@
         // background: $dark-4;
         color: $text-color-muted;
 
+        &.compact {
+          padding: 0.5rem 1rem;
+        }
+
         .problem-details-right-item {
           margin-bottom: 0.2rem;
         }

src/sass/_variables.dark.scss

@@ -44,3 +44,4 @@ $problems-table-stripe: $dark-3;
 $problem-details-background: $dark-3;
 $problem-statusbar-background: $dark-2;
 $problem-statusbar-muted: $dark-3;
+$action-button-color: #103e66;

src/sass/_variables.light.scss

@@ -43,3 +43,4 @@ $problems-table-stripe: $gray-6;
 $problem-details-background: $gray-6;
 $problem-statusbar-background: $gray-4;
 $problem-statusbar-muted: $gray-5;
+$action-button-color: #103e66;