mirror of
https://github.com/EGroupware/egroupware.git
synced 2025-06-21 18:31:37 +02:00
Better handling for taglist overflow - ellipsis, better hiding, better layout handling
This commit is contained in:
parent
b9fc5e26df
commit
04e33f4d19
@ -526,7 +526,11 @@ var et2_taglist = (function(){ "use strict"; return et2_selectbox.extend([et2_IR
|
|||||||
}
|
}
|
||||||
if(_rows)
|
if(_rows)
|
||||||
{
|
{
|
||||||
var max = (25 * _rows) + _rows;
|
var border = this.taglist !== null ?
|
||||||
|
this.div.outerHeight(true) - this.taglist.container.innerHeight() :
|
||||||
|
0;
|
||||||
|
|
||||||
|
var max = (25 * _rows) + _rows + border;
|
||||||
css['max-height'] = max+'px';
|
css['max-height'] = max+'px';
|
||||||
if(this._multiple)
|
if(this._multiple)
|
||||||
{
|
{
|
||||||
@ -729,6 +733,7 @@ var et2_taglist = (function(){ "use strict"; return et2_selectbox.extend([et2_IR
|
|||||||
if(min_width === null) return;
|
if(min_width === null) return;
|
||||||
|
|
||||||
min_width += (this.options.multiple === 'toggle' ? $j('.toggle',this.div).outerWidth() : 0);
|
min_width += (this.options.multiple === 'toggle' ? $j('.toggle',this.div).outerWidth() : 0);
|
||||||
|
min_width += this.taglist.trigger ? this.taglist.trigger.outerWidth(true) : 0;
|
||||||
|
|
||||||
// Not enough for one
|
// Not enough for one
|
||||||
if(min_width > this.div.width() ||
|
if(min_width > this.div.width() ||
|
||||||
|
@ -966,11 +966,15 @@ ul.et2_link_string {
|
|||||||
line-height: 13px;
|
line-height: 13px;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
word-break: break-all;
|
word-break: break-word;
|
||||||
|
white-space: normal;
|
||||||
|
max-width: calc(100% - 30px);
|
||||||
}
|
}
|
||||||
.et2_taglist.ui-state-hover,
|
.et2_taglist.ui-state-hover,
|
||||||
.et2_taglist.ui-state-active {
|
.et2_taglist.ui-state-active {
|
||||||
font-weight: inherit;
|
font-weight: inherit;
|
||||||
|
border: inherit;
|
||||||
|
background: inherit;
|
||||||
}
|
}
|
||||||
.et2_taglist div.ms-ctn {
|
.et2_taglist div.ms-ctn {
|
||||||
background-color: white;
|
background-color: white;
|
||||||
@ -1005,13 +1009,15 @@ ul.et2_link_string {
|
|||||||
}
|
}
|
||||||
/* Toggle single / multiple */
|
/* Toggle single / multiple */
|
||||||
.et2_taglist_toggle {
|
.et2_taglist_toggle {
|
||||||
white-space: nowrap;
|
|
||||||
}
|
}
|
||||||
.et2_taglist_toggle > div.ms-ctn {
|
.et2_taglist_toggle > div.ms-ctn {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: calc(100% - 40px);
|
width: calc(100% - 40px);
|
||||||
padding-right: 2px
|
padding-right: 2px
|
||||||
}
|
}
|
||||||
|
.et2_taglist_toggle:not(.et2_taglist_single) .ms-ctn {
|
||||||
|
/* height: 100%;*/
|
||||||
|
}
|
||||||
.et2_taglist_toggle.et2_taglist_single > div.ms-ctn {
|
.et2_taglist_toggle.et2_taglist_single > div.ms-ctn {
|
||||||
padding-right: 7px
|
padding-right: 7px
|
||||||
}
|
}
|
||||||
@ -1048,12 +1054,30 @@ ul.et2_link_string {
|
|||||||
div .et2_taglist_single div.ms-sel-ctn div.ms-sel-item {
|
div .et2_taglist_single div.ms-sel-ctn div.ms-sel-item {
|
||||||
border: none;
|
border: none;
|
||||||
background: inherit;
|
background: inherit;
|
||||||
width: calc(100% - 43px);
|
|
||||||
margin-bottom: 0px;
|
margin-bottom: 0px;
|
||||||
padding-bottom: 6px;
|
padding-bottom: 6px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
div .et2_taglist_single:not(.et2_taglist_small) div.ms-sel-ctn div.ms-sel-item {
|
||||||
|
width: calc(100% - 43px);
|
||||||
|
}
|
||||||
|
.et2_taglist_single div.ms-sel-item > span:first-child {
|
||||||
|
max-width: 100%;
|
||||||
|
display: inline-block;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
.et2_taglist_toggle.et2_taglist_small.et2_taglist_single::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.et2_taglist_single div.ms-sel-ctn .ms-close-btn {
|
||||||
|
position: relative;
|
||||||
|
top: 0px;
|
||||||
|
right: 5px;
|
||||||
|
float: none;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
/* Taglist that is limited in size - does not grow */
|
/* Taglist that is limited in size - does not grow */
|
||||||
.et2_taglist.et2_taglist_small .ms-ctn,
|
.et2_taglist.et2_taglist_small .ms-ctn,
|
||||||
@ -1081,18 +1105,20 @@ div .et2_taglist_single div.ms-sel-ctn div.ms-sel-item {
|
|||||||
min-width: 25%;
|
min-width: 25%;
|
||||||
background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 25%);
|
background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 25%);
|
||||||
}
|
}
|
||||||
|
div .et2_taglist_small.et2_taglist_single div.ms-sel-ctn div.ms-sel-item {
|
||||||
|
max-width: calc(100% - 43px);
|
||||||
|
}
|
||||||
.et2_taglist_toggle.et2_taglist_small::before {
|
.et2_taglist_toggle.et2_taglist_small::before {
|
||||||
right: 25px;
|
right: 25px;
|
||||||
}
|
}
|
||||||
.et2_taglist_small.ui-state-hover,
|
.et2_taglist_small.ui-state-hover,
|
||||||
.et2_taglist_small.ui-state-active {
|
.et2_taglist_small.ui-state-active {
|
||||||
position: absolute;
|
|
||||||
max-height: none;
|
max-height: none;
|
||||||
max-width: 25em;
|
max-width: 25em;
|
||||||
min-width: 15em;
|
min-width: 15em;
|
||||||
background: white;
|
background: white;
|
||||||
z-index: 5;
|
z-index: 5;
|
||||||
margin-top: -14px;
|
margin-top: 0px;
|
||||||
transition-duration: 0s;
|
transition-duration: 0s;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
@ -1105,9 +1131,6 @@ div .et2_taglist_single div.ms-sel-ctn div.ms-sel-item {
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
.et2_taglist_toggle.et2_taglist_small.et2_taglist_single::before {
|
|
||||||
right: 51px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Taglist category */
|
/* Taglist category */
|
||||||
.et2_taglist_category span[class*="cat_"] {
|
.et2_taglist_category span[class*="cat_"] {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user