diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less index 29a73bd524..99008c7e10 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less @@ -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,22 +79,21 @@ 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; } - i { - position: absolute; - margin-top: -1px; + .umb-nested-content__item-icon { + margin-top: -3px; + font-size: 22px; } .umb-nested-content__item-name { @@ -105,10 +105,9 @@ padding-left: 5px; &.--has-icon { - padding-left: 30px; + padding-left: 10px; } } - } .umb-nested-content__icons { @@ -116,7 +115,7 @@ transition: opacity 120ms ease-in-out; position: absolute; right: 0; - top: 3px; + top: 5px; padding: 5px; background-color: @white; } @@ -124,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 { @@ -139,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, @@ -148,8 +148,6 @@ opacity: 1; } - - .umb-nested-content__icon { background: transparent; border: 0 none; @@ -167,7 +165,7 @@ .umb-nested-content__icon .icon { display: block; - font-size: 16px !important; + font-size: 18px !important; } .umb-nested-content__icon--disabled { @@ -179,9 +177,6 @@ } } - - - .umb-nested-content__footer-bar { margin-top: 20px; } @@ -208,10 +203,9 @@ .umb-nested-content__add-content.--disabled:hover { color: @gray-7; border-color: @gray-7; - cursor: default; + cursor: not-allowed; } - .umb-nested-content__content { border-top: 1px solid transparent; border-bottom: 1px solid transparent;