From e42af34b5f23802646a4bacf28aa05099e38b616 Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Tue, 14 Sep 2021 07:43:21 +0200 Subject: [PATCH 1/6] Introduce overlaysize prevalue editor (#11010) * Introduce overlaysize prevalue editor instead of redundant prevalue editor for each property editor * Move ordering of properties * Change overlaySizeWidth to overlaySize * Make it clear overlay is only for link picker * Fix overlay size not working for link picker in rich text editor --- .../src/common/services/tinymce.service.js | 11 ++++---- .../overlaysize.controller.js} | 2 +- .../overlaysize.html} | 4 +-- .../markdowneditor.controller.js | 10 ++++--- .../multiurlpicker.controller.js | 26 +++++++++++-------- .../multiurlpicker.prevalues.controller.js | 6 ----- .../multiurlpicker.prevalues.html | 9 ------- .../rte/rte.prevalues.controller.js | 4 --- .../propertyeditors/rte/rte.prevalues.html | 10 ------- .../PropertyEditors/MarkdownConfiguration.cs | 4 +-- .../MultiUrlPickerConfiguration.cs | 4 +-- .../PropertyEditors/RichTextConfiguration.cs | 3 +++ 12 files changed, 37 insertions(+), 56 deletions(-) rename src/Umbraco.Web.UI.Client/src/views/{propertyeditors/markdowneditor/markdowneditor.prevalues.controller.js => prevalueeditors/overlaysize.controller.js} (57%) rename src/Umbraco.Web.UI.Client/src/views/{propertyeditors/markdowneditor/markdowneditor.prevalues.html => prevalueeditors/overlaysize.html} (66%) delete mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.controller.js delete mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.html diff --git a/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js b/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js index b433ab5d13..46c047448f 100644 --- a/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js +++ b/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js @@ -1536,22 +1536,23 @@ function tinyMceService($rootScope, $q, imageHelper, $locale, $http, $timeout, s //create link picker self.createLinkPicker(args.editor, function (currentTarget, anchorElement) { + entityResource.getAnchors(args.model.value).then(anchorValues => { - entityResource.getAnchors(args.model.value).then(function (anchorValues) { - var linkPicker = { + const linkPicker = { currentTarget: currentTarget, dataTypeKey: args.model.dataTypeKey, ignoreUserStartNodes: args.model.config.ignoreUserStartNodes, anchors: anchorValues, - size: args.model.config.editor.overlayWidthSize, - submit: function (model) { + size: args.model.config.overlaySize, + submit: model => { self.insertLinkInEditor(args.editor, model.target, anchorElement); editorService.close(); }, - close: function () { + close: () => { editorService.close(); } }; + editorService.linkPicker(linkPicker); }); diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.prevalues.controller.js b/src/Umbraco.Web.UI.Client/src/views/prevalueeditors/overlaysize.controller.js similarity index 57% rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.prevalues.controller.js rename to src/Umbraco.Web.UI.Client/src/views/prevalueeditors/overlaysize.controller.js index 29a3b876ea..f3a2f7dd8b 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.prevalues.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/prevalueeditors/overlaysize.controller.js @@ -1,4 +1,4 @@ -angular.module("umbraco").controller("Umbraco.PrevalueEditors.MarkdownEditorController", +angular.module("umbraco").controller("Umbraco.PrevalueEditors.OverlaySizeController", function ($scope) { if (!$scope.model.value) { $scope.model.value = "small"; diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.prevalues.html b/src/Umbraco.Web.UI.Client/src/views/prevalueeditors/overlaysize.html similarity index 66% rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.prevalues.html rename to src/Umbraco.Web.UI.Client/src/views/prevalueeditors/overlaysize.html index 8564a9f490..413ef3b1d2 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.prevalues.html +++ b/src/Umbraco.Web.UI.Client/src/views/prevalueeditors/overlaysize.html @@ -1,4 +1,4 @@ -
+
-
\ No newline at end of file +
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.controller.js index d398c943c4..1c76ba64f4 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/markdowneditor/markdowneditor.controller.js @@ -28,17 +28,19 @@ function MarkdownEditorController($scope, $element, assetsService, editorService } function openLinkPicker(callback) { - var linkPicker = { + + const linkPicker = { hideTarget: true, - size: $scope.model.config.overlayWidthSize, - submit: function(model) { + size: $scope.model.config.overlaySize, + submit: model => { callback(model.target.url, model.target.name); editorService.close(); }, - close: function() { + close: () => { editorService.close(); } }; + editorService.linkPicker(linkPicker); } diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.controller.js index fc8fa8b809..962fd46549 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.controller.js @@ -29,12 +29,12 @@ function multiUrlPickerController($scope, localizationService, entityResource, i } }; - $scope.model.value.forEach(function (link) { + $scope.model.value.forEach(link => { link.icon = iconHelper.convertFromLegacyIcon(link.icon); $scope.renderModel.push(link); }); - $scope.$on("formSubmitting", function () { + $scope.$on("formSubmitting", () => { $scope.model.value = $scope.renderModel; }); @@ -78,13 +78,13 @@ function multiUrlPickerController($scope, localizationService, entityResource, i target: link.target } : null; - var linkPicker = { + const linkPicker = { currentTarget: target, dataTypeKey: $scope.model.dataTypeKey, ignoreUserStartNodes : ($scope.model.config && $scope.model.config.ignoreUserStartNodes) ? $scope.model.config.ignoreUserStartNodes : "0", hideAnchor: $scope.model.config && $scope.model.config.hideAnchor ? true : false, - size: $scope.model.config.overlayWidthSize, - submit: function (model) { + size: $scope.model.config.overlaySize, + submit: model => { if (model.target.url || model.target.anchor) { // if an anchor exists, check that it is appropriately prefixed if (model.target.anchor && model.target.anchor[0] !== '?' && model.target.anchor[0] !== '#') { @@ -108,12 +108,14 @@ function multiUrlPickerController($scope, localizationService, entityResource, i } if (link.udi) { - var entityType = model.target.isMedia ? "Media" : "Document"; + const entityType = model.target.isMedia ? "Media" : "Document"; + + entityResource.getById(link.udi, entityType).then(data => { - entityResource.getById(link.udi, entityType).then(function (data) { link.icon = iconHelper.convertFromLegacyIcon(data.icon); link.published = (data.metaData && data.metaData.IsPublished === false && entityType === "Document") ? false : true; link.trashed = data.trashed; + if (link.trashed) { item.url = vm.labels.general_recycleBin; } @@ -127,10 +129,11 @@ function multiUrlPickerController($scope, localizationService, entityResource, i } editorService.close(); }, - close: function () { + close: () => { editorService.close(); } }; + editorService.linkPicker(linkPicker); }; @@ -141,8 +144,9 @@ function multiUrlPickerController($scope, localizationService, entityResource, i } function init() { + localizationService.localizeMany(["general_recycleBin"]) - .then(function (data) { + .then(data => { vm.labels.general_recycleBin = data[0]; }); @@ -152,11 +156,11 @@ function multiUrlPickerController($scope, localizationService, entityResource, i $scope.model.config.minNumber = 1; } - _.each($scope.model.value, function (item){ + _.each($scope.model.value, function (item) { // we must reload the "document" link URLs to match the current editor culture if (item.udi && item.udi.indexOf("/document/") > 0) { item.url = null; - entityResource.getUrlByUdi(item.udi).then(function (data) { + entityResource.getUrlByUdi(item.udi).then(data => { item.url = data; }); } diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.controller.js deleted file mode 100644 index 3a1e6368e9..0000000000 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.controller.js +++ /dev/null @@ -1,6 +0,0 @@ -angular.module("umbraco").controller("Umbraco.PrevalueEditors.MultiUrlPickerController", - function ($scope) { - if (!$scope.model.value) { - $scope.model.value = "small"; - } - }); diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.html deleted file mode 100644 index 7abb3c3c01..0000000000 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.html +++ /dev/null @@ -1,9 +0,0 @@ -
-
- -
-
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.prevalues.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.prevalues.controller.js index 24eaba9886..47d1f401c7 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.prevalues.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.prevalues.controller.js @@ -23,10 +23,6 @@ angular.module("umbraco").controller("Umbraco.PrevalueEditors.RteController", $scope.model.value.mode = "classic"; } - if(!$scope.model.value.overlayWidthSize) { - $scope.model.value.overlayWidthSize = "small"; - } - tinyMceService.configuration().then(function(config){ $scope.tinyMceConfig = config; diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.prevalues.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.prevalues.html index 68fb2dbf5f..96de0cd040 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.prevalues.html +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.prevalues.html @@ -46,14 +46,4 @@ - -
- -
- - diff --git a/src/Umbraco.Web/PropertyEditors/MarkdownConfiguration.cs b/src/Umbraco.Web/PropertyEditors/MarkdownConfiguration.cs index 0a65246c7c..94a5a509e7 100644 --- a/src/Umbraco.Web/PropertyEditors/MarkdownConfiguration.cs +++ b/src/Umbraco.Web/PropertyEditors/MarkdownConfiguration.cs @@ -14,7 +14,7 @@ namespace Umbraco.Web.PropertyEditors public string DefaultValue { get; set; } - [ConfigurationField("overlayWidthSize", "Overlay Width Size", "views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.html")] - public string OverlayWidthSize { get; set; } + [ConfigurationField("overlaySize", "Overlay Size", "overlaysize", Description = "Select the width of the overlay (link picker).")] + public string OverlaySize { get; set; } } } diff --git a/src/Umbraco.Web/PropertyEditors/MultiUrlPickerConfiguration.cs b/src/Umbraco.Web/PropertyEditors/MultiUrlPickerConfiguration.cs index 0c18f05dc1..6b8bcedd73 100644 --- a/src/Umbraco.Web/PropertyEditors/MultiUrlPickerConfiguration.cs +++ b/src/Umbraco.Web/PropertyEditors/MultiUrlPickerConfiguration.cs @@ -11,8 +11,8 @@ namespace Umbraco.Web.PropertyEditors [ConfigurationField("maxNumber", "Maximum number of items", "number")] public int MaxNumber { get; set; } - [ConfigurationField("overlayWidthSize", "Overlay Width Size", "views/propertyeditors/multiurlpicker/multiurlpicker.prevalues.html")] - public string OverlayWidthSize { get; set; } + [ConfigurationField("overlaySize", "Overlay Size", "overlaysize", Description = "Select the width of the overlay.")] + public string OverlaySize { get; set; } [ConfigurationField(Core.Constants.DataTypes.ReservedPreValueKeys.IgnoreUserStartNodes, "Ignore User Start Nodes", "boolean", diff --git a/src/Umbraco.Web/PropertyEditors/RichTextConfiguration.cs b/src/Umbraco.Web/PropertyEditors/RichTextConfiguration.cs index c6d4e3ce70..feecc1dddc 100644 --- a/src/Umbraco.Web/PropertyEditors/RichTextConfiguration.cs +++ b/src/Umbraco.Web/PropertyEditors/RichTextConfiguration.cs @@ -13,6 +13,9 @@ namespace Umbraco.Web.PropertyEditors [ConfigurationField("editor", "Editor", "views/propertyeditors/rte/rte.prevalues.html", HideLabel = true)] public JObject Editor { get; set; } + [ConfigurationField("overlaySize", "Overlay Size", "overlaysize", Description = "Select the width of the overlay (link picker).")] + public string OverlaySize { get; set; } + [ConfigurationField("hideLabel", "Hide Label", "boolean")] public bool HideLabel { get; set; } From 8810b98003eeb8786bc70d1e84c0845d0d5343c5 Mon Sep 17 00:00:00 2001 From: Jeavon Leopold Date: Mon, 13 Sep 2021 15:10:52 +0100 Subject: [PATCH 2/6] Exclude "Server" header from excessive check if the value is "cloudflare" --- .../Checks/Security/ExcessiveHeadersCheck.cs | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/Umbraco.Web/HealthCheck/Checks/Security/ExcessiveHeadersCheck.cs b/src/Umbraco.Web/HealthCheck/Checks/Security/ExcessiveHeadersCheck.cs index 30ccf96691..3ff6e57eb0 100644 --- a/src/Umbraco.Web/HealthCheck/Checks/Security/ExcessiveHeadersCheck.cs +++ b/src/Umbraco.Web/HealthCheck/Checks/Security/ExcessiveHeadersCheck.cs @@ -58,7 +58,15 @@ namespace Umbraco.Web.HealthCheck.Checks.Security { var response = request.GetResponse(); var allHeaders = response.Headers.AllKeys; - var headersToCheckFor = new [] {"Server", "X-Powered-By", "X-AspNet-Version", "X-AspNetMvc-Version"}; + + var headersToCheckFor = new List {"Server", "X-Powered-By", "X-AspNet-Version", "X-AspNetMvc-Version" }; + + // Ignore if server header is present and it's set to cloudflare + if (allHeaders.InvariantContains("Server") && response.Headers["Server"].InvariantEquals("cloudflare")) + { + headersToCheckFor.Remove("Server"); + } + var headersFound = allHeaders .Intersect(headersToCheckFor) .ToArray(); From 5b62516114b464ba2c78e6b35074a2b9bc4a39ac Mon Sep 17 00:00:00 2001 From: Jan Skovgaard <1932158+BatJan@users.noreply.github.com> Date: Tue, 14 Sep 2021 07:54:46 +0200 Subject: [PATCH 3/6] Grid: labels offset fix (#10979) * Add missing focus styling * Ensure labels have the proper pixels offset Co-authored-by: BatJan Co-authored-by: Jan Skovgaard Olsen --- src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less | 1 + 1 file changed, 1 insertion(+) diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less index 033fe8fc0e..b92d1db05a 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less @@ -842,6 +842,7 @@ width: 100%; left: 0; padding-top: 15px; + top: 15px; } .help-text { From aa48cdbbfdc80f8772b9529c8f7698e2f61932f6 Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Tue, 14 Sep 2021 07:58:59 +0200 Subject: [PATCH 4/6] Media picker 3 preview with checkered background (#10939) * Set property editor limit width on parent like other property editors * Use checkered background in media picker 3 preview like the legacy media picker --- .../components/mediacard/umb-media-card.less | 54 +++++++++++-------- .../umb-media-picker3-property-editor.less | 4 +- 2 files changed, 34 insertions(+), 24 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/views/components/mediacard/umb-media-card.less b/src/Umbraco.Web.UI.Client/src/views/components/mediacard/umb-media-card.less index de3840b4d7..3d06c8b16f 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/mediacard/umb-media-card.less +++ b/src/Umbraco.Web.UI.Client/src/views/components/mediacard/umb-media-card.less @@ -1,4 +1,4 @@ -.umb-media-card, +.umb-media-card, umb-media-card { position: relative; display: inline-block; @@ -7,11 +7,8 @@ umb-media-card { border-radius: @baseBorderRadius; //box-shadow: 0 1px 2px rgba(0,0,0,.2); overflow: hidden; - transition: box-shadow 120ms; - cursor: pointer; - .umb-outline(); &:hover { @@ -24,7 +21,7 @@ umb-media-card { position: absolute; border: 2px solid @ui-active-border; border-radius: @baseBorderRadius; - top:0; + top: 0; bottom: 0; left: 0; right: 0; @@ -36,28 +33,34 @@ umb-media-card { } &.--sortable-placeholder { + box-shadow: none; + &::after { content: ""; position: absolute; - background-color:rgba(@ui-drop-area-color, .05); + background-color: rgba(@ui-drop-area-color, .05); border: 2px solid rgba(@ui-drop-area-color, .1); border-radius: @baseBorderRadius; box-shadow: 0 0 4px rgba(@ui-drop-area-color, 0.05); - top:0; + top: 0; bottom: 0; left: 0; right: 0; animation: umb-block-card--sortable-placeholder 400ms ease-in-out alternate infinite; + @keyframes umb-block-card--sortable-placeholder { - 0% { opacity: 1; } - 100% { opacity: 0.5; } + 0% { + opacity: 1; + } + + 100% { + opacity: 0.5; + } } } - box-shadow: none; } .__status { - position: absolute; top: 0; left: 0; @@ -72,22 +75,26 @@ umb-media-card { .__showcase { position: relative; + display: flex; max-width: 100%; min-height: 120px; max-height: 240px; text-align: center; - //padding-bottom: 10/16*100%; - //background-color: @gray-12; + align-items: center; + justify-content: center; + + .checkeredBackground(); img { object-fit: contain; max-height: 240px; } - + umb-file-icon { width: 100%; padding-bottom: 100%; display: block; + .umb-file-icon { position: absolute; top: 0; @@ -100,7 +107,7 @@ umb-media-card { } } } - + .__info { position: absolute; text-align: left; @@ -108,15 +115,17 @@ umb-media-card { width: 100%; background-color: #fff; padding-top: 6px; - padding-bottom: 7px;// 7 + 1 to compentiate for the -1 substraction in margin-bottom. - + padding-bottom: 7px; // 7 + 1 to compentiate for the -1 substraction in margin-bottom. + opacity: 0; transition: opacity 120ms; &.--error { opacity: 1; background-color: @errorBackground; - .__name, .__subname { + + .__name, + .__subname { color: @errorText; } } @@ -127,11 +136,11 @@ umb-media-card { color: @ui-action-type; margin-left: 16px; margin-bottom: -1px; - white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } + .__subname { color: @gray-4; font-size: 12px; @@ -146,6 +155,7 @@ umb-media-card { .__info { opacity: 1; } + .__info:not(.--error) { .__name { color: @ui-action-type-hover; @@ -162,25 +172,25 @@ umb-media-card { border-radius: 16px; padding-left: 5px; padding-right: 5px; - opacity: 0; transition: opacity 120ms; + .__action { position: relative; display: inline-block; padding: 5px; font-size: 18px; - color: @ui-action-discreet-type; + &:hover { color: @ui-action-discreet-type-hover; } } } + &:hover, &:focus, &:focus-within { .__actions { opacity: 1; } } - } diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker3/umb-media-picker3-property-editor.less b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker3/umb-media-picker3-property-editor.less index d02c0b055c..bb62307bd7 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker3/umb-media-picker3-property-editor.less +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker3/umb-media-picker3-property-editor.less @@ -1,10 +1,10 @@ .umb-mediapicker3 { - + .umb-property-editor--limit-width(); + .umb-media-card-grid { padding: 20px; border: 1px solid @inputBorder; box-sizing: border-box; - .umb-property-editor--limit-width(); &.--singleMode { max-width: 202px; From a4e472b4d395831d19754679295ee4be67488dc6 Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Mon, 23 Aug 2021 23:34:48 +0200 Subject: [PATCH 5/6] Stream line and --- .../components/umbprogressbar.directive.js | 4 ++- .../components/umbprogresscircle.directive.js | 6 ++-- .../src/less/components/umb-progress-bar.less | 22 +++++++++++++- .../less/components/umb-progress-circle.less | 30 +++++++++---------- .../views/components/umb-progress-bar.html | 2 +- 5 files changed, 43 insertions(+), 21 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogressbar.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogressbar.directive.js index 59f51fca3f..a71dcc5ffe 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogressbar.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogressbar.directive.js @@ -17,6 +17,7 @@ Use this directive to generate a progress bar. @param {number} percentage (attribute): The progress in percentage. @param {string} size (attribute): The size (s, m). +@param {string} color (attribute): The color of the progress (primary, secondary, success, warning, danger). Success by default. **/ @@ -31,7 +32,8 @@ Use this directive to generate a progress bar. templateUrl: 'views/components/umb-progress-bar.html', scope: { percentage: "@", - size: "@?" + size: "@?", + color: "@?" } }; diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogresscircle.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogresscircle.directive.js index 871ae771d5..f197520eec 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogresscircle.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogresscircle.directive.js @@ -20,8 +20,8 @@ Use this directive to render a circular progressbar. -@param {string} size (attribute): This parameter defines the width and the height of the circle in pixels. @param {string} percentage (attribute): Takes a number between 0 and 100 and applies it to the circle's highlight length. +@param {string} size (attribute): This parameter defines the width and the height of the circle in pixels. @param {string} color (attribute): The color of the highlight (primary, secondary, success, warning, danger). Success by default. **/ @@ -72,9 +72,9 @@ Use this directive to render a circular progressbar. replace: true, templateUrl: 'views/components/umb-progress-circle.html', scope: { - size: "@?", percentage: "@", - color: "@" + size: "@?", + color: "@?" }, link: link diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-bar.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-bar.less index 8c15084d55..c8fb742f5e 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-bar.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-bar.less @@ -17,6 +17,26 @@ bottom: 0; width: 100%; border-radius: 10px; + + &--primary { + background: @blue; + } + + &--secondary { + background: @purple; + } + + &--success { + background: @green; + } + + &--warning { + background: @yellow; + } + + &--danger { + background: @red; + } } .umb-progress-bar--s { @@ -27,4 +47,4 @@ .umb-progress-bar--m { height: 10px; border-radius: 10px; -} \ No newline at end of file +} diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-circle.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-circle.less index d8fb3b4d8f..b1e8ed1ecd 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-circle.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-circle.less @@ -11,26 +11,26 @@ // circle highlight on progressbar .umb-progress-circle__highlight { stroke: @green; -} -.umb-progress-circle__highlight--primary { - stroke: @blue; -} + &--primary { + stroke: @blue; + } -.umb-progress-circle__highlight--secondary { - stroke: @purple; -} + &--secondary { + stroke: @purple; + } -.umb-progress-circle__highlight--success { - stroke: @green; -} + &--success { + stroke: @green; + } -.umb-progress-circle__highlight--warning { - stroke: @yellow; -} + &--warning { + stroke: @yellow; + } -.umb-progress-circle__highlight--danger { - stroke: @red; + &--danger { + stroke: @red; + } } // circle progressbar bg diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-progress-bar.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-progress-bar.html index 719a53e361..46b06455c6 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/umb-progress-bar.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-progress-bar.html @@ -1,3 +1,3 @@ - + From 71733b72d9c5416e0e2bda2d29891cdd69837648 Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Tue, 14 Sep 2021 09:57:16 +0200 Subject: [PATCH 6/6] Remove restricted image size when opening media (#10940) * Remove restricted image size as SVG are vector and we already handle max size in css * Use css class instead of inline style * Add required src and alt attributes to img tag - ng-src will populate value of src attribute * Align folder icon in medie entry editor --- .../mediaentryeditor/mediaentryeditor.html | 2 +- .../mediaentryeditor/mediaentryeditor.less | 9 ++++++--- .../src/views/components/imaging/umb-image-gravity.html | 4 ++-- 3 files changed, 9 insertions(+), 6 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.html index b2899cf6dc..938d719431 100644 --- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.html +++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.html @@ -75,7 +75,7 @@ ng-class="{'trashed': vm.media.trashed}" extension="{{vm.media.extension}}" icon="{{vm.media.icon}}" - size="s" + size="m" text="{{vm.media.name}}"> diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.less b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.less index 1de962f7e1..139d7bef4a 100644 --- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.less +++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.less @@ -84,6 +84,7 @@ width: 4px; } } + &.--is-defined { } @@ -109,14 +110,16 @@ } .umb-media-entry-editor__imageholder { - display: block; + display: flex; + align-items: center; + justify-content: center; position: relative; height: calc(100% - 50px); } + .umb-media-entry-editor__imageholder-actions { - background-color: white; + background-color: @white; height: 50px; display: flex; justify-content: center; } - diff --git a/src/Umbraco.Web.UI.Client/src/views/components/imaging/umb-image-gravity.html b/src/Umbraco.Web.UI.Client/src/views/components/imaging/umb-image-gravity.html index 10aa6a774a..e74c1d8d65 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/imaging/umb-image-gravity.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/imaging/umb-image-gravity.html @@ -3,8 +3,8 @@
- - + +