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

make special zIndex's for the tour

Browse Source
This commit is contained in:
Mads Rasmussen
2018-09-04 11:17:27 +02:00
parent 5b3b160f3b
commit 54255b41a0
3 changed files with 16 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less
View File

@@ -1,13 +1,13 @@
.umb-tour__loader {
background: @white;
z-index: 10000;
z-index: @zindexTourModal;
position: fixed;
height: 5px;
}
.umb-tour__pulse {
position: fixed;
z-index: 10000;
z-index: @zindexTourModal;
display: none;
background: transparent;
box-shadow: 0 0 0 @green inset;
@@ -31,7 +31,7 @@
position: fixed;
background: @white;
border-radius: @baseBorderRadius;
z-index: 10000;
z-index: @zindexTourModal;
width: 320px;
max-width: 100%;
box-sizing: border-box;
@@ -100,3 +100,8 @@
font-size: 14px;
line-height: 1.6em;
}
// we need to make sure the tour is on top of everything else
.umb-tour-is-visible .umb-backdrop {
z-index: @zindexTourBackdrop;
}

4
src/Umbraco.Web.UI.Client/src/less/variables.less
View File

@@ -331,6 +331,10 @@
@zindexUmbOverlay: 7500;
@zindexOverlayBackdrop: 2000;
// these are used for the tour which should be on top of everything else
@zindexTourBackdrop: 9999;
@zindexTourModal: 10000;
// Sticky bar has a z-index of "500", which is set from javascript in directive
// so set z-index of cropper should be lower to be behind sticky bar.
@zindexCropperOverlay: 499;

7
src/Umbraco.Web.UI/Umbraco/Views/Default.cshtml
View File

@@ -43,7 +43,7 @@
new BasicPath("Umbraco", IOHelper.ResolveUrl(SystemDirectories.Umbraco)),
new BasicPath("UmbracoClient", IOHelper.ResolveUrl(SystemDirectories.UmbracoClient)))
</head>
<body ng-class="{'touch':touchDevice, 'emptySection':emptySection, 'umb-drawer-is-visible':drawer.show}" ng-controller="Umbraco.MainController" id="umbracoMainPageBody">
<body ng-class="{'touch':touchDevice, 'emptySection':emptySection, 'umb-drawer-is-visible':drawer.show, 'umb-tour-is-visible': tour.show}" ng-controller="Umbraco.MainController" id="umbracoMainPageBody">
<noscript>
<div style="margin: 10px;">
@@ -77,8 +77,9 @@
</div>
<umb-tour ng-if="tour.show"
model="tour">
<umb-tour
ng-if="tour.show"
model="tour">
</umb-tour>
<umb-notifications></umb-notifications>