Fix style of notification

* normal line-height
* no gray background on hover
* underline on hover to detect that it is clickable
* pull primary buttons to right
* white color for primary button instead of grey (looked disabled)
* for nextcloud/server#735

css/styles.css

@@ -1,6 +1,7 @@
 .notification {
 	display: block;
 	padding: 7px 15px 50px 15px;
+	line-height: normal;
 }
 .notification:not(:last-child) {
 	border-bottom: 1px solid rgb(238, 238, 238);
@@ -49,10 +50,6 @@
 	opacity: 0.3;
 }
 
-.notification:hover {
-	background-color: #f8f8f8;
-}
-
 .notification-delete:hover {
 	opacity: 0.8 !important;
 	cursor: pointer;
@@ -95,6 +92,10 @@
 	padding: 0;
 }
 
+.notification .notification-actions .action-button.primary{
+	color: #fff;
+}
+
 .notification .notification-actions:first-child {
 	margin-left: auto;
 }
@@ -103,6 +104,9 @@
 	display: inline-block;
 	margin-right: 10px;
 }
+.notification .notification-subject:hover {
+	background-color: #f8f8f8;
+}
 
 .notification .notification-message {
 	line-height: 20px;

js/notification.js

@@ -124,7 +124,7 @@
 			_.each(actionsData, function(actionData) {
 				// FIXME: use handlebars template
 				actions.append(
-					'<button class="action-button' + (actionData.primary ? ' primary': '') + '" data-type="' + escapeHTML(actionData.type) + '" ' +
+					'<button class="action-button' + (actionData.primary ? ' primary pull-right': '') + '" data-type="' + escapeHTML(actionData.type) + '" ' +
 					'data-href="'+escapeHTML(actionData.link)+'">'+escapeHTML(actionData.label)+'</button>'
 				);
 				// TODO create event handler on click for given action type