diff --git a/assets/css/dark.css b/assets/css/dark.css index 16829e1..ff79d0c 100644 --- a/assets/css/dark.css +++ b/assets/css/dark.css @@ -7,11 +7,6 @@ color: #ececec; } - /* IndieWeb u-photo shouldn't look like floating punctuation marks */ - .u-photo { - border: 1px solid #ddc; - } - a { color: #ed7; } @@ -27,6 +22,7 @@ blockquote, :not(pre) > code, hr, + img, pre { border-color: #333; } diff --git a/assets/css/main.css b/assets/css/main.css index 3399360..992873b 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -6,14 +6,19 @@ * regular text. * 3. max text width for readability * 4. single-row nav links widescreen, multiline nav on narrow screens - * 5. Soft border around code in case it looks too similar to regular - * text, and to show it continue across more than one line + * 5. Soft border around code and images to disginguish from the + * surrounding page. Images with white/black or transparent + * backgrounds should have clear dimensions, and multiple consecutive + * inline spans should look separate. A span that + * continues across multiple lines should not look like multiple different + * spans. * 6. Increase the line-spacing a bit so users on mobile devices can * tap links more easily. * 7. Horizontally center non-inline images; left-aligned stick out. * 8. dark.css changes a few colors if the browser wants dark mode. * 9. Support unstyled lists: for webmentions, post lists, nav links. - * 10. Make blockquotes look okay on narrow screens. + * 10. Narrow screen optimization: less-indented blockquotes, overflow + * behavior for
.
  * Everything else is browser defaults:
  * default fonts, non-dark-mode colors, etc.
  */
@@ -61,6 +66,13 @@ img:not(.u-photo) {
 	max-width: 100%;
 }
 
+/* Distinguish images from the background in case their color is
+ * too similar to the page background color */
+img,
+pre {
+	border: 1px solid #bbb;
+}
+
 code,
 pre {
 	/* browsers make 
 small for some dumb legacy reason
@@ -72,12 +84,16 @@ pre {
 	/* stylelint-enable */
 }
 
-pre,
 /* don't put a border around code within a 
 block,
  * just put the border around the  */
 :not(pre) > code {
 	border: 1px solid #bbb;
 	padding: 0 0.1em;
+	overflow-wrap: break-word;
+}
+
+li.u-comment.h-cite {
+	overflow-wrap: break-word;
 }
 
 /* Allow horizontal scroll in a pre block, but don't clip it vertically */
diff --git a/content/posts/keeping-platforms-open.md b/content/posts/keeping-platforms-open.md
index c04da78..4cd853a 100644
--- a/content/posts/keeping-platforms-open.md
+++ b/content/posts/keeping-platforms-open.md
@@ -1,15 +1,14 @@
 ---
 date: "2021-02-23T11:54:00-08:00"
-description: "How open platforms become closed, and how standards-driven development
-    can prevent it from happening."
+description: "How open platforms become closed, and how standards-driven development can prevent it from happening."
 footnote_heading: "Notes"
 outputs:
-  - html
-  - gemtext
+    - html
+    - gemtext
 tags:
-  - free software
-  - user domestication
-  - platforms
+    - free software
+    - user domestication
+    - platforms
 title: Keeping platforms open
 ---
 This article is the second entry of series of posts exploring situations in which FLOSS alone isn't enough to secure user freedom.
@@ -124,8 +123,8 @@ The standards- and consensus-driven approach to platform development and the ine
 
 Perhaps the biggest benefit to abandoning the "move fast and break things" mindset is that in addition to making it hard to rapidly improve a service, abandoning the mindset also makes it hard to rapidly worsen a service.
 
-Acknowledgements
-----------------
+Acknowledge­ments
+---------------------
 
 {{}} helped me brainstorm early in the writing process and provided useful information for the section on XMPP.
 
@@ -144,3 +143,4 @@ Thanks to {{ I feel like there's some tension between simplicity and open platforms; to take Signal, in a way it's simple precisely because it's a de-facto-closed platform, or at least so Moxie has argued. In turn, Matrix is superficially simple, but the protocol is actually (imho) fairly complex exactly because it's an open platform.