コメントの返信ボタンのアイコンフォントの余白をCSSでスタイリング

xserver-inc · Oct 25, 2023 · 96b011f · 96b011f
1 parent edb738b
commit 96b011f
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 4 deletions.
diff --git a/amp.css b/amp.css
@@ -5932,6 +5932,9 @@ figcaption {
   display: inline;
   padding: 5px 8px;
 }
+.comment-reply-link .comment-icon {
+  margin-right: 3px;
+}
 
 .comment-page-link {
   text-align: center;

diff --git a/css/admin.css b/css/admin.css
@@ -5711,6 +5711,9 @@ body.wp-admin {
   display: inline;
   padding: 5px 8px;
 }
+.admin-settings .demo .comment-reply-link .comment-icon {
+  margin-right: 3px;
+}
 .admin-settings .demo .comment-page-link {
   text-align: center;
 }
@@ -13671,6 +13674,9 @@ body.wp-admin {
   display: inline;
   padding: 5px 8px;
 }
+.admin-settings .demo .comment-reply-link .comment-icon {
+  margin-right: 3px;
+}
 .admin-settings .demo .comment-page-link {
   text-align: center;
 }

diff --git a/lib/comments.php b/lib/comments.php
@@ -135,7 +135,7 @@ function simple_thread_comment_custom_callback($comment, $args, $depth) {
 add_filter( 'comment_reply_link', 'comment_reply_link_custom' );
 if ( !function_exists( 'comment_reply_link_custom' ) ):
 function comment_reply_link_custom($tag){
-  $tag = preg_replace('#<a .+?>#', '$0<span class="fa fa-comment-o"></span> ', $tag);
+  $tag = preg_replace('#<a .+?>#', '$0<span class="fa fa-comment-o comment-icon"></span>', $tag);
   return $tag;
 }
 endif;
diff --git a/scss/_comments.scss b/scss/_comments.scss
@@ -77,9 +77,9 @@
   font-size: 14px;
   display: inline;
   padding: 5px 8px;
-  // &:before{
-  //   content: '\f0e5';
-  // }
+  .comment-icon{
+    margin-right: 3px;
+  }
 }
 
 //コメントのページネーション

diff --git a/style.css b/style.css
@@ -5957,6 +5957,9 @@ figcaption {
   display: inline;
   padding: 5px 8px;
 }
+.comment-reply-link .comment-icon {
+  margin-right: 3px;
+}
 
 .comment-page-link {
   text-align: center;