:art:

9 files changed, 15 insertions, 7 deletions

diff --git a/src/client/app/common/views/components/mention.vue b/src/client/app/common/views/components/mention.vue
index 9c12c67e61..6fbf8c47fd 100644
--- a/src/client/app/common/views/components/mention.vue
+++ b/src/client/app/common/views/components/mention.vue
@@ -53,14 +53,14 @@ export default Vue.extend({
 		pointer-events none
 		user-select none
 		padding 0 4px
-		background var(--primary)
-		border solid 1px var(--primary)
+		background var(--mfmMention)
+		border solid 1px var(--mfmMention)
 		border-radius 4px 0 0 4px
-		color var(--primaryForeground)
+		color var(--mfmMentionForeground)
 
 		& + .main
 			padding 0 4px
-			border solid 1px var(--primary)
+			border solid 1px var(--mfmMention)
 			border-radius 0 4px 4px 0
 
 	> .main
diff --git a/src/client/app/common/views/widgets/tips.vue b/src/client/app/common/views/widgets/tips.vue
index 1a9c91ba8b..85b102fc19 100644
--- a/src/client/app/common/views/widgets/tips.vue
+++ b/src/client/app/common/views/widgets/tips.vue
@@ -84,6 +84,7 @@ export default define({
 <style lang="stylus" scoped>
 .mkw-tips
 	overflow visible !important
+	opacity 0.8
 
 	> p
 		display block
@@ -91,7 +92,7 @@ export default define({
 		padding 0 12px
 		text-align center
 		font-size 0.7em
-		color #999
+		color var(--text)
 
 		> [data-icon]
 			margin-right 4px
@@ -102,7 +103,7 @@ export default define({
 			margin 0 2px
 			font-size 1em
 			font-family inherit
-			border solid 1px #999
+			border solid 1px var(--text)
 			border-radius 2px
 
 </style>
diff --git a/src/client/app/common/views/widgets/version.vue b/src/client/app/common/views/widgets/version.vue
index eb2bb9972e..470eb1a84e 100644
--- a/src/client/app/common/views/widgets/version.vue
+++ b/src/client/app/common/views/widgets/version.vue
@@ -24,6 +24,7 @@ p
 	padding 0 12px
 	text-align center
 	font-size 0.7em
-	color #aaa
+	color var(--text)
+	opacity 0.8
 
 </style>
diff --git a/src/client/theme/colorful.json5 b/src/client/theme/colorful.json5
index 7daa45e219..5b7441e1cf 100644
--- a/src/client/theme/colorful.json5
+++ b/src/client/theme/colorful.json5
@@ -15,6 +15,7 @@
 	props: {
 		bg: 'rgb(250, 250, 250)',
 		mfmMention: '#f07171',
+		mfmMentionForeground: '#fff',
 		mfmUrl: '#86b300',
 		mfmLink: '#399ee6',
 		mfmHashtag: '#fa8d3e'
diff --git a/src/client/theme/dark.json5 b/src/client/theme/dark.json5
index 6c88090f87..a12ffae540 100644
--- a/src/client/theme/dark.json5
+++ b/src/client/theme/dark.json5
@@ -123,6 +123,7 @@
 		mfmUrl: '$primary',
 		mfmLink: '@mfmUrl',
 		mfmMention: '$primary',
+		mfmMentionForeground: '@primaryForeground',
 		mfmHashtag: '$primary',
 
 		suspendedInfoBg: '#611d1d',
diff --git a/src/client/theme/gruvbox-dark.json5 b/src/client/theme/gruvbox-dark.json5
index 65479f90ee..670b2a76d1 100644
--- a/src/client/theme/gruvbox-dark.json5
+++ b/src/client/theme/gruvbox-dark.json5
@@ -17,6 +17,7 @@
 		renoteText: 'rgb(169, 174, 36)',
 		quoteBorder: 'rgb(169, 174, 36)',
 		mfmMention: 'rgb(177, 98, 134)',
+		mfmMentionForeground: '#fff',
 		mfmUrl: 'rgb(69, 133, 136)',
 		mfmLink: 'rgb(104, 157, 106)',
 		mfmHashtag: 'rgb(204, 36, 29)'
diff --git a/src/client/theme/light.json5 b/src/client/theme/light.json5
index 9e362c99e2..c6a4f860b4 100644
--- a/src/client/theme/light.json5
+++ b/src/client/theme/light.json5
@@ -123,6 +123,7 @@
 		mfmUrl: '$primary',
 		mfmLink: '@mfmUrl',
 		mfmMention: '$primary',
+		mfmMentionForeground: '@primaryForeground',
 		mfmHashtag: '$primary',
 
 		suspendedInfoBg: '#ffdbdb',
diff --git a/src/client/theme/monokai.json5 b/src/client/theme/monokai.json5
index 859c1c2340..a949089ba8 100644
--- a/src/client/theme/monokai.json5
+++ b/src/client/theme/monokai.json5
@@ -17,6 +17,7 @@
 		renoteText: '#a6e22e',
 		quoteBorder: '#a6e22e',
 		mfmMention: '#ae81ff',
+		mfmMentionForeground: '#fff',
 		mfmUrl: '#66d9ef',
 		mfmLink: '#e6db74',
 		mfmHashtag: '#fd971f'
diff --git a/src/client/theme/natural.json5 b/src/client/theme/natural.json5
index 74e9cd7000..956c8dab36 100644
--- a/src/client/theme/natural.json5
+++ b/src/client/theme/natural.json5
@@ -15,6 +15,7 @@
 	props: {
 		bg: 'rgb(248, 239, 221)',
 		mfmMention: 'rgb(238, 150, 43)',
+		mfmMentionForeground: '#fff',
 		mfmUrl: 'rgb(0, 189, 214)',
 		mfmLink: 'rgb(255, 87, 146)',
 		mfmHashtag: 'rgb(179, 134, 0)'