2020-06-22 17:29:49 +02:00
|
|
|
<template>
|
2020-07-15 22:00:19 +02:00
|
|
|
<div id="app">
|
|
|
|
<picker @images="images = $event"/>
|
|
|
|
<collage :images="images"/>
|
|
|
|
</div>
|
2020-06-22 17:29:49 +02:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts">
|
2020-07-15 22:00:19 +02:00
|
|
|
import {Component, Vue} from "vue-property-decorator";
|
|
|
|
import Picker from "@/components/Picker.vue";
|
|
|
|
import Collage from "@/components/Collage.vue";
|
2020-06-22 17:29:49 +02:00
|
|
|
|
|
|
|
@Component({
|
2020-07-15 22:00:19 +02:00
|
|
|
components: {
|
|
|
|
Picker,
|
|
|
|
Collage
|
|
|
|
},
|
2020-06-22 17:29:49 +02:00
|
|
|
})
|
2020-07-15 22:00:19 +02:00
|
|
|
export default class App extends Vue {
|
|
|
|
private images: ImageBitmap[] = [];
|
|
|
|
}
|
2020-06-22 17:29:49 +02:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<style>
|
2020-07-15 22:00:19 +02:00
|
|
|
html, body {
|
|
|
|
margin: 0 2em;
|
|
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
|
2020-06-22 17:29:49 +02:00
|
|
|
#app {
|
2020-07-15 22:00:19 +02:00
|
|
|
font-family: monospace;
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
justify-content: space-evenly;
|
|
|
|
min-height: 100vh;
|
2020-06-22 17:29:49 +02:00
|
|
|
}
|
|
|
|
</style>
|