ConfigView component (mockup content)

This commit is contained in:
Jörn-Michael Miehe 2023-09-10 03:10:22 +00:00
parent 8389ceb14a
commit 5b5d85e9d9
2 changed files with 96 additions and 0 deletions

View file

@ -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,
},

View 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>