Updated blog styling

mozilla · Oct 22, 2013 · 441901b · 441901b
1 parent b647c82
commit 441901b
Show file tree

Hide file tree

Showing 4 changed files with 97 additions and 40 deletions.
diff --git a/wp-content/themes/mozfest2012/media/css/_sidebar.less b/wp-content/themes/mozfest2012/media/css/_sidebar.less
@@ -1,7 +1,8 @@
 #sidebar {
 	float: right;
 	width: 300px;
-	margin-right: -320px;
+	padding: 0 5px;
+	margin-right: -325px;
 	overflow: hidden;
 }
 

diff --git a/wp-content/themes/mozfest2012/media/css/core.css b/wp-content/themes/mozfest2012/media/css/core.css
@@ -25,7 +25,7 @@ body {
   margin: 0;
   padding: 0;
   font-family: 'Open Sans', sans-serif;
-  font-size: 13px;
+  font-size: 14px;
   color: #4d4d4d;
 }
 .constrained {
@@ -94,6 +94,7 @@ a {
 body.archive article {
   margin-top: 50px;
 }
+/* revert the big top margin for tag archives */
 body.tag article {
   margin-top: 0;
 }
@@ -128,35 +129,48 @@ img.alignleft {
   float: left;
   margin: 0 1em 0 0;
 }
+img.aligncenter {
+  margin: 0 auto;
+  display: block;
+}
 img.alignright {
   float: right;
   margin: 0 0 0 1em;
 }
-body.blog #content-inner .blog-title,
-body.tag #content-inner .blog-title {
+body.blog .blog-title,
+body.tag .blog-title {
   margin-bottom: 1em;
   padding-top: 1em;
-  border-top: 1px solid #E5E5E6;
+  border-top: solid 1px #E5E5E6;
 }
 body.blog #content-inner article:first-child .blog-title,
 body.tag #content-inner h2 + article .blog-title {
   border-top: none;
   margin-top: 0;
   padding-top: 0;
 }
+body.blog #content-inner object,
+body.single-post #content-inner object,
+body.tag #content-inner object,
 body.blog #content-inner img,
 body.single-post #content-inner img,
 body.tag #content-inner img {
-  width: 100%;
+  max-width: 100%;
   height: auto;
   margin-bottom: 1em;
   display: block;
 }
+body.blog #content-inner img.alignnone,
+body.single-post #content-inner img.alignnone,
+body.tag #content-inner img.alignnone,
 body.blog #content-inner img.alignleft,
-body.blog #content-inner img.alignright,
 body.single-post #content-inner img.alignleft,
-body.single-post #content-inner img.alignright,
 body.tag #content-inner img.alignleft,
+body.blog #content-inner img.aligncenter,
+body.single-post #content-inner img.aligncenter,
+body.tag #content-inner img.aligncenter,
+body.blog #content-inner img.alignright,
+body.single-post #content-inner img.alignright,
 body.tag #content-inner img.alignright {
   width: auto;
   display: inline-block;
@@ -166,6 +180,21 @@ body.single-post #content-inner img.alignleft,
 body.tag #content-inner img.alignleft {
   margin-right: 10px;
 }
+body.blog #content-inner img.aligncenter,
+body.single-post #content-inner img.aligncenter,
+body.tag #content-inner img.aligncenter {
+  display: block;
+}
+body.blog #content-inner img.alignright,
+body.single-post #content-inner img.alignright,
+body.tag #content-inner img.alignright {
+  margin-left: 10px;
+}
+body.blog #content-inner img.alignleft,
+body.single-post #content-inner img.alignleft,
+body.tag #content-inner img.alignleft {
+  margin-right: 10px;
+}
 body.blog #content-inner img.alignright,
 body.single-post #content-inner img.alignright,
 body.tag #content-inner img.alignright {
@@ -571,7 +600,8 @@ pre.template {
 #sidebar {
   float: right;
   width: 300px;
-  margin-right: -320px;
+  padding: 0 5px;
+  margin-right: -325px;
   overflow: hidden;
 }
 #sidebar > .primary {

diff --git a/wp-content/themes/mozfest2012/media/css/core.less b/wp-content/themes/mozfest2012/media/css/core.less
@@ -8,7 +8,7 @@ body {
 	margin: 0;
 	padding: 0;
 	font-family: 'Open Sans', sans-serif;
-	font-size: 13px;
+	font-size: 14px;
 	color: @slate;
 }
 
@@ -129,6 +129,11 @@ img.alignleft {
 	margin: 0 1em 0 0;
 }
 
+img.aligncenter {
+	margin: 0 auto;
+	display: block;
+}
+
 img.alignright {
 	float: right;
 	margin: 0 0 0 1em;
@@ -148,23 +153,40 @@ body.tag #content-inner h2 + article .blog-title {
     padding-top: 0;
 }
 
-body.blog #content-inner img,
-body.single-post #content-inner img,
-body.tag #content-inner img {
-    width: 100%;
-    height: auto;
-    margin-bottom: 1em;
-    display: block;
-}
+body.blog,
+body.single-post,
+body.tag {
+	#content-inner {
+		object,
+		img {
+			max-width: 100%;
+			height: auto;
+			margin-bottom: 1em;
+			display: block;
+		}
 
-body.blog #content-inner img.alignleft,
-body.blog #content-inner img.alignright,
-body.single-post #content-inner img.alignleft,
-body.single-post #content-inner img.alignright,
-body.tag #content-inner img.alignleft,
-body.tag #content-inner img.alignright {
-    width: auto;
-    display: inline-block;
+		img {
+			&.alignnone,
+			&.alignleft,
+			&.aligncenter,
+			&.alignright {
+				width: auto;
+				display: inline-block;
+			}
+
+			&.alignleft {
+				margin-right: 10px;
+			}
+
+			&.aligncenter {
+				display: block;
+			}
+
+			&.alignright {
+				margin-left: 10px;
+			}
+		}
+	}
 }
 
 body.blog #content-inner img.alignleft,

diff --git a/wp-content/themes/mozfest2012/media/css/core.min.css b/wp-content/themes/mozfest2012/media/css/core.min.css