61 lines
1.1 KiB
Vue
61 lines
1.1 KiB
Vue
<template>
|
|
<div class="tui-root-layout">
|
|
<slot></slot>
|
|
<copyright :icp="icp" :domain="domain" :author="author" :text="text" />
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { Copyright } from "timi-web";
|
|
|
|
defineOptions({
|
|
name: "RootLayout"
|
|
});
|
|
|
|
withDefaults(defineProps<{
|
|
icp?: string;
|
|
domain?: string;
|
|
author?: string;
|
|
text?: string;
|
|
}>(), {
|
|
});
|
|
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.tui-root-layout {
|
|
border: var(--tui-border);
|
|
margin: 128px 80px 128px 0;
|
|
display: flex;
|
|
min-height: 520px;
|
|
background: WHITE;
|
|
transition: width 240ms var(--tui-bezier), margin 240ms var(--tui-bezier), min-height 240ms var(--tui-bezier);
|
|
box-shadow: var(--tui-shadow);
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
/* 自适应 */
|
|
@media screen and (max-width: 2560px) {
|
|
.tui-root-layout {
|
|
width: 1200px;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1920px) {
|
|
.tui-root-layout {
|
|
width: 900px;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1200px) {
|
|
.tui-root-layout {
|
|
width: 100%;
|
|
margin: 0;
|
|
border: none;
|
|
box-shadow: none;
|
|
min-height: 100vh;
|
|
}
|
|
}
|
|
</style>
|