Skip to content

Q
question2answer
Commit c9bd34d7 by Scott
Options

Refactor SnowFlat users CSS 

Keep ‘qa-top-users-item’ class, use wrapper class for each page type.
parent 80453a06
Showing with 39 additions and 63 deletions
qa-include/app/favorites.php
......@@ -128,7 +128,7 @@
$ranking = array(
'items' => array(),
'rows' => ceil(count($users)/qa_opt('columns_users')),
'type' => 'top-users',
'type' => 'users',
);
foreach ($users as $user) {
......@@ -157,7 +157,7 @@
$ranking = array(
'items' => array(),
'rows' => ceil(count($tags)/qa_opt('columns_tags')),
'type' => 'top-tags'
'type' => 'tags'
);
foreach ($tags as $tag) {
......
qa-include/pages/tags.php
......@@ -50,7 +50,8 @@ $qa_content['title'] = qa_lang_html('main/popular_tags');
$qa_content['ranking'] = array(
'items' => array(),
'rows' => ceil($pagesize / qa_opt('columns_tags')),
'type' => 'top-tags'
'type' => 'tags',
'sort' => 'count',
);
if (count($populartags)) {
......
qa-include/pages/users-blocked.php
......@@ -71,7 +71,8 @@ $qa_content['title'] = $count > 0 ? qa_lang_html('users/blocked_users') : qa_lan
$qa_content['ranking'] = array(
'items' => array(),
'rows' => ceil(count($users) / qa_opt('columns_users')),
'type' => 'blocked-users'
'type' => 'users',
'sort' => 'level',
);
foreach ($users as $user) {
......
qa-include/pages/users-newest.php
......@@ -62,7 +62,8 @@ $qa_content['title'] = qa_lang_html('main/newest_users');
$qa_content['ranking'] = array(
'items' => array(),
'rows' => ceil($pageSize / qa_opt('columns_users')),
'type' => 'newest-users',
'type' => 'users',
'sort' => 'date',
);
if (!empty($users)) {
......
qa-include/pages/users-special.php
......@@ -64,7 +64,8 @@ $qa_content['title'] = qa_lang_html('users/special_users');
$qa_content['ranking'] = array(
'items' => array(),
'rows' => ceil(qa_opt('page_size_users') / qa_opt('columns_users')),
'type' => 'special-users'
'type' => 'users',
'sort' => 'level',
);
foreach ($users as $user) {
......
qa-include/pages/users.php
......@@ -50,7 +50,8 @@ $qa_content['title'] = qa_lang_html('main/highest_users');
$qa_content['ranking'] = array(
'items' => array(),
'rows' => ceil($pagesize / qa_opt('columns_users')),
'type' => 'top-users'
'type' => 'users',
'sort' => 'points',
);
if (count($users)) {
......
qa-include/qa-theme-base.php
......@@ -815,6 +815,8 @@ class qa_html_theme_base
public function main_part($key, $part)
{
$isRanking = strpos($key, 'ranking') === 0;
$partdiv = (
strpos($key, 'custom') === 0 ||
strpos($key, 'form') === 0 ||
......@@ -822,13 +824,18 @@ class qa_html_theme_base
(strpos($key, 'q_view') === 0 && !isset($this->content['form_q_edit'])) ||
strpos($key, 'a_form') === 0 ||
strpos($key, 'a_list') === 0 ||
strpos($key, 'ranking') === 0 ||
$isRanking ||
strpos($key, 'message_list') === 0 ||
strpos($key, 'nav_list') === 0
);
if ($partdiv)
$this->output('<div class="qa-part-'.strtr($key, '_', '-').'">'); // to help target CSS to page parts
if ($partdiv) {
$class = 'qa-part-' . strtr($key, '_', '-');
if ($isRanking)
$class .= ' qa-ranking-' . $part['type'] . '-' . (isset($part['sort']) ? $part['sort'] : 'points');
// help target CSS to page parts
$this->output('<div class="'.$class.'">');
}
if (strpos($key, 'custom') === 0)
$this->output_raw($part);
......@@ -1367,7 +1374,7 @@ class qa_html_theme_base
if (!isset($ranking['type']))
$ranking['type'] = 'items';
$class = 'qa-'.$ranking['type'];
$class = 'qa-top-' . $ranking['type'];
if (!$this->ranking_block_layout) {
// old, less semantic table layout
......
qa-theme/SnowFlat/qa-styles.css
......@@ -1454,10 +1454,7 @@ blockquote p {
padding: 5px;
}
.qa-top-users-item,
.qa-special-users-item,
.qa-blocked-users-item,
.qa-newest-users-item {
.qa-top-users-item {
width: 100%;
max-width: 320px;
}
......@@ -1469,10 +1466,7 @@ blockquote p {
@media only screen and (min-width: 992px) {
/* two column layout for Desktops and above*/
.qa-top-users-item,
.qa-special-users-item,
.qa-blocked-users-item,
.qa-newest-users-item {
.qa-top-users-item {
width: 48%;
max-width: none;
}
......@@ -1483,25 +1477,17 @@ blockquote p {
}
}
.qa-top-users-avatar .qa-avatar-link,
.qa-special-users-avatar .qa-avatar-link,
.qa-newest-users-avatar .qa-avatar-link {
.qa-top-users-avatar .qa-avatar-link {
display: block;
float: left;
margin-right: 1em;
}
.qa-top-users-avatar .qa-avatar-link img,
.qa-special-users-avatar .qa-avatar-link img,
.qa-blocked-users-avatar .qa-avatar-link img,
.qa-newest-users-avatar .qa-avatar-link img {
.qa-top-users-avatar .qa-avatar-link img {
border: 1px solid #cbd7e3;
}
.qa-top-users-label .qa-user-link,
.qa-special-users-label .qa-user-link,
.qa-blocked-users-label .qa-user-link,
.qa-newest-users-label .qa-user-link {
.qa-top-users-label .qa-user-link {
background-color: #e74c3c;
display: block;
float: left;
......@@ -1511,21 +1497,12 @@ blockquote p {
}
.qa-top-users-label .qa-user-link:hover,
.qa-top-users-label .qa-user-link:focus,
.qa-special-users-label .qa-user-link:hover,
.qa-special-users-label .qa-user-link:focus,
.qa-blocked-users-label .qa-user-link:hover,
.qa-blocked-users-label .qa-user-link:focus,
.qa-newest-users-label .qa-user-link:hover,
.qa-newest-users-label .qa-user-link:focus {
.qa-top-users-label .qa-user-link:focus {
background-color: #eb695c;
text-decoration: none;
}
.qa-top-users-label .qa-user-link:before,
.qa-special-users-label .qa-user-link:before,
.qa-blocked-users-label .qa-user-link:before,
.qa-newest-users-label .qa-user-link:before {
.qa-top-users-label .qa-user-link:before {
content: "";
position: absolute;
left: -5px;
......@@ -1539,19 +1516,14 @@ blockquote p {
}
@media (min-width: 980px) {
.qa-top-users-label .qa-user-link:hover:after, .qa-top-users-label .qa-user-link:focus:after,
.qa-special-users-label .qa-user-link:hover:after, .qa-special-users-label .qa-user-link:focus:after,
.qa-blocked-users-label .qa-user-link:hover:after, .qa-blocked-users-label .qa-user-link:focus:after,
.qa-newest-users-label .qa-user-link:hover:after, .qa-newest-users-label .qa-user-link:focus:after {
.qa-top-users-label .qa-user-link:hover:after,
.qa-top-users-label .qa-user-link:focus:after {
-ms-transform: translate(80px, 0);
-webkit-transform: translate(80px, 0);
transform: translate(80px, 0);
}
.qa-top-users-label .qa-user-link:after,
.qa-special-users-label .qa-user-link:after,
.qa-blocked-users-label .qa-user-link:after,
.qa-newest-users-label .qa-user-link:after {
.qa-top-users-label .qa-user-link:after {
content: "";
display: block;
width: 0;
......@@ -1571,32 +1543,24 @@ blockquote p {
}
}
.qa-top-users-label .qa-user-link.qa-user-favorited,
.qa-special-users-label .qa-user-link.qa-user-favorited,
.qa-blocked-users-label .qa-user-link.qa-user-favorited,
.qa-newest-users-label .qa-user-link.qa-user-favorited {
.qa-top-users-label .qa-user-link.qa-user-favorited {
background-image: url('images/icons/fev-star.png');
background-repeat: no-repeat;
background-position: 2px center;
padding-left: 22px;
}
.qa-top-users-score,
.qa-special-users-score,
.qa-blocked-users-score,
.qa-newest-users-score {
.qa-top-users-score {
position: relative;
float: right;
padding: 2px 6px 2px 1.8em;
padding: 2px 6px 2px 6px;
background-color: #2ecc71;
color: #fff;
}
.qa-special-users-score,
.qa-blocked-users-score,
.qa-newest-users-score {
padding-left: 6px;
.qa-ranking-users-points .qa-top-users-score {
padding-left: 1.8em;
}
.qa-top-users-score:before {
.qa-ranking-users-points .qa-top-users-score:before {
content: '\e810';
font-family: "fontello";
display: inline-block;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment