1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-10 03:11:07 +00:00

Use breadcrumb, update path-bar style and fix close button in popover

This commit is contained in:
Daniel Pan
2016-05-02 11:31:01 +08:00
parent 55da80b237
commit 374edec89b
8 changed files with 52 additions and 50 deletions

View File

@@ -165,7 +165,6 @@ h4 { font-size:1.1em; color:#222; font-weight:normal; }
h5, h6 { font-size:1em; margin:0.4em 0 0.15em; }
h1, h2, h3, h4 { line-height: 1.5; }
ul { list-style:none; }
ol { padding-left:2em; }
dl { margin:1.5em 0; }
dt { color:#666; margin:24px 0 2px; font-weight: normal; }
dd { margin-bottom:.8em; color:#222; }
@@ -302,7 +301,12 @@ th { text-align:left; font-weight:normal; color:#9c9c9c; }
td, th { padding:5px 3px; word-wrap:break-word; border-bottom:1px solid #eee; }
td { color: #333; font-size:14px; }
table img { vertical-align:middle; }
/**** overwrite bootstrap css ****/
.breadcrumb {
padding:0;
background-color:#fff;
border-radius:0;
}
/********** common class ***********/
.hl { background-color: #f8f8f8; }/*highlight*/
.fleft { float:left }
@@ -388,8 +392,8 @@ table img { vertical-align:middle; }
}
.loading-icon {
display:inline-block;
width:22px;
height:22px;
width:26px;
height:26px;
border:2px solid #eee;
border-left-color:#aaa;
border-radius:50%;
@@ -517,6 +521,15 @@ textarea:-moz-placeholder {/* for FF */
}
/*******ui widgets**************/
/**** path ****/
.path-bar {
font-size:1rem;
line-height:1.5;
margin:0; /* for merge with tabs */
background-color:#f2f2f2;
padding:0.6rem 0.75rem 0.25rem;
border-radius: 2px 2px 0 0;
}
/****paginator****/
#paginator {
text-align:center;
@@ -1862,12 +1875,6 @@ button.sf-dropdown-toggle:focus {
line-height:25px;
margin:0;
}
#group-top .path,
#dir-view .path {
font-size:16px;
line-height:1.5;
margin:0 0 5px;
}
#dir-view .repo-op .op-btn {
padding:5px 14px;
}
@@ -1909,7 +1916,7 @@ button.sf-dropdown-toggle:focus {
width:200px;
}
.repo-file-list th {
padding-top:20px;
padding-top:1rem;
}
#repo-file-list .fixed-hd {
position:fixed;
@@ -3040,7 +3047,7 @@ button.sf-dropdown-toggle:focus {
}
.repo-folder-perm-folder-path {
width:150px;
padding:3px 33px 3px 5px;
padding:1px 33px 1px 5px;
}
.repo-folder-perm-add-folder {
position:absolute;
@@ -3316,19 +3323,14 @@ img.thumbnail {
#group {
position:relative;
}
#group-members {
#group-members, #group-settings, #group-discussions {
position:absolute;
top:77px;
top:90px;
right:0;
}
#group-members .outer-caret {
right:66px;
}
#group-settings {
position:absolute;
top:77px;
right:0;
}
#group-settings .outer-caret {
right:106px;
}
@@ -3340,9 +3342,6 @@ img.thumbnail {
}
#group-discussions {
width:440px;
position:absolute;
top:77px;
right:0;
}
#group-discussions .outer-caret {
right:30px;

View File

@@ -1,7 +1,7 @@
{% load i18n %}
<script type="text/template" id="dir-view-tmpl">
<div class="repo-file-list-topbar">
<p class="path"></p>
<ol class="path-bar breadcrumb"></ol>
<div class="repo-op"></div>
</div>
<div class="js-dir-content">

View File

@@ -153,23 +153,23 @@
</script>
<script type="text/template" id="dir-path-bar-tmpl">
<% if (context == 'group') { %>
<a href="#groups/" class="path-link normal">{% trans "Groups" %}</a> /
<a href="#<%= category %>/" class="path-link normal"><%- group_name %></a> /
<li><a href="#groups/" class="path-link normal">{% trans "Groups" %}</a></li>
<li><a href="#<%= category %>/" class="path-link normal"><%- group_name %></a></li>
<% } else if (context == 'org') { %>
<a href="#<%= category %>/" class="path-link normal">{% trans "Organization" %}</a> /
<li><a href="#<%= category %>/" class="path-link normal">{% trans "Organization" %}</a></li>
<% } else if (context == 'common') { %>
<a href="#my-libs/" class="path-link normal">{% trans "Mine" %}</a> /
<li><a href="#my-libs/" class="path-link normal">{% trans "Mine" %}</a></li>
<% } else { %>
<a href="#<%= category %>/" class="path-link normal"><% if (category == 'my-libs') { %>{% trans "Mine" %}<% } %><% if (category == 'shared-libs') { %>{% trans "Shared" %}<% } %><% if (category == 'my-sub-libs') { %>{% trans "Sub-libraries" %}<% } %></a> /
<li><a href="#<%= category %>/" class="path-link normal"><% if (category == 'my-libs') { %>{% trans "Mine" %}<% } %><% if (category == 'shared-libs') { %>{% trans "Shared" %}<% } %></a></li>
<% } %>
<% if (path == '/') { %>
<%- repo_name %> /
<li><%- repo_name %></li>
<% } else { %>
<a href="#<%= category %>/lib/<%= repo_id %>/" class="path-link normal"><%- repo_name %></a> /
<% for (var i = 0,len = path_list.length - 1; i < len; i++) { %>
<a href="#<%= category %>/lib/<%= repo_id %>/<% print(path_list_encoded.slice(0, i+1).join('/')); %>" class="path-link normal"><%- path_list[i] %></a> /
<% } %>
<%- path_list[i] + ' /' %>
<li><a href="#<%= category %>/lib/<%= repo_id %>/" class="path-link normal"><%- repo_name %></a></li>
<% for (var i = 0,len = path_list.length - 1; i < len; i++) { %>
<li><a href="#<%= category %>/lib/<%= repo_id %>/<% print(path_list_encoded.slice(0, i+1).join('/')); %>" class="path-link normal"><%- path_list[i] %></a></li>
<% } %>
<li><%- path_list[i] %></li>
<% } %>
</script>
<script type="text/template" id="dirents-hd-tmpl">
@@ -729,7 +729,10 @@
</form>
</script>
<script type="text/template" id="group-top-tmpl">
<p class="path"><a href="{% url 'group_list' %}" class="normal">{% trans "Groups" %}</a> / <%- name %></p>
<ol class="path-bar breadcrumb">
<li><a href="{% url 'group_list' %}" class="normal">{% trans "Groups" %}</a></li>
<li><%- name %></li>
</ol>
<div class="hd ovhd">
{% if user.permissions.can_add_repo %}
<button class="repo-create fleft"><span class="icon-plus-square add vam"></span><span class="vam">{% trans "New Library" %}</span></button>
@@ -1423,7 +1426,7 @@
<script type="text/template" id="notice-popover-tmpl">
<div class="outer-caret up-outer-caret"><div class="inner-caret"></div></div>
<div class="sf-popover-hd ovhd">
<a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf-popover-close close sf2-icon-x1 op-icon fright"></a>
<a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf-popover-close js-close sf2-icon-x1 op-icon fright"></a>
<h3 class="sf-popover-title">{% trans "Notifications" %}</h3>
</div>
<div class="sf-popover-con">

View File

@@ -116,7 +116,7 @@
<script type="text/template" id="group-settings-tmpl">
<div class="outer-caret up-outer-caret"><div class="inner-caret"></div></div>
<div class="sf-popover-hd ovhd">
<a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf-popover-close close sf2-icon-x1 op-icon fright"></a>
<a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf-popover-close js-close sf2-icon-x1 op-icon fright"></a>
<h3 class="sf-popover-title">{% trans "Settings" %}</h3>
</div>
<div class="sf-popover-con">
@@ -126,7 +126,7 @@
<script type="text/template" id="group-members-tmpl">
<div class="outer-caret up-outer-caret"><div class="inner-caret"></div></div>
<div class="sf-popover-hd ovhd">
<a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf-popover-close close sf2-icon-x1 op-icon fright"></a>
<a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf-popover-close js-close sf2-icon-x1 op-icon fright"></a>
<h3 class="sf-popover-title">{% trans "Members" %}</h3>
</div>
<div class="sf-popover-con">
@@ -139,7 +139,7 @@
<script type="text/template" id="group-discussions-tmpl">
<div class="outer-caret up-outer-caret"><div class="inner-caret"></div></div>
<div class="sf-popover-hd ovhd">
<a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf-popover-close close sf2-icon-x1 op-icon fright"></a>
<a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf-popover-close js-close sf2-icon-x1 op-icon fright"></a>
<h3 class="sf-popover-title">{% trans "Discussions" %}</h3>
</div>
<div class="sf-popover-con">

View File

@@ -5,10 +5,10 @@
{% block right_panel %}
<p class="path">
<a class="path-link normal" href="{{ SITE_ROOT }}sys/groupadmin/">Groups</a> /
{{ group.group_name }}
</p>
<ol class="path-bar breadcrumb">
<li><a class="path-link normal" href="{{ SITE_ROOT }}sys/groupadmin/">Groups</a></li>
<li>{{ group.group_name }}</li>
</ol>
<div id="tabs" class="tab-tabs">
<div class="hd ovhd">

View File

@@ -11,13 +11,13 @@
{% block right_panel %}
<p class="path">
<a class="path-link normal" href="{{ SITE_ROOT }}sys/useradmin/">Users</a> /
{{ email }}
</p>
<ol class="path-bar breadcrumb">
<li><a class="path-link normal" href="{{ SITE_ROOT }}sys/useradmin/">Users</a></li>
<li>{{ email }}</li>
</ol>
<div id="tabs" class="tab-tabs">
<div class="hd ovhd">
<div class="hd header-bar ovhd">
<ul class="tab-tabs-nav fleft">
<li class="tab"><a href="#profile" class="a">{% trans "Profile" %}</a></li>
<li class="tab"><a href="#owned" class="a">{% trans "Owned Libs" %}</a></li>

View File

@@ -104,7 +104,7 @@ define([
this.$dirent_grid = this.$('.grid-view');
this.$dirent_list_body = this.$('.repo-file-list tbody');
this.$path_bar = this.$('.path');
this.$path_bar = this.$('.path-bar');
// For compatible with css, we use .repo-op instead of .dir-op
this.$dir_op_bar = this.$('.repo-op');

View File

@@ -48,7 +48,7 @@ define([
var PopoverView = Backbone.View.extend({
initialize: function(options) {
this.$el.on('click', '.close', _.bind(this.hide, this));
this.$el.on('click', '.js-close', _.bind(this.hide, this));
},
// set max-height for '.sf-popover-con'