natty
/
calckey
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

page style

This commit is contained in:
ThatOneCalculator 2022-11-18 17:51:57 -08:00
parent e4a6631fde
commit f7873047cd
2 changed files with 14 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "calckey", "name": "calckey",
"version": "12.119.0-calc.15-beta.3", "version": "12.119.0-calc.15-beta.4",
"codename": "aqua", "codename": "aqua",
"repository": { "repository": {
"type": "git", "type": "git",

27
packages/client/src/pages/page.vue
View File

@ -5,10 +5,12 @@
<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> <transition :name="$store.state.animation ? 'fade' : ''" mode="out-in">
<div v-if="page" :key="page.id" v-size="{ max: [450] }" class="xcukqgmh"> <div v-if="page" :key="page.id" v-size="{ max: [450] }" class="xcukqgmh">
<div class="_block main"> <div class="_block main">
<!--
<div class="header">
<h1>{{ page.title }}</h1>
</div>
-->
<div class="banner"> <div class="banner">
<div class="header">
<h1>{{ page.title }}</h1>
</div>
<img v-if="page.eyeCatchingImageId" :src="page.eyeCatchingImage.url"/> <img v-if="page.eyeCatchingImageId" :src="page.eyeCatchingImage.url"/>
</div> </div>
<div class="content"> <div class="content">
@ -23,14 +25,14 @@
<button v-tooltip="i18n.ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="ph-repeat-bold ph-lg ph-fw ph-lg"></i></button> <button v-tooltip="i18n.ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="ph-repeat-bold ph-lg ph-fw ph-lg"></i></button>
<button v-tooltip="i18n.ts.share" v-click-anime class="_button" @click="share"><i class="ph-share-network-bold ph-lg ph-fw ph-lg"></i></button> <button v-tooltip="i18n.ts.share" v-click-anime class="_button" @click="share"><i class="ph-share-network-bold ph-lg ph-fw ph-lg"></i></button>
</div> </div>
<div class="user"> </div>
<div class="user">
<div class="name">
<MkAvatar :user="page.user" class="avatar"/> <MkAvatar :user="page.user" class="avatar"/>
<div class="name"> <MkUserName :user="page.user" style="display: block;"/>
<MkUserName :user="page.user" style="display: block;"/> <MkAcct :user="page.user"/>
<MkAcct :user="page.user"/>
</div>
<MkFollowButton v-if="!$i || $i.id != page.user.id" :user="page.user" :inline="true" :transparent="false" :full="true" class="koudoku"/>
</div> </div>
<MkFollowButton v-if="!$i || $i.id != page.user.id" :user="page.user" :inline="true" :transparent="false" :full="true" class="koudoku"/>
</div> </div>
<div class="links"> <div class="links">
<MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ i18n.ts._pages.viewSource }}</MkA> <MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ i18n.ts._pages.viewSource }}</MkA>
@ -180,10 +182,6 @@ definePageMetadata(computed(() => page ? {
> .header { > .header {
padding: 16px; padding: 16px;
-webkit-backdrop-filter: var(--blur, blur(10px));
backdrop-filter: var(--blur, blur(10px));
background-color: var(--X16);
border-radius: 999px;
> h1 { > h1 {
margin: 0; margin: 0;
@ -228,6 +226,7 @@ definePageMetadata(computed(() => page ? {
} }
> .other { > .other {
margin-left: auto;
> button { > button {
padding: 8px; padding: 8px;
@ -241,7 +240,7 @@ definePageMetadata(computed(() => page ? {
} }
> .user { > .user {
margin-top: 16px; margin-left: auto;
padding: 16px 0 0 0; padding: 16px 0 0 0;
border-top: solid 0.5px var(--divider); border-top: solid 0.5px var(--divider);
display: flex; display: flex;