From bad2a5411d603a497c3522b23e315007af6c9e4a Mon Sep 17 00:00:00 2001
From: jooncco <jooncco.g@gmail.com>
Date: Sat, 16 Mar 2024 17:22:55 +0900
Subject: [PATCH] :art: override facebook comment section style

---
 _includes/comments-providers/facebook.html | 20 ++++++++++------
 _sass/minimal-mistakes/_comment.scss       | 27 ++++++++++++++++++++--
 2 files changed, 38 insertions(+), 9 deletions(-)

diff --git a/_includes/comments-providers/facebook.html b/_includes/comments-providers/facebook.html
index 009dc1c..3e99924 100644
--- a/_includes/comments-providers/facebook.html
+++ b/_includes/comments-providers/facebook.html
@@ -1,8 +1,14 @@
 <div id="fb-root"></div>
-<script>(function(d, s, id) {
-  var js, fjs = d.getElementsByTagName(s)[0];
-  if (d.getElementById(id)) return;
-  js = d.createElement(s); js.id = id;
-  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5{% if site.comments.facebook.appid %}&appId={{ site.comments.facebook.appid }}{% endif %}";
-  fjs.parentNode.insertBefore(js, fjs);
-}(document, 'script', 'facebook-jssdk'));</script>
\ No newline at end of file
+<script>
+  (function (d, s, id) {
+    var js,
+      fjs = d.getElementsByTagName(s)[0];
+    if (d.getElementById(id)) return;
+    js = d.createElement(s);
+    js.id = id;
+    js.src =
+      "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5{% if site.comments.facebook.appid %}&appId={{ site.comments.facebook.appid }}{% endif %}";
+    fjs.parentNode.insertBefore(js, fjs);
+  })(document, "script", "facebook-jssdk");
+</script>
+<link rel="stylesheet" href="/_sass/minimal-mistakes/_comment.scss" />
diff --git a/_sass/minimal-mistakes/_comment.scss b/_sass/minimal-mistakes/_comment.scss
index d816305..d7dbeda 100644
--- a/_sass/minimal-mistakes/_comment.scss
+++ b/_sass/minimal-mistakes/_comment.scss
@@ -1,3 +1,26 @@
-.fb-comments {
-  background: #aaa;
+// Overriding styles for facebook comment section.
+// The facebook jssdk theme doen't fit well into look & feel of this site.
+section.fb-comments {
+  ._6b {
+    vertical-align: baseline !important;
+    margin: 0 0.25em !important;
+  }
+
+  ._pup {
+    color: #eee !important;
+  }
+
+  ._3-8m {
+    span {
+      color: #ccc !important;
+    }
+  }
+
+  ._ohe {
+    color: #eee !important;
+  }
+}
+
+section.fb-comments ._50f7 {
+  color: #eee !important;
 }