changeset 87:60f77a3de847

css: improve appearance on mobile
author Paper <paper@paper.us.eu.org>
date Tue, 11 Jun 2024 00:50:07 -0400
parents 1fed81c848a5
children bac91b82b969
files _posts/2024-06-09-schism-unicode-and-you.html css/style.css
diffstat 2 files changed, 15 insertions(+), 3 deletions(-) [+]
line wrap: on
line diff
--- a/_posts/2024-06-09-schism-unicode-and-you.html	Sun Jun 09 22:07:26 2024 -0400
+++ b/_posts/2024-06-09-schism-unicode-and-you.html	Tue Jun 11 00:50:07 2024 -0400
@@ -7,7 +7,7 @@
 <span>Recently I've taken on adding real Unicode-awareness to Schism, and it was <i>surprisingly</i> easy, to say the least.</span>
 <br><br>
 <span>I was expecting to have to convert lots of things to be real Unicode, but nope! All that really needed to be done was to convert UTF-8 to CP437 where necessary to actually *draw* the data while keeping the internal form pure UTF-8, and then bundle everything up into a neat macro to keep everything consistent:</span>
-<figure><pre><code>#define CHARSET_EASY_MODE_EX(MOD, in, inset, outset, x) \
+<figure><pre class="code-block"><code>#define CHARSET_EASY_MODE_EX(MOD, in, inset, outset, x) \
 	do { \
 		MOD uint8_t* out; \
 		charset_error_t err = charset_iconv(in, (uint8_t**)&out, inset, outset); \
--- a/css/style.css	Sun Jun 09 22:07:26 2024 -0400
+++ b/css/style.css	Tue Jun 11 00:50:07 2024 -0400
@@ -161,7 +161,10 @@
 
 .center-image {
 	display: block;
-	margin: 0 auto;
+	margin-left: auto;
+	margin-right: auto;
+	width: 100%;
+	height: auto;
 }
 
 .plugs-list {
@@ -170,7 +173,9 @@
 
 	flex-wrap: wrap;
 	justify-content: center;
-	column-gap: 4px;
+
+	/* column-gap: 4px; */
+	row-gap: 0.5em;
 }
 
 .plugs-list-item {
@@ -180,8 +185,15 @@
 	height: 31px;
 
 	opacity: 80%;
+	image-rendering: pixelated;
 }
 
 .plugs-list-item:hover {
 	opacity: 100%;
 }
+
+.code-block {
+	overflow-x: scroll;
+	background-color: rgba(0, 0, 0, 0.6);
+	padding: 0.5em;
+}