From 5e48868fa8494760353bc2cc284d1e0d60d50cc9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=96=9F=E9=85=8C=20=E9=B5=AC=E5=85=84?= <tgckpg@gmail.com>
Date: Fri, 11 Nov 2016 11:09:35 +0800
Subject: [PATCH] HomeEntry Responsive style

---
 botanjs/src/Astro/Blog/Components/Entry/Home.css | 11 +++++++++++
 botanjs/src/Astro/Starfall/Layout/TwoColumn.js   | 16 ++++++++++------
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/botanjs/src/Astro/Blog/Components/Entry/Home.css b/botanjs/src/Astro/Blog/Components/Entry/Home.css
index 08ea682..28e72b5 100644
--- a/botanjs/src/Astro/Blog/Components/Entry/Home.css
+++ b/botanjs/src/Astro/Blog/Components/Entry/Home.css
@@ -10,12 +10,22 @@
 	text-align: right;
 }
 
+[data-narrow] .h_info {
+	position: relative;
+	width: auto;
+	text-align: center;
+}
 
 .h_body {
 	margin-left: 7em;
 	margin-right: 0.5em;
 }
 
+[data-narrow] .h_body
+, [data-narrow] .h_bodyWrapper {
+	margin: 0 auto;
+}
+
 .h_bodyWrapper {
 	border: 1px solid #D4D7C9;
 	background-color: #FAFAFA;
@@ -47,6 +57,7 @@
 	width: 80px;
 	height: 80px;
 }
+[data-narrow] .h_avatarWrapper { display: inline; }
 
 .h_avatar, .a_avatarWrapper {
 	width: 80px;
diff --git a/botanjs/src/Astro/Starfall/Layout/TwoColumn.js b/botanjs/src/Astro/Starfall/Layout/TwoColumn.js
index 24ca689..c3f1db1 100644
--- a/botanjs/src/Astro/Starfall/Layout/TwoColumn.js
+++ b/botanjs/src/Astro/Starfall/Layout/TwoColumn.js
@@ -14,12 +14,16 @@
 			BotanJS.addEventListener( "Responsive"
 				/** e @type {Astro.Starfall.Events.Responsive} */
 				, function( e ) {
-				rspd.foreach(
-					document.ELEMENT_NODE
-					, e.data.ratio < 1.2
-						? function( elem ) { elem.style.width = "100%"; }
-						: function( elem ) { elem.style.width = ""; }
-				);
+					if( e.data.ratio < 1.2 )
+					{
+						document.body.setAttribute( "data-narrow", 1 );
+						rspd.foreach( document.ELEMENT_NODE, function( elem ) { elem.style.width = "100%"; } );
+					}
+					else
+					{
+						document.body.removeAttribute( "data-narrow" );
+						rspd.foreach( document.ELEMENT_NODE, function( elem ) { elem.style.width = ""; } );
+					}
 			});
 		}
 	};