I am trying to embed facebook post in my app in iOS.
Using the embed generator provided by Facebook, I can get the code. It all works fine in light mode but when I switch to dark mode, the background does change to black but the text color doesn’t change.
It remains black, thus it looks like a black text on black background, thus it blends and nothing is visible.
Here is my code,
<code><div class="embed-facebook-post">
<div class="fb-post" data-href="https://www.facebook.com/babalilachocolate/posts/pfbid033rJeUdXXam2jJZNCA12QUyeZZivmQq7MTtDGiuiXVu6St3WEMpwecNu4iC2yqJ9Wl" data-width="500" data-show-text="true">
<blockquote cite="https://www.facebook.com/babalilachocolate/posts/536751285131885" class="fb-xfbml-parse-ignore">
<p>✨At the heart of Baba Lila is The Twelve Truffles✨
It all began with them. Tash has been making these 12 flavours since...</p>
Posted by <a href="https://www.facebook.com/babalilachocolate">Baba Lila</a>
on <a href="https://www.facebook.com/babalilachocolate/posts/536751285131885">Thursday, November 24, 2022</a></blockquote>
</div>
</div>
<!-- This is part of my css --!>
@media (prefers-color-scheme: dark) {
div.embed-facebook-post {
color: #fff;
background-color: #000;
}
}
</code>
<code><div class="embed-facebook-post">
<div class="fb-post" data-href="https://www.facebook.com/babalilachocolate/posts/pfbid033rJeUdXXam2jJZNCA12QUyeZZivmQq7MTtDGiuiXVu6St3WEMpwecNu4iC2yqJ9Wl" data-width="500" data-show-text="true">
<blockquote cite="https://www.facebook.com/babalilachocolate/posts/536751285131885" class="fb-xfbml-parse-ignore">
<p>✨At the heart of Baba Lila is The Twelve Truffles✨
It all began with them. Tash has been making these 12 flavours since...</p>
Posted by <a href="https://www.facebook.com/babalilachocolate">Baba Lila</a>
on <a href="https://www.facebook.com/babalilachocolate/posts/536751285131885">Thursday, November 24, 2022</a></blockquote>
</div>
</div>
<!-- This is part of my css --!>
@media (prefers-color-scheme: dark) {
div.embed-facebook-post {
color: #fff;
background-color: #000;
}
}
</code>
<div class="embed-facebook-post">
<div class="fb-post" data-href="https://www.facebook.com/babalilachocolate/posts/pfbid033rJeUdXXam2jJZNCA12QUyeZZivmQq7MTtDGiuiXVu6St3WEMpwecNu4iC2yqJ9Wl" data-width="500" data-show-text="true">
<blockquote cite="https://www.facebook.com/babalilachocolate/posts/536751285131885" class="fb-xfbml-parse-ignore">
<p>✨At the heart of Baba Lila is The Twelve Truffles✨
It all began with them. Tash has been making these 12 flavours since...</p>
Posted by <a href="https://www.facebook.com/babalilachocolate">Baba Lila</a>
on <a href="https://www.facebook.com/babalilachocolate/posts/536751285131885">Thursday, November 24, 2022</a></blockquote>
</div>
</div>
<!-- This is part of my css --!>
@media (prefers-color-scheme: dark) {
div.embed-facebook-post {
color: #fff;
background-color: #000;
}
}
So far I found this similar issue asked here.
https://www.phpbb.com/customise/db/extension/mediaembed/support/topic/177161
How to change the text color of the fb post to white so that it is visible in dark mode?
4