[Client] 🎨
This commit is contained in:
		
							parent
							
								
									9d49f71b48
								
							
						
					
					
						commit
						5a0189ce9b
					
				
					 3 changed files with 19 additions and 6 deletions
				
			
		| 
						 | 
					@ -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
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -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 }>
 | 
				
			||||||
			<mk-notification notification={ notification }></mk-notification>
 | 
								<div>
 | 
				
			||||||
 | 
									<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
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -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
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue