refactor(client): use css modules
This commit is contained in:
		
							parent
							
								
									72dfbfcf35
								
							
						
					
					
						commit
						f3c0af7e23
					
				
					 3 changed files with 7 additions and 8 deletions
				
			
		|  | @ -80,7 +80,6 @@ export default defineComponent({ | ||||||
| 			} else { | 			} else { | ||||||
| 				if (props.ad && item._shouldInsertAd_) { | 				if (props.ad && item._shouldInsertAd_) { | ||||||
| 					return [h(MkAd, { | 					return [h(MkAd, { | ||||||
| 						class: 'a', // advertiseの意(ブロッカー対策) |  | ||||||
| 						key: item.id + ':ad', | 						key: item.id + ':ad', | ||||||
| 						prefer: ['horizontal', 'horizontal-big'], | 						prefer: ['horizontal', 'horizontal-big'], | ||||||
| 					}), el]; | 					}), el]; | ||||||
|  |  | ||||||
|  | @ -4,7 +4,7 @@ | ||||||
| 	v-show="!isDeleted" | 	v-show="!isDeleted" | ||||||
| 	ref="el" | 	ref="el" | ||||||
| 	v-hotkey="keymap" | 	v-hotkey="keymap" | ||||||
| 	:class="[$style.root, { [$style.isRenote]: isRenote }]" | 	:class="$style.root" | ||||||
| 	:tabindex="!isDeleted ? '-1' : null" | 	:tabindex="!isDeleted ? '-1' : null" | ||||||
| > | > | ||||||
| 	<MkNoteSub v-if="appearNote.reply" :note="appearNote.reply" :class="$style.replyTo"/> | 	<MkNoteSub v-if="appearNote.reply" :note="appearNote.reply" :class="$style.replyTo"/> | ||||||
|  |  | ||||||
|  | @ -8,9 +8,9 @@ | ||||||
| 	</template> | 	</template> | ||||||
| 
 | 
 | ||||||
| 	<template #default="{ items: notes }"> | 	<template #default="{ items: notes }"> | ||||||
| 		<div class="giivymft" :class="{ noGap }"> | 		<div :class="[$style.root, { [$style.noGap]: noGap }]"> | ||||||
| 			<MkDateSeparatedList ref="notes" v-slot="{ item: note }" :items="notes" :direction="pagination.reversed ? 'up' : 'down'" :reversed="pagination.reversed" :no-gap="noGap" :ad="true" class="notes"> | 			<MkDateSeparatedList ref="notes" v-slot="{ item: note }" :items="notes" :direction="pagination.reversed ? 'up' : 'down'" :reversed="pagination.reversed" :no-gap="noGap" :ad="true" :class="$style.notes"> | ||||||
| 				<XNote :key="note._featuredId_ || note._prId_ || note.id" class="qtqtichx" :note="note"/> | 				<XNote :key="note._featuredId_ || note._prId_ || note.id" :class="$style.note" :note="note"/> | ||||||
| 			</MkDateSeparatedList> | 			</MkDateSeparatedList> | ||||||
| 		</div> | 		</div> | ||||||
| 	</template> | 	</template> | ||||||
|  | @ -36,8 +36,8 @@ defineExpose({ | ||||||
| }); | }); | ||||||
| </script> | </script> | ||||||
| 
 | 
 | ||||||
| <style lang="scss" scoped> | <style lang="scss" module> | ||||||
| .giivymft { | .root { | ||||||
| 	&.noGap { | 	&.noGap { | ||||||
| 		> .notes { | 		> .notes { | ||||||
| 			background: var(--panel); | 			background: var(--panel); | ||||||
|  | @ -48,7 +48,7 @@ defineExpose({ | ||||||
| 		> .notes { | 		> .notes { | ||||||
| 			background: var(--bg); | 			background: var(--bg); | ||||||
| 
 | 
 | ||||||
| 			.qtqtichx { | 			.note { | ||||||
| 				background: var(--panel); | 				background: var(--panel); | ||||||
| 				border-radius: var(--radius); | 				border-radius: var(--radius); | ||||||
| 			} | 			} | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue