[ticket/12608] Add styling (CSS class) options to notifications

This will allow different notifications to have different styles

PHPBB3-12608

phpBB/language/en/common.php

@@ -442,7 +442,7 @@ $lang = array_merge($lang, array(
 	'NOTIFICATION_BOOKMARK'				=> array(
 		1	=> '<strong>Reply</strong> from %1$s in bookmarked topic:',
 	),
-	'NOTIFICATION_FORUM'				=> 'Forum: "%1$s"',
+	'NOTIFICATION_FORUM'				=> '<em>Forum:</em> %1$s',
 	'NOTIFICATION_GROUP_REQUEST'		=> '<strong>Group request</strong> from %1$s to join the group %2$s.',
 	'NOTIFICATION_GROUP_REQUEST_APPROVED'	=> '<strong>Group request approved</strong> to join the group %1$s.',
 	'NOTIFICATION_PM'					=> '<strong>Private Message</strong> from %1$s:',
@@ -456,7 +456,7 @@ $lang = array_merge($lang, array(
 		1	=> '<strong>Quoted</strong> by %1$s in:',
 	),
 	'NOTIFICATION_REFERENCE'			=> '"%1$s"',
-	'NOTIFICATION_REASON'				=> 'Reason: "%1$s".',
+	'NOTIFICATION_REASON'				=> '<em>Reason:</em> %1$s.',
 	'NOTIFICATION_REPORT_PM'			=> '<strong>Private Message reported</strong> by %1$s:',
 	'NOTIFICATION_REPORT_POST'			=> '<strong>Post reported</strong> by %1$s:',
 	'NOTIFICATION_REPORT_CLOSED'   		=> '<strong>Report closed</strong> by %1$s for:',

phpBB/phpbb/notification/type/base.php

@@ -309,6 +309,8 @@ abstract class base implements \phpbb\notification\type\type_interface
 		return array(
 			'NOTIFICATION_ID'	=> $this->notification_id,
 
+			'STYLING'			=> $this->get_styling(),
+
 			'AVATAR'			=> $this->get_avatar(),
 
 			'FORMATTED_TITLE'	=> $this->get_title(),
@@ -342,6 +344,16 @@ abstract class base implements \phpbb\notification\type\type_interface
 		return false;
 	}
 
+	/**
+	* Get the styling of the notification (fall back)
+	*
+	* @return string
+	*/
+	public function get_styling()
+	{
+		return '';
+	}
+
 	/**
 	* Get the user's avatar (fall back)
 	*

phpBB/phpbb/notification/type/report_pm.php

@@ -30,6 +30,16 @@ class report_pm extends \phpbb\notification\type\pm
 		return 'report_pm';
 	}
 
+	/**
+	* Get the styling of the notification
+	*
+	* @return string
+	*/
+	public function get_styling()
+	{
+		return 'reported';
+	}
+
 	/**
 	* Language key used to output the text
 	*

phpBB/phpbb/notification/type/report_post.php

@@ -29,6 +29,16 @@ class report_post extends \phpbb\notification\type\post_in_queue
 		return 'report_post';
 	}
 
+	/**
+	* Get the styling of the notification
+	*
+	* @return string
+	*/
+	public function get_styling()
+	{
+		return 'reported';
+	}
+
 	/**
 	* Language key used to output the text
 	*

phpBB/phpbb/notification/type/type_interface.php

@@ -87,6 +87,13 @@ interface type_interface
 	*/
 	public function load_special($data, $notifications);
 
+	/**
+	* Get the styling of the notification
+	*
+	* @return string
+	*/
+	public function get_styling();
+
 	/**
 	* Get the HTML formatted title of this notification
 	*

phpBB/styles/prosilver/template/notification_dropdown.html

@@ -18,13 +18,13 @@
 				</li>
 			<!-- ENDIF -->
 			<!-- BEGIN notifications -->
-				<li class="<!-- IF notifications.UNREAD --> bg2<!-- ENDIF -->">
+				<li class="<!-- IF notifications.UNREAD --> bg2<!-- ENDIF --><!-- IF notifications.STYLING --> {notifications.STYLING}<!-- ENDIF -->">
 					<!-- IF notifications.URL -->
 						<a href="<!-- IF notifications.UNREAD -->{notifications.U_MARK_READ}" class="notification-block" data-real-url="{notifications.URL}<!-- ELSE -->{notifications.URL}<!-- ENDIF -->">
 					<!-- ENDIF -->
 						<!-- IF notifications.AVATAR -->{notifications.AVATAR}<!-- ELSE --><img src="{T_THEME_PATH}/images/no_avatar.gif" alt="" /><!-- ENDIF -->
 						<div class="notification_text">
-							<p class="title">{notifications.FORMATTED_TITLE}</p>
+							<p class="notification-title">{notifications.FORMATTED_TITLE}</p>
 							<!-- IF notifications.REFERENCE --><p class="notification-reference">{notifications.REFERENCE}</p><!-- ENDIF -->
 							<!-- IF notifications.FORUM --><p class="notification-forum">{notifications.FORUM}</p><!-- ENDIF -->
 							<!-- IF notifications.REASON --><p class="notification-reason">{notifications.REASON}</p><!-- ENDIF -->

phpBB/styles/prosilver/template/ucp_notifications.html

@@ -65,7 +65,7 @@
 				</ul>
 				<ul class="topiclist cplist two-columns">
 					<!-- BEGIN notification_list -->
-						<li class="row<!-- IF notification_list.UNREAD --> bg3<!-- ELSE --><!-- IF notification_list.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF --><!-- ENDIF -->">
+						<li class="row<!-- IF notification_list.UNREAD --> bg3<!-- ELSE --><!-- IF notification_list.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF --><!-- ENDIF --><!-- IF notification_list.STYLING --> {notification_list.STYLING}<!-- ENDIF -->">
 							<dl>
 								<dt>
 									<div class="list-inner">										

phpBB/styles/prosilver/theme/colours.css

@@ -235,6 +235,15 @@ p.post-notice.reported:before, p.post-notice.error:before {
 	background-image: url("./images/icon_topic_reported.gif");
 }
 
+.notification_list p.notification-time {
+	color: #4C5D77;
+}
+
+.notification_list .reported p.notifications_title strong,
+.notification_list .reported p.notification-title strong {
+	color: #D31141;
+}
+
 /*
 --------------------------------------------------------------
 Colours and backgrounds for links.css

phpBB/styles/prosilver/theme/common.css

@@ -1199,7 +1199,7 @@ form > p.post-notice strong {
 	white-space: nowrap;
 }
 
-.notification_list ul li p.notification-time {
+.notification_list p.notification-time {
 	font-size: 0.9em;
 	margin: 0;
 	text-align: right;