Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ticket/12155 CSS-ing mini post buttons #2005

Closed
wants to merge 3 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion phpBB/includes/acp/acp_styles.php
Original file line number Diff line number Diff line change
Expand Up @@ -1164,7 +1164,7 @@ protected function get_users()
{
$style_count[$row['user_style']] = $row['style_count'];
}
$this->db->sql_freeresult($result);
$this->db->sql_freeresult($result);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unrelated.


return $style_count;
}
Expand Down
6 changes: 4 additions & 2 deletions phpBB/styles/prosilver/template/overall_header.html
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,10 @@
-->

<link href="{T_THEME_PATH}/print.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" type="text/css" media="print" title="printonly" />
<!-- IF S_ALLOW_CDN --><link href="//fonts.googleapis.com/css?family=Open+Sans:600&amp;subset=latin,cyrillic-ext,latin-ext,cyrillic,greek-ext,greek,vietnamese" rel="stylesheet" type="text/css" media="screen, projection" /><!-- ENDIF -->
<link href="{T_STYLESHEET_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />
<!-- IF S_ALLOW_CDN -->
<link href="//fonts.googleapis.com/css?family=Open+Sans:600&amp;subset=latin,cyrillic-ext,latin-ext,cyrillic,greek-ext,greek,vietnamese" rel="stylesheet" type="text/css" media="screen, projection" />
<link href='//fonts.googleapis.com/css?family=Noto+Sans:400,700&subset=latin,cyrillic-ext,cyrillic,latin-ext,greek-ext,greek,vietnamese' rel='stylesheet' type='text/css' media="screen, projection" />
<!-- ENDIF --><link href="{T_STYLESHEET_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Move the <link> to its own line please.

<link href="{T_STYLESHEET_LANG_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />
<link href="{T_THEME_PATH}/responsive.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" type="text/css" media="only screen and (max-width: 700px), only screen and (max-device-width: 700px)" />

Expand Down
2 changes: 1 addition & 1 deletion phpBB/styles/prosilver/template/ucp_pm_viewmessage.html
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@

<!-- IF U_PM or U_EMAIL or U_WWW or U_MSN or U_ICQ or U_YIM or U_AIM or U_JABBER -->
<dd>
<ul class="profile-icons">
<ul class="contact-icons">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unrelated.

<!-- 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_WWW --><li class="web-icon"><a href="{U_WWW}" title="{L_VISIT_WEBSITE}{L_COLON} {U_WWW}"><span>{L_WEBSITE}</span></a></li><!-- ENDIF -->
Expand Down
8 changes: 4 additions & 4 deletions phpBB/styles/prosilver/template/viewtopic_body.html
Original file line number Diff line number Diff line change
Expand Up @@ -145,7 +145,7 @@ <h2>{POLL_QUESTION}</h2>
<!-- IF not S_IS_BOT -->
<!-- IF postrow.U_PM or postrow.U_EMAIL or postrow.U_WWW or postrow.U_MSN or postrow.U_ICQ or postrow.U_YIM or postrow.U_AIM or postrow.U_JABBER -->
<dd>
<ul class="profile-icons">
<ul class="contact-icons">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unrelated.

<!-- 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_WWW --><li class="web-icon"><a href="{postrow.U_WWW}" title="{L_VISIT_WEBSITE}{L_COLON} {postrow.U_WWW}"><span>{L_WEBSITE}</span></a></li><!-- ENDIF -->
Expand Down Expand Up @@ -183,12 +183,12 @@ <h3 <!-- IF postrow.S_FIRST_ROW -->class="first"<!-- ENDIF -->><!-- IF postrow.P
<!-- IF postrow.U_EDIT or postrow.U_DELETE or postrow.U_REPORT or postrow.U_WARN or postrow.U_INFO or postrow.U_QUOTE -->
<ul class="profile-icons">
<!-- EVENT viewtopic_body_post_buttons_before -->
<!-- IF postrow.U_EDIT --><li class="edit-icon"><a href="{postrow.U_EDIT}" title="{L_EDIT_POST}"><span>{L_EDIT_POST}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_EDIT --><li class="edit-icon"><a href="{postrow.U_EDIT}" title="{L_EDIT_POST}"><span>{L_BUTTON_EDIT}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_DELETE --><li class="delete-icon"><a href="{postrow.U_DELETE}" title="{L_DELETE_POST}"><span>{L_DELETE_POST}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_REPORT --><li class="report-icon"><a href="{postrow.U_REPORT}" title="{L_REPORT_POST}"><span>{L_REPORT_POST}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_WARN --><li class="warn-icon"><a href="{postrow.U_WARN}" title="{L_WARN_USER}"><span>{L_WARN_USER}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_INFO --><li class="info-icon"><a href="{postrow.U_INFO}" title="{L_INFORMATION}"><span>{L_INFORMATION}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_QUOTE --><li class="quote-icon"><a href="{postrow.U_QUOTE}" title="{L_REPLY_WITH_QUOTE}"><span>{L_REPLY_WITH_QUOTE}</span></a></li><!-- ENDIF -->
<!-- IF postrow.U_INFO --><li class="info-icon"><a href="{postrow.U_INFO}" title="{L_INFORMATION}"><span>{L_IP}</span></a></li><!-- ENDIF -->
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The post info page contains more than just the IP, so this is rather misleading.

<!-- IF postrow.U_QUOTE --><li class="quote-icon"><a href="{postrow.U_QUOTE}" title="{L_REPLY_WITH_QUOTE}"><span>{L_QUOTE}</span></a></li><!-- ENDIF -->
<!-- EVENT viewtopic_body_post_buttons_after -->
</ul>
<!-- ENDIF -->
Expand Down
224 changes: 179 additions & 45 deletions phpBB/styles/prosilver/theme/buttons.css
Original file line number Diff line number Diff line change
Expand Up @@ -139,49 +139,49 @@ ul.linklist.bulletin li.small-icon:before {
display: none;
}

/* Poster profile icons
/* Poster contact icons
----------------------------------------*/
ul.profile-icons {
ul.contact-icons {
padding-top: 10px;
list-style: none;
}

/* Rollover state */
ul.profile-icons li {
ul.contact-icons li {
float: left;
margin: 0 6px 3px 0;
background-position: 0 100%;
}

/* Rolloff state */
ul.profile-icons li a {
ul.contact-icons li a {
display: block;
width: 100%;
height: 100%;
background-position: 0 0;
}

/* Hide <a> text and hide off-state image when rolling over (prevents flicker in IE) */
ul.profile-icons li span { display:none; }
ul.profile-icons li a:hover { background: none; }
ul.contact-icons li span { display:none; }
ul.contact-icons li a:hover { background: none; }

/* Positioning of moderator icons */
.postbody ul.profile-icons {
.postbody ul.contact-icons {
float: right;
width: auto;
padding: 0;
}

.postbody ul.profile-icons li {
.postbody ul.contact-icons li {
margin: 0 3px;
}

/* Responsive icons in postbody */
.postbody ul.profile-icons.responsive .responsive-menu {
.postbody ul.contact-icons.responsive .responsive-menu {
position: relative;
}

ul.profile-icons.responsive a.responsive-menu-link {
ul.contact-icons.responsive a.responsive-menu-link {
display: inline-block;
position: relative;
margin: 0 5px;
Expand All @@ -191,11 +191,11 @@ ul.profile-icons.responsive a.responsive-menu-link {
background: none top left no-repeat;
}

ul.profile-icons.responsive a.responsive-menu-link:hover {
ul.contact-icons.responsive a.responsive-menu-link:hover {
background-position: 0 -20px;
}

ul.profile-icons.responsive a.responsive-menu-link:before {
ul.contact-icons.responsive a.responsive-menu-link:before {
content: '';
position: absolute;
left: 0;
Expand All @@ -206,13 +206,13 @@ ul.profile-icons.responsive a.responsive-menu-link:before {
border-top: 0.375em double transparent;
}

.postbody ul.profile-icons.responsive .popup-pointer {
.postbody ul.contact-icons.responsive .popup-pointer {
left: auto;
right: 7px;
top: 20px;
}

.postbody ul.profile-icons .dropdown li, .postbody ul.profile-icons .dropdown li a {
.postbody ul.contact-icons .dropdown li, .postbody ul.contact-icons .dropdown li a {
display: block;
background: transparent none;
width: auto;
Expand All @@ -223,19 +223,19 @@ ul.profile-icons.responsive a.responsive-menu-link:before {
list-style-type: none;
}

.postbody ul.profile-icons .dropdown li span {
.postbody ul.contact-icons .dropdown li span {
display: block;
text-align: right;
font-size: 1.2em;
line-height: 1.8em;
white-space: nowrap;
}

.hasjs .postbody ul.profile-icons {
.hasjs .postbody ul.contact-icons {
max-width: 40%;
}

/* Profile & navigation icons */
/* contact & navigation icons */
.email-icon, .email-icon a { background: none top left no-repeat; }
.aim-icon, .aim-icon a { background: none top left no-repeat; }
.yahoo-icon, .yahoo-icon a { background: none top left no-repeat; }
Expand All @@ -246,32 +246,166 @@ ul.profile-icons.responsive a.responsive-menu-link:before {
.pm-icon, .pm-icon a { background: none top left no-repeat; }
.quote-icon, .quote-icon a { background: none top left no-repeat; }

/* Moderator icons */
.report-icon, .report-icon a { background: none top left no-repeat; }
.warn-icon, .warn-icon a { background: none top left no-repeat; }
.edit-icon, .edit-icon a { background: none top left no-repeat; }
.delete-icon, .delete-icon a { background: none top left no-repeat; }
.info-icon, .info-icon a { background: none top left no-repeat; }

/* Set profile icon dimensions */
ul.profile-icons li.email-icon { width: 20px; height: 20px; }
ul.profile-icons li.aim-icon { width: 20px; height: 20px; }
ul.profile-icons li.yahoo-icon { width: 20px; height: 20px; }
ul.profile-icons li.web-icon { width: 20px; height: 20px; }
ul.profile-icons li.msnm-icon { width: 20px; height: 20px; }
ul.profile-icons li.icq-icon { width: 20px; height: 20px; }
ul.profile-icons li.jabber-icon { width: 20px; height: 20px; }
ul.profile-icons li.pm-icon { width: 28px; height: 20px; }
ul.profile-icons li.quote-icon { width: 54px; height: 20px; }
ul.profile-icons li.report-icon { width: 20px; height: 20px; }
ul.profile-icons li.edit-icon { width: 42px; height: 20px; }
ul.profile-icons li.delete-icon { width: 20px; height: 20px; }
ul.profile-icons li.info-icon { width: 20px; height: 20px; }
ul.profile-icons li.warn-icon { width: 20px; height: 20px; }
ul.profile-icons a.responsive-menu-link { width: 20px; height: 20px; }

/* Fix profile icon default margins */
ul.profile-icons li.edit-icon { margin: 0 0 0 3px; }
ul.profile-icons li.quote-icon { margin: 0 0 0 10px; }
ul.profile-icons li.info-icon, ul.profile-icons li.report-icon { margin: 0 3px 0 0; }

/* Set contact icon dimensions */
ul.contact-icons li.email-icon { width: 20px; height: 20px; }
ul.contact-icons li.aim-icon { width: 20px; height: 20px; }
ul.contact-icons li.yahoo-icon { width: 20px; height: 20px; }
ul.contact-icons li.web-icon { width: 20px; height: 20px; }
ul.contact-icons li.msnm-icon { width: 20px; height: 20px; }
ul.contact-icons li.icq-icon { width: 20px; height: 20px; }
ul.contact-icons li.jabber-icon { width: 20px; height: 20px; }
ul.contact-icons li.pm-icon { width: 28px; height: 20px; }
ul.contact-icons a.responsive-menu-link { width: 20px; height: 20px; }


/* mini profile buttons
--------------------------------------------- */
ul.profile-icons {
float: right;
list-style: none;
width: auto;
height: auto;
margin-top: 2px;
}

ul.profile-icons li {
float: left;
margin: 0 5px 0 0;
}

ul.profile-icons li a {
font-weight: bold;
display: inline-block;
font-family: 'Noto Sans', sans-serif, Verdana, Arial, Helvetica;
font-size: 9px;
line-height: 10px;
height: 12px;
text-decoration: none !important;
outline-style: none !important;
vertical-align: bottom;
white-space: nowrap;
border: 1px solid transparent;
border-radius: 3px;
background: transparent none 0 0 repeat-x;
padding: 3px 5px 1px 8px;
position: relative;
border-color: #858585;
background: #e3e3e3;
/*background: url(data:image/svg+xml; base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlM2UzZTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);*/
background: -moz-linear-gradient(top, #ffffff 0%, #e3e3e3 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e3e3e3));
background: -webkit-linear-gradient(top, #ffffff 0%,#e3e3e3 100%);
background: -o-linear-gradient(top, #ffffff 0%,#e3e3e3 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#e3e3e3 100%);
background: linear-gradient(to bottom, #ffffff 0%,#e3e3e3 100%);
-m-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e3e3e3',GradientType=0 );
box-shadow: 0 0 0 1px #FFFFFF inset;
-webkit-box-shadow: 0 0 0 1px #FFFFFF inset;
color: #BC2A4D !important;
}

ul.profile-icons li a:hover {
border-color: #0a8ed0;
background: #ffffff;
/*background: url(data:image/svg+xml; base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2UzZTNlMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);*/
background: -moz-linear-gradient(top, #e3e3e3 1%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#e3e3e3), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(top, #e3e3e3 1%,#ffffff 100%);
background: -o-linear-gradient(top, #e3e3e3 1%,#ffffff 100%);
background: -ms-linear-gradient(top, #e3e3e3 1%,#ffffff 100%);
background: linear-gradient(to bottom, #e3e3e3 1%,#ffffff 100%);
-m-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e3e3e3', endColorstr='#ffffff',GradientType=0 );
text-shadow: 1px 1px 0 #FFFFFF, -1px -1px 0 #FFFFFF, -1px -1px 0 rgba(188, 42, 77, 0.2);
box-shadow: 0 0 0 1px #FFFFFF inset;
-webkit-box-shadow: 0 0 0 1px #FFFFFF inset;
color: #BC2A4D !important;
}

ul.profile-icons li a:after {
content: '';
display: block;
position: absolute;
top: 50%;
left: -4px;
width: 12px;
height: 16px;
margin-top: -10px;
background: transparent 0 0 no-repeat;
background-image: url("images/mini-buttons.png");
}

/* Mini profile button images */
ul.profile-icons li.quote-icon a:after {
background-position: 0px 0px;
}

ul.profile-icons li.quote-icon a:hover:after {
background-position: 0px -21px;
}

ul.profile-icons li.edit-icon a:after {
background-position: -24px 0;
}

ul.profile-icons li.edit-icon a:hover:after {
background-position: -24px -21px;
}

ul.profile-icons li.warn-icon span {
display: none;
}

ul.profile-icons li.warn-icon a:after {
background-position: -48px 0px;
}

ul.profile-icons li.warn-icon a:hover:after {
background-position: -48px -21px;
}

ul.profile-icons li.delete-icon span {
display: none;
}

ul.profile-icons li.delete-icon a {
width: 12px;
padding: 3px 3px 1px 3px;
}

ul.profile-icons li.delete-icon a:after {
background-position: -36px 0px;
left: 3px;
margin-top: -6px;
}

ul.profile-icons li.delete-icon a:hover:after {
background-position: -36px -21px;
}

ul.profile-icons li.report-icon span {
display: none;
}

ul.profile-icons li.report-icon a {
width: 12px;
padding: 3px 3px 1px 3px;
}

ul.profile-icons li.report-icon a:after {
background-position: -48px 0px;
left: 3px;
margin-top: -6px;
}

ul.profile-icons li.report-icon a:hover:after {
background-position: -48px -21px;
}

ul.profile-icons li.info-icon a {
padding: 3px 5px 1px 6px;
}

ul.profile-icons li.info-icon a:after {
background: none;
}
5 changes: 0 additions & 5 deletions phpBB/styles/prosilver/theme/en/stylesheet.css
Original file line number Diff line number Diff line change
@@ -1,8 +1,3 @@
/* Set profile icon dimensions */
ul.profile-icons li.pm-icon { width: 28px; height: 20px; }
ul.profile-icons li.quote-icon { width: 54px; height: 20px; }
ul.profile-icons li.edit-icon { width: 42px; height: 20px; }

/* Online image */
.online { background-image: url("./icon_user_online.gif"); }

Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.