1
0
mirror of https://github.com/phpbb/phpbb.git synced 2025-05-02 22:02:07 +02:00

[ticket/12265] Simplify contact icon design and move to dropdown.

PHPBB3-12265
This commit is contained in:
Cesar G 2014-03-20 02:33:19 -07:00
parent 7d4be1fe19
commit eae37267a5
16 changed files with 149 additions and 66 deletions

View File

@ -167,6 +167,7 @@ $lang = array_merge($lang, array(
'CONGRATULATIONS' => 'Congratulations to',
'CONNECTION_FAILED' => 'Connection failed.',
'CONNECTION_SUCCESS' => 'Connection was successful!',
'CONTACT_USER' => 'Contact',
'COOKIES_DELETED' => 'All board cookies successfully deleted.',
'CURRENT_TIME' => 'It is currently %s',

View File

@ -47,7 +47,6 @@ $lang = array_merge($lang, array(
'BEFORE' => 'Before',
'CC_EMAIL' => 'Send a copy of this email to yourself.',
'CONTACT_USER' => 'Contact',
'DEST_LANG' => 'Language',
'DEST_LANG_EXPLAIN' => 'Select an appropriate language (if available) for the recipient of this message.',

View File

@ -35,24 +35,55 @@
<!-- IF U_PM or U_EMAIL or U_JABBER -->
<dd class="profile-contact">
<ul class="profile-icons">
<!-- EVENT ucp_pm_viewmessage_contact_fields_before -->
<!-- IF U_PM --><li class="pm-icon"><a href="{U_PM}" title="{L_PRIVATE_MESSAGE}"><span>{L_PRIVATE_MESSAGE}</span></a></li><!-- ENDIF -->
<!-- IF U_EMAIL --><li class="email-icon"><a href="{U_EMAIL}" title="{L_SEND_EMAIL_USER} {MESSAGE_AUTHOR}"><span>{L_SEND_EMAIL_USER} {MESSAGE_AUTHOR}</span></a></li><!-- ENDIF -->
<!-- IF U_JABBER --><li class="jabber-icon"><a href="{U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span>{L_JABBER}</span></a></li><!-- ENDIF -->
{% set CELL_BREAK = {1: 1, 2: 1, 3: 2, 4: 2, 5: 3, 6: 3, 7: 4, 8: 4, 9: 5, 10: 5, 11: 4, 12: 4, 13: 5, 14: 5, 16: 4} %}
{% set CONTACT_CNT = 0 %}
{% set CNT = 0 %}
<!-- IF U_PM -->{% set CONTACT_CNT = CONTACT_CNT + 1 %}<!-- ENDIF -->
<!-- IF U_EMAIL -->{% set CONTACT_CNT = CONTACT_CNT + 1 %}<!-- ENDIF -->
<!-- IF U_JABBER -->{% set CONTACT_CNT = CONTACT_CNT + 1 %}<!-- ENDIF -->
<!-- BEGIN custom_fields -->
<!-- IF custom_fields.S_PROFILE_CONTACT -->
<li class="{custom_fields.PROFILE_FIELD_IDENT}-icon">
<a href="<!-- IF custom_fields.PROFILE_FIELD_CONTACT -->{custom_fields.PROFILE_FIELD_CONTACT}<!-- ELSE -->{U_MESSAGE_AUTHOR}<!-- ENDIF -->">
<span>{custom_fields.PROFILE_FIELD_NAME}</span>
</a>
</li>
<!-- ENDIF -->
<!-- IF custom_fields.S_PROFILE_CONTACT -->{% set CONTACT_CNT = CONTACT_CNT + 1 %}<!-- ENDIF -->
<!-- END custom_fields -->
<!-- EVENT ucp_pm_viewmessage_contact_fields_after -->
</ul>
</dd>
<!-- IF CELL_BREAK[CONTACT_CNT] -->{% set DIV_CNT = CELL_BREAK[CONTACT_CNT] %}<!-- ELSE -->{% set DIV_CNT = 4 %}<!-- ENDIF -->
<dd class="profile-contact">
<strong>{L_CONTACT_USER}{L_COLON}</strong>
<div class="dropdown-container">
<a href="#" class="dropdown-trigger">Trigger</a>
<div class="dropdown hidden">
<div class="pointer"><div class="pointer-inner"></div></div>
<div class="dropdown-contents contact-icons">
<div>
<!-- EVENT ucp_pm_viewmessage_contact_fields_before -->
<!-- IF U_PM -->
{% set CNT = CNT + 1 %}
<a href="{U_PM}" title="{L_PRIVATE_MESSAGE}"><span class="contact-icon pm-icon"></span></a>
<!-- ENDIF -->
<!-- IF U_EMAIL -->
{% set CNT = CNT + 1 %}
<a href="{U_EMAIL}" title="{L_SEND_EMAIL_USER} {POST_AUTHOR}"><span class="contact-icon email-icon"></span></a>
<!-- ENDIF -->
<!-- IF U_JABBER -->
{% set CNT = CNT + 1 %}
<a <!-- IF CNT % DIV_CNT == 0 -->class="last-cell" <!-- ENDIF -->href="{U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span class="contact-icon jabber-icon"></span></a>
<!-- IF (CNT % DIV_CNT == 0) && CNT != CONTACT_CNT --></div><div><!-- ENDIF -->
<!-- ENDIF -->
<!-- BEGIN custom_fields -->
<!-- IF custom_fields.S_PROFILE_CONTACT -->
{% set CNT = CNT + 1 %}
<a <!-- IF CNT % DIV_CNT == 0 -->class="last-cell" <!-- ENDIF -->href="<!-- IF postrow.custom_fields.PROFILE_FIELD_CONTACT -->{custom_fields.PROFILE_FIELD_CONTACT}<!-- ELSE -->{U_POST_AUTHOR}<!-- ENDIF -->" title="{custom_fields.PROFILE_FIELD_NAME}">
<span class="contact-icon {custom_fields.PROFILE_FIELD_IDENT}-icon"></span>
</a>
<!-- IF (CNT % DIV_CNT == 0) && CNT != CONTACT_CNT --></div><div><!-- ENDIF -->
<!-- ENDIF -->
<!-- END custom_fields -->
<!-- EVENT ucp_pm_viewmessage_contact_fields_after -->
</div>
</div>
</div>
</div>
</dd>
<!-- ENDIF -->
</dl>

View File

@ -143,26 +143,54 @@
<!-- END custom_fields -->
<!-- EVENT viewtopic_body_postrow_custom_fields_after -->
<!-- IF not S_IS_BOT -->
<!-- IF postrow.U_PM or postrow.U_EMAIL or postrow.U_JABBER -->
<!-- IF not S_IS_BOT and (postrow.U_PM or postrow.U_EMAIL or postrow.U_JABBER) -->
{% set CELL_BREAK = {1: 1, 2: 1, 3: 2, 4: 2, 5: 3, 6: 3, 7: 4, 8: 4, 9: 5, 10: 5, 11: 4, 12: 4, 13: 5, 14: 5, 16: 4} %}
{% set CONTACT_CNT = 0 %}
{% set CNT = 0 %}
<!-- IF postrow.U_PM -->{% set CONTACT_CNT = CONTACT_CNT + 1 %}<!-- ENDIF -->
<!-- IF postrow.U_EMAIL -->{% set CONTACT_CNT = CONTACT_CNT + 1 %}<!-- ENDIF -->
<!-- IF postrow.U_JABBER -->{% set CONTACT_CNT = CONTACT_CNT + 1 %}<!-- ENDIF -->
<!-- BEGIN custom_fields -->
<!-- IF postrow.custom_fields.S_PROFILE_CONTACT -->{% set CONTACT_CNT = CONTACT_CNT + 1 %}<!-- ENDIF -->
<!-- END custom_fields -->
<!-- IF CELL_BREAK[CONTACT_CNT] -->{% set DIV_CNT = CELL_BREAK[CONTACT_CNT] %}<!-- ELSE -->{% set DIV_CNT = 4 %}<!-- ENDIF -->
<dd class="profile-contact">
<ul class="profile-icons">
<!-- IF postrow.U_PM --><li class="pm-icon"><a href="{postrow.U_PM}" title="{L_PRIVATE_MESSAGE}"><span>{L_PRIVATE_MESSAGE}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_EMAIL --><li class="email-icon"><a href="{postrow.U_EMAIL}" title="{L_SEND_EMAIL_USER} {postrow.POST_AUTHOR}"><span>{L_SEND_EMAIL_USER} {postrow.POST_AUTHOR}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_JABBER --><li class="jabber-icon"><a href="{postrow.U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span>{L_JABBER}</span></a></li><!-- ENDIF -->
<!-- BEGIN custom_fields -->
<!-- IF postrow.custom_fields.S_PROFILE_CONTACT -->
<li class="{postrow.custom_fields.PROFILE_FIELD_IDENT}-icon">
<a href="<!-- IF postrow.custom_fields.PROFILE_FIELD_CONTACT -->{postrow.custom_fields.PROFILE_FIELD_CONTACT}<!-- ELSE -->{postrow.U_POST_AUTHOR}<!-- ENDIF -->">
<span>{postrow.custom_fields.PROFILE_FIELD_NAME}</span>
</a>
</li>
<!-- ENDIF -->
<!-- END custom_fields -->
</ul>
<strong>{L_CONTACT_USER}{L_COLON}</strong>
<div class="dropdown-container">
<a href="#" class="dropdown-trigger">Trigger</a>
<div class="dropdown hidden">
<div class="pointer"><div class="pointer-inner"></div></div>
<div class="dropdown-contents contact-icons">
<div>
<!-- IF postrow.U_PM -->
{% set CNT = CNT + 1 %}
<a href="{postrow.U_PM}" title="{L_PRIVATE_MESSAGE}"><span class="contact-icon pm-icon"></span></a>
<!-- ENDIF -->
<!-- IF postrow.U_EMAIL -->
{% set CNT = CNT + 1 %}
<a href="{postrow.U_EMAIL}" title="{L_SEND_EMAIL_USER} {postrow.POST_AUTHOR}"><span class="contact-icon email-icon"></span></a>
<!-- ENDIF -->
<!-- IF postrow.U_JABBER -->
{% set CNT = CNT + 1 %}
<a <!-- IF CNT % DIV_CNT == 0 -->class="last-cell" <!-- ENDIF -->href="{postrow.U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span class="contact-icon jabber-icon"></span></a>
<!-- IF (CNT % DIV_CNT == 0) && CNT != CONTACT_CNT --></div><div><!-- ENDIF -->
<!-- ENDIF -->
<!-- BEGIN custom_fields -->
<!-- IF postrow.custom_fields.S_PROFILE_CONTACT -->
{% set CNT = CNT + 1 %}
<a <!-- IF CNT % DIV_CNT == 0 -->class="last-cell" <!-- ENDIF -->href="<!-- IF postrow.custom_fields.PROFILE_FIELD_CONTACT -->{postrow.custom_fields.PROFILE_FIELD_CONTACT}<!-- ELSE -->{postrow.U_POST_AUTHOR}<!-- ENDIF -->" title="{postrow.custom_fields.PROFILE_FIELD_NAME}">
<span class="contact-icon {postrow.custom_fields.PROFILE_FIELD_IDENT}-icon"></span>
</a>
<!-- IF (CNT % DIV_CNT == 0) && CNT != CONTACT_CNT --></div><div><!-- ENDIF -->
<!-- ENDIF -->
<!-- END custom_fields -->
</div>
</div>
</div>
</div>
</dd>
<!-- ENDIF -->
<!-- ENDIF -->
</dl>

View File

@ -235,20 +235,49 @@ ul.profile-icons.responsive a.responsive-menu-link:before {
max-width: 40%;
}
.contact-icons.dropdown-contents {
min-width: 0;
padding: 0;
}
.contact-icon {
background-repeat: no-repeat;
display: block;
height: 16px;
width: 16px;
}
.contact-icons a {
border-bottom: 1px dotted;
border-right: 1px dotted;
display: block;
float: left;
padding: 8px;
}
.contact-icons div:last-child a {
border-bottom: none;
}
.contact-icons .last-cell {
border-right: none;
}
/* Profile & navigation icons */
.email-icon, .email-icon a { background: none top left no-repeat; }
.aim-icon, .aim-icon a { background: none top left no-repeat; }
.phpbb_aol-icon, .phpbb_aol-icon a { background: none top left no-repeat; }
.yahoo-icon, .yahoo-icon a { background: none top left no-repeat; }
.phpbb_yahoo-icon, .phpbb_yahoo-icon a { background: none top left no-repeat; }
.web-icon, .web-icon a { background: none top left no-repeat; }
.phpbb_website-icon, .phpbb_website-icon a { background: none top left no-repeat; }
.msnm-icon, .msnm-icon a { background: none top left no-repeat; }
.phpbb_wlm-icon, .phpbb_wlm-icon a { background: none top left no-repeat; }
.icq-icon, .icq-icon a { background: none top left no-repeat; }
.phpbb_icq-icon, .phpbb_icq-icon a { background: none top left no-repeat; }
.jabber-icon, .jabber-icon a { background: none top left no-repeat; }
.pm-icon, .pm-icon a { background: none top left no-repeat; }
.pm-icon { background-position: 0 0; }
.email-icon { background-position: -21px 0; }
.jabber-icon { background-position: -82px 0; }
.phpbb_icq-icon { background-position: -61px 0 ; }
.phpbb_wlm-icon { background-position: -182px 0; }
.phpbb_aol-icon { background-position: -245px 0; }
.phpbb_website-icon { background-position: -40px 0; }
.phpbb_youtube-icon { background-position: -98px 0; }
.phpbb_facebook-icon { background-position: -119px 0; }
.phpbb_google_plus-icon { background-position: -140px 0; }
.phpbb_skype-icon { background-position: -161px 0; }
.phpbb_twitter-icon { background-position: -203px 0; }
.phpbb_yahoo-icon { background-position: -224px 0; }
.quote-icon, .quote-icon a { background: none top left no-repeat; }
/* Moderator icons */

View File

@ -718,6 +718,14 @@ a.sendemail {
background-image: url("images/buttons.png");
}
.contact-icons a {
border-color: #DCDCDC;
}
.contact-icons a:hover {
background-color: #F2F6F9;
}
/* Icon images
---------------------------------------- */
.icon-faq { background-image: url("./images/icon_faq.gif"); }
@ -738,19 +746,8 @@ a.sendemail {
.icon-mark { background-image: url("./images/icon_mark.gif"); }
/* Profile & navigation icons */
.email-icon, .email-icon a { background-image: url("./images/icon_contact_email.gif"); }
.phpbb_aol-icon, .phpbb_aol-icon a { background-image: url("./images/icon_contact_aim.gif"); }
.aim-icon, .aim-icon a { background-image: url("./images/icon_contact_aim.gif"); }
.yahoo-icon, .yahoo-icon a { background-image: url("./images/icon_contact_yahoo.gif"); }
.phpbb_yahoo-icon, .phpbb_yahoo-icon a { background-image: url("./images/icon_contact_yahoo.gif"); }
.web-icon, .web-icon a { background-image: url("./images/icon_contact_www.gif"); }
.phpbb_website-icon, .phpbb_website-icon a { background-image: url("./images/icon_contact_www.gif"); }
.msnm-icon, .msnm-icon a { background-image: url("./images/icon_contact_msnm.gif"); }
.phpbb_wlm-icon, .phpbb_wlm-icon a { background-image: url("./images/icon_contact_msnm.gif"); }
.icq-icon, .icq-icon a { background-image: url("./images/icon_contact_icq.gif"); }
.phpbb_icq-icon, .phpbb_icq-icon a { background-image: url("./images/icon_contact_icq.gif"); }
.jabber-icon, .jabber-icon a { background-image: url("./images/icon_contact_jabber.gif"); }
.pm-icon, .pm-icon a { background-image: url("./en/icon_contact_pm.gif"); }
.contact-icon { background-image: url("./images/icons_contact.png"); }
.quote-icon, .quote-icon a { background-image: url("./en/icon_post_quote.gif"); }
ul.profile-icons.responsive a.responsive-menu-link { background-image: url("./images/icon_post_menu.png"); }

View File

@ -731,6 +731,10 @@ fieldset.polls dd div {
height: auto !important;
}
dd.profile-contact {
overflow: visible;
}
.online {
background-image: none;
background-position: 100% 0;

View File

@ -7,16 +7,10 @@ ul.profile-icons li.edit-icon { width: 42px; height: 20px; }
.online { background-image: url("./icon_user_online.gif"); }
/* Icon images */
.pm-icon, .pm-icon a { background-image: url("./icon_contact_pm.gif"); }
.quote-icon, .quote-icon a { background-image: url("./icon_post_quote.gif"); }
.edit-icon, .edit-icon a { background-image: url("./icon_post_edit.gif"); }
/* EN Language Pack */
.imageset.icon_contact_pm {
background-image: url("./icon_contact_pm.gif");
padding-left: 28px;
padding-top: 20px;
}
.imageset.icon_post_edit {
background-image: url("./icon_post_edit.gif");
padding-left: 42px;

Binary file not shown.

Before

Width:  |  Height:  |  Size: 546 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 523 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 562 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1014 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 590 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 541 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.3 KiB