提交 9e102e8a 作者: 方治民

feat: 调整 index page 示例效果

上级 f8b09f09
...@@ -25,4 +25,9 @@ ...@@ -25,4 +25,9 @@
// 全局样式 // 全局样式
@import './common/public.less'; @import './common/public.less';
uni-page-body,
page {
height: 100%;
}
</style> </style>
{ {
"hello": "你好" "hello": "你好, 世界"
} }
<script setup lang="ts"> <script setup lang="ts">
import dayjs from 'dayjs'
const year = ref(dayjs().year())
const title = ref('Hello World') const title = ref('Hello World')
// TODO: 测试接口 // TODO: 测试接口
...@@ -10,34 +13,33 @@ ...@@ -10,34 +13,33 @@
<template> <template>
<view class="content"> <view class="content">
<fui-avatar src="/static/logo.png" radius="14" /> <fui-avatar src="/static/logo.png" radius="14" />
<view class="text-area"> <view class="info">
<text class="title">{{ title }}</text> <text class="title">{{ title }}</text>
<text class="title">{{ $t('app.hello') }}</text>
</view> </view>
<view class="title">{{ $t('app.hello') }}</view> <fui-footer isFixed :text="`Copyright © ${year} YiRing.com`" />
<fui-footer isFixed text="Copyright © 2022 YiRing.com" />
</view> </view>
</template> </template>
<style> <style>
page {
height: 100%;
}
.content { .content {
height: 100%; height: calc(100vh - 100rpx);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.text-area { .info {
display: flex; display: flex;
flex-direction: column;
justify-content: center; justify-content: center;
margin: 50rpx 0 30rpx 0; margin: 50rpx 0 30rpx 0;
} }
.title { .title {
display: flex;
justify-content: center;
font-size: 36rpx; font-size: 36rpx;
color: #8f8f94; color: #8f8f94;
} }
......
src/static/logo.png

3.9 KB | W: | H:

src/static/logo.png

6.9 KB | W: | H:

src/static/logo.png
src/static/logo.png
src/static/logo.png
src/static/logo.png
  • 2-up
  • Swipe
  • Onion skin
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论