Garmelon/showbits
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add calendar segment

Browse source
This commit is contained in:
Joscha 2025-03-03 14:52:32 +01:00
parent b0353dc334
commit 020daf8a16
2 changed files with 97 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

15
showbits-thermal-printer-ui/src/components/CSegment.vue
View file

@ -1,18 +1,21 @@
<script setup lang="ts">
import { ref } from "vue";
import CSegmentCalendar from "./CSegmentCalendar.vue";
import CSegmentText from "./CSegmentText.vue";
const mode = ref<"text">();
const mode = ref<"calendar" | "text">();
</script>
<template>
<div class="outer">
<button v-if="mode" class="close" @click="mode = undefined">X</button>
<CSegmentCalendar v-if="mode === 'calendar'" />
<CSegmentText v-if="mode === 'text'" />
<section v-else class="choose">
<hr v-if="mode !== undefined" />
<section>
<p>What do you want to print?</p>
<div class="list">
<button @click="mode = 'text'">Calendar</button>
<button @click="mode = 'calendar'">Calendar</button>
<button @click="mode = 'text'">Cellular Automaton</button>
<button @click="mode = 'text'">Chat Message</button>
<button @click="mode = 'text'">Easter Egg</button>
@ -55,6 +58,12 @@ const mode = ref<"text">();
background-color: #666;
}
hr {
border: none;
border-top: 2px groove white;
margin: 32px -32px;
}
p {
margin-bottom: 1ch;
}