index.html: dark twitter timeline

Author: paper42

assets/css/misc.css

@@ -294,9 +294,6 @@ h1[id], h2[id], h3[id], h4[id], h5[id], h6[id] {
     background-color: inherit;
     color: white;
   }
-  .twitter-timeline {
-    background-color: white;
-  }
   .alert-warning {
     font-weight: bold;
     color: #ccc;

index.html

@@ -69,8 +69,12 @@ <h3>xbps-src</h3>
 	<hr>
 	<div class="row">
 		<div class="col-md-4">
-			<a class="twitter-timeline" data-chrome="noborders noscrollbar transparent" width="520" height="300" href="https://twitter.com/VoidLinux" data-widget-id="621226324586328064">Tweets by @VoidLinux</a>
-			<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
+		<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
+		<script>
+		theme = "light"
+		if (window.matchMedia('(prefers-color-scheme: dark)').matches) theme="dark"
+		document.write('<a class="twitter-timeline" data-theme="' + theme + '" data-chrome="noborders noscrollbar transparent" width="520" height="300" href="https://twitter.com/VoidLinux">Tweets by VoidLinux</a>')
+		</script>
 		</div>
 		<div class="col-md-4">
 			<h3>void-packages changes <span class="rssdev"><a href="https://github.com/void-linux/void-packages/commits/master.atom" title="Subscribe to void-packages"><i class="fa fa-rss fa-lg"></i></a></span></h3>