Do some minor optimizations on the admin theme

* Add noisy background images
* Rename SCSS/CSS file "main" to "bright"
* Remove uppercase text-transform for headings
* Replace hardcoded font sizes with SCSS variables
* Decrease font size for category link in post item template
* Move right-floated ID before the heading in the HTML markup to ensure
  it does not moves to the second line if the heading text is too wide.

5 files changed, 20 insertions, 20 deletions

diff --git a/theme/admin/rsrc/css/main.css b/theme/admin/rsrc/css/bright.css
index 95fce4b..3525c89 100644
--- a/theme/admin/rsrc/css/main.css
+++ b/theme/admin/rsrc/css/bright.css
@@ -65,7 +65,6 @@ a:focus {
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
 h1, h2, h3 {
   margin-bottom: 0;
-  text-transform: uppercase;
 }
 h1 + p, h2 + p, h3 + p {
   margin-top: 0;
@@ -98,7 +97,7 @@ html, body {
 html {
   font-size: 1.25rem;
   color: #333;
-  background: #DDD;
+  background: url("../img/noise-bright.png") #DDD;
   -webkit-hyphens: auto;
   word-break: break-word;
   hyphens: auto;
@@ -431,15 +430,16 @@ img {
   padding: 0;
   list-style: none;
 }
-.item-meta-right {
-  float: right;
-}
 .item-meta li {
   display: inline-block;
 }
 .item-meta li + li:before {
   content: " – ";
 }
+.item-meta li.item-meta-right {
+  float: right;
+  font-size: 0.6rem;
+}
 .item-meta li.item-meta-right:before {
   content: none;
 }
diff --git a/theme/admin/rsrc/css/main.scss b/theme/admin/rsrc/css/bright.scss
index a3ae746..8173497 100644
--- a/theme/admin/rsrc/css/main.scss
+++ b/theme/admin/rsrc/css/bright.scss
@@ -1,7 +1,7 @@
 /*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 # Content background and border color
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
-$htmlBackgroundColor: #DDD;
+$htmlBackground: url("../img/noise-bright.png") #DDD;
 $backgroundColor: #FFF;
 $backgroundColorEmphasize: #EEE;
 $borderColor: #AAA;
diff --git a/theme/admin/rsrc/css/dark.css b/theme/admin/rsrc/css/dark.css
index ece8bba..d7ac53d 100644
--- a/theme/admin/rsrc/css/dark.css
+++ b/theme/admin/rsrc/css/dark.css
@@ -65,7 +65,6 @@ a:focus {
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
 h1, h2, h3 {
   margin-bottom: 0;
-  text-transform: uppercase;
 }
 h1 + p, h2 + p, h3 + p {
   margin-top: 0;
@@ -98,7 +97,7 @@ html, body {
 html {
   font-size: 1.25rem;
   color: #9DAAB7;
-  background: #4D535B;
+  background: url("../img/noise-dark.png") #3D434B;
   -webkit-hyphens: auto;
   word-break: break-word;
   hyphens: auto;
@@ -431,15 +430,16 @@ img {
   padding: 0;
   list-style: none;
 }
-.item-meta-right {
-  float: right;
-}
 .item-meta li {
   display: inline-block;
 }
 .item-meta li + li:before {
   content: " – ";
 }
+.item-meta li.item-meta-right {
+  float: right;
+  font-size: 0.6rem;
+}
 .item-meta li.item-meta-right:before {
   content: none;
 }
diff --git a/theme/admin/rsrc/css/dark.scss b/theme/admin/rsrc/css/dark.scss
index 4388715..e75e280 100644
--- a/theme/admin/rsrc/css/dark.scss
+++ b/theme/admin/rsrc/css/dark.scss
@@ -1,7 +1,7 @@
 /*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 # Content background and border color
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
-$htmlBackgroundColor: #4D535B;
+$htmlBackground: url("../img/noise-dark.png") #3D434B;
 $backgroundColorEmphasize: #32373E;
 $backgroundColor: #3D434B;
 $borderColor: #1D232B;
diff --git a/theme/admin/rsrc/css/import/_styles.scss b/theme/admin/rsrc/css/import/_styles.scss
index 88ef8b4..1cac455 100644
--- a/theme/admin/rsrc/css/import/_styles.scss
+++ b/theme/admin/rsrc/css/import/_styles.scss
@@ -28,7 +28,6 @@ a {
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
 h1, h2, h3 {
 	margin-bottom: 0;
-	text-transform: uppercase;
 
 	+p {
 		margin-top: 0;
@@ -63,7 +62,7 @@ html, body {
 html {
 	font-size: 1.25rem;
 	color: $textColor;
-	background: $htmlBackgroundColor;
+	background: $htmlBackground;
 	-webkit-hyphens: auto;
 	word-break: break-word;
 	hyphens: auto;
@@ -432,7 +431,7 @@ img {
 	&-id {
 		float: right;
 		color: $textColorLight;
-		font-size: 0.7rem;
+		font-size: $fontSize;
 		font-weight: normal;
 	}
 
@@ -441,10 +440,6 @@ img {
 		padding: 0;
 		list-style: none;
 
-		&-right {
-			float: right;
-		}
-
 		li {
 			display: inline-block;
 
@@ -452,6 +447,11 @@ img {
 				content: " – ";
 			}
 
+			&.item-meta-right {
+				float: right;
+				font-size: $fontSizeSmall;
+			}
+
 			&.item-meta-right:before {
 				content: none;
 			}
@@ -640,7 +640,7 @@ input, select, textarea {
 	background: $backgroundColorEmphasize;
 	color: $textColorLight;
 	font-family: inherit;
-	font-size: 0.7rem;
+	font-size: $fontSize;
 	padding: 0.25rem;
 	border: 0.05rem solid $borderColor;
 	box-sizing: border-box;