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

Inherit text color from parent element (#10894)

Browse Source 
* Inherit text color from parent element

* Update block card icon and avoid use of !important

* Wrap card in div

* interpolate background image path value, to remove string escaping which can be confusing

Co-authored-by: Nathan Woulfe <nathan@nathanw.com.au>
This commit is contained in:
Bjarne Fyrstenborg
2021-08-19 01:11:31 +02:00
committed by GitHub
parent dc359cc819
commit e2af016a7b
2 changed files with 16 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,10 +1,10 @@
<div>
<div class="__showcase"
ng-class="{'--error':vm.elementTypeModel === null}"
ng-style="{'background-color': vm.blockConfigModel ? vm.blockConfigModel.backgroundColor : '', 'background-image': vm.styleBackgroundImage}">
ng-class="{'--error':vm.elementTypeModel === null}"
ng-style="{'background-color': vm.blockConfigModel ? vm.blockConfigModel.backgroundColor : '', 'background-image': vm.styleBackgroundImage}">
<div class="__icon">
<umb-icon icon="{{vm.elementTypeModel ? vm.elementTypeModel.icon : 'icon-block'}}"
ng-attr-style="{{'color:' + vm.blockConfigModel.iconColor + ' !important'}}"
<umb-icon icon="{{vm.icon}}"
ng-attr-style="{{'color:' + vm.blockConfigModel.iconColor}}"
ng-if="vm.blockConfigModel == null || vm.blockConfigModel.thumbnail == null">
</umb-icon>
</div>
@@ -19,4 +19,4 @@
</div>
<ng-transclude></ng-transclude>
</div>

17
src/Umbraco.Web.UI.Client/src/views/components/blockcard/umbBlockCard.component.js
View File

@@ -16,23 +16,26 @@
function BlockCardController($scope, umbRequestHelper) {
var vm = this;
const vm = this;
vm.styleBackgroundImage = "none";
var unwatch = $scope.$watch("vm.blockConfigModel.thumbnail", (newValue, oldValue) => {
if(newValue !== oldValue) {
if (newValue !== oldValue) {
vm.updateThumbnail();
}
});
vm.$onInit = function () {
vm.updateThumbnail();
};
vm.$onChanges = function () {
vm.icon = vm.elementTypeModel ? vm.elementTypeModel.icon.split(" ")[0] : 'icon-block';
};
}
vm.$onDestroy = function () {
unwatch();
}
};
vm.updateThumbnail = function () {
if (vm.blockConfigModel == null || vm.blockConfigModel.thumbnail == null || vm.blockConfigModel.thumbnail === "") {
@@ -44,8 +47,8 @@
if (path.toLowerCase().endsWith(".svg") === false) {
path += "?upscale=false&width=400";
}
vm.styleBackgroundImage = 'url(\''+path+'\')';
}
vm.styleBackgroundImage = `url('${path}')`;
};
}