26 lines
659 B
Vue
26 lines
659 B
Vue
<template>
|
|
<!-- todo use javascript media breakpoint instead of display classes so we dont double-render the slot -->
|
|
<div>
|
|
<!-- tablets and desktops get a card outline -->
|
|
<v-card class="d-none d-sm-block phone-card" :elevation="4" :title="title">
|
|
<slot/>
|
|
</v-card>
|
|
<!-- phones use the entire screen -->
|
|
<div class="d-sm-none pa-0">
|
|
<v-card-title>{{title}}</v-card-title>
|
|
<slot class="pa-0"/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {useStore} from "@/store/store";
|
|
const s = useStore()
|
|
const props = defineProps(['title'])
|
|
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@use "src/styles/vars" as *;
|
|
</style>
|