#1334 Fix the notification fly-out

GetLuna · Sep 4, 2015 · 1e78863 · 1e78863
1 parent 26629bd
commit 1e78863
Showing 1 changed file with 51 additions and 0 deletions.
diff --git a/themes/Sixteen/style.css b/themes/Sixteen/style.css
@@ -337,6 +337,57 @@ hr {
 	background-color: #fff;
 }
 
+/* Notification fly-out */
+.notification-menu {
+	width: 400px;
+}
+
+.notification-menu .timestamp {
+	color: #aaa;
+}
+
+.notification-menu li {
+	position: relative;
+}
+
+.notification-menu li .notification-action {
+	color: #999;
+	display: none;
+	padding: 9px 0;
+	position: absolute;
+	text-align: center;
+	top: 0;
+	width: 32px;
+}
+
+.notification-menu li .notification-action.action-check {
+	right: 10px;
+}
+
+.notification-menu li .notification-action.action-delete {
+	right: 42px;
+}
+
+.notification-menu li:not(.no-hover):hover, .notification-menu li:hover a {
+	background: #f5f5f5;
+}
+
+.notification-menu li:hover .notification-action {
+	display: block;
+}
+
+.notification-menu li:hover .notification-link {
+	opacity: 0.8;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	width: 328px;
+}
+
+.notification-menu li:hover .notification-link .timestamp {
+	display: none;
+}
+
 /* Pagination */
 .pagination {
 	margin: 0;