You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@allura.apache.org by he...@apache.org on 2015/10/28 19:02:11 UTC
[49/50] [abbrv] allura git commit: [#7919] Refactor and reduce
toolbar css
[#7919] Refactor and reduce toolbar css
Project: http://git-wip-us.apache.org/repos/asf/allura/repo
Commit: http://git-wip-us.apache.org/repos/asf/allura/commit/6b697c2e
Tree: http://git-wip-us.apache.org/repos/asf/allura/tree/6b697c2e
Diff: http://git-wip-us.apache.org/repos/asf/allura/diff/6b697c2e
Branch: refs/heads/hs/7919
Commit: 6b697c2e45202d8ae73cf48556dd925be0049708
Parents: 7e01077
Author: Heith Seewald <hs...@hsmb.local>
Authored: Mon Oct 26 12:57:23 2015 -0400
Committer: Heith Seewald <hs...@hsmb.local>
Committed: Wed Oct 28 14:00:52 2015 -0400
----------------------------------------------------------------------
Allura/allura/public/nf/css/navbar.css | 319 ++++----------------
Allura/allura/public/nf/js/add-new-tool.es6.js | 2 +-
Allura/allura/public/nf/js/navbar.es6.js | 6 +-
3 files changed, 70 insertions(+), 257 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/allura/blob/6b697c2e/Allura/allura/public/nf/css/navbar.css
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/css/navbar.css b/Allura/allura/public/nf/css/navbar.css
index d27b727..097c163 100644
--- a/Allura/allura/public/nf/css/navbar.css
+++ b/Allura/allura/public/nf/css/navbar.css
@@ -1,146 +1,58 @@
-.submenu ul {
- list-style: none;
- width: 350px;
- display: none;
-}
-
-/*.hidden {*/
-/*display: none;*/
-/*}*/
-
-.submenu ul {
- list-style: none;
- display: block;
- position: relative;
- background-color: rgb(237, 237, 237);
- border: solid darkgray 1px;
- border-radius: 0 0 5px 5px;
- margin-top: -13px;
- margin-left: 341px;
- left: -25px;
- padding-left: 0;
- box-shadow: 3px 0 3px #d7d7d7;
- z-index: -1000;
- padding-top: 11px;
-}
-
#bar-config {
- display: inline-flex;
position: absolute;
right: 0;
top: -30px;
- align-items: stretch;
- flex: 1 1 auto;
-}
-
-#threshold-config > span > input {
- width: 2rem;
- background-color: #A1A1A1;
- color: white;
- font-weight: bold;
}
#toggle-admin-btn {
position: absolute;
- right: -9px;
- top: 0;
- width: 2rem;
+ right: -11px;
+ top: -1px;
+ width: 1.8rem;
height: 1.8rem;
}
-nav {
- display: flex;
- flex-direction: row;
- justify-content: center;
- margin: auto;
-}
-
-#top_nav_admin > div.edit-mode > ul {
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
- flex: 1;
-}
-
-#top_nav_admin > div.edit-mode > ul > .tb-item {
- background-color: #F0F0F0;
- margin-top: 0.5rem;
- display: inline-grid;
- margin-left: .5rem;
- border: 1px dashed gray;
- padding: 0.3rem 0.6rem 0.3rem 0.6rem;
-}
-
-.admin-toolbar {
- display: flex;
+#threshold-config > span > input {
+ width: 2rem;
+ background-color: #F2F2F2;
+ color: #333;
+ font-weight: bold;
}
#top_nav_admin {
- display: grid;
- flex-direction: row;
- flex-wrap: wrap;
- -moz-border-radius: 4px;
- -webkit-border-radius: 4px;
- -o-border-radius: 4px;
- -ms-border-radius: 4px;
- -khtml-border-radius: 4px;
- border-radius: 4px;
+ overflow: hidden;
+ min-height: 42px;
width: 918px; /* 940px - 32px for toggle-admin-btn */
}
-#top_nav_admin .edit-mode .fa {
- margin: 0 3px;
+#admin-toolbar-list{
+ border-bottom: 1px solid transparent;
}
-.btn-bar {
- display: block;
- clear: both;
- padding: 0 10px 0 10px;
- -moz-border-radius: 4px;
- -webkit-border-radius: 4px;
- -o-border-radius: 4px;
- -ms-border-radius: 4px;
- -khtml-border-radius: 4px;
- border-radius: 4px;
- text-decoration: none;
- min-width: 1em;
- text-align: center;
- position: relative;
- margin: 0 0 20px;
-}
-
-ul.dropdown li {
- float: left;
- vertical-align: middle;
- zoom: 1;
- padding-top: 10px;
- padding-bottom: 10px;
-}
-
-ul.dropdown, ul.dropdown li, ul.dropdown ul {
- list-style: none;
- margin: 0;
- padding: 0;
-}
-
-li.tb-item-edit > input {
- width: 2.2rem;
+.anchored {
+ cursor: not-allowed;
+ color: gray;
}
.draggable-handle {
+ margin-left: 2px;
cursor: move;
}
-ul.dropdown li {
+.react-reorderable-item {
+ display: inline-flex;
float: left;
- vertical-align: middle;
- zoom: 1;
- padding-top: 10px;
- padding-bottom: 10px;
}
-#content {
- width: 990px;
+.react-reorderable-item-active {
+ border: 3px dashed #9e9e9e;
+ background: #c9c9c9;
+ width: 5rem; /* dynamic would be nice */
+ height: 50px;
+}
+
+.react-reorderable-item-active div {
+ display: none;
}
.react-reorderable-item {
@@ -164,7 +76,9 @@ ul.dropdown li {
}
#top_nav_admin .tb-item a {
- margin: 10px;
+ margin: 10px 10px 10px 0;
+ border-right: 1px solid #ccc;
+ padding-right: 10px;
}
.react-drag {
@@ -175,39 +89,20 @@ ul.dropdown li {
user-select: none;
}
-ul.dropdown ul {
- visibility: hidden;
- position: absolute;
- top: 70px;
- z-index: 598;
- background-color: #ffffff;
- border: 1px solid #dddddd;
- border-top-width: 0;
-}
-
-ul.dropdown .hover, ul.dropdown li:hover {
+.btn-bar {
+ display: block;
+ padding: 0 10px 0 10px;
+ -moz-border-radius: 4px;
+ -webkit-border-radius: 4px;
+ -o-border-radius: 4px;
+ -ms-border-radius: 4px;
+ -khtml-border-radius: 4px;
+ border-radius: 4px;
+ text-decoration: none;
+ min-width: 1em;
+ text-align: center;
position: relative;
- z-index: 599;
- cursor: default;
-}
-
-.anchored {
- cursor: not-allowed;
- color: gray;
-}
-
-.nav_admin {
- height: auto;
-}
-
-.nav_admin > div > ul > li {
- height: 1.2rem;
- font-weight: inherit;
-}
-
-.tool-partition {
- height: 0;
- border-top: 3px solid #777;
+ margin: 0 0 20px;
}
.installable-tool-box {
@@ -222,19 +117,15 @@ ul.dropdown .hover, ul.dropdown li:hover {
}
.installable-tool-box div {
- padding-top: 4px;
margin-bottom: 0;
margin-left: 0;
border-radius: 0 0 4px 4px;
- padding-left: 5px;
- padding-bottom: 2px;
- padding-right: 5px;
+ padding: 4px 5px 2px;
text-align: center;
font-size: small;
font-weight: 400;
list-style: none;
cursor: pointer;
- /*align-items: flex-start;*/
min-width: 40px;
border: 1px solid transparent;
-webkit-user-select: none;
@@ -244,14 +135,7 @@ ul.dropdown .hover, ul.dropdown li:hover {
user-select: none;
}
-/*.installable-tool-box > div{
- color:blue;
- background: rgba(255, 255, 255, 0.8);
- min-width: 75px;
- border: 1px dashed orange;
-}*/
-
-.selected-tool {
+.tool-card .selected-tool {
background: #09C !important;
color: white !important;
height: 21px;
@@ -285,7 +169,7 @@ ul.dropdown .hover, ul.dropdown li:hover {
color: #4E4E4E;
font-size: xx-large;
position: absolute;
- right: 0px;
+ right: 0;
top: -14px;
overflow: visible;
float: right;
@@ -305,9 +189,17 @@ ul.dropdown .hover, ul.dropdown li:hover {
}
.tool-info {
- min-height: -15rem;
display: block;
- clear: both;
+}
+
+.tool-info-left {
+ background: #636363;
+ width: 60%;
+ height: 206px;
+ left: 0;
+ float: left;
+ top: 0;
+ color: white;
}
.tool-info-left p {
@@ -317,7 +209,6 @@ ul.dropdown .hover, ul.dropdown li:hover {
left: 0;
font-size: 11pt;
font-weight: 400;
- margin: 2rem 33px;
color: #F9F9F9;
padding-bottom: 20px;
margin: 20px;
@@ -336,74 +227,26 @@ ul.dropdown .hover, ul.dropdown li:hover {
margin: 0;
}
-.add-tool-button {
- width: 140px;
- height: auto;
- min-height: 1.6rem;
- font-size: small;
- bottom: 0.7rem;
- right: -10px;
-}
-
-.tool-info-left {
- background: #636363;
- width: 60%;
- height: 206px;
- left: 0;
- float: left;
- top: 0;
- color: white;
-}
-
.tool-info-right {
width: 40%;
float: right;
- overflow: hidden;
position: relative;
- display: block;
top: 0;
}
-.tool-form {
- display: inline-block;
- width: 100%;
- position: absolute;
- right: 0;
- top: 0;
- padding-top: 1rem;
- height: auto;
-}
-
-#add-tool-form > label {
- padding: 0;
- font-size: 13pt;
- position: absolute;
- margin-left: 18px;
-}
-
-#add-tool-form > p {
- font-size: large;
-
-}
-
-#add-tool-form > input {
- padding-top: 10px;
- padding-left: 10px;
- width: 77%;
- margin: 23px 60px 11px 19px;
-}
-
#add-tool-form {
padding-top: 20px;
padding-left: 25px;
padding-right: 25px;
}
-.tool-form-fields {
- clear: both;
- position: relative;
- display: flex;
- flex-direction: row;
+.add-tool-button {
+ width: 140px;
+ height: auto;
+ min-height: 1.6rem;
+ font-size: small;
+ bottom: 0.7rem;
+ right: -10px;
}
#mount_point :invalid {
@@ -411,25 +254,12 @@ ul.dropdown .hover, ul.dropdown li:hover {
}
.add-tool-toggle {
- background: rgba(255, 255, 255, 0.32);
- /*clear: both;*/
- color: #8b8b8b;
- /*font-weight: bold;*/
- /*margin: 1px;*/
- /*position: relative;*/
-
- /*right: 127px;*/
- /*position: absolute;*/
- /*padding: 5px 5px 3px;*/
border: 1px dashed #B3B3B3;
- padding-top: 2px;
- padding-bottom: 2px;
- /*top: 18px;*/
+ padding: 1px;
height: 100%;
- width: 5.7rem;
+ width: 5.1rem;
float: right;
border-radius: 4px;
- /*height: 1.5rem;*/
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
@@ -443,25 +273,6 @@ ul.dropdown .hover, ul.dropdown li:hover {
color: #777;
}
-.active-nav-link {
- font-weight: bolder;
-}
-
.add-tool-field {
width: 50%;
}
-
-.error-box {
- background: rgba(255, 114, 114, 0.65);
- color: white;
- padding: 4px;
- font-weight: 500;
- position: fixed;
- top: 289px;
- width: 175px;
- box-shadow: 0px 1px 1px #8E8E8E;
- left: 639px;
- border-radius: 4px;
- font-size: 9pt;
- float: left;
-}
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/allura/blob/6b697c2e/Allura/allura/public/nf/js/add-new-tool.es6.js
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/js/add-new-tool.es6.js b/Allura/allura/public/nf/js/add-new-tool.es6.js
index c9820e9..c5593e8 100644
--- a/Allura/allura/public/nf/js/add-new-tool.es6.js
+++ b/Allura/allura/public/nf/js/add-new-tool.es6.js
@@ -111,7 +111,7 @@ var FormField = React.createClass({
});
console.log('result', result);
return (
- <div className="error-box">
+ <div className="add-tool-error-box">
{result}
</div>
);
http://git-wip-us.apache.org/repos/asf/allura/blob/6b697c2e/Allura/allura/public/nf/js/navbar.es6.js
----------------------------------------------------------------------
diff --git a/Allura/allura/public/nf/js/navbar.es6.js b/Allura/allura/public/nf/js/navbar.es6.js
index c547cc8..e860597 100644
--- a/Allura/allura/public/nf/js/navbar.es6.js
+++ b/Allura/allura/public/nf/js/navbar.es6.js
@@ -101,10 +101,11 @@ var NavBarItem = React.createClass({
} else {
arrow_classes += ' draggable-handle';
}
- controls.push(<i className={arrow_classes}></i>);
+//controls.push(<i className={arrow_classes}></i>);
return (
<div className="tb-item tb-item-edit">
- <a>{this.props.name}<br/>{controls}</a>
+ <a>{controls}
+ <span className="draggable-handle">{this.props.name}</span></a>
</div>
);
}
@@ -184,6 +185,7 @@ var NormalNavBar = React.createClass({
var classes = 'dropdown';
return (
<ul
+ id="admin-toolbar-list"
className={ classes }
key={ `toolList-${_.uniqueId()}` }>
{ listItems }