mirror of
https://github.com/lubosz/overte.git
synced 2025-04-23 20:54:25 +02:00
First prototype styling and layout.
This commit is contained in:
Kasen IO
parent
243309fdc4
commit
3f4b3c4b36
6 changed files with 37049 additions and 0 deletions
171
scripts/system/inventory/inventory.html
Normal file
171
scripts/system/inventory/inventory.html
Normal file
|
|
@ -0,0 +1,171 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css" rel="stylesheet">
|
||||
<!-- <link href="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.min.css" rel="stylesheet"> -->
|
||||
<link href="./styles/vuetify.css" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
|
||||
</head>
|
||||
<body>
|
||||
<div id="inventoryApp">
|
||||
<v-app>
|
||||
<v-app-bar
|
||||
app
|
||||
>
|
||||
<v-app-bar-nav-icon @click="drawer = true"></v-app-bar-nav-icon>
|
||||
|
||||
<v-toolbar-title>Inventory</v-toolbar-title>
|
||||
</v-app-bar>
|
||||
|
||||
<v-navigation-drawer
|
||||
v-model="drawer"
|
||||
absolute
|
||||
temporary
|
||||
>
|
||||
<v-list
|
||||
nav
|
||||
dense
|
||||
>
|
||||
<v-list-item-group
|
||||
active-class="deep-purple--text text--accent-4"
|
||||
>
|
||||
<v-list-item>
|
||||
<v-list-item-icon>
|
||||
<v-icon>mdi-home</v-icon>
|
||||
</v-list-item-icon>
|
||||
<v-list-item-title>Home</v-list-item-title>
|
||||
</v-list-item>
|
||||
|
||||
<v-list-item>
|
||||
<v-list-item-icon>
|
||||
<v-icon>mdi-account</v-icon>
|
||||
</v-list-item-icon>
|
||||
<v-list-item-title>Account</v-list-item-title>
|
||||
</v-list-item>
|
||||
|
||||
</v-list-item-group>
|
||||
</v-list>
|
||||
</v-navigation-drawer>
|
||||
<v-content>
|
||||
<v-container fluid>
|
||||
<v-data-iterator
|
||||
:items="items"
|
||||
hide-default-footer
|
||||
>
|
||||
<template>
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="item in items"
|
||||
:key="item.name"
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
lg="3"
|
||||
>
|
||||
<v-card
|
||||
class="mx-auto"
|
||||
max-width="344"
|
||||
outlined
|
||||
>
|
||||
<v-list-item three-line>
|
||||
<v-list-item-content>
|
||||
<div class="overline mb-4">{{item.type}}</div>
|
||||
<v-list-item-title class="headline mb-1">{{item.name}}</v-list-item-title>
|
||||
<!-- <v-list-item-subtitle>Greyhound divisely hello coldly fonwderfully</v-list-item-subtitle> -->
|
||||
</v-list-item-content>
|
||||
|
||||
<v-list-item-avatar
|
||||
size="80"
|
||||
color="blue"
|
||||
>
|
||||
<v-icon x-large dark>mdi-code-tags</v-icon>
|
||||
</v-list-item-avatar>
|
||||
</v-list-item>
|
||||
|
||||
<v-card-actions>
|
||||
<v-btn text>Share</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn text :href="item.url">Load</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
</v-data-iterator>
|
||||
</v-container>
|
||||
</v-content>
|
||||
</v-app>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@2.x/dist/vue.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.js"></script>
|
||||
<script>
|
||||
|
||||
var vue_this;
|
||||
|
||||
|
||||
new Vue({
|
||||
el: '#inventoryApp',
|
||||
vuetify: new Vuetify(),
|
||||
data: () => ({
|
||||
items: [
|
||||
{
|
||||
"type": "script",
|
||||
"name": "VRGrabScale",
|
||||
"url": "https://google.com/vr.js",
|
||||
},
|
||||
{
|
||||
"type": "script",
|
||||
"name": "VRGrabScale",
|
||||
"url": "https://google.com/vr.js",
|
||||
},
|
||||
{
|
||||
"type": "script",
|
||||
"name": "TEST",
|
||||
"url": "https://google.com/vr.js",
|
||||
},
|
||||
{
|
||||
"type": "script",
|
||||
"name": "TEST",
|
||||
"url": "https://google.com/vr.js",
|
||||
},
|
||||
{
|
||||
"type": "script",
|
||||
"name": "TEST",
|
||||
"url": "https://google.com/vr.js",
|
||||
},
|
||||
{
|
||||
"type": "script",
|
||||
"name": "TEST",
|
||||
"url": "https://google.com/vr.js",
|
||||
},
|
||||
{
|
||||
"type": "script",
|
||||
"name": "TEST",
|
||||
"url": "https://google.com/vr.js",
|
||||
},
|
||||
{
|
||||
"type": "script",
|
||||
"name": "TEST",
|
||||
"url": "https://google.com/vr.js",
|
||||
},
|
||||
],
|
||||
iconType: {
|
||||
script: "mdi-code-tags",
|
||||
|
||||
},
|
||||
darkTheme: true,
|
||||
drawer: false,
|
||||
}),
|
||||
created: function () {
|
||||
vue_this = this;
|
||||
this.$vuetify.theme.dark = this.darkTheme;
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
0
scripts/system/inventory/inventory.js
Normal file
0
scripts/system/inventory/inventory.js
Normal file
3
scripts/system/inventory/styles/materialdesignicons.min.css
vendored
Normal file
3
scripts/system/inventory/styles/materialdesignicons.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
24904
scripts/system/inventory/styles/vuetify.css
Normal file
24904
scripts/system/inventory/styles/vuetify.css
Normal file
File diff suppressed because it is too large
Load diff
6
scripts/system/inventory/vue.min.js
vendored
Normal file
6
scripts/system/inventory/vue.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
11965
scripts/system/inventory/vue_dev.js
Normal file
11965
scripts/system/inventory/vue_dev.js
Normal file
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue