V8.7RC Block list adjustments (#8763)
This commit is contained in:
Bjarne Fyrstenborg
committed by
GitHub
GitHub
parent
62d2963501
commit
031769fb17
@@ -543,7 +543,6 @@
|
||||
unsupported: true
|
||||
};
|
||||
contentScaffold = {};
|
||||
|
||||
}
|
||||
|
||||
var blockObject = {};
|
||||
@@ -614,8 +613,7 @@
|
||||
if (this.config.settingsElementTypeKey !== null) {
|
||||
mapElementValues(settings, this.settings);
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
blockObject.sync = function () {
|
||||
if (this.content !== null) {
|
||||
@@ -624,7 +622,7 @@
|
||||
if (this.config.settingsElementTypeKey !== null) {
|
||||
mapToPropertyModel(this.settings, this.settingsData);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// first time instant update of label.
|
||||
blockObject.label = getBlockLabel(blockObject);
|
||||
@@ -663,7 +661,6 @@
|
||||
}
|
||||
|
||||
return blockObject;
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
ng-click="vm.openBlock(block)"
|
||||
ng-focus="block.focus">
|
||||
<span class="caret"></span>
|
||||
<i class="icon {{block.content.icon}}"></i>
|
||||
<i class="icon {{block.content.icon}}" aria-hidden="true"></i>
|
||||
<span class="name">{{block.label}}</span>
|
||||
</button>
|
||||
<div class="blockelement-inlineblock-editor__inner" ng-class="{'--singleGroup':block.content.variants[0].tabs.length === 1}" ng-if="block.active === true">
|
||||
|
||||
@@ -3,6 +3,6 @@
|
||||
ng-focus="block.focus"
|
||||
ng-class="{ '--active': block.active, '--error': parentForm.$invalid && valFormManager.isShowingValidation() }"
|
||||
val-server-property-class="">
|
||||
<i class="icon {{block.content.icon}}"></i>
|
||||
<i class="icon {{block.content.icon}}" aria-hidden="true"></i>
|
||||
<span>{{block.label}}</span>
|
||||
</button>
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
<div class="blockelement-unsupportedblock-editor blockelement__draggable-element" ng-focus="block.focus">
|
||||
<div class="__header">
|
||||
<i class="icon icon-alert"></i>
|
||||
<i class="icon icon-alert" aria-hidden="true"></i>
|
||||
<span>{{block.label}}</span>
|
||||
</div>
|
||||
<div class="__body">
|
||||
This Block is no longer supported in this context.<br/>
|
||||
You might want to remove this block, or contact your developer to take actions for making this block available again.<br/><br/>
|
||||
<a href="http://our.umbraco.com" target="_blank">Learn about this circumstance</a>
|
||||
<a href="http://our.umbraco.com" target="_blank" rel="noreferrer">Learn about this circumstance</a>
|
||||
<h5>Block data:</h5>
|
||||
<pre ng-bind="block.data | json : 4"></pre>
|
||||
</div>
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
class="btn-reset umb-block-list__create-button umb-outline"
|
||||
ng-class="{ '--disabled': vm.availableBlockTypes.length === 0 }"
|
||||
ng-click="vm.showCreateDialog(vm.layout.length, $event)">
|
||||
<localize key="grid_addElement"></localize>
|
||||
<localize key="grid_addElement">Add content</localize>
|
||||
</button>
|
||||
|
||||
<input type="hidden" name="minCount" ng-model="vm.layout" val-server="minCount" />
|
||||
|
||||
@@ -157,7 +157,7 @@ ng-form.ng-invalid-val-server-match-settings > .umb-block-list__block > .umb-blo
|
||||
.umb-block-list__block--create-button {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index:1;
|
||||
z-index: 1;
|
||||
opacity: 0;
|
||||
outline: none;
|
||||
height: 12px;
|
||||
@@ -170,28 +170,27 @@ ng-form.ng-invalid-val-server-match-settings > .umb-block-list__block > .umb-blo
|
||||
content: '';
|
||||
position: absolute;
|
||||
background-color: @blueMid;
|
||||
border-top:1px solid white;
|
||||
border-bottom:1px solid white;
|
||||
border-top: 1px solid white;
|
||||
border-bottom: 1px solid white;
|
||||
border-radius: 2px;
|
||||
top:5px;
|
||||
top: 5px;
|
||||
right: 0;
|
||||
left: 0;
|
||||
height: 2px;
|
||||
animation: umb-block-list__block--create-button_before 400ms ease-in-out alternate infinite;
|
||||
|
||||
@keyframes umb-block-list__block--create-button_before {
|
||||
0% { opacity: 1; }
|
||||
100% { opacity: 0.5; }
|
||||
}
|
||||
}
|
||||
|
||||
> .__plus {
|
||||
position: absolute;
|
||||
pointer-events: none;// lets stop avoiding the mouse values in JS move event.
|
||||
margin-left: -18px - 10px;
|
||||
margin-top: -18px;
|
||||
margin-bottom: -18px;
|
||||
width: 28px;
|
||||
height: 25px;
|
||||
padding-bottom: 3px;
|
||||
pointer-events: none; // lets stop avoiding the mouse values in JS move event.
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
padding: 0;
|
||||
border-radius: 3em;
|
||||
border: 2px solid @blueMid;
|
||||
display: flex;
|
||||
@@ -202,25 +201,29 @@ ng-form.ng-invalid-val-server-match-settings > .umb-block-list__block > .umb-blo
|
||||
font-weight: 800;
|
||||
background-color: rgba(255, 255, 255, .96);
|
||||
box-shadow: 0 0 0 2px rgba(255, 255, 255, .96);
|
||||
transform: scale(0);
|
||||
transform: scale(0) translate(-80%, -50%);
|
||||
transition: transform 240ms ease-in;
|
||||
animation: umb-block-list__block--create-button_after 800ms ease-in-out infinite;
|
||||
|
||||
@keyframes umb-block-list__block--create-button_after {
|
||||
0% { color: rgba(@blueMid, 0.8); }
|
||||
50% { color: rgba(@blueMid, 1); }
|
||||
100% { color: rgba(@blueMid, 0.8); }
|
||||
}
|
||||
}
|
||||
|
||||
&:focus {
|
||||
> .__plus {
|
||||
border: 2px solid @ui-outline;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover, &:focus {
|
||||
opacity: 1;
|
||||
transition-duration: 120ms;
|
||||
|
||||
> .__plus {
|
||||
transform: scale(1);
|
||||
transform: scale(1) translate(-80%, -50%);
|
||||
transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -44,23 +44,23 @@
|
||||
|
||||
vm.loading = true;
|
||||
vm.currentBlockInFocus = null;
|
||||
vm.setBlockFocus = function(block) {
|
||||
if(vm.currentBlockInFocus !== null) {
|
||||
vm.setBlockFocus = function (block) {
|
||||
if (vm.currentBlockInFocus !== null) {
|
||||
vm.currentBlockInFocus.focus = false;
|
||||
}
|
||||
vm.currentBlockInFocus = block;
|
||||
block.focus = true;
|
||||
}
|
||||
};
|
||||
|
||||
vm.supportCopy = clipboardService.isSupported();
|
||||
|
||||
vm.layout = []; // The layout object specific to this Block Editor, will be a direct reference from Property Model.
|
||||
vm.availableBlockTypes = []; // Available block entries of this property editor.
|
||||
vm.labels = {};
|
||||
|
||||
var labels = {};
|
||||
vm.labels = labels;
|
||||
localizationService.localizeMany(["grid_addElement", "content_createEmpty"]).then(function (data) {
|
||||
labels.grid_addElement = data[0];
|
||||
labels.content_createEmpty = data[1];
|
||||
vm.labels.grid_addElement = data[0];
|
||||
vm.labels.content_createEmpty = data[1];
|
||||
});
|
||||
|
||||
vm.$onInit = function() {
|
||||
@@ -195,12 +195,14 @@
|
||||
|
||||
function getDefaultViewForBlock(block) {
|
||||
|
||||
var defaultViewFolderPath = "views/propertyeditors/blocklist/blocklistentryeditors/";
|
||||
|
||||
if (block.config.unsupported === true)
|
||||
return "views/propertyeditors/blocklist/blocklistentryeditors/unsupportedblock/unsupportedblock.editor.html";
|
||||
return defaultViewFolderPath + "unsupportedblock/unsupportedblock.editor.html";
|
||||
|
||||
if (inlineEditing === true)
|
||||
return "views/propertyeditors/blocklist/blocklistentryeditors/inlineblock/inlineblock.editor.html";
|
||||
return "views/propertyeditors/blocklist/blocklistentryeditors/labelblock/labelblock.editor.html";
|
||||
return defaultViewFolderPath + "inlineblock/inlineblock.editor.html";
|
||||
return defaultViewFolderPath + "labelblock/labelblock.editor.html";
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user