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

Nested content UI fixes (#9384)

Browse Source 
* Fixing spacing of nested content header + icon

* Removing border from single Nested Content properties

* fix overlapping icon on nested content with multiple items

Co-authored-by: Sebastiaan Janssen <sebastiaan@umbraco.com>
Co-authored-by: Mads Rasmussen <madsr@hey.com>
This commit is contained in:
Callum Whyte
2021-01-13 14:11:50 +00:00
committed by GitHub
parent 16cd19ed9a
commit 0fdd599596
1 changed files with 17 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -4,6 +4,7 @@
.umb-nested-content-property-container {
position: relative;
&:not(:last-child){
margin-bottom: 12px;
}
@@ -54,19 +55,19 @@
visibility: visible !important;
}
.umb-nested-content__item--single > .umb-nested-content__content {
.umb-nested-content__item--single {
border: 0;
}
.umb-nested-content__item--single > .umb-nested-content__content > .umb-pane {
margin: 0;
> .umb-nested-content__content {
> .umb-pane {
margin: 0;
}
}
}
.umb-nested-content__header-bar {
cursor: pointer;
background-color: @white;
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
@@ -78,21 +79,19 @@
padding-right: 60px;
}
}
}
.umb-nested-content__heading {
display: flex;
padding: 15px;
line-height: 20px;
position: relative;
padding: 15px 5px;
color:@ui-option-type;
color: @ui-option-type;
&:hover {
color:@ui-option-type-hover;
color: @ui-option-type-hover;
}
.umb-nested-content__item-icon {
position: absolute;
margin-top: -3px;
font-size: 22px;
}
@@ -106,10 +105,9 @@
padding-left: 5px;
&.--has-icon {
padding-left: 30px;
padding-left: 10px;
}
}
}
.umb-nested-content__icons {
@@ -125,13 +123,16 @@
.umb-nested-content__item--active > .umb-nested-content__header-bar {
.umb-nested-content__heading {
background-color: @ui-active;
&:hover {
color:@ui-option-type;
color: @ui-option-type;
}
.umb-nested-content__item-name {
padding-right: 60px;
}
}
.umb-nested-content__icons {
background-color: @ui-active;
&:before {
@@ -140,8 +141,6 @@
}
}
.umb-nested-content__header-bar:hover .umb-nested-content__icons,
.umb-nested-content__header-bar:focus .umb-nested-content__icons,
.umb-nested-content__header-bar:focus-within .umb-nested-content__icons,
@@ -149,8 +148,6 @@
opacity: 1;
}
.umb-nested-content__icon {
background: transparent;
border: 0 none;
@@ -180,9 +177,6 @@
}
}
.umb-nested-content__footer-bar {
margin-top: 20px;
}
@@ -212,7 +206,6 @@
cursor: not-allowed;
}
.umb-nested-content__content {
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
@@ -299,4 +292,4 @@
.umb-textarea, .umb-textstring {
width:100%;
}
}
}