Merge branch 'develop' of https://github.com/syuilo/misskey into develop

package.json

@@ -191,7 +191,7 @@
 		"single-line-log": "1.1.2",
 		"speakeasy": "2.0.0",
 		"stringz": "1.0.0",
-		"style-loader": "0.23.0",
+		"style-loader": "0.23.1",
 		"stylus": "0.54.5",
 		"stylus-loader": "3.0.2",
 		"summaly": "2.2.0",

src/client/app/common/views/components/reactions-viewer.vue

@@ -40,18 +40,24 @@ export default Vue.extend({
 
 <style lang="stylus" scoped>
 .mk-reactions-viewer
-	border-top dashed 1px var(--reactionViewerBorder)
+	margin 6px 0
-	border-bottom dashed 1px var(--reactionViewerBorder)
-	margin 4px 0
 
 	&:empty
 		display none
 
 	> span
-		margin-right 8px
+		margin-right 6px
+		padding 6px 6px 6px 4px
+		border-radius 3px
 
 		&.notReacted
 			cursor pointer
+			border solid 1px var(--reactionViewerButtonBorder)
+			background-color var(--reactionViewerButtonBg)
+
+			&:hover
+				border solid 1px var(--reactionViewerButtonHoverBorder)
+				background-color var(--reactionViewerButtonHoverBg)
 
 		> .mk-reaction-icon
 			font-size 1.4em

src/client/theme/dark.json5

@@ -84,7 +84,10 @@
 
 		reactionPickerButtonHoverBg: 'rgba(255, 255, 255, 0.18)',
 
-		reactionViewerBorder: 'rgba(255, 255, 255, 0.1)',
+		reactionViewerButtonBg: 'rgba(0, 0, 0, 0)',
+		reactionViewerButtonHoverBg: 'rgba(0, 0, 0, 0)',
+		reactionViewerButtonBorder: 'rgba(255, 255, 255, 0.1)',
+		reactionViewerButtonHoverBorder: 'rgba(255, 255, 255, 0.2)',
 
 		pollEditorInputBg: 'rgba(0, 0, 0, 0.25)',
 

src/client/theme/light.json5

@@ -84,7 +84,10 @@
 
 		reactionPickerButtonHoverBg: '#eee',
 
-		reactionViewerBorder: 'rgba(0, 0, 0, 0.1)',
+		reactionViewerButtonBg: 'rgba(0, 0, 0, 0)',
+		reactionViewerButtonHoverBg: 'rgba(0, 0, 0, 0)',
+		reactionViewerButtonBorder: 'rgba(0, 0, 0, 0.1)',
+		reactionViewerButtonHoverBorder: 'rgba(0, 0, 0, 0.2)',
 
 		pollEditorInputBg: '#fff',