From d969670ce03e8b0037814d91d9605f7534d93a16 Mon Sep 17 00:00:00 2001 From: Marcel Werk Date: Mon, 18 Jul 2016 13:36:03 +0200 Subject: [PATCH] Improved attachment styling --- .../install/files/style/ui/attachment.scss | 22 +++++++++---------- 1 file changed, 10 insertions(+), 12 deletions(-) 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; -- 2.20.1