button component

src/components.css

@@ -1,5 +1,7 @@
 /* --- Component Structural Styles --- */
-mc-world, mc-timeline, mc-camera, mc-frame { display: none; }
+mc-world, mc-timeline, mc-camera, mc-frame {
+    display: none;
+}
 
 mc-diorama {
     display: block;
@@ -255,6 +257,7 @@ mc-diorama {
         opacity: 1;
         pointer-events: auto;
     }
+
     & .visualizer-ui {
         pointer-events: auto;
     }

src/style.css

@@ -6,7 +6,7 @@
     unicode-range: U+0000-007F;
 }
 
-h1, h2, h3, h4, h5, h6, nav li {
+h1, h2, h3, h4, h5, h6, nav li, .btn {
     font-family: "Mojangles", sans-serif;
 }
 
@@ -91,4 +91,21 @@ table {
     td {
         vertical-align: text-top;
     }
-}
+}
+
+
+.btn {
+    padding: 0.5ch 2ch;
+    display: inline-block;
+    text-shadow: 1.20pt 1.20pt 0 #333;
+    border-image-source: url("/assets/minecraft/textures/gui/sprites/widget/button.png");
+    border-image-width: 2.4pt 2.4pt 3.6pt 2.4pt;
+    border-image-slice: 2 2 3 2 fill;
+    border-image-repeat: repeat;
+    image-rendering: pixelated;
+    /*border-image-slice: calc(3 / 200 * 100%) calc(2 / 20 * 100%);*/
+}
+
+.btn:hover {
+    border-image-source: url("/assets/minecraft/textures/gui/sprites/widget/button_highlighted.png");
+}