Unified style for clickable buttons
This commit is contained in:
parent
b4d2c5ecbb
commit
4ac91374b9
9 changed files with 33 additions and 29 deletions
|
@ -41,3 +41,14 @@ hr {
|
|||
border-top: 1px solid #eee;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
.big-button.active {
|
||||
background: #f7fbfc;
|
||||
color: #8ba !important;
|
||||
}
|
||||
|
||||
.big-button:focus,
|
||||
.big-button:hover {
|
||||
background: #f3f7f8;
|
||||
color: #7a9 !important;
|
||||
}
|
||||
|
|
|
@ -21,16 +21,9 @@
|
|||
font-size: 15px;
|
||||
}
|
||||
|
||||
#top-navigation li.active a {
|
||||
color: #8ba;
|
||||
background: #f7fbfc;
|
||||
}
|
||||
|
||||
#top-navigation li a:focus,
|
||||
#top-navigation li a:hover {
|
||||
outline: 0;
|
||||
background: #f3f7f8;
|
||||
color: #7a9;
|
||||
}
|
||||
|
||||
#top-navigation li:first-child a {
|
||||
|
|
|
@ -17,10 +17,6 @@
|
|||
margin: 0 0.5em;
|
||||
}
|
||||
|
||||
#user-list ul.order li.active a {
|
||||
background: #f7fbfc;
|
||||
}
|
||||
|
||||
#user-list ul.order a {
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
|
|
|
@ -28,10 +28,6 @@
|
|||
padding: 0.2em 0.5em;
|
||||
}
|
||||
|
||||
#user-view ul a.active {
|
||||
background: #f7fbfc;
|
||||
}
|
||||
|
||||
#user-view .tab {
|
||||
display: none;
|
||||
margin-top: 1.5em;
|
||||
|
|
|
@ -23,8 +23,8 @@ App.Presenters.TopNavigationPresenter = function(
|
|||
|
||||
function select(newSelectedElement) {
|
||||
selectedElement = newSelectedElement;
|
||||
$el.find('li').removeClass('active');
|
||||
$el.find('li.' + selectedElement).addClass('active');
|
||||
$el.find('li a').removeClass('active');
|
||||
$el.find('li.' + selectedElement).find('a').addClass('active');
|
||||
}
|
||||
|
||||
function loginStateChanged() {
|
||||
|
@ -42,7 +42,7 @@ App.Presenters.TopNavigationPresenter = function(
|
|||
canListTags: auth.hasPrivilege(auth.privileges.listTags),
|
||||
canUploadPosts: auth.hasPrivilege(auth.privileges.uploadPosts),
|
||||
}));
|
||||
$el.find('li.' + selectedElement).addClass('active');
|
||||
$el.find('li.' + selectedElement).find('a').addClass('active');
|
||||
}
|
||||
|
||||
function changeTitle(subTitle) {
|
||||
|
|
|
@ -61,8 +61,8 @@ App.Presenters.UserListPresenter = function(
|
|||
}
|
||||
|
||||
function updateActiveOrder(activeOrder) {
|
||||
$el.find('.order li').removeClass('active');
|
||||
$el.find('.order [data-order="' + activeOrder + '"]').parent('li').addClass('active');
|
||||
$el.find('.order li a').removeClass('active');
|
||||
$el.find('.order [data-order="' + activeOrder + '"]').addClass('active');
|
||||
}
|
||||
|
||||
function renderUsers(users, clear) {
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
<% _.each(links, function(link) { %><!--
|
||||
--><% var className = link[0], target=link[1], title=link[2], iconClassName=link[3] %><!--
|
||||
--><li class="<%= className %>">
|
||||
<a href="<%= target %>">
|
||||
<a class="big-button" href="<%= target %>">
|
||||
<i class="fa <%= iconClassName %>"></i><br/>
|
||||
<%= title %>
|
||||
</a>
|
||||
|
|
|
@ -1,16 +1,16 @@
|
|||
<div id="user-list">
|
||||
<ul class="order">
|
||||
<li>
|
||||
<a data-order="name">Sort A→Z</a>
|
||||
<a class="big-button" data-order="name">Sort A→Z</a>
|
||||
</li>
|
||||
<li>
|
||||
<a data-order="name,desc">Sort Z→A</a>
|
||||
<a class="big-button" data-order="name,desc">Sort Z→A</a>
|
||||
</li>
|
||||
<li>
|
||||
<a data-order="registrationTime">Sort old→new</a>
|
||||
<a class="big-button" data-order="registrationTime">Sort old→new</a>
|
||||
</li>
|
||||
<li>
|
||||
<a data-order="registrationTime,desc">Sort new→old</a>
|
||||
<a class="big-button" data-order="registrationTime,desc">Sort new→old</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
|
|
@ -12,24 +12,32 @@
|
|||
|
||||
<ul>
|
||||
<li>
|
||||
<a href="#/user/<%= user.name %>" data-tab="basic-info">Basic information</a>
|
||||
<a class="big-button" href="#/user/<%= user.name %>" data-tab="basic-info">
|
||||
Basic information
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<% if (canChangeBrowsingSettings) { %>
|
||||
<li>
|
||||
<a href="#/user/<%= user.name %>/browsing-settings" data-tab="browsing-settings">Browsing settings</a>
|
||||
<a class="big-button" href="#/user/<%= user.name %>/browsing-settings" data-tab="browsing-settings">
|
||||
Browsing settings
|
||||
</a>
|
||||
</li>
|
||||
<% } %>
|
||||
|
||||
<% if (canChangeAccountSettings) { %>
|
||||
<li>
|
||||
<a href="#/user/<%= user.name %>/account-settings" data-tab="account-settings">Account settings</a>
|
||||
<a class="big-button" href="#/user/<%= user.name %>/account-settings" data-tab="account-settings">
|
||||
Account settings
|
||||
</a>
|
||||
</li>
|
||||
<% } %>
|
||||
|
||||
<% if (canDeleteAccount) { %>
|
||||
<li>
|
||||
<a href="#/user/<%= user.name %>/account-removal" data-tab="account-removal">Account removal</a>
|
||||
<a class="big-button" href="#/user/<%= user.name %>/account-removal" data-tab="account-removal">
|
||||
Account removal
|
||||
</a>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
|
|
Loading…
Reference in a new issue