kana-bbs/pages/index.vue
2022-01-30 17:37:25 +08:00

73 lines
1.4 KiB
Vue

<template lang="pug">
.index.main-width
article
.card
.content
p 下载 Kana: 400 行代码实现服务端
p 下载 Kana-bbs: 基于 kana 后端使用 Nuxt3 构建的社区论坛程序
p 文档补全计划: 标记任何你感到疑惑的或是不符合直觉之处, 以及你需要却感觉无法轻松实现的功能
.card
.header
span 最新
span 精华
.expnone
nuxt-link.thread-create(to="/thread/create") 发新帖
.content
ThreadList(:data="data")
aside
.card
.content
.bbs-title Kana 开发者论坛
p 基于 node 实现的小型服务端
</template>
<script>
export default {
asyncData({ $axios }) {
return $axios.get("/api/thread").then((res) => {
return { data: res.data };
});
},
};
</script>
<style lang="sass">
// 基本布局
.index
display: flex
article
flex: 75
.card .header
display: flex
.expnone
flex: 1
aside
flex: 25
.card
margin: 1rem .5rem
border-radius: .5rem
overflow: hidden
background-color: #ffffff
box-shadow: 0 6px 22px 0 rgba(0,0,0,.08)
.header
padding: 1rem
border-bottom: 1px solid #ccc
.content
padding: 1rem
.thread-create
border: none
border-radius: .25rem
padding: .5rem 1rem
background-color: #007bff
color: #ffffff
display: block
.bbs-title
font-size: 1.2rem
font-weight: 600
</style>