graphite/Sharkey
1
0
Fork 0
mirror of https://git.joinsharkey.org/Sharkey/Sharkey.git synced 2024-11-23 16:53:08 +02:00
Code Issues Projects Releases Packages Wiki Activity

[Client] 🎨

Browse source
This commit is contained in:
syuilo 2017-06-07 13:53:04 +09:00
parent 9d49f71b48
commit 5a0189ce9b
3 changed files with 19 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/web/app/desktop/tags/notifications.tag
View file

@ -64,7 +64,7 @@
</virtual> </virtual>
</div> </div>
<button class="more" if={ moreNotifications } onclick={ fetchMoreNotifications } disabled={ fetchingMoreNotifications }> <button class="more" if={ moreNotifications } onclick={ fetchMoreNotifications } disabled={ fetchingMoreNotifications }>
{ fetchingMoreNotifications ? '%i18n:common.loading%' : '%i18n:desktop.tags.mk-notifications.more%' } <i class="fa fa-spinner fa-pulse fa-fw" if={ fetchingMoreNotifications }></i>{ fetchingMoreNotifications ? '%i18n:common.loading%' : '%i18n:desktop.tags.mk-notifications.more%' }
</button> </button>
<p class="empty" if={ notifications.length == 0 && !loading }>ありません！</p> <p class="empty" if={ notifications.length == 0 && !loading }>ありません！</p>
<p class="loading" if={ loading }><i class="fa fa-spinner fa-pulse fa-fw"></i>%i18n:common.loading%<mk-ellipsis/></p> <p class="loading" if={ loading }><i class="fa fa-spinner fa-pulse fa-fw"></i>%i18n:common.loading%<mk-ellipsis/></p>
@ -178,6 +178,12 @@
color #555 color #555
border-top solid 1px rgba(0, 0, 0, 0.05) border-top solid 1px rgba(0, 0, 0, 0.05)
&:hover
background rgba(0, 0, 0, 0.025)
&:active
background rgba(0, 0, 0, 0.05)
> .empty > .empty
margin 0 margin 0
padding 16px padding 16px

12
src/web/app/mobile/tags/notifications.tag
View file

@ -1,12 +1,14 @@
<mk-notifications> <mk-notifications>
<div class="notifications" if={ notifications.length != 0 }> <div class="notifications" if={ notifications.length != 0 }>
<virtual each={ notification, i in notifications }> <virtual each={ notification, i in notifications }>
<div>
<mk-notification notification={ notification }></mk-notification> <mk-notification notification={ notification }></mk-notification>
</div>
<p class="date" if={ i != notifications.length - 1 && notification._date != notifications[i + 1]._date }><span><i class="fa fa-angle-up"></i>{ notification._datetext }</span><span><i class="fa fa-angle-down"></i>{ notifications[i + 1]._datetext }</span></p> <p class="date" if={ i != notifications.length - 1 && notification._date != notifications[i + 1]._date }><span><i class="fa fa-angle-up"></i>{ notification._datetext }</span><span><i class="fa fa-angle-down"></i>{ notifications[i + 1]._datetext }</span></p>
</virtual> </virtual>
</div> </div>
<button class="more" if={ moreNotifications } onclick={ fetchMoreNotifications } disabled={ fetchingMoreNotifications }> <button class="more" if={ moreNotifications } onclick={ fetchMoreNotifications } disabled={ fetchingMoreNotifications }>
{ fetchingMoreNotifications ? '%i18n:common.loading%' : '%i18n:mobile.tags.mk-notifications.more%' } <i class="fa fa-spinner fa-pulse fa-fw" if={ fetchingMoreNotifications }></i>{ fetchingMoreNotifications ? '%i18n:common.loading%' : '%i18n:mobile.tags.mk-notifications.more%' }
</button> </button>
<p class="empty" if={ notifications.length == 0 && !loading }>%i18n:mobile.tags.mk-notifications.empty%</p> <p class="empty" if={ notifications.length == 0 && !loading }>%i18n:mobile.tags.mk-notifications.empty%</p>
<p class="loading" if={ loading }><i class="fa fa-spinner fa-pulse fa-fw"></i>%i18n:common.loading%<mk-ellipsis/></p> <p class="loading" if={ loading }><i class="fa fa-spinner fa-pulse fa-fw"></i>%i18n:common.loading%<mk-ellipsis/></p>
@ -16,15 +18,17 @@
background #fff background #fff
> .notifications > .notifications
margin 0 auto
max-width 500px
> mk-notification > div
border-bottom solid 1px rgba(0, 0, 0, 0.05) border-bottom solid 1px rgba(0, 0, 0, 0.05)
&:last-child &:last-child
border-bottom none border-bottom none
> mk-notification
margin 0 auto
max-width 500px
> .date > .date
display block display block
margin 0 margin 0

3
src/web/app/reset.styl
View file

@ -34,6 +34,9 @@ button
* *
pointer-events none pointer-events none
&[disabled]
cursor default
pre pre
overflow auto overflow auto
white-space pre white-space pre