Author: nathangray
New Revision: 55333
URL: http://svn.stylite.de/viewvc/egroupware?rev=55333&view=rev
Log:
Change taglist toggle to tri-state where toggle button replaces dropdown trigger, instead of having a separate button
Modified:
trunk/etemplate/js/et2_widget_taglist.js
trunk/etemplate/templates/default/etemplate2.css
trunk/pixelegg/css/mobile.css
trunk/pixelegg/css/pixelegg.css
trunk/pixelegg/less/etemplate2.less
trunk/pixelegg/mobile/fw_mobile.css
— trunk/etemplate/js/et2_widget_taglist.js (original)
+++ trunk/etemplate/js/et2_widget_taglist.js Wed Mar 9 17:20:53 2016
@@ -196,7 +196,7 @@
}
// MagicSuggest would replaces our div, so add a wrapper instead
@@ -280,6 +280,7 @@
// Position absolute to break out of containers
.on(‘expand’, jQuery.proxy(function© {
var taglist = this.taglist;
@@ -313,6 +314,7 @@
);
this.$taglist.one(‘collapse’, function() {
wrapper.remove();
@@ -510,6 +512,12 @@
if(this.taglist == null) return;
disabled ? this.taglist.disable() : this.taglist.enable();
-
},
-
-
set_width: function(_width)
-
{
-
this.div.width(_width);
-
this.options.width = _width;
},
/**
@@ -706,6 +714,9 @@
if(this.taglist == null) return;
-
// Switch to multiple if allowed and more than 1 value
-
this._set_multiple(this.options.multiple ? values.length > 1 : false);
-
this.taglist.setSelection(values);
},
— trunk/etemplate/templates/default/etemplate2.css (original)
+++ trunk/etemplate/templates/default/etemplate2.css Wed Mar 9 17:20:53 2016
@@ -1004,7 +1004,7 @@
font-weight: bold;
}
/* min-height to fix calculations done while hidden /
-.et2_taglist, .et2_taglist > div:first-child {
+.et2_taglist, .et2_taglist > div.ms-ctn {
min-height: 23px;
}
/ Toggle single / multiple */
@@ -1012,8 +1012,12 @@
}
.et2_taglist_toggle > div.ms-ctn {
display: inline-block;
- width: calc(100% - 40px);
- padding-right: 2px
- width: calc(100% - 16px);
- padding-right: 2px;
+}
+.et2_taglist_toggle.ui-state-hover,
+.et2_taglist_toggle.ui-state-active {
- z-index: 1;
}
.et2_taglist_toggle:not(.et2_taglist_single) .ms-ctn {
/* height: 100%;*/
@@ -1025,17 +1029,25 @@
margin-left: -1px;
float: right;
-
width: 25px;
height: 23px;
position: relative;
-
z-index: 5;
-
border: 1px solid #BBB;
-
background-color: white;
background-repeat: no-repeat;
background-position: center center;
background-image: url("…/…/…/phpgwapi/templates/default/images/foldertree_nolines_minus.gif");
}
-.et2_taglist_toggle.et2_taglist_single > div.toggle {
-
+.et2_taglist_toggle.et2_taglist_single:not(.expanded) > div.toggle {
- display: none;
+}
+.et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
background-image: url("…/…/…/phpgwapi/templates/default/images/foldertree_nolines_plus.gif");
- display: block;
}
.et2_taglist_toggle:not(.et2_taglist_single) .ms-trigger {
display: none;
@@ -1064,6 +1076,7 @@
}
.et2_taglist_single div.ms-sel-item > span:first-child {
max-width: 100%;
- width: 100%;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
@@ -1074,7 +1087,7 @@
.et2_taglist_single div.ms-sel-ctn .ms-close-btn {
position: relative;
top: 0px;
- right: 10px;
float: none;
display: inline-block;
}
@@ -1093,7 +1106,7 @@
content: attr(data-content) ‘’;
text-align: right;
position: absolute;
- z-index: 10;
top: 1px;
bottom: 0px;
right: 0;
@@ -1105,16 +1118,18 @@
min-width: 25%;
background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 25%);
}
+.et2_taglist_small:not(.et2_taglist_single) {
- border-bottom: 1px solid silver;
+}
div .et2_taglist_small.et2_taglist_single div.ms-sel-ctn div.ms-sel-item {
max-width: calc(100% - 43px);
- width: 100%;
}
.et2_taglist_toggle.et2_taglist_small::before {
- right: 25px;
}
.et2_taglist_small.ui-state-hover,
.et2_taglist_small.ui-state-active {
max-height: none;
- max-width: 25em;
min-width: 15em;
background: white;
z-index: 5;
— trunk/pixelegg/css/mobile.css (original)
+++ trunk/pixelegg/css/mobile.css Wed Mar 9 17:20:53 2016
@@ -1000,7 +1000,7 @@
background-image: url("…/images/minus.svg");
background-size: 50%;
}
- .et2_taglist_toggle.et2_taglist_single > div.toggle {
- .et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
background-image: url("…/images/plus.svg");
background-size: 50%;
}
— trunk/pixelegg/css/pixelegg.css (original)
+++ trunk/pixelegg/css/pixelegg.css Wed Mar 9 17:20:53 2016
@@ -939,7 +939,7 @@
background-image: url("…/images/minus.svg");
background-size: 50%;
}
- .et2_taglist_toggle.et2_taglist_single > div.toggle {
- .et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
background-image: url("…/images/plus.svg");
background-size: 50%;
}
— trunk/pixelegg/less/etemplate2.less (original)
+++ trunk/pixelegg/less/etemplate2.less Wed Mar 9 17:20:53 2016
@@ -910,7 +910,7 @@
background-image: url("…/images/minus.svg");
background-size: 50%;
}
-.et2_taglist_toggle.et2_taglist_single > div.toggle {
+.et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
background-image: url("…/images/plus.svg");
background-size: 50%;
}
— trunk/pixelegg/mobile/fw_mobile.css (original)
+++ trunk/pixelegg/mobile/fw_mobile.css Wed Mar 9 17:20:53 2016
@@ -1011,7 +1011,7 @@
background-image: url("…/images/minus.svg");
background-size: 50%;
}
- .et2_taglist_toggle.et2_taglist_single > div.toggle {
- .et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
background-image: url("…/images/plus.svg");
background-size: 50%;
}
Transform Data into Opportunity.
Accelerate data analysis in your applications with
Intel Data Analytics Acceleration Library.
Click to learn more.
http://pubads.g.doubleclick.net/gampad/clk?id=278785111&iu=/4140
eGroupWare-cvs mailing list
eGroupWare-cvs@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/egroupware-cvs
