Improve image thumbnails and files table

3 files changed, 52 insertions, 84 deletions

diff --git a/assets/css/src/dropdown.css b/assets/css/src/dropdown.css
index 8f13f5bf..7d967b06 100644
--- a/assets/css/src/dropdown.css
+++ b/assets/css/src/dropdown.css
@@ -71,11 +71,16 @@ ul.dropdown-submenu-open {
     padding-right: 10px;
 }
 
+.dropdown-menu-link-text,
 .dropdown-menu-link-icon {
     color: #333;
     text-decoration: none;
 }
 
+.dropdown-menu-link-text:hover {
+    text-decoration: underline;
+}
+
 /* textarea dropdown */
 .textarea-dropdown {
     list-style: none;
diff --git a/assets/css/src/files.css b/assets/css/src/files.css
new file mode 100644
index 00000000..af87d8d2
--- /dev/null
+++ b/assets/css/src/files.css
@@ -0,0 +1,45 @@
+.file-thumbnails {
+    display: -webkit-flex;
+    display: flex;
+    -webkit-flex-direction: row;
+    flex-direction: row;
+    -webkit-justify-content: space-between;
+    justify-content: space-between;
+    -webkit-flex-wrap: wrap;
+    flex-wrap: wrap;
+}
+
+.file-thumbnail {
+    width: 250px;
+    border: 1px solid #efefef;
+    border-radius: 5px;
+    margin-bottom: 20px;
+    box-shadow: 2px 2px 5px -2px rgba(0, 0, 0, 0.55);
+}
+
+.file-thumbnail img {
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+}
+
+.file-thumbnail img:hover {
+    opacity: 0.5;
+}
+
+.file-thumbnail-content {
+    padding-left: 8px;
+    padding-right: 8px;
+}
+
+.file-thumbnail-title {
+    font-weight: 700;
+    font-size: 0.9em;
+    color: #555;
+}
+
+.file-thumbnail-description {
+    font-size: 0.8em;
+    color: #aaa;
+    margin-top: 8px;
+    margin-bottom: 5px;
+}
diff --git a/assets/css/src/task.css b/assets/css/src/task.css
index fd5b8efc..57acb52a 100644
--- a/assets/css/src/task.css
+++ b/assets/css/src/task.css
@@ -118,21 +118,11 @@ span.task-board-date-overdue {
 }
 
 /* task score */
-.task-score {
-    font-weight: bold;
-}
-
 .task-board .task-score {
+    font-weight: bold;
     font-size: 1.1em;
 }
 
-.task-show-details .task-score {
-    position: absolute;
-    bottom: 5px;
-    right: 5px;
-    font-size: 2em;
-}
-
 /* task age */
 .task-board-closed,
 .task-board-days {
@@ -167,7 +157,7 @@ span.task-board-date-overdue {
     display: none;
 }
 
-/* task view */
+/* task summary */
 #task-summary {
     margin-bottom: 15px;
 }
@@ -204,38 +194,6 @@ span.task-board-date-overdue {
     line-height: 23px;
 }
 
-.task-show-section {
-    margin-top: 30px;
-    margin-bottom: 20px;
-}
-
-.task-show-files a {
-    font-weight: bold;
-    text-decoration: none;
-}
-
-.task-show-files li {
-    margin-left: 25px;
-    list-style-type: square;
-    line-height: 25px;
-}
-
-.task-show-file-actions {
-    font-size: 0.75em;
-}
-
-.task-show-file-actions:before {
-    content: " [";
-}
-
-.task-show-file-actions:after {
-    content: "]";
-}
-
-.task-show-file-actions a {
-    color: #333;
-}
-
 .task-show-description {
     border-left: 4px solid #333;
     padding-left: 20px;
@@ -267,46 +225,6 @@ span.task-board-date-overdue {
     text-decoration: line-through;
 }
 
-.task-show-images {
-    list-style-type: none;
-}
-
-.task-show-images li img {
-    width: 100%;
-}
-
-.task-show-images li .img_container {
-    width: 250px;
-    height: 100px;
-    overflow: hidden;
-}
-
-.task-show-images li {
-    padding: 10px;
-    overflow: auto;
-    width: 250px;
-    min-height: 120px;
-    display: inline-block;
-    vertical-align: top;
-}
-
-.task-show-images li p{
-    padding: 5px;
-    font-weight: bold;
-}
-
-.task-show-images li:hover {
-    background: #eee;
-}
-
-.task-show-image-actions {
-    margin-left: 5px;
-}
-
-.task-show-file-table {
-    width: auto;
-}
-
 .flag-milestone {
     color: green;
 }