mirror of
https://github.com/haselkern/Minecraft-ArmorStand.git
synced 2025-05-18 05:55:35 +00:00
Design beginnings
This commit is contained in:
parent
5c5f34dc36
commit
f2bf164431
10 changed files with 71 additions and 4 deletions
45
src/App.vue
45
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>
|
||||
|
|
5
src/components/Card.vue
Normal file
5
src/components/Card.vue
Normal file
|
@ -0,0 +1,5 @@
|
|||
<template>
|
||||
<div class="bg-white rounded-lg m-2 p-2 shadow">
|
||||
<slot/>
|
||||
</div>
|
||||
</template>
|
|
@ -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");
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue