makary/phpbb
1
0
Fork 0
mirror of https://github.com/phpbb/phpbb.git synced 2025-06-28 14:18:52 +00:00
Code Issues Projects Releases Packages Wiki Activity

[ticket/11103] Restyling notifications list for prosilver

Browse source 
PHPBB3-11103
This commit is contained in:
Nathan Guse 2012-10-16 16:47:45 -05:00
parent 61a1467c90
commit ee00688829
4 changed files with 117 additions and 85 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
phpBB/styles/prosilver/template/overall_header.html
View file

@ -134,26 +134,30 @@
<li> <li>
[ <a href="#" id="notification_list_button" title="{NOTIFICATIONS_COUNT}">{NOTIFICATIONS_COUNT}</a> ] &bull; [ <a href="#" id="notification_list_button" title="{NOTIFICATIONS_COUNT}">{NOTIFICATIONS_COUNT}</a> ] &bull;
<div id="notification_list" class="notification_list"> <div id="notification_list" class="notification_list">
<ul class="topiclist forums"> <div class="header">
{L_NOTIFICATIONS}
</div>
<ul>
<!-- BEGIN notifications --> <!-- BEGIN notifications -->
<li class="row<!-- IF notifications.UNREAD --> bg2<!-- ENDIF -->"> <li class="<!-- IF notifications.UNREAD --> bg2<!-- ENDIF -->">
<!-- IF notifications.URL --><a href="<!-- IF notifications.UNREAD -->{notifications.U_MARK_READ}<!-- ELSE -->{notifications.URL}<!-- ENDIF -->"><!-- ENDIF --> <!-- IF notifications.URL --><a href="<!-- IF notifications.UNREAD -->{notifications.U_MARK_READ}<!-- ELSE -->{notifications.URL}<!-- ENDIF -->"><!-- ENDIF -->
<span>
{notifications.AVATAR} {notifications.AVATAR}
<span class="notification_title"> <div>
{notifications.FORMATTED_TITLE} <p>{notifications.FORMATTED_TITLE}</p>
<div class="notification_time">{notifications.TIME}</div> <p>{notifications.TIME}</p>
</span>
</span> <!-- IF not notifications.URL and notifications.U_MARK_READ -->
<!-- IF notifications.URL --></a><!-- ENDIF --> <p><a href="{notifications.U_MARK_READ}">{L_MARK_READ}</a></p>
<!-- IF not notifications.URL and notifications.UNREAD -->
<span class="mark_notification_read">
<a href="{notifications.U_MARK_READ}">{L_MARK_READ}</a>
</span>
<!-- ENDIF --> <!-- ENDIF -->
</div>
<!-- IF notifications.URL --></a><!-- ENDIF -->
</li> </li>
<!-- END notifications --> <!-- END notifications -->
</ul> </ul>
<div class="footer">
<a style="display: block;" href="{U_VIEW_ALL_NOTIFICATIONS}"><span>{L_SEE_ALL}</span></a>
</div>
</div> </div>
</li> </li>
<!-- ENDIF --> <!-- ENDIF -->

24
phpBB/styles/prosilver/template/ucp_notifications.html
View file

@ -62,6 +62,7 @@
</div> </div>
<!-- ENDIF --> <!-- ENDIF -->
<div class="notification_list">
<ul class="topiclist"> <ul class="topiclist">
<li class="header"> <li class="header">
<dl> <dl>
@ -69,28 +70,21 @@
<dd class="mark">{L_MARK_READ}</dd> <dd class="mark">{L_MARK_READ}</dd>
</dl> </dl>
</li> </li>
</ul>
<div class="notification_list">
<ul class="topiclist cplist">
<!-- BEGIN notification_list --> <!-- 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 -->">
<dl> <dl>
<dt> <dt>
<!-- IF notification_list.URL --><a href="<!-- IF notification_list.UNREAD -->{notification_list.U_MARK_READ}<!-- ELSE -->{notification_list.URL}<!-- ENDIF -->"><!-- ENDIF --> <!-- IF notification_list.URL --><a href="<!-- IF notification_list.UNREAD -->{notification_list.U_MARK_READ}<!-- ELSE -->{notification_list.URL}<!-- ENDIF -->"><!-- ENDIF -->
<span>
{notification_list.AVATAR} {notification_list.AVATAR}
<span class="notification_title"> <div>
{notification_list.FORMATTED_TITLE} <p>{notification_list.FORMATTED_TITLE}</p>
<div class="notification_time">{notification_list.TIME}</div> <p>{notification_list.TIME}</p>
</span>
</span> <!-- IF not notification_list.URL and notification_list.U_MARK_READ -->
<!-- IF notification_list.URL --></a><!-- ENDIF --> <p><a href="{notification_list.U_MARK_READ}">{L_MARK_READ}</a></p>
<!-- IF not notifications.URL and notifications.UNREAD -->
<span class="mark_notification_read">
<a href="{notifications.U_MARK_READ}">{L_MARK_READ}</a>
</span>
<!-- ENDIF --> <!-- ENDIF -->
</div>
<!-- IF notification_list.URL --></a><!-- ENDIF -->
</dt> </dt>
<dd class="mark">&nbsp;<!-- IF notification_list.UNREAD --><input type="checkbox" name="mark[]" value="{notification_list.NOTIFICATION_ID}" /> <dfn>{L_MARK_READ}</dfn><!-- ENDIF -->&nbsp;</dd> <dd class="mark">&nbsp;<!-- IF notification_list.UNREAD --><input type="checkbox" name="mark[]" value="{notification_list.NOTIFICATION_ID}" /> <dfn>{L_MARK_READ}</dfn><!-- ENDIF -->&nbsp;</dd>

13
phpBB/styles/prosilver/theme/colours.css
View file

@ -1044,3 +1044,16 @@ input.disabled {
background-color: #000000; background-color: #000000;
} }
#notification_list {
background-color: #FFFFFF;
border-color: #00608F;
}
#notification_list ul li:hover {
background-color: #CFE1F6;
color: #000000;
}
#notification_list > .header, .notification_list > .footer {
border-color: #00608F;
}

73
phpBB/styles/prosilver/theme/common.css
View file

@ -670,49 +670,70 @@ p.rules a {
display: none; display: none;
position: absolute; position: absolute;
width: 330px; width: 330px;
max-height: 350px;
z-index: 1; z-index: 1;
border: 1px solid;
border-radius: 4px;
box-shadow: 4px 4px 5px;
}
#notification_list ul {
max-height: 350px;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
background-color: #FFFFFF;
} }
#notification_list ul li { #notification_list ul li {
width: ;
padding: 10px; padding: 10px;
margin: 0;
float: left;
border-bottom: 1px solid;
list-style-type: none;
font-size: 0.95em;
clear: both;
}
#notification_list ul li {
width: 310px; width: 310px;
line-height: 1.5em;
} }
.notification_list ul.topiclist dt { #notification_list ul li:last-child {
width: 70%; border-bottom: 0px;
} }
.notification_list ul li span img { #notification_list > .header {
padding: 0 5px;
font-weight: bold;
border-bottom: 1px solid;
}
#notification_list > .footer {
text-align: center;
font-size: 1.2em;
border-top: 1px solid;
}
#notification_list ul li a, .notification_list dt > a {
display: block;
}
.notification_list ul li img {
float: left; float: left;
max-width: 50px; max-width: 50px;
max-height: 50px; max-height: 50px;
margin-right: 5px;
} }
.notification_list ul li span .notification_title { #notification_list ul li div {
float: left;
width: 240px; width: 240px;
margin: 0 0 0 5px;
word-wrap: break-word;
position: relative;
top: -0.2em;
}
.notification_list ul li dl dt span .notification_title {
width: auto;
padding: 10px 0 0 0;
}
.notification_time {
margin-top: 0.5em;
}
.mark_notification_read {
clear: both;
float: left; float: left;
margin-top: 0.5em; }
.notification_list ul li p {
margin: 0;
word-wrap: break-word;
}
.notification_list ul.topiclist dt {
width: 88%;
} }