make toggle-button and table-design generally available PR: #728 PR-URL: https://github.com/apache/couchdb-fauxton/pull/728 Reviewed-By: garren smith <garren.sm...@gmail.com>
Project: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/repo Commit: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/commit/049d6ca9 Tree: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/tree/049d6ca9 Diff: http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/diff/049d6ca9 Branch: refs/heads/master Commit: 049d6ca92426789ceec61435a953d74d32dbb6b1 Parents: 39cba49 Author: Robert Kowalski <robertkowal...@apache.org> Authored: Mon Jun 13 12:32:34 2016 +0200 Committer: Robert Kowalski <robertkowal...@apache.org> Committed: Mon Jun 13 16:07:06 2016 +0200 ---------------------------------------------------------------------- app/addons/databases/assets/less/databases.less | 15 --------- app/addons/databases/components.react.jsx | 4 +-- app/addons/documents/assets/less/documents.less | 22 ------------- .../documents/assets/less/index-results.less | 3 -- assets/less/fauxton.less | 19 +++++++++++ assets/less/formstyles.less | 34 ++++++++++++++++++++ 6 files changed, 55 insertions(+), 42 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/049d6ca9/app/addons/databases/assets/less/databases.less ---------------------------------------------------------------------- diff --git a/app/addons/databases/assets/less/databases.less b/app/addons/databases/assets/less/databases.less index 0d27d75..e075fc2 100644 --- a/app/addons/databases/assets/less/databases.less +++ b/app/addons/databases/assets/less/databases.less @@ -18,21 +18,6 @@ margin-bottom: 10px; } -.databases { - a.db-actions, - a.db-actions:visited { - color: @linkColor; - border: 1px solid #e3e3e3; - padding: 5px 7px; - .border-radius(6px); - text-decoration: none; - font-size: 19px; - } - td { - vertical-align: middle; - } -} - .new-database-tray { padding: 16px 20px 28px; &:before { http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/049d6ca9/app/addons/databases/components.react.jsx ---------------------------------------------------------------------- diff --git a/app/addons/databases/components.react.jsx b/app/addons/databases/components.react.jsx index e4a11c5..62eb09e 100644 --- a/app/addons/databases/components.react.jsx +++ b/app/addons/databases/components.react.jsx @@ -105,13 +105,13 @@ var DatabaseTable = React.createClass({ ); } - var rows = this.createRows(); + const rows = this.createRows(); return ( <div className="view"> <DeleteDatabaseModal showHide={this.showDeleteDatabaseModal} modalProps={this.props.showDeleteDatabaseModal} /> - <table className="databases table table-striped"> + <table className="table table-striped fauxton-table-list databases"> <thead> <tr> <th>Name</th> http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/049d6ca9/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 8ce8aa6..175e879 100644 --- a/app/addons/documents/assets/less/documents.less +++ b/app/addons/documents/assets/less/documents.less @@ -23,28 +23,6 @@ @import "revision-browser"; @import "jumptodoc"; -.two-sides-toggle-button { - font-size: 15px; - padding: 11px; - - button.btn { - padding: 10px 15px; - background-color: #fff; - color: #888; - &:hover { - background-color: #e73d34; - color: #fff; - } - &.active { - background-color: #f1f1f1; - color: #af2d24; - &:hover { - background-color: #f1f1f1; - color: #af2d24; - } - } - } -} button.beautify { margin-top: 20px; http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/049d6ca9/app/addons/documents/assets/less/index-results.less ---------------------------------------------------------------------- diff --git a/app/addons/documents/assets/less/index-results.less b/app/addons/documents/assets/less/index-results.less index ac420c2..f53f9b9 100644 --- a/app/addons/documents/assets/less/index-results.less +++ b/app/addons/documents/assets/less/index-results.less @@ -99,9 +99,6 @@ td.tableview-checkbox-cell, th.tableview-header-el-checkbox { width: 68px; } - .tableview-checkbox-cell input { - margin: 0 0 0 8px; - } .tableview-conflict { color: #F00; } http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/049d6ca9/assets/less/fauxton.less ---------------------------------------------------------------------- diff --git a/assets/less/fauxton.less b/assets/less/fauxton.less index 701e6c5..d832dfb 100644 --- a/assets/less/fauxton.less +++ b/assets/less/fauxton.less @@ -69,6 +69,10 @@ button:focus, a:focus { outline: 0; } +.table input[type="checkbox"] { + margin: 0 0 0 8px; +} + a, a:visited, a:active { @@ -753,3 +757,18 @@ body .control-toggle-include-docs span { .capitalize { text-transform: capitalize; } + +.fauxton-table-list { + a.db-actions, + a.db-actions:visited { + color: @linkColor; + border: 1px solid #e3e3e3; + padding: 5px 7px; + .border-radius(6px); + text-decoration: none; + font-size: 19px; + } + td { + vertical-align: middle; + } +} http://git-wip-us.apache.org/repos/asf/couchdb-fauxton/blob/049d6ca9/assets/less/formstyles.less ---------------------------------------------------------------------- diff --git a/assets/less/formstyles.less b/assets/less/formstyles.less index c04ffb7..c04a254 100644 --- a/assets/less/formstyles.less +++ b/assets/less/formstyles.less @@ -48,6 +48,10 @@ select { } } +button:focus { + outline: 0 !important; +} + .btn { .box-shadow(none); .border-radius(@baseBorderRadius); @@ -289,3 +293,33 @@ input.errorHighlight { -webkit-animation: errorBlinkBG 1s; animation: errorBlinkBG 1s; } + +.two-sides-toggle-button { + font-size: 15px; + padding: 11px; + + button.btn { + padding: 10px 15px; + background-color: #fff; + color: #888; + &.active:first-child { + border-right-radius: 10px; + } + &:hover { + background-color: #e73d34; + color: #fff; + .box-shadow(none); + + } + &.active { + background-color: #f1f1f1; + color: #af2d24; + &:hover { + background-color: #f1f1f1; + color: #af2d24; + } + .box-shadow(none); + } + } + +}
