From f2bf1644316162b070291b6dd6dc52551af66729 Mon Sep 17 00:00:00 2001
From: Lars Martens <lars@martens.red>
Date: Sat, 12 Dec 2020 21:17:42 +0100
Subject: [PATCH] Design beginnings

---
 package-lock.json       |  10 +++++++++
 package.json            |   2 ++
 public/favicon.ico      | Bin 4286 -> 0 bytes
 public/favicon.png      | Bin 0 -> 360 bytes
 public/index.html       |   2 +-
 src/App.vue             |  45 ++++++++++++++++++++++++++++++++++++++--
 src/components/Card.vue |   5 +++++
 src/main.js             |   1 +
 tailwind.config.js      |   8 +++++++
 vue.config.js           |   2 +-
 10 files changed, 71 insertions(+), 4 deletions(-)
 delete mode 100644 public/favicon.ico
 create mode 100644 public/favicon.png
 create mode 100644 src/components/Card.vue
 create mode 100644 tailwind.config.js

diff --git a/package-lock.json b/package-lock.json
index 43b38cc..f045ca3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1034,6 +1034,11 @@
         "to-fast-properties": "^2.0.0"
       }
     },
+    "@fortawesome/fontawesome-free": {
+      "version": "5.15.1",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-5.15.1.tgz",
+      "integrity": "sha512-OEdH7SyC1suTdhBGW91/zBfR6qaIhThbcN8PUXtXilY4GYnSBbVqOntdHbC1vXwsDnX0Qix2m2+DSU1J51ybOQ=="
+    },
     "@fullhuman/postcss-purgecss": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-3.0.0.tgz",
@@ -12069,6 +12074,11 @@
         "neo-async": "^2.6.0"
       }
     },
+    "three": {
+      "version": "0.123.0",
+      "resolved": "https://registry.npmjs.org/three/-/three-0.123.0.tgz",
+      "integrity": "sha512-KNnx/IbilvoHRkxOtL0ouozoDoElyuvAXhFB21RK7F5IPWSmqyFelICK6x3hJerLNSlAdHxR0hkuvMMhH9pqXg=="
+    },
     "through": {
       "version": "2.3.8",
       "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
diff --git a/package.json b/package.json
index 9f32ee2..da1b9be 100644
--- a/package.json
+++ b/package.json
@@ -8,10 +8,12 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "@fortawesome/fontawesome-free": "^5.15.1",
     "autoprefixer": "^9.8.6",
     "core-js": "^3.6.5",
     "postcss": "^7.0.35",
     "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.0.1",
+    "three": "^0.123.0",
     "vue": "^3.0.0"
   },
   "devDependencies": {
diff --git a/public/favicon.ico b/public/favicon.ico
deleted file mode 100644
index df36fcfb72584e00488330b560ebcf34a41c64c2..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4286
zcmds*O-Phc6o&64GDVCEQHxsW(p4>LW*W<827=Unuo8sGpRux(DN@jWP-e29Wl%wj
zY84_aq9}^Am9-cWTD5GGEo#+5Fi2wX_P*bo+xO!)p*7B;iKlbFd(U~_d(U?#hLj56
zPhFkj-|A6~Qk#@g^#D^U0XT1cu=c-vu1+SElX9NR;kzAUV(q0|dl0|%h|dI$%VICy
zJnu2^L*Te9JrJMGh%-P79CL0}dq92RGU6gI{v2~|)p}sG5x0U*z<8U;Ij*hB9z?ei
z@g6Xq-pDoPl=MANPiR7%172VA%r)kev<ISBgE$F{SFy+(=9Z)f)De0Se}ZDZW}Z3B
zElCeVrw;K0Fdl_Cg=gZOFXXc3pL)Q05CAuT+XucQ<8g~3dteP~|7s7c6QYP;fy;mF
zMN;>tV-_5H*QJKFmd;8yA$98zCxBZYXTNZ#QFk2(TX0;Y2dt&WitL#$96|gJY=3xX
zpCoi|YNzgO3R`f@IiEeSmKrPSf#h#Qd<$%Ej^RIeeYfsxhPMOG`S`Pz8q``=511zm
zAm)MX5AV^5xIWPyEu7u>qYs?pn$I4nL9J!=K=SGlKLXpE<5x+2cDTXq?brj?n6sp=
zphe9;_JHf40^9~}9i08r{XM$7HB!`{Ys~TK0kx<}ZQng`UPvH*11|q7&l9?@FQz;8
zx!=3<4seY*%=OlbCbcae?<QnEgvj4i?s}Yk=qA2z`-^*<eK3c)MS4JOdbsTQEOa0)
z0NWqlna2rzs>5^V_}*K>Uo6ZWV8mTyE^B=DKy7-sdLYkR5Z?paTgK-zyIkKjIcpyO
z{+uIt&YSa_$QnN_@t~L014dyK(fOOo+W*MIxbA6Ndgr=Y!f#Tokqv}n<7-9qfHkc3
z=>a|HWqcX8fzQCT=dqVbogRq!-S>H%yA{1w#2Pn;=e>JiEj7Hl;zdt-2f+j2%DeVD
zsW0Ab)ZK@0cIW%W7<X*Er!BfRbvU93$DH%#v6dRt^6HBxz1xBNHx=$&_Gv<&J}Ljk
zJN<Fzx(`Oe@KgQ0F$<14=XV#WK`o#6Ku>z}H{&~yGhn~D;aiP4=;m-HCo`BEI+Kd6
z={Xwx{T<?%b6i9IjI)Ls)S{-*mq<@~R{?$}ZKjf;^k75i_}(2MXt}^SEBVg7AI@28
zo_uPg2V)_e-`2Ois=PYoe%9u*n9({PFR)OnHJPi{dNx>Kx<YG`4QQ>D#iCLfl2<BD
h7L=-;Q>vQGDitKtN>z|-AdCN|$jTFDg0m3O`WLD4_s#$S

diff --git a/public/favicon.png b/public/favicon.png
new file mode 100644
index 0000000000000000000000000000000000000000..a1e658368872a9f4c25d5a2fe5150397dc7913d4
GIT binary patch
literal 360
zcmV-u0hj)XP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F80003mNkl<ZSi|L(
ztxm&W6o#J>63V(DSP(O0rokX)FbmbKMj)no0m~%2fEl;|JXe5bdIXInb2Aep2$GJX
zifB%<e(BOblJ@J4J84DFd*1iyfr8}@t<W7>Atmd8itDh*<Nzc05&(bm8v-oeSFQa}
zK<f15_+LJt{tE1J`f~jVfZ0AueDCFL+0t79)$Qu;zrKF}7~fvS6tQ||xzbU&0;zkl
z2j{Wf-Z&QkJkLK8d#S8ksDBD%67fXW?8Kg{eO@B!M?y(~<i9Kt^;1CdzpK|yfmFwe
z`yIQV=zj5lkWhHg91d*#)xvG|KRmqxF!inrO|EYWWY>*JL2d=a{rgKobz;>M%_X5X
znMJpr??)amO#lqT03Zkg03Pq}^dezqYN@wj+6ASJ2mSyp-)om>U7bS!0000<MNUMn
GLSTXvmY`q&

literal 0
HcmV?d00001

diff --git a/public/index.html b/public/index.html
index b046b91..64d3394 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <link rel="icon" type="image/png" href="<%= BASE_URL %>favicon.png">
     <title>Minecraft Armorstand</title>
 </head>
 <body>
diff --git a/src/App.vue b/src/App.vue
index 026b09c..2d2b509 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,9 +1,50 @@
 <template>
-    <h1>Hello Vue!</h1>
+    <div class="grid grid-cols-5 min-h-screen bg-gray-200">
+        <div class="col-span-3"></div>
+        <div class="col-span-2">
+            <card class="text-center">
+                <h1 class="text-2xl font-bold">Minecraft Armorstand</h1>
+                <a
+                    title="Source Code"
+                    href="https://github.com/haselkern/Minecraft-ArmorStand"
+                    class="inline-flex items-center justify-center w-8 h-8 m-2 text-white bg-gray-700 rounded-lg">
+                    <i class="fas fa-code"></i>
+                </a>
+                <a
+                    title="Help"
+                    href="https://haselkern.com/armorstand/"
+                    class="inline-flex items-center justify-center w-8 h-8 m-2 text-white bg-gray-700 rounded-lg">
+                    <i class="fas fa-question"></i>
+                </a>
+            </card>
+            <card>
+                <h1 class="text-xl">Pose</h1>
+                <table class="w-full">
+                    <tr>
+                        <td>Rotation</td>
+                        <td colspan="3"><input v-model="rotation" class="w-full" type="range" min="0" max="360"></td>
+                    </tr>
+                    <tr>
+                        <td>Head</td>
+                        <td><input class="w-full" type="range" min="0" max="360"></td>
+                        <td><input class="w-full" type="range" min="0" max="360"></td>
+                        <td><input class="w-full" type="range" min="0" max="360"></td>
+                    </tr>
+                </table>
+            </card>
+        </div>
+    </div>
 </template>
 
 <script>
-export default {
+import Card from "./components/Card";
 
+export default {
+    components: {Card},
+    data() {
+        return {
+            rotation: 0,
+        };
+    },
 }
 </script>
diff --git a/src/components/Card.vue b/src/components/Card.vue
new file mode 100644
index 0000000..9e40aa1
--- /dev/null
+++ b/src/components/Card.vue
@@ -0,0 +1,5 @@
+<template>
+    <div class="bg-white rounded-lg m-2 p-2 shadow">
+        <slot/>
+    </div>
+</template>
diff --git a/src/main.js b/src/main.js
index e85a1e3..a45000b 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,5 +1,6 @@
 import { createApp } from "vue";
 import App from "./App.vue";
 import "./assets/tailwind.css";
+import "../node_modules/@fortawesome/fontawesome-free/css/all.css";
 
 createApp(App).mount("#app");
diff --git a/tailwind.config.js b/tailwind.config.js
new file mode 100644
index 0000000..042d3db
--- /dev/null
+++ b/tailwind.config.js
@@ -0,0 +1,8 @@
+module.exports = {
+    purge: [
+      "./src/**/*.vue",
+    ],
+    theme: {},
+    variants: {},
+    plugins: [],
+  }
diff --git a/vue.config.js b/vue.config.js
index 38d1f1d..0a4935e 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -1,5 +1,5 @@
 module.exports = {
     publicPath: process.env.NODE_ENV === 'production'
-        ? '/test/'
+        ? '/Minecraft-ArmorStand/'
         : '/'
 }
\ No newline at end of file