1
0
mirror of https://github.com/phpbb/phpbb.git synced 2025-07-30 21:40:43 +02:00

Merge remote-tracking branch 'PayBas/ticket/12608' into develop-ascraeus

* PayBas/ticket/12608:
  [ticket/12608] Change CSS classes to prevent styling conflicts
  [ticket/12608] Add subSilver
  [ticket/12608] Changed get_styling() to get_style_class()
  [ticket/12608] Remove somewhat redundant reported color style
  [ticket/12608] Improved LTR and various bugfixes
  [ticket/12608] Clean up whitespace
  [ticket/12608] Add styling (CSS class) options to notifications
  [ticket/12608] Updated tests
  [ticket/12608] Improve notifications drop-down menu styling in header
This commit is contained in:
Cesar G
2014-06-22 15:44:06 -07:00
22 changed files with 430 additions and 78 deletions

View File

@@ -18,14 +18,17 @@
</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 not notifications.URL --> no-url<!-- ENDIF -->">
<!-- IF notifications.URL -->
<a href="<!-- IF notifications.UNREAD -->{notifications.U_MARK_READ}" data-real-url="{notifications.URL}<!-- ELSE -->{notifications.URL}<!-- ENDIF -->">
<a class="notification-block" href="<!-- IF notifications.UNREAD -->{notifications.U_MARK_READ}" 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>{notifications.FORMATTED_TITLE}</p>
<p>&raquo; {notifications.TIME}</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 -->
<p class="notification-time">{notifications.TIME}</p>
</div>
<!-- IF notifications.URL --></a><!-- ENDIF -->
<!-- IF notifications.UNREAD -->

View File

@@ -65,19 +65,18 @@
</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">
<!-- IF notification_list.AVATAR -->{notification_list.AVATAR}<!-- ELSE --><img src="{T_THEME_PATH}/images/no_avatar.gif" alt="" /><!-- ENDIF -->
<div class="notifications">
<!-- IF notification_list.URL --><a href="<!-- IF notification_list.UNREAD -->{notification_list.U_MARK_READ}<!-- ELSE -->{notification_list.URL}<!-- ENDIF -->"><!-- ENDIF -->
<p class="notifications_title">{notification_list.FORMATTED_TITLE}</p>
<!-- IF notification_list.URL --></a><!-- ENDIF -->
<p class="notifications_title">{notification_list.FORMATTED_TITLE}<!-- IF notification_list.REFERENCE --> {notification_list.REFERENCE}<!-- ENDIF --></p>
<!-- IF notification_list.URL --></a><!-- ENDIF -->
<!-- IF notification_list.FORUM --><p class="notifications_forum">{notification_list.FORUM}</p><!-- ENDIF -->
<!-- IF notification_list.REASON --><p class="notifications_reason">{notification_list.REASON}</p><!-- ENDIF -->
<p class="notifications_time">{notification_list.TIME}</p>
<!-- IF not notification_list.URL and notification_list.U_MARK_READ -->
<p><a href="{notification_list.U_MARK_READ}">{L_MARK_READ}</a></p>
<!-- ENDIF -->
</div>
</div>
</dt>

View File

@@ -112,6 +112,32 @@
padding-right: 10px;
}
.rtl .dropdown-extended .header .header_settings {
float: left;
}
/* Notifications
----------------------------------------*/
.rtl .notification_list ul li img {
float: right;
margin-left: 5px;
margin-right: 0;
}
.rtl .notification_list div.notifications {
margin-left: 0;
margin-right: 50px;
}
.rtl .notification_text {
margin-left: 0;
margin-right: 58px;
}
.rtl .notification_list p.notification-time {
text-align: left;
}
/* Responsive breadcrumbs
----------------------------------------*/
.rtl .breadcrumbs .crumb {

View File

@@ -1173,3 +1173,14 @@ ul.linklist li.responsive-menu a.responsive-menu-link:hover:before, ul.linklist
#minitabs .dropdown-contents {
background-color: #F1F8FF;
}
/* Notifications
---------------------------------------- */
.notification_list p.notification-time {
color: #4C5D77;
}
li.notification-reported strong, li.notification-disapproved strong {
color: #D31141;
}

View File

@@ -1101,7 +1101,7 @@ form > p.post-notice strong {
display: none;
position: absolute;
left: 0;
width: 330px;
width: 340px;
z-index: 1;
top: 22px;
}
@@ -1115,7 +1115,7 @@ form > p.post-notice strong {
.dropdown-extended ul li {
padding: 0;
margin: 0;
margin: 0 !important;
float: none;
border-bottom: 1px solid;
list-style-type: none;
@@ -1160,8 +1160,8 @@ form > p.post-notice strong {
font-size: 1.1em;
}
.dropdown-extended ul li a{
padding: 10px;
.dropdown-extended ul li a, .dropdown-extended ul li.no-url {
padding: 8px;
}
.dropdown-extended .footer > a {
@@ -1176,28 +1176,55 @@ form > p.post-notice strong {
.notification_list ul li img {
float: left;
max-height: 50px;
max-width: 50px;
width: auto !important;
height: auto !important;
margin-right: 5px;
}
.notification_list ul li p {
margin: 0;
margin-bottom: 4px;
font-size: 1em;
}
.notification_list p.notification-reference,
.notification_list p.notification-location,
.notification_list li a p.notification-reason {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.notification_list p.notification-time {
font-size: 10px;
margin: 0;
text-align: right;
}
.notification_list div.notifications {
margin-left: 50px;
padding: 5px;
}
.notification_list div.notifications a {
display: block;
}
.notification_list p.notifications_title {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 13px !important;
}
.notification_list p.notifications_title strong {
font-weight: bold;
}
.notification_list p.notifications_time {
font-size: 11px !important;
font-size: 10px !important;
}
.notification_text {
margin-left: 58px;
}
.notification_text:after {

View File

@@ -62,6 +62,9 @@ ul.linklist li.small-icon > a, ul.linklist li.breadcrumbs span:first-child > a {
top: 50%;
width: 30px;
height: 40px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.dropdown-extended li:hover a.mark_read {

View File

@@ -169,7 +169,7 @@ function marklist(id, name, state)
</div>
<div class="notification_scroll">
<table class="tablebg" width="310" cellspacing="1">
<table class="tablebg" cellspacing="1">
<!-- BEGIN notifications -->
<tr class="row<!-- IF notifications.UNREAD -->2<!-- ELSE -->1<!-- ENDIF -->">
<td width="50">
@@ -180,7 +180,11 @@ function marklist(id, name, state)
<!-- IF notifications.URL --><a href="<!-- IF notifications.UNREAD -->{notifications.U_MARK_READ}<!-- ELSE -->{notifications.URL}<!-- ENDIF -->"><!-- ENDIF -->
{notifications.FORMATTED_TITLE}
<!-- IF notifications.URL --></a><!-- ENDIF -->
<br />&raquo; {notifications.TIME}
<!-- IF notifications.REFERENCE --><br /><span class="notification-reference">{notifications.REFERENCE}</span><!-- ENDIF -->
<!-- IF notifications.FORUM --><br /><span class="notification-forum">{notifications.FORUM}</span><!-- ENDIF -->
<!-- IF notifications.REASON --><br /><span class="notification-reason">{notifications.REASON}</span><!-- ENDIF -->
<br /><span class="notification-time">{notifications.TIME}</span>
<!-- IF not notifications.URL and notifications.UNREAD -->
<br /><a href="{notifications.U_MARK_READ}">{L_MARK_READ}</a>
<!-- ENDIF -->

View File

@@ -92,9 +92,11 @@
<td valign="top">
<span class="gen">
<!-- IF notification_list.URL --><a href="<!-- IF notification_list.UNREAD -->{notification_list.U_MARK_READ}<!-- ELSE -->{notification_list.URL}<!-- ENDIF -->"><!-- ENDIF -->
<strong>{notification_list.FORMATTED_TITLE}</strong>
{notification_list.FORMATTED_TITLE}<!-- IF notification_list.REFERENCE --> {notification_list.REFERENCE}<!-- ENDIF -->
<!-- IF notification_list.URL --></a><!-- ENDIF --><br />
{notification_list.TIME}
<!-- IF notification_list.FORUM --><span class="notifications_forum">{notification_list.FORUM}</span><br /><!-- ENDIF -->
<!-- IF notification_list.REASON --><span class="notifications_reason">{notification_list.REASON}</span><br /><!-- ENDIF -->
<span class="notifications_time">{notification_list.TIME}</span>
</span>
</td>
<td align="center">

View File

@@ -1189,12 +1189,21 @@ a.imageset {
overflow-x: hidden;
}
#notification_list table {
width: 100%;
}
#notification_list .notification_title {
padding: 5px;
padding: 3px;
}
#notification_list .notification_title:after {
clear: both;
content: '';
display: block;
}
#notification_list .header {
width: 298px;
padding: 5px;
font-weight: bold;
border: 1px solid #A9B8C2;
@@ -1208,7 +1217,6 @@ a.imageset {
}
#notification_list .footer {
width: 300px;
text-align: center;
font-size: 1.2em;
border: 1px solid #A9B8C2;
@@ -1223,3 +1231,12 @@ a.imageset {
#notification_list .footer > a {
display: block;
}
#notification_list .notification-time {
font-size: 0.9em;
float: right;
}
.notification_list .notifications_time {
font-size: 0.8em;
}