yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

V8: Fix the Nested Content title overflow (#5594)

Browse Source
This commit is contained in:
Kenn Jacobsen
2019-06-23 13:09:12 +02:00
committed by Sebastiaan Janssen
parent ac6625a80c
commit 85565f2c5f
2 changed files with 23 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less
View File

@@ -56,13 +56,20 @@
-webkit-user-select: none;
-o-user-select: none;
user-select: none;
&:hover {
.umb-nested-content__heading .umb-nested-content__item-name {
padding-right: 60px;
}
}
}
.umb-nested-content__heading {
line-height: 20px;
position: relative;
margin-top:1px;
padding: 15px 20px;
padding: 15px 5px;
color:@ui-option-type;
border-radius: 3px 3px 0 0;
@@ -71,16 +78,21 @@
}
i {
display: inline;
margin-right: 10px;
position: absolute;
margin-top: -1px;
}
.umb-nested-content__item-name {
display: inline;
display: block;
max-height: 20px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding-left: 5px;
&.--has-icon {
padding-left: 30px;
}
}
}
@@ -89,9 +101,10 @@
opacity: 0;
transition: opacity 120ms ease-in-out;
position: absolute;
right: 8px;
top: 4px;
right: 0;
top: 3px;
padding: 5px;
background-color: @white;
}
.umb-nested-content__item--active > .umb-nested-content__header-bar {
@@ -100,6 +113,9 @@
&:hover {
color:@ui-option-type;
}
.umb-nested-content__item-name {
padding-right: 60px;
}
}
.umb-nested-content__icons {
background-color: @ui-active;

2
src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.html
View File

@@ -12,7 +12,7 @@
<div class="umb-nested-content__header-bar" ng-click="$parent.editNode($index)" ng-hide="$parent.singleMode">
<div class="umb-nested-content__heading"><i ng-if="showIcons" class="icon" ng-class="$parent.getIcon($index)"></i><span class="umb-nested-content__item-name" ng-bind="$parent.getName($index)"></span></div>
<div class="umb-nested-content__heading"><i ng-if="showIcons" class="icon" ng-class="$parent.getIcon($index)"></i><span class="umb-nested-content__item-name" ng-class="{'--has-icon': showIcons}" ng-bind="$parent.getName($index)"></span></div>
<div class="umb-nested-content__icons">
<a class="umb-nested-content__icon umb-nested-content__icon--copy" title="{{copyIconTitle}}" ng-click="clickCopy($event, node);" ng-if="showCopy" prevent-default>