From: Marcel Werk <burntime@woltlab.com>
Date: Mon, 18 Jul 2016 11:36:03 +0000 (+0200)
Subject: Improved attachment styling
X-Git-Tag: 3.0.0_Beta_1~1056
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=d969670ce03e8b0037814d91d9605f7534d93a16;p=GitHub%2FWoltLab%2FWCF.git

Improved attachment styling
---

diff --git a/wcfsetup/install/files/style/ui/attachment.scss b/wcfsetup/install/files/style/ui/attachment.scss
index bd95199a03..d12357115f 100644
--- a/wcfsetup/install/files/style/ui/attachment.scss
+++ b/wcfsetup/install/files/style/ui/attachment.scss
@@ -12,9 +12,7 @@
 }
 
 .attachmentThumbnail {
-	border-radius: 3px;
-	box-shadow: 0 0 1px #aaa;
-	background: #fff;
+	box-shadow: 0 0 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
 	margin-bottom: 15px !important;
 	margin-right: 15px !important;
 	position: relative;
@@ -25,11 +23,11 @@
 	
 	.attachmentThumbnailContainer {
 		position: relative;
+		padding: 5px 5px 0;
 	}
 	
 	.attachmentThumbnailImage {
 		align-items: center;
-		border-radius: 3px 3px 0 0;
 		background-color: #333;
 		display: flex;
 		justify-content: center;
@@ -72,13 +70,13 @@
 	
 	.attachmentThumbnailData {
 		backface-visibility: hidden;
-		background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, .7) 100%);
-		border-radius: 3px 3px 0 0;
-		height: 100%;
+		background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 65%, rgba(0, 0, 0, .5) 100%);
+		bottom: 0;
+		left: 5px;
 		position: absolute;
-		top: 0;
-		transform: translate3d(0,0,0);
-		width: 100%;
+		right: 5px;
+		top: 5px;
+		transform: translate3d(0, 0, 0);
 	}
 	
 	.attachmentFilename {
@@ -88,7 +86,7 @@
 		padding: 10px;
 		position: absolute;
 		text-overflow: ellipsis;
-		text-shadow: 0 1px 2px rgba(0, 0, 0, .8);
+		text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
 		width: 100%;
 		white-space: nowrap;
     	
@@ -97,7 +95,7 @@
 	
 	.attachmentMetaData {
 		color: $wcfContentDimmedText;
-		padding: 10px;
+		padding: 10px 15px;
 		
 		li:not(:last-child) {
 			margin-right: 10px;