Merge branch 'develop'

2 files changed, 20 insertions, 10 deletions

diff --git a/src/client/components/date-separated-list.vue b/src/client/components/date-separated-list.vue
index c7ca67582a..9636ee053c 100644
--- a/src/client/components/date-separated-list.vue
+++ b/src/client/components/date-separated-list.vue
@@ -90,7 +90,7 @@ export default defineComponent({
 			} else {
 				if (this.ad && item._shouldInsertAd_) {
 					return [h(MkAd, {
-						class: 'ad',
+						class: 'a', // advertiseの意(ブロッカー対策)
 						key: item.id + ':ad',
 						prefer: 'horizontal',
 					}), el];
diff --git a/src/client/components/global/ad.vue b/src/client/components/global/ad.vue
index 53e6e8b8bb..ee2a7ebe92 100644
--- a/src/client/components/global/ad.vue
+++ b/src/client/components/global/ad.vue
@@ -85,16 +85,23 @@ export default defineComponent({
 	background-image: repeating-linear-gradient(45deg, transparent, transparent 8px, var(--ad) 8px, var(--ad) 14px );
 
 	> .main {
+		text-align: center;
+
 		> a {
-			display: block;
+			display: inline-block;
 			position: relative;
-			margin: 0 auto;
+			vertical-align: bottom;
+
+			&:hover {
+				> img {
+					filter: contrast(120%);
+				}
+			}
 
 			> img {
 				display: block;
-				width: 100%;
-				height: 100%;
 				object-fit: contain;
+				margin: auto;
 			}
 
 			> .menu {
@@ -106,23 +113,26 @@ export default defineComponent({
 		}
 
 		&.square {
-			> a {
+			> a ,
+			> a > img {
 				max-width: min(300px, 100%);
-				max-height: min(300px, 100%);
+				max-height: 300px;
 			}
 		}
 
 		&.horizontal {
 			padding: 8px;
 
-			> a {
+			> a ,
+			> a > img {
 				max-width: min(600px, 100%);
-				max-height: min(100px, 100%);
+				max-height: 80px;
 			}
 		}
 
 		&.vertical {
-			> a {
+			> a ,
+			> a > img {
 				max-width: min(100px, 100%);
 			}
 		}