use a common variable on the block model for isOpen, to be able to make Actions show when open.
This commit is contained in:
+3
-7
@@ -1,16 +1,12 @@
|
||||
(function () {
|
||||
'use strict';
|
||||
|
||||
function InlineBlockEditor($scope) {
|
||||
function InlineBlockEditor() {
|
||||
|
||||
const bc = this;
|
||||
|
||||
bc.isOpen = false;
|
||||
bc.caretIconType = "icon-navigation-right";
|
||||
|
||||
bc.openBlock = function() {
|
||||
bc.isOpen = !bc.isOpen;
|
||||
bc.caretIconType = bc.isOpen ? "icon-navigation-down" : "icon-navigation-right";
|
||||
bc.openBlock = function(block) {
|
||||
block.isOpen = !block.isOpen;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
+2
-2
@@ -1,10 +1,10 @@
|
||||
<div class="blockelement-inlineblock-editor" ng-class="{'--open': bc.isOpen}" ng-controller="Umbraco.PropertyEditors.BlockEditor.InlineBlockEditor as bc">
|
||||
<div class="blockelement-inlineblock-editor" ng-controller="Umbraco.PropertyEditors.BlockEditor.InlineBlockEditor as bc">
|
||||
<button type="button" class="btn-reset umb-outline blockelement__draggable-element" ng-click="bc.openBlock(block)" focus-when="{{vm.moveFocusToBlock === block}}">
|
||||
<span class="caret"></span>
|
||||
<i class="icon {{block.content.icon}}"></i>
|
||||
<span>{{block.label}}</span>
|
||||
</button>
|
||||
<div class="blockelement-inlineblock-editor__inner" ng-if="bc.isOpen === true">
|
||||
<div class="blockelement-inlineblock-editor__inner" ng-if="block.isOpen === true">
|
||||
<umb-element-editor-content model="block.content"></umb-element-editor-content>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
+3
-3
@@ -6,7 +6,7 @@
|
||||
border-radius: @baseBorderRadius;
|
||||
transition: border-color 120ms;
|
||||
|
||||
&:not(.--open):hover {
|
||||
.umb-block-list__block:not(.--open) &:hover {
|
||||
border-color: @gray-8;
|
||||
}
|
||||
|
||||
@@ -43,7 +43,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&.--open {
|
||||
.umb-block-list__block.--open & {
|
||||
border-color: @gray-8;
|
||||
box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.05);
|
||||
> button {
|
||||
@@ -55,7 +55,7 @@
|
||||
}
|
||||
.blockelement-inlineblock-editor__inner {
|
||||
border-top: 1px solid @gray-8;
|
||||
background-color: @gray-11;
|
||||
background-color: @gray-12;
|
||||
|
||||
.umb-group-panel {
|
||||
background-color: transparent;
|
||||
|
||||
+1
-1
@@ -14,7 +14,7 @@
|
||||
>
|
||||
</button>
|
||||
|
||||
<div class="umb-block-list__block">
|
||||
<div class="umb-block-list__block" ng-class="{'--open':block.isOpen}">
|
||||
<div class="umb-block-list__block--content" ng-if="block.view" ng-include="block.view">
|
||||
</div>
|
||||
|
||||
|
||||
+4
-1
@@ -21,7 +21,10 @@
|
||||
transition: opacity 120ms;
|
||||
}
|
||||
|
||||
&:hover, &:focus, &:focus-within {
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:focus-within,
|
||||
&.--open {
|
||||
|
||||
> .umb-block-list__block--actions {
|
||||
opacity: 1;
|
||||
|
||||
Reference in New Issue
Block a user