app mgmt app level design enhancements

1 files changed, 33 insertions, 27 deletions

diff --git a/settings/css/settings.css b/settings/css/settings.css
index eb6b0f54053..999a7f9ea4a 100644
--- a/settings/css/settings.css
+++ b/settings/css/settings.css
@@ -194,38 +194,42 @@ input.userFilter {width: 200px;}
 	background: #fbb;
 }
 
-.recommendedapp {
-	font-size: 11px;
-	background-position: left center;
-	padding-left: 18px;
-	vertical-align: top;
+span.version {
+	margin-left: 1em;
+	margin-right: 1em;
+	color: #555;
 }
-span.version { margin-left:1em; margin-right:1em; color:#555; }
 
 #app-navigation .app-external,
-.app-version,
-.recommendedapp {
+.app-version {
 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
 	filter: alpha(opacity=50);
 	opacity: .5;
 }
 
 .app-level {
-	color: white;
+	margin-top: 8px;
 }
-
-.app-level .official, .app-level .approved {
-	background-color: #E8C805;
-	border-radius: 2px;
-	margin-left: 5px;
-	padding: 3px;
+.app-level span {
+	color: #555;
+	background-color: transparent;
+	border: 1px solid #555;
+	border-radius: 3px;
+	padding: 3px 6px;
+}
+.app-level .official {
+	border-color: #37ce02;
+	background-position: left center;
+	background-position: 5px center;
+	padding-left: 25px;
+}
+.app-level .approved {
+	border-color: #e8c805;
 }
-
 .app-level .experimental {
-	background-color: #F02405;
-	border-radius: 2px;
-	margin-left: 5px;
-	padding: 3px;
+	background-color: #ce3702;
+	border-color: #ce3702;
+	color: #fff;
 }
 
 #apps-list {
@@ -235,6 +239,9 @@ span.version { margin-left:1em; margin-right:1em; color:#555; }
 .section {
 	position: relative;
 }
+.section h2.app-name {
+	margin-bottom: 8px;
+}
 .app-image {
 	float: left;
 	padding-right: 10px;
@@ -254,8 +261,7 @@ span.version { margin-left:1em; margin-right:1em; color:#555; }
 .app-name,
 .app-version,
 .app-score,
-.app-level,
-.recommendedapp {
+.app-level {
 	display: inline-block;
 }
 
@@ -286,7 +292,7 @@ span.version { margin-left:1em; margin-right:1em; color:#555; }
 
 .app-dependencies {
 	margin-top: 10px;
-	color: #c33;
+	color: #ce3702;
 }
 
 .missing-dependencies {
@@ -321,7 +327,7 @@ table.grid td.date{
 #security-warning li {
 	list-style: initial;
 	margin: 10px 0;
-	color: #c33;
+	color: #ce3702;
 }
 #shareAPI p { padding-bottom: 0.8em; }
 #shareAPI input#shareapiExpireAfterNDays {width: 25px;}
@@ -372,12 +378,12 @@ table.grid td.date{
 }
 
 span.success {
-        background: #37ce02;
-        border-radius: 3px;
+	 background: #37ce02;
+	 border-radius: 3px;
 }
 
 span.error {
-        background: #ce3702;
+	 background: #ce3702;
 }