Repos / s4g / 8e4bddbbe6
commit 8e4bddbbe6182b7ff0bae964216185e90dca6159
Author: Nhân <hi@imnhan.com>
Date:   Tue Jul 11 21:28:14 2023 +0700

    scale post: tweak responsiveness
    
    Set max width for content images.
    
    Put floated image below "by Ted Dziuba" line to avoid clumsy line
    breaking in that line when viewport width gets small.

diff --git a/theme/base.css b/theme/base.css
index 05ffb70..813e870 100644
--- a/theme/base.css
+++ b/theme/base.css
@@ -10,6 +10,10 @@ ol {
   line-height: 1.35rem;
 }
 
+main img {
+  max-width: 100%;
+}
+
 footer {
   margin-top: 2rem;
   text-align: right;
diff --git a/www/scale/index.dj b/www/scale/index.dj
index 4adeb61..efa2841 100644
--- a/www/scale/index.dj
+++ b/www/scale/index.dj
@@ -3,10 +3,10 @@ PostedAt: 2008-04-24
 Templates: $_theme/base.tmpl, $_theme/includes.tmpl, scale.tmpl
 ---
 
-![scaleboner](bill.jpg)
-
 _by [Ted Dziuba][1]_
 
+![scaleboner](bill.jpg)
+
 Engineers love to talk about scalability.  It makes us feel like the bad ass,
 dick-swingin' motherfuckers that we wish we could be.
 
diff --git a/www/scale/index.html b/www/scale/index.html
index 5c8bc7c..882841b 100644
--- a/www/scale/index.html
+++ b/www/scale/index.html
@@ -29,8 +29,8 @@
 <div class="main-container">
   <main>
   <h1>I&#39;m Going To Scale My Foot Up Your Ass</h1>
-  <p><img alt="scaleboner" src="bill.jpg"></p>
-<p><em>by <a href="http://widgetsandshit.com/teddziuba/2008/04/im-going-to-scale-my-foot-up-y.html">Ted Dziuba</a></em></p>
+  <p><em>by <a href="http://widgetsandshit.com/teddziuba/2008/04/im-going-to-scale-my-foot-up-y.html">Ted Dziuba</a></em></p>
+<p><img alt="scaleboner" src="bill.jpg"></p>
 <p>Engineers love to talk about scalability.  It makes us feel like the bad ass,
 dick-swingin’ motherfuckers that we wish we could be.</p>
 <p>After we talk about scalability with our co-workers (<em>Yeah, Rails doesn’t
@@ -152,10 +152,8 @@ <h2>tl;dr</h2>
   box-shadow: 1px 1px 3px #6F6F6F;
 }
 
-
-h2 {
-  font-size: 1em;
-}
+h1 { font-size: 1.5rem; }
+h2 { font-size: 1em; }
 </style>
 
 </body>
diff --git a/www/scale/scale.tmpl b/www/scale/scale.tmpl
index 59ee909..9f48df1 100644
--- a/www/scale/scale.tmpl
+++ b/www/scale/scale.tmpl
@@ -69,9 +69,7 @@ main {
   box-shadow: 1px 1px 3px #6F6F6F;
 }
 
-
-h2 {
-  font-size: 1em;
-}
+h1 { font-size: 1.5rem; }
+h2 { font-size: 1em; }
 </style>
 {{- end}}