This commit is contained in:
syuilo 2019-02-26 14:37:17 +09:00
parent 2d516cc059
commit 9adb5c3de8
4 changed files with 24 additions and 22 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="mk-note-detail" tabindex="-1"> <div class="mk-note-detail" tabindex="-1" :class="{ shadow: $store.state.device.useShadow }">
<button <button
class="more" class="more"
v-if="appearNote.reply && appearNote.reply.replyId && conversation.length == 0" v-if="appearNote.reply && appearNote.reply.replyId && conversation.length == 0"
@ -165,10 +165,12 @@ export default Vue.extend({
text-align left text-align left
background var(--face) background var(--face)
border-radius 8px border-radius 8px
box-shadow 0 4px 16px rgba(#000, 0.1)
@media (min-width 500px) &.shadow
box-shadow 0 8px 32px rgba(#000, 0.1) box-shadow 0 4px 16px rgba(#000, 0.1)
@media (min-width 500px)
box-shadow 0 8px 32px rgba(#000, 0.1)
> .fetching > .fetching
padding 64px 0 padding 64px 0
@ -180,7 +182,7 @@ export default Vue.extend({
width 100% width 100%
font-size 1em font-size 1em
text-align center text-align center
color #999 color var(--text)
cursor pointer cursor pointer
background var(--subNoteBg) background var(--subNoteBg)
outline none outline none
@ -289,7 +291,7 @@ export default Vue.extend({
> .location > .location
margin 4px 0 margin 4px 0
font-size 12px font-size 12px
color #ccc color var(--text)
> .map > .map
width 100% width 100%

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="ivaojijs"> <div class="ivaojijs" :class="{ shadow: $store.state.device.useShadow }">
<div class="empty" v-if="notes.length == 0 && !fetching && inited">{{ $t('@.no-notes') }}</div> <div class="empty" v-if="notes.length == 0 && !fetching && inited">{{ $t('@.no-notes') }}</div>
<mk-error v-if="!fetching && !inited" @retry="init()"/> <mk-error v-if="!fetching && !inited" @retry="init()"/>
@ -192,10 +192,12 @@ export default Vue.extend({
overflow hidden overflow hidden
background var(--face) background var(--face)
border-radius 8px border-radius 8px
box-shadow 0 4px 16px rgba(#000, 0.1)
@media (min-width 500px) &.shadow
box-shadow 0 8px 32px rgba(#000, 0.1) box-shadow 0 4px 16px rgba(#000, 0.1)
@media (min-width 500px)
box-shadow 0 8px 32px rgba(#000, 0.1)
> .empty > .empty
padding 16px padding 16px
@ -239,13 +241,7 @@ export default Vue.extend({
padding 32px padding 32px
max-width 400px max-width 400px
text-align center text-align center
color #999 color var(--text)
> [data-icon]
display block
margin-bottom 16px
font-size 3em
color #ccc
> footer > footer
text-align center text-align center
@ -258,7 +254,7 @@ export default Vue.extend({
margin 0 margin 0
padding 16px padding 16px
width 100% width 100%
color #ccc color var(--text)
@media (min-width 500px) @media (min-width 500px)
padding 20px padding 20px

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="header" ref="root"> <div class="header" ref="root" :class="{ shadow: $store.state.device.useShadow }">
<p class="warn" v-if="env != 'production'">{{ $t('@.do-not-use-in-production') }} <a href="/assets/flush.html?force">Flush</a></p> <p class="warn" v-if="env != 'production'">{{ $t('@.do-not-use-in-production') }} <a href="/assets/flush.html?force">Flush</a></p>
<div class="main" ref="main"> <div class="main" ref="main">
<div class="backdrop"></div> <div class="backdrop"></div>
@ -47,7 +47,9 @@ export default Vue.extend({
z-index 1024 z-index 1024
width calc(100% + 16px) width calc(100% + 16px)
padding 0 8px padding 0 8px
box-shadow 0 0px 8px rgba(0, 0, 0, 0.25)
&.shadow
box-shadow 0 0px 8px rgba(0, 0, 0, 0.25)
&, * &, *
user-select none user-select none

View File

@ -59,7 +59,7 @@
</div> </div>
</div> </div>
</header> </header>
<nav v-if="$route.name == 'user'"> <nav v-if="$route.name == 'user'" :class="{ shadow: $store.state.device.useShadow }">
<div class="nav-container"> <div class="nav-container">
<a :data-active="page == 'home'" @click="page = 'home'"><fa icon="home"/> {{ $t('overview') }}</a> <a :data-active="page == 'home'" @click="page = 'home'"><fa icon="home"/> {{ $t('overview') }}</a>
<a :data-active="page == 'notes'" @click="page = 'notes'"><fa :icon="['far', 'comment-alt']"/> {{ $t('timeline') }}</a> <a :data-active="page == 'notes'" @click="page = 'notes'"><fa :icon="['far', 'comment-alt']"/> {{ $t('timeline') }}</a>
@ -315,10 +315,12 @@ export default Vue.extend({
position -webkit-sticky position -webkit-sticky
position sticky position sticky
top 47px top 47px
box-shadow 0 4px 4px var(--mobileUserPageHeaderShadow)
background-color $bg background-color $bg
z-index 2 z-index 2
&.shadow
box-shadow 0 4px 4px var(--mobileUserPageHeaderShadow)
> .nav-container > .nav-container
display flex display flex
justify-content center justify-content center