new card action demos (#1003)

src/scss/ui/_buttons.scss

@@ -195,4 +195,50 @@
   .btn-ghost-#{$name} {
     @extend %btn-ghost;
   }
+}
+
+//
+// Action button
+//
+.btn-action {
+  padding: 0;
+  border: 0;
+  color: $text-muted;
+  display: inline-flex;
+  width: 2rem;
+  height: 2rem;
+  align-items: center;
+  justify-content: center;
+  border-radius: $border-radius;
+
+  &:after {
+    content: none;
+  }
+
+  &:focus {
+    outline: none;
+    box-shadow: none;
+  }
+
+  &:hover,
+  &.show {
+    color: $body-color;
+    background: $body-bg;
+  }
+
+  &.show {
+    color: $primary;
+  }
+
+  .icon {
+    margin: 0;
+    width: 1.25rem;
+    height: 1.25rem;
+    font-size: 1.25rem;
+    stroke-width: 1;
+  }
+}
+
+.btn-actions {
+  display: flex;
 }