You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@couchdb.apache.org by ga...@apache.org on 2014/07/22 17:26:18 UTC
[27/59] [abbrv] fauxton commit: updated refs/heads/master to 4e37185
Fauxton: Clean up css for new sidebar
Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo
Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/23b8b0b3
Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/23b8b0b3
Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/23b8b0b3
Branch: refs/heads/master
Commit: 23b8b0b39da957cabf64f0bd81cf439ab59da5df
Parents: 19a557e
Author: sean barclay <fu...@hotmail.com>
Authored: Wed May 28 21:08:21 2014 -0700
Committer: Garren Smith <ga...@gmail.com>
Committed: Tue Jul 22 16:49:09 2014 +0200
----------------------------------------------------------------------
app/addons/documents/assets/less/documents.less | 101 ++++++++++++++++---
.../documents/templates/design_doc_menu.html | 14 ++-
app/addons/documents/templates/sidebar.html | 6 +-
assets/less/fauxton.less | 19 ++--
assets/less/variables.less | 3 +-
5 files changed, 110 insertions(+), 33 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/23b8b0b3/app/addons/documents/assets/less/documents.less
----------------------------------------------------------------------
diff --git a/app/addons/documents/assets/less/documents.less b/app/addons/documents/assets/less/documents.less
index 4e87dd6..cdcb3ed 100644
--- a/app/addons/documents/assets/less/documents.less
+++ b/app/addons/documents/assets/less/documents.less
@@ -10,6 +10,10 @@
// License for the specific language governing permissions and limitations under
// the License.
/*ALL DOCS TABLE*/
+
+@import "../../../style/assets/less/mixins.less";
+@import "../../../../../assets/less/variables.less";
+
tr.all-docs-item {
border: none;
background: transparent;
@@ -20,7 +24,7 @@ tr.all-docs-item {
}
}
button.beautify {
- margin-top: 20px;
+ margin-top: 20px;
}
.toggle-btns {
@@ -159,6 +163,26 @@ button.beautify {
.sidenav{
margin-bottom: 40px;
+ .nav-list > .active > a{
+ text-shadow: none;
+ background-color: rgba(0, 0, 0, 0.05);
+ }
+ .nav-list > .active > a:hover,
+ .nav-list > .active > a:focus{
+ color: white;
+ }
+ .nav-list > li > a:hover + div.add-dropdown .dropdown-toggle{
+ color: white;
+ }
+ .dropdown-toggle:hover {
+ color: @linkRed
+ }
+ li{
+ position: relative;
+ a{
+ text-shadow: none;
+ }
+ }
li.nav-header {
position: relative;
.accordion-body{
@@ -167,34 +191,83 @@ button.beautify {
}
color: #eee;
margin-left: 0;
+ li.active > a{
+ background-color: rgba(0, 0, 0, 0.05);
+ }
li a{
padding-left: 55px;
font-size: 14px;
&:hover {
- background-color: #af2d24;
color: #fff;
text-decoration: none;
+ background-color: @darkRed;
}
}
}
- > span{
+ .fonticon-play{
+ color: @subListGray;
+ position: absolute;
+ display: block;
+ vertical-align: bottom;
+ }
+ > .js-collapse-toggle{
+ position: relative;
display: block;
- padding: 10px 13px 10px 30px;
- color: #333333;
border-bottom: 1px solid #d3d7db;
- &:before{
- vertical-align: bottom;
+ .accordion-list-item:hover {
+ p, .fonticon-play{
+ color: white;
+ }
+ p{
+ background-color: @darkRed;
+ }
+ }
+ .accordion-list-item:hover + div.add-dropdown .dropdown-toggle{
+ color: white;
+ }
+ .accordion-list-item p, .fonticon-play{
+ .transition(all 0.25s linear);
+ }
+ .accordion-list-item p{
+ margin: 0;
+ padding: 10px 13px 10px 36px;
+ color: @linkRed;
+ }
+ .fonticon-play{
font-size: 12px;
- padding-right: 10px;
- margin-bottom: 2px;
+ top: 12px;
+ left: 12px;
+ }
+ &.down .fonticon-play {
+ .rotate(90deg);
+ }
+ .add-dropdown{
+ right: 15px;
}
- &.down:before {
- margin-bottom: -2px;
- transform:rotate(90deg);
- -ms-transform:rotate(90deg); /* IE 9 */
- -webkit-transform:rotate(90deg); /* Opera, Chrome, and Safari */
+ .dropdown-toggle:hover{
+ color: @linkRed
+ }
+ }
+ > ul.accordion-body{
+ > li {
+ a{
+ padding-left: 36px;
+ }
+ .fonticon-play{
+ font-size: 8px;
+ top: 11px;
+ left: 15px;
+ }
+ .fonticon:before{
+ margin-right: 6px;
+ font-size: 20px;
+ }
}
}
}
+
}
+
+
+
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/23b8b0b3/app/addons/documents/templates/design_doc_menu.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/design_doc_menu.html b/app/addons/documents/templates/design_doc_menu.html
index 63d6016..beb0c85 100644
--- a/app/addons/documents/templates/design_doc_menu.html
+++ b/app/addons/documents/templates/design_doc_menu.html
@@ -12,13 +12,19 @@ License for the specific language governing permissions and limitations under
the License.
-->
<li class="nav-header">
- <div class="new-button add-dropdown"></div>
- <span class="fonticon-play js-collapse-toggle" data-toggle="collapse" data-target="#<%= ddoc_clean %>">
- <%= designDoc%>
- </span>
+
+ <div class="js-collapse-toggle" data-toggle="collapse" data-target="#<%= ddoc_clean %>">
+ <div class="accordion-list-item">
+ <div class="fonticon-play"></div>
+ <p><%= designDoc%></p>
+ </div>
+ <div class="new-button add-dropdown"></div>
+ </div>
<ul class="accordion-body collapse" id="<%= ddoc_clean %>">
<li>
<a id="<%= ddoc_clean %>_metadata" href="#/database/<%- database_encoded %>/_design/<%- ddoc_encoded %>/metadata" class="toggle-view">
+ <div class="fonticon-play"></div>
+ <span class="cloudant-sidenav-info fonticon"></span>
Design Doc Metadata
</a>
</li>
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/23b8b0b3/app/addons/documents/templates/sidebar.html
----------------------------------------------------------------------
diff --git a/app/addons/documents/templates/sidebar.html b/app/addons/documents/templates/sidebar.html
index b90a7b6..8d2ea4c 100644
--- a/app/addons/documents/templates/sidebar.html
+++ b/app/addons/documents/templates/sidebar.html
@@ -18,13 +18,13 @@ the License.
<% _.each(docLinks, function (link) { %>
<li><a href="<%= database_url + '/' + link.url %>"><%= link.title %></a></li>
<% }); %>
- <li class="active">
- <div id="new-all-docs-button" class="add-dropdown"> </div>
+ <li class="active">
<a id="all-docs" href="#<%= database.url('index') %>" class="toggle-view"> All Documents</a>
+ <div id="new-all-docs-button" class="add-dropdown"> </div>
</li>
<li>
- <div id="new-design-docs-button" class="add-dropdown"> </div>
<a id="design-docs" href='#<%= database.url("index") %>?startkey="_design"&endkey="_e"' class="toggle-view"> All Design Docs</a>
+ <div id="new-design-docs-button" class="add-dropdown"> </div>
</li>
</ul>
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/23b8b0b3/assets/less/fauxton.less
----------------------------------------------------------------------
diff --git a/assets/less/fauxton.less b/assets/less/fauxton.less
index 9b1574f..34df6b7 100644
--- a/assets/less/fauxton.less
+++ b/assets/less/fauxton.less
@@ -700,12 +700,12 @@ table.databases {
background-color: @darkRed;
color: #fff;
}
-
li.active > a {
color: @darkRed;
}
> li > a{
- padding: 10px 13px 10px 30px;
+ color: @linkRed;
+ padding: 10px 13px 10px 36px;
border-bottom: 1px solid #d3d7db;
}
.dropdown-menu {
@@ -716,8 +716,7 @@ table.databases {
a{
display: block;
padding: 10px 5px 10px 15px;
- color: #333333;
-
+ color: @subListGray;
.divider {
background: none;
color: #ccc;
@@ -728,8 +727,6 @@ table.databases {
padding: 0px;
text-shadow: none;
color: #333333;
- margin-bottom: -4px;
-
& > span:hover {
color: @red;
}
@@ -931,12 +928,12 @@ div.spinner {
}
}
-div.add-dropdown {
-
- position: absolute;
- right: 15px;
+div.add-dropdown {
+ position: absolute;
+ top: 0px;
+ right: 0px;
.dropdown-menu{
- left: -82px;
+ left: -90px;
padding-bottom: 0;
width: auto;
min-width: 0;
http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/23b8b0b3/assets/less/variables.less
----------------------------------------------------------------------
diff --git a/assets/less/variables.less b/assets/less/variables.less
index 2377e6b..d3ea957 100644
--- a/assets/less/variables.less
+++ b/assets/less/variables.less
@@ -20,7 +20,8 @@
@greyBrown: #554D4C;
@greyBrownLighter: #A59D9D;
@fontGrey: #808080;
-@secondarySidebar: #E4DFDC;
+@secondarySidebar: white;
+@subListGray: #767F89;
@orange: #F3622D;