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

Merge BjarneF fix into 10.3 (#13220)

Browse Source 
Co-authored-by: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
This commit is contained in:
Niels Lyngsø
2022-10-17 12:47:18 +02:00
committed by GitHub
parent ed66fe1277
commit e22c7ea0d6
6 changed files with 55 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/Umbraco.Web.UI.Client/src/views/components/blockcard/umb-block-card.less
View File

@@ -130,13 +130,18 @@ umb-block-card {
right: 10px;
opacity: 0;
transition: opacity 120ms;
margin-right: 10px;
.__action {
display: inline-block;
display: inline-flex;
justify-content: center;
align-items: center;
border-radius: 50%;
width: 28px;
height: 28px;
background-color: white;
color:@ui-action-type;
&:hover {
color: @ui-action-type-hover;
}

8
src/Umbraco.Web.UI.Client/src/views/components/umb-property-info-button/umb-property-info-button.less
View File

@@ -3,16 +3,20 @@ umb-property-info-button {
display: inline-block;
vertical-align: text-bottom;
.control-label + & {
margin-left: 3px;
}
> .__button {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
text-align: center;
width: 15px;
height: 15px;
padding-top: 1px;
padding-left: 1px;
padding: 2px 1px 1px 1px;
margin-top: -1px;
font-size: 12px;
font-weight: 700;

20
src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockgrid/umbblockgridentry.component.js
View File

@@ -311,7 +311,8 @@
vm.scaleHandlerKeyUp = function($event) {
let addCol = 0;
let addColIndex = 0;
let addRow = 0;
switch ($event.originalEvent.key) {
@@ -322,16 +323,23 @@
addRow = 1;
break;
case 'ArrowLeft':
addCol = -1;
addColIndex = -1;
break;
case 'ArrowRight':
addCol = 1;
addColIndex = 1;
break;
}
const newColumnSpan = Math.max(vm.layoutEntry.columnSpan + addCol, 1);
vm.layoutEntry.columnSpan = closestColumnSpanOption(newColumnSpan, vm.layoutEntry.$block.config.columnSpanOptions, gridColumns.length).columnSpan;
if(addColIndex !== 0) {
if (vm.layoutEntry.$block.config.columnSpanOptions.length > 0) {
const sortOptions = vm.layoutEntry.$block.config.columnSpanOptions.sort((a,b) => (a.columnSpan > b.columnSpan) ? 1 : ((b.columnSpan > a.columnSpan) ? -1 : 0));
const currentColIndex = sortOptions.findIndex(x => x.columnSpan === vm.layoutEntry.columnSpan);
const newColIndex = Math.min(Math.max(currentColIndex + addColIndex, 0), sortOptions.length-1);
vm.layoutEntry.columnSpan = sortOptions[newColIndex].columnSpan;
} else {
vm.layoutEntry.columnSpan = vm.layoutColumnsInt;
}
}
let newRowSpan = Math.max(vm.layoutEntry.rowSpan + addRow, vm.layoutEntry.$block.config.rowMinSpan || 1);
if(vm.layoutEntry.$block.config.rowMaxSpan != null) {
newRowSpan = Math.min(newRowSpan, vm.layoutEntry.$block.config.rowMaxSpan);

2
src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/prevalue/blocklist.blockconfiguration.controller.js
View File

@@ -72,7 +72,7 @@
});
event.stopPropagation();
}
};
vm.removeBlockByIndex = function (index) {
$scope.model.value.splice(index, 1);

6
src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/prevalue/blocklist.blockconfiguration.html
View File

@@ -8,8 +8,10 @@
ng-repeat="block in model.value"
ng-class="{'--isOpen':vm.openBlock === block}"
ng-click="vm.openBlockOverlay(block)">
<div class="__actions">
<button type="button" class="btn-reset __action umb-outline" ng-click="vm.requestRemoveBlockByIndex($index, $event)">
<div class="__actions" ng-click="$event.stopPropagation()" tabindex="-1">
<button type="button"
class="btn-reset __action umb-outline"
ng-click="vm.requestRemoveBlockByIndex($index, $event)">
<umb-icon icon="icon-trash" class="icon"></umb-icon>
<localize key="general_delete" class="sr-only">Delete</localize>
</button>

42
src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/prevalue/blocklist.blockconfiguration.overlay.html
View File

@@ -26,9 +26,9 @@
<!-- label -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label" for="label"><localize key="blockEditor_labelLabelTemplate">label</localize></label>
<label class="control-label" for="blockLabel"><localize key="blockEditor_labelLabelTemplate">label</localize></label>
<div class="controls">
<input type="text" name="label" ng-model="vm.block.label" style="width:100%" umb-auto-focus/>
<input type="text" name="label" id="blockLabel" ng-model="vm.block.label" style="width:100%" umb-auto-focus/>
</div>
</div>
</div>
@@ -36,7 +36,7 @@
<!-- custom view -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label" for="iconcolor"><localize key="blockEditor_labelCustomView">Custom view</localize></label>
<label class="control-label" for="blockCustomView"><localize key="blockEditor_labelCustomView">Custom view</localize></label>
<umb-property-info-button button-title-key="blockEditor_labelCustomViewInfoTitle">
<localize key="blockEditor_labelCustomViewDescription">Overwrite how this block appears in the BackOffice UI. Pick a .html file containing your presentation.</localize>
</umb-property-info-button>
@@ -50,7 +50,7 @@
</button>
</div>
</div>
<button type="button" class="btn-reset __settings-input --noValue umb-outline" ng-if="vm.block.view === null" ng-click="vm.addViewForBlock(vm.block)">
<button type="button" id="blockCustomView" class="btn-reset __settings-input --noValue umb-outline" ng-if="vm.block.view === null" ng-click="vm.addViewForBlock(vm.block)">
<localize key="blockEditor_addCustomView">Add custom view</localize>
</button>
</div>
@@ -60,7 +60,7 @@
<!-- custom stylesheet -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label" for="iconcolor"><localize key="blockEditor_labelCustomStylesheet">Custom stylesheet</localize></label>
<label class="control-label" for="blockStyleSheet"><localize key="blockEditor_labelCustomStylesheet">Custom stylesheet</localize></label>
<div class="controls">
<div class="__settings-input --hasValue" ng-if="vm.block.stylesheet !== null" >
@@ -71,7 +71,7 @@
</button>
</div>
</div>
<button type="button" class="btn-reset __settings-input --noValue umb-outline" ng-if="vm.block.stylesheet === null" ng-click="vm.addStylesheetForBlock(vm.block)">
<button type="button" id="blockStyleSheet" class="btn-reset __settings-input --noValue umb-outline" ng-if="vm.block.stylesheet === null" ng-click="vm.addStylesheetForBlock(vm.block)">
<localize key="blockEditor_addCustomStylesheet">Add custom stylesheet</localize>
</button>
</div>
@@ -81,9 +81,9 @@
<!-- editor overlay size -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label" for="editorSize"><localize key="blockEditor_labelEditorSize">Editor size</localize></label>
<label class="control-label" for="blockEditorSize"><localize key="blockEditor_labelEditorSize">Editor size</localize></label>
<div class="controls">
<select id="editorSize" ng-model="vm.block.editorSize">
<select id="blockEditorSize" ng-model="vm.block.editorSize">
<option value="small">Small</option>
<option value="medium">Medium</option>
<option value="large">Large</option>
@@ -107,12 +107,12 @@
<!-- Content Element Type -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label"><localize key="blockEditor_labelContentElementType">Content ElementType</localize></label>
<label class="control-label" for="blockContentElemenType"><localize key="blockEditor_labelContentElementType">Content ElementType</localize></label>
<div class="controls">
<div class="__settings-input --hasValue" ng-if="vm.block.contentElementTypeKey !== null" >
<umb-node-preview icon="vm.contentPreview.icon" name="vm.contentPreview.name" alias="vm.contentPreview.alias"></umb-node-preview>
<div class="__control-actions">
<button type="button" class="btn-reset __control-actions-btn --open umb-outline" ng-click="vm.openElementType(vm.block.contentElementTypeKey)">
<button type="button" id="blockContentElemenType" class="btn-reset __control-actions-btn --open umb-outline" ng-click="vm.openElementType(vm.block.contentElementTypeKey)">
<umb-icon icon="icon-edit" class="icon"></umb-icon>
</button>
</div>
@@ -124,7 +124,7 @@
<!-- Settings Element Type -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label"><localize key="blockEditor_labelSettingsElementType">Settings Element Type</localize></label>
<label class="control-label" for="blockSettingsElemenType"><localize key="blockEditor_labelSettingsElementType">Settings Element Type</localize></label>
<div class="controls">
<div class="__settings-input --hasValue" ng-if="vm.block.settingsElementTypeKey !== null">
<umb-node-preview icon="vm.settingsPreview.icon" name="vm.settingsPreview.name" alias="vm.settingsPreview.alias"></umb-node-preview>
@@ -137,7 +137,7 @@
</button>
</div>
</div>
<button type="button" class="btn-reset __settings-input --noValue umb-outline" ng-if="vm.block.settingsElementTypeKey === null" ng-click="vm.addSettingsForBlock($event, vm.block)">
<button type="button" id="blockSettingsElemenType" class="btn-reset __settings-input --noValue umb-outline" ng-if="vm.block.settingsElementTypeKey === null" ng-click="vm.addSettingsForBlock($event, vm.block)">
<localize key="blockEditor_addSettingsElementType">Add settings</localize>
</button>
</div>
@@ -157,9 +157,10 @@
<!-- backgroundColor -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label" for="backgroundColor"><localize key="blockEditor_labelBackgroundColor">Background Color</localize></label>
<label class="control-label" for="blockBackgroundColor"><localize key="blockEditor_labelBackgroundColor">Background Color</localize></label>
<div class="controls">
<umb-color-picker
id="blockBackgroundColor"
ng-model="vm.block.backgroundColor"
options="vm.colorPickerOptions"
on-change="vm.changeBackgroundColor(color)">
@@ -171,9 +172,10 @@
<!-- iconColor -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label" for="iconColor"><localize key="blockEditor_labelIconColor">Icon Color</localize></label>
<label class="control-label" for="blockIconColor"><localize key="blockEditor_labelIconColor">Icon Color</localize></label>
<div class="controls">
<umb-color-picker
id="blockIconColor"
ng-model="vm.block.iconColor"
options="vm.colorPickerOptions"
on-change="vm.changeIconColor(color)">
@@ -185,7 +187,7 @@
<!-- thumbnail -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label" for="iconcolor"><localize key="blockEditor_thumbnail">Thumbnail</localize></label>
<label class="control-label" for="blockThumbnail"><localize key="blockEditor_thumbnail">Thumbnail</localize></label>
<div class="controls">
<div class="__settings-input --hasValue" ng-if="vm.block.thumbnail !== null" >
@@ -196,7 +198,7 @@
</button>
</div>
</div>
<button type="button" class="btn-reset __settings-input --noValue umb-outline" ng-if="vm.block.thumbnail === null" ng-click="vm.addThumbnailForBlock(vm.block)">
<button type="button" id="blockThumbnail" class="btn-reset __settings-input --noValue umb-outline" ng-if="vm.block.thumbnail === null" ng-click="vm.addThumbnailForBlock(vm.block)">
<localize key="blockEditor_addThumbnail">Add thumbnail</localize>
</button>
</div>
@@ -218,9 +220,13 @@
<!-- forceHideContentEditorInOverlay -->
<div class="control-group umb-control-group -no-border">
<div class="umb-el-wrap">
<label class="control-label" for="forceHideContentEditorInOverlay"><localize key="blockEditor_forceHideContentEditor">Force hide content editor</localize></label>
<label class="control-label" for="blockforceHideContentEditorInOverlay"><localize key="blockEditor_forceHideContentEditor">Force hide content editor</localize></label>
<div class="controls">
<umb-toggle checked="vm.block.forceHideContentEditorInOverlay" on-click="vm.block.forceHideContentEditorInOverlay = vm.block.forceHideContentEditorInOverlay != true"></umb-toggle>
<umb-toggle
input-id="blockforceHideContentEditorInOverlay"
checked="vm.block.forceHideContentEditorInOverlay"
on-click="vm.block.forceHideContentEditorInOverlay = vm.block.forceHideContentEditorInOverlay != true">
</umb-toggle>
</div>
</div>
</div>