Browse Source

Subtle design changes

Tobias Reich 10 years ago
parent
commit
91a2a78ee4
5 changed files with 44 additions and 49 deletions
  1. 3 3
      assets/css/content.css
  2. 20 20
      assets/css/contextmenu.css
  3. 4 4
      assets/css/infobox.css
  4. 17 22
      assets/css/message.css
  5. 0 0
      assets/min/main.css

+ 3 - 3
assets/css/content.css

@@ -156,13 +156,13 @@
 		margin-top: -1px;
 		margin-left: 12px;
 		padding: 12px 7px 3px 7px;
-		box-shadow: 0px 0px 3px #000;
+		box-shadow: 0px 0px 3px rgba(0, 0, 0, .8);
 		border-radius: 0px 0px 3px 3px;
 		border: 1px solid #fff;
 		border-top: none;
 		color: #fff;
 		font-size: 24px;
-		text-shadow: 0px 1px 0px #000;
+		text-shadow: 0px 1px 0px rgba(0, 0, 0, .4);
 		opacity: .9;
 	}
 	.album .badge.icon-star,
@@ -236,7 +236,7 @@
 		color: #fff;
 		font-size: 14px;
 		font-weight: bold;
-		text-shadow: 0px -1px 0px #000;
+		text-shadow: 0px -1px 0px rgba(0, 0, 0, .8);
 	}
 
 	/* No Content ------------------------------------------------*/

+ 20 - 20
assets/css/contextmenu.css

@@ -15,15 +15,15 @@
 	top: 0px;
 	left: 0px;
 	padding: 5px 0px 6px 0px;
-	background-color: #393939;
-	background-image: -webkit-linear-gradient(top, #444, #2d2d2d);
-	background-image: -moz-linear-gradient(top, #393939, #2d2d2d);
-	background-image: -ms-linear-gradient(top, #393939, #2d2d2d);
-	background-image: linear-gradient(top, #393939, #2d2d2d);
-	border: 1px solid rgba(0,0,0,0.7);
-	border-bottom: 1px solid rgba(0,0,0,.9);
+	background-color: #444;
+	background-image: -webkit-linear-gradient(top, #444, #2f2f2f);
+	background-image: -moz-linear-gradient(top, #444, #2f2f2f);
+	background-image: -ms-linear-gradient(top, #444, #2f2f2f);
+	background-image: linear-gradient(top, #444, #2f2f2f);
+	border: 1px solid rgba(0,0,0,0.5);
+	border-bottom: 1px solid rgba(0,0,0,.7);
 	border-radius: 5px;
-	box-shadow: 0px 4px 5px rgba(0,0,0,0.3), inset 0px 1px 0px rgba(255,255,255,0.15), inset 1px 0px 0px rgba(255,255,255,0.05), inset -1px 0px 0px rgba(255,255,255,0.05);
+	box-shadow: 0px 3px 4px rgba(0,0,0,0.25), inset 0px 1px 0px rgba(255,255,255, .1);
 	opacity: 0;
 	z-index: 1001;
 
@@ -36,15 +36,15 @@
 	.contextmenu tr {
 		font-size: 14px;
 		color: #eee;
-		text-shadow: 0px -1px 0px rgba(0,0,0,.4);
+		text-shadow: 0px -1px 0px rgba(0,0,0,.2);
 		cursor: pointer;
 	}
 	.contextmenu tr:hover {
 		background-color: #6a84f2;
-		background-image: -webkit-linear-gradient(top, #6a84f2, #3959ef);
-		background-image: -moz-linear-gradient(top, #6a84f2, #3959ef);
-		background-image: -ms-linear-gradient(top, #6a84f2, #3959ef);
-		background-image: linear-gradient(top, #6a84f2, #3959ef);
+		background-image: -webkit-linear-gradient(top, #6a84f2, #4967F0);
+		background-image: -moz-linear-gradient(top, #6a84f2, #4967F0);
+		background-image: -ms-linear-gradient(top, #6a84f2, #4967F0);
+		background-image: linear-gradient(top, #6a84f2, #4967F0);
 	}
 	.contextmenu tr.no_hover:hover {
 		cursor: inherit;
@@ -55,8 +55,8 @@
 		float: left;
 		height: 1px;
 		width: 100%;
-		background-color: #1c1c1c;
-		border-bottom: 1px solid #4a4a4a;
+		background-color: #1f1f1f;
+		border-bottom: 1px solid #4c4c4c;
 		margin: 5px 0px;
 		cursor: inherit;
 	}
@@ -74,7 +74,7 @@
 	.contextmenu tr:hover td {
 		color: #fff;
 		box-shadow: inset 0px 1px 0px rgba(255,255,255,.05);
-		text-shadow: 0px -1px 0px rgba(0,0,0,.4);
+		text-shadow: 0px -1px 0px rgba(0,0,0,.2);
 	}
 	.contextmenu tr.no_hover:hover td {
 		box-shadow: none;
@@ -90,13 +90,13 @@
 	.contextmenu #link {
 		float: right;
 		width: 140px;
-		margin: 0px -17px -1px 0px;
-		padding: 4px 6px 5px 6px;
+		margin: -1px -18px -2px -1px;
+		padding: 5px 7px 6px 7px;
 		background-color: #444;
 		color: #fff;
 		border: none;
-		border: 1px solid #111;
-		box-shadow: 0px 1px 0px rgba(255,255,255,.1);
+		border: 1px solid rgba(0, 0, 0, .5);
+		box-shadow: 0px 1px 0px rgba(255,255,255,.08);
 		outline: none;
 		border-radius: 5px;
 	}

+ 4 - 4
assets/css/infobox.css

@@ -11,7 +11,7 @@
 	height: 100%;
 	top: 0px;
 	left: 0px;
-	background-color: rgba(0,0,0,.85);
+	background-color: rgba(0,0,0,.8);
 }
 #infobox {
 	z-index: 4;
@@ -77,7 +77,7 @@
 		font-size: 16px;
 		font-weight: bold;
 		text-align: center;
-		text-shadow: 0px -1px 0px #000;
+		text-shadow: 0px -1px 0px rgba(0, 0, 0, .8);
 	}
 	#infobox .header a {
 		float: right;
@@ -85,7 +85,7 @@
 		color: #fff;
 		font-size: 20px;
 		font-weight: bold;
-		text-shadow: 0px -1px 0px #000;
+		text-shadow: 0px -1px 0px rgba(0, 0, 0, .8);
 		opacity: .5;
 		cursor: pointer;
 	}
@@ -105,7 +105,7 @@
 		color: #fff;
 		font-size: 14px;
 		font-weight: bold;
-		text-shadow: 0px -1px 0px #000;
+		text-shadow: 0px -1px 0px rgba(0, 0, 0, .8);
 	}
 
 	/* Table ------------------------------------------------*/

+ 17 - 22
assets/css/message.css

@@ -25,7 +25,7 @@
 	background-image: -ms-linear-gradient(top, rgb(75, 75, 75), rgb(45, 45, 45));
 	background-image: linear-gradient(top, rgb(75, 75, 75), rgb(45, 45, 45));
 	border-radius: 5px;
-	box-shadow: 0px 0px 5px #000, inset 0px 1px 0px rgba(255,255,255,.08), inset 1px 0px 0px rgba(255,255,255,.03), inset -1px 0px 0px rgba(255,255,255,.03);
+	box-shadow: 0px 0px 5px #000, inset 0px 1px 0px rgba(255,255,255,.08);
 
 	/* Animation */
 	-webkit-animation-name: moveUp;
@@ -47,7 +47,7 @@
 		color: #fff;
 		font-size: 16px;
 		font-weight: bold;
-		text-shadow: 0px -1px 0px #222;
+		text-shadow: 0px -1px 0px rgba(0, 0, 0, .3);
 		text-align: center;
 	}
 	.message .close {
@@ -57,7 +57,7 @@
 		padding: 12px 14px 6px 7px;
 		color: #aaa;
 		font-size: 20px;
-		text-shadow: 0px -1px 0px #222;
+		text-shadow: 0px -1px 0px rgba(0, 0, 0, .3);
 		cursor: pointer;
 	}
 	.message .close:hover {
@@ -72,7 +72,7 @@
 		padding: 12px 5% 15px 5%;
 		color: #eee;
 		font-size: 14px;
-		text-shadow: 0px -1px 0px #222;
+		text-shadow: 0px -1px 0px rgba(0, 0, 0, .3);
 		line-height: 20px;
 	}
 	.message p b {
@@ -88,20 +88,15 @@
 	.message .button {
 		float: right;
 		margin: 15px 15px 15px 0px;
-		padding: 6px 10px 8px 10px;
-		background-color: #4e4e4e;
-		background-image: -webkit-linear-gradient(top, rgb(60, 60, 60), rgb(45, 45, 45));
-		background-image: -moz-linear-gradient(top, rgb(60, 60, 60), rgb(45, 45, 45));
-		background-image: -ms-linear-gradient(top, rgb(60, 60, 60), rgb(45, 45, 45));
-		background-image: linear-gradient(top, rgb(60, 60, 60), rgb(45, 45, 45));
+		padding: 7px 10px 8px 10px;
 		color: #ccc;
 		font-size: 14px;
 		font-weight: bold;
 		text-align: center;
 		text-shadow: 0px -1px 0px #222;
 		border-radius: 5px;
-		border: 1px solid #191919;
-		box-shadow: inset 0px 1px 0px rgba(255,255,255,.1), 0px 1px 0px rgba(255,255,255,.1);
+		border: 1px solid rgba(0,0,0,.4);
+		box-shadow: inset 0px 1px 0px rgba(255,255,255,.08), 0px 1px 0px rgba(255,255,255,.05);
 		cursor: pointer;
 	}
 	.message .button:first-of-type {
@@ -109,22 +104,22 @@
 	}
 	.message .button.active {
 		color: #fff;
-		box-shadow: inset 0px 1px 0px rgba(255,255,255,.1), 0px 1px 0px rgba(255,255,255,.1), 0px 0px 4px #005ecc;
+		box-shadow: inset 0px 1px 0px rgba(255,255,255,.08), 0px 1px 0px rgba(255,255,255,.1), 0px 0px 4px #005ecc;
 	}
 	.message .button:hover {
 		background-color: #565757;
-		background-image: -webkit-linear-gradient(top, rgb(80, 80, 80), rgb(57, 57, 57));
-		background-image: -moz-linear-gradient(top, rgb(80, 80, 80), rgb(57, 57, 57));
-		background-image: -ms-linear-gradient(top, rgb(80, 80, 80), rgb(57, 57, 57));
-		background-image: linear-gradient(top, rgb(80, 80, 80), rgb(57, 57, 57));
+		background-image: -webkit-linear-gradient(top, rgb(60, 60, 60), rgb(57, 57, 57));
+		background-image: -moz-linear-gradient(top, rgb(60, 60, 60), rgb(57, 57, 57));
+		background-image: -ms-linear-gradient(top, rgb(60, 60, 60), rgb(57, 57, 57));
+		background-image: linear-gradient(top, rgb(60, 60, 60), rgb(57, 57, 57));
 	}
 	.message .button:active,
 	.message .button.pressed {
 		background-color: #393939;
-		background-image: -webkit-linear-gradient(top, rgb(57, 57, 57), rgb(70, 70, 70));
-		background-image: -moz-linear-gradient(top, rgb(57, 57, 57), rgb(70, 70, 70));
-		background-image: -ms-linear-gradient(top, rgb(57, 57, 57), rgb(70, 70, 70));
-		background-image: linear-gradient(top, rgb(57, 57, 57), rgb(70, 70, 70));
+		background-image: -webkit-linear-gradient(top, rgb(57, 57, 57), rgb(60, 60, 60));
+		background-image: -moz-linear-gradient(top, rgb(57, 57, 57), rgb(60, 60, 60));
+		background-image: -ms-linear-gradient(top, rgb(57, 57, 57), rgb(60, 60, 60));
+		background-image: linear-gradient(top, rgb(57, 57, 57), rgb(60, 60, 60));
 	}
 
 	/* Sign in ------------------------------------------------*/
@@ -213,7 +208,7 @@
 			color: #fff;
 			font-size: 14px;
 			font-weight: 700;
-			text-shadow: 0 -1px 0 #222;
+			text-shadow: 0 -1px 0 rgba(0, 0, 0, .3);
 		}
 		.message .choice p {
 			margin-top: 2px;

File diff suppressed because it is too large
+ 0 - 0
assets/min/main.css


Some files were not shown because too many files changed in this diff