ConfigView component (mockup content)
This commit is contained in:
parent
8389ceb14a
commit
5b5d85e9d9
2 changed files with 96 additions and 0 deletions
|
@ -8,6 +8,7 @@
|
|||
</div>
|
||||
|
||||
<div class="section">
|
||||
<ConfigView />
|
||||
<DoorMapEditor />
|
||||
<AdminButton />
|
||||
</div>
|
||||
|
@ -18,10 +19,12 @@
|
|||
import { Options, Vue } from "vue-class-component";
|
||||
|
||||
import AdminButton from "./components/AdminButton.vue";
|
||||
import ConfigView from "./components/ConfigView.vue";
|
||||
import DoorMapEditor from "./components/DoorMapEditor.vue";
|
||||
|
||||
@Options({
|
||||
components: {
|
||||
ConfigView,
|
||||
DoorMapEditor,
|
||||
AdminButton,
|
||||
},
|
||||
|
|
93
ui/src/components/ConfigView.vue
Normal file
93
ui/src/components/ConfigView.vue
Normal file
|
@ -0,0 +1,93 @@
|
|||
<template>
|
||||
<BulmaDrawer header="Konfiguration">
|
||||
<div class="panel-block">
|
||||
<div class="columns" style="width: 100%">
|
||||
<div class="column content">
|
||||
<h4>Rätsel</h4>
|
||||
<dl>
|
||||
<dt>Lösung</dt>
|
||||
<dd>ABCDEFGHIJKLMNOPQRSTUVWX</dd>
|
||||
|
||||
<dt>Reihenfolge</dt>
|
||||
<dd>AGFCINBEWLKQMXDURPOSJVHT</dd>
|
||||
|
||||
<dt>Offene Türchen</dt>
|
||||
<dd>10</dd>
|
||||
|
||||
<dt>Nächstes Türchen in</dt>
|
||||
<dd>dd-hh-mm-ss</dd>
|
||||
|
||||
<dt>Erstes Türchen</dt>
|
||||
<dd>01.12.2023</dd>
|
||||
|
||||
<dt>Letztes Türchen</dt>
|
||||
<dd>24.12.2023</dd>
|
||||
|
||||
<dt>Rätsel schließt</dt>
|
||||
<dd>01.04.2024</dd>
|
||||
|
||||
<dt>Zufalls-Seed</dt>
|
||||
<dd>""</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="column content">
|
||||
<h4>Kalender</h4>
|
||||
<dl>
|
||||
<dt>Definition</dt>
|
||||
<dd>files/default.toml</dd>
|
||||
|
||||
<dt>Hintergrundbild</dt>
|
||||
<dd>files/adventskalender.jpg</dd>
|
||||
|
||||
<dt>Türchen</dt>
|
||||
<dd>0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16</dd>
|
||||
</dl>
|
||||
|
||||
<h4>Bilder</h4>
|
||||
<dl>
|
||||
<dt>Größe</dt>
|
||||
<dd>500 px</dd>
|
||||
|
||||
<dt>Rand</dt>
|
||||
<dd>30 px</dd>
|
||||
|
||||
<dt>Schriftarten</dt>
|
||||
<dd>files/Lena.ttf (Größe 50)</dd>
|
||||
<dd>files/foobar.ttf (Größe 33)</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="column content">
|
||||
<h4>WebDAV</h4>
|
||||
<dl>
|
||||
<dt>URL</dt>
|
||||
<dd>https://example.com/remote.php/webdav/advent22</dd>
|
||||
|
||||
<dt>Login</dt>
|
||||
<dd>*** / ***</dd>
|
||||
|
||||
<dt>Cache-Dauer</dt>
|
||||
<dd>30 s</dd>
|
||||
|
||||
<dt>Konfigurationsdatei</dt>
|
||||
<dd>config.toml</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</BulmaDrawer>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Options, Vue } from "vue-class-component";
|
||||
|
||||
import BulmaDrawer from "./bulma/Drawer.vue";
|
||||
|
||||
@Options({
|
||||
components: {
|
||||
BulmaDrawer,
|
||||
},
|
||||
})
|
||||
export default class extends Vue {}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
Loading…
Reference in a new issue