tweak style
This commit is contained in:
		
							parent
							
								
									0d276d0d61
								
							
						
					
					
						commit
						b1e6a33d6b
					
				
					 6 changed files with 36 additions and 11 deletions
				
			
		|  | @ -20,7 +20,6 @@ export default defineComponent({ | |||
| 			[symbols.PAGE_INFO]: { | ||||
| 				title: computed(() => this.folder ? this.folder.name : this.$ts.drive), | ||||
| 				icon: 'fas fa-cloud', | ||||
| 				menu: () => this.$refs.drive.getMenu() | ||||
| 			}, | ||||
| 			folder: null, | ||||
| 		}; | ||||
|  |  | |||
|  | @ -282,7 +282,6 @@ export default defineComponent({ | |||
| 				share: { | ||||
| 					title: this.user.name, | ||||
| 				}, | ||||
| 				menu: () => getUserMenu(this.user), | ||||
| 			} : null), | ||||
| 			user: null, | ||||
| 			error: null, | ||||
|  |  | |||
|  | @ -94,7 +94,11 @@ export default (opts) => ({ | |||
| 				for (let i = 0; i < items.length; i++) { | ||||
| 					const item = items[i]; | ||||
| 					markRaw(item); | ||||
| 					if (i === 3) item._shouldInsertAd_ = true; | ||||
| 					if (this.pagination.reversed) { | ||||
| 						if (i === items.length - 2) item._shouldInsertAd_ = true; | ||||
| 					} else { | ||||
| 						if (i === 3) item._shouldInsertAd_ = true; | ||||
| 					} | ||||
| 				} | ||||
| 				if (!this.pagination.noPaging && (items.length > (this.pagination.limit || 10))) { | ||||
| 					items.pop(); | ||||
|  | @ -133,7 +137,11 @@ export default (opts) => ({ | |||
| 				for (let i = 0; i < items.length; i++) { | ||||
| 					const item = items[i]; | ||||
| 					markRaw(item); | ||||
| 					if (i === 10) item._shouldInsertAd_ = true; | ||||
| 					if (this.pagination.reversed) { | ||||
| 						if (i === items.length - 9) item._shouldInsertAd_ = true; | ||||
| 					} else { | ||||
| 						if (i === 10) item._shouldInsertAd_ = true; | ||||
| 					} | ||||
| 				} | ||||
| 				if (items.length > SECOND_FETCH_LIMIT) { | ||||
| 					items.pop(); | ||||
|  |  | |||
|  | @ -1,17 +1,23 @@ | |||
| <script lang="ts"> | ||||
| import { defineComponent, h, TransitionGroup } from 'vue'; | ||||
| import { defineComponent, h, PropType, TransitionGroup } from 'vue'; | ||||
| import MkAd from '@client/components/global/ad.vue'; | ||||
| 
 | ||||
| export default defineComponent({ | ||||
| 	props: { | ||||
| 		items: { | ||||
| 			type: Array, | ||||
| 			type: Array as PropType<{ id: string; createdAt: string; _shouldInsertAd_: boolean; }[]>, | ||||
| 			required: true, | ||||
| 		}, | ||||
| 		reversed: { | ||||
| 			type: Boolean, | ||||
| 			required: false, | ||||
| 			default: false | ||||
| 		} | ||||
| 		}, | ||||
| 		ad: { | ||||
| 			type: Boolean, | ||||
| 			required: false, | ||||
| 			default: false | ||||
| 		}, | ||||
| 	}, | ||||
| 
 | ||||
| 	methods: { | ||||
|  | @ -66,7 +72,15 @@ export default defineComponent({ | |||
| 
 | ||||
| 				return [el, separator]; | ||||
| 			} else { | ||||
| 				return el; | ||||
| 				if (this.ad && item._shouldInsertAd_) { | ||||
| 					return [h(MkAd, { | ||||
| 						class: 'a', // advertiseの意(ブロッカー対策) | ||||
| 						key: item.id + ':ad', | ||||
| 						prefer: ['horizontal', 'horizontal-big'], | ||||
| 					}), el]; | ||||
| 				} else { | ||||
| 					return el; | ||||
| 				} | ||||
| 			} | ||||
| 		})); | ||||
| 	}, | ||||
|  |  | |||
|  | @ -55,6 +55,7 @@ | |||
| 					<MkA to="/my/favorites" class="item"><i class="fas fa-star icon"></i>{{ $ts.favorites }}</MkA> | ||||
| 				</div> | ||||
| 			</div> | ||||
| 			<MkAd class="a" prefer="square"/> | ||||
| 		</div> | ||||
| 		<footer class="footer"> | ||||
| 			<div class="left"> | ||||
|  | @ -351,7 +352,7 @@ export default defineComponent({ | |||
| 		flex-direction: column; | ||||
| 		width: 250px; | ||||
| 		height: 100vh; | ||||
| 		border-right: solid 0.5px var(--divider); | ||||
| 		border-right: solid 4px var(--divider); | ||||
| 
 | ||||
| 		> .header, > .footer { | ||||
| 			$padding: 8px; | ||||
|  | @ -498,6 +499,10 @@ export default defineComponent({ | |||
| 					} | ||||
| 				} | ||||
| 			} | ||||
| 
 | ||||
| 			> .a { | ||||
| 				margin: 12px; | ||||
| 			} | ||||
| 		} | ||||
| 	} | ||||
| 
 | ||||
|  | @ -591,7 +596,7 @@ export default defineComponent({ | |||
| 
 | ||||
| 	> .side { | ||||
| 		width: 350px; | ||||
| 		border-left: solid 0.5px var(--divider); | ||||
| 		border-left: solid 4px var(--divider); | ||||
| 
 | ||||
| 		&.widgets.sideViewOpening { | ||||
| 			@media (max-width: 1400px) { | ||||
|  |  | |||
|  | @ -16,7 +16,7 @@ | |||
| 		</MkButton> | ||||
| 	</div> | ||||
| 
 | ||||
| 	<XList ref="notes" :items="notes" v-slot="{ item: note }" :direction="reversed ? 'up' : 'down'" :reversed="reversed"> | ||||
| 	<XList ref="notes" :items="notes" v-slot="{ item: note }" :direction="reversed ? 'up' : 'down'" :reversed="reversed" :ad="true"> | ||||
| 		<XNote :note="note" @update:note="updated(note, $event)" :key="note._featuredId_ || note._prId_ || note.id"/> | ||||
| 	</XList> | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue