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

wrap variant switcher in correct flex values

Browse Source
This commit is contained in:
Mads Rasmussen
2021-08-09 10:53:22 +02:00
parent 6f73c6041a
commit 99ffbed7a6
2 changed files with 21 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/Umbraco.Web.UI.Client/src/less/components/editor/umb-variant-switcher.less
View File

@@ -108,6 +108,16 @@ button.umb-variant-switcher__toggle {
cursor: default;
}
.umb-variant-switcher__name-wrapper {
display: flex;
align-items: center;
.umb-variant-switcher__name-content {
display: flex;
flex-direction: column;
}
}
.umb-variant-switcher__item.--state-notCreated:not(.--active) {
.umb-variant-switcher__name-wrapper::before {
content: "+";

18
src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-content-header.html
View File

@@ -59,11 +59,13 @@
<i class="icon {{entry.open ? 'icon-navigation-down' : 'icon-navigation-right'}}"></i>
</button>
<button type="button" class="umb-variant-switcher__name-wrapper umb-outline" ng-click="selectVariant($event, entry.variant)">
<span class="umb-variant-switcher__name" ng-bind="entry.variant.displayName"></span>
<span class="umb-variant-switcher__state">
<umb-variant-state variant="entry.variant"></umb-variant-state>
<span ng-if="entry.variant.language.isMandatory"> - <localize key="general_mandatory"></localize></span>
<span ng-if="entry.variant.language.isDefault"> - <localize key="general_default"></localize></span>
<span class="umb-variant-switcher__name-content">
<span class="umb-variant-switcher__name" ng-bind="entry.variant.displayName"></span>
<span class="umb-variant-switcher__state">
<umb-variant-state variant="entry.variant"></umb-variant-state>
<span ng-if="entry.variant.language.isMandatory"> - <localize key="general_mandatory"></localize></span>
<span ng-if="entry.variant.language.isDefault"> - <localize key="general_default"></localize></span>
</span>
</span>
</button>
<div ng-if="splitViewOpen !== true && !entry.variant.active" class="umb-variant-switcher__split-view umb-outline" ng-click="openInSplitView($event, entry.variant)">Open in split view</div>
@@ -79,8 +81,10 @@
ng-class="{'--current': subVariant === editor.content, '--active': subVariant.active && vm.dropdownOpen, '--error': subVariant.active !== true && subVariant.hasError, '--state-notCreated':subVariant.state==='NotCreated', '--state-draft':subVariant.state==='Draft'}"
>
<button type="button" class="umb-variant-switcher__name-wrapper umb-outline" ng-click="selectVariant($event, subVariant)">
<span class="umb-variant-switcher__name" ng-bind="subVariant.segment"></span>
<umb-variant-state variant="subVariant" class="umb-variant-switcher__state"></umb-variant-state>
<span class="umb-variant-switcher__name-content">
<span class="umb-variant-switcher__name" ng-bind="subVariant.segment"></span>
<umb-variant-state variant="subVariant" class="umb-variant-switcher__state"></umb-variant-state>
</span>
</button>
<div ng-if="splitViewOpen !== true && !subVariant.active" class="umb-variant-switcher__split-view umb-outline" ng-click="openInSplitView($event, subVariant)">Open in split view</div>
</umb-dropdown-item>