Fix for U4-7373 Error notifications shown are hidden underneath the dialogs

http://issues.umbraco.org/issue/U4-7373
This commit is contained in:
Simon Busborg
2015-12-15 10:08:19 +01:00
parent 3cdd650b66
commit ecb6c8e52c
5 changed files with 28 additions and 20 deletions

View File

@@ -31,6 +31,7 @@ angular.module("umbraco.directives")
resize: function(e, ui) {
var wrapper = $("#mainwrapper");
var contentPanel = $("#contentwrapper");
var umbNotification = $("#umb-notifications-wrapper");
var apps = $("#applications");
var bottomBar = contentPanel.find(".umb-bottom-bar");
var navOffeset = $("#navOffset");
@@ -39,6 +40,7 @@ angular.module("umbraco.directives")
contentPanel.css({ left: leftPanelWidth });
bottomBar.css({ left: leftPanelWidth });
umbNotification.css({ left: leftPanelWidth });
navOffeset.css({ "margin-left": ui.element.outerWidth() });
},
@@ -55,11 +57,13 @@ angular.module("umbraco.directives")
if (resizeEnabled) {
//kill the resize
element.resizable("destroy");
element.css("width", "");
var navInnerContainer = element.find(".navigation-inner-container");
navInnerContainer.css("width", "");
$("#contentwrapper").css("left", "");
$("#umb-notification").css("left" "");
$("#navOffset").css("margin-left", "");
resizeEnabled = false;

View File

@@ -9,18 +9,17 @@
<link rel="stylesheet" href="assets/css/umbraco.css" />
</head>
<body ng-class="{touch:touchDevice}" ng-controller="Umbraco.MainController" id="umbracoMainPageBody">
<body ng-class="{touch:touchDevice,emptySection:emptySection}" ng-controller="Umbraco.MainController" id="umbracoMainPageBody">
<div ng-hide="!authenticated" ng-cloak id="mainwrapper" class="clearfix" ng-click="closeDialogs($event)">
<umb-navigation></umb-navigation>
<section id="contentwrapper">
<div id="contentcolumn">
<div class="content-column-body" ng-view></div>
<div id="contentcolumn" ng-view>
</div>
</section>
</div>
<umb-notifications></umb-notifications>
<umb-notifications></umb-notifications>
<script src="lib/rgrove-lazyload/lazyload.js"></script>
<script src="js/loader.dev.js"></script>

View File

@@ -47,6 +47,10 @@ body {
margin: 0
}
#umb-notifications-wrapper {
left: 80px;
}
#contentcolumn {
left: 0px;
}
@@ -168,12 +172,12 @@ body {
border-radius: 0;
}
.ui-resizable-e {
cursor: e-resize;
width: 4px;
right: -5px;
top: 0;
bottom: 0;
.ui-resizable-e {
cursor: e-resize;
width: 4px;
right: -5px;
top: 0;
bottom: 0;
background-color: @grayLighter;
border: solid 1px @grayLight;
position:absolute;
@@ -182,12 +186,12 @@ body {
}
@media (min-width: 1101px) {
#contentwrapper {left: 440px;}
#contentwrapper, #umb-notifications-wrapper {left: 440px;}
#speechbubble {left: 360px;}
}
//empty section modification
.emptySection #contentwrapper {left: 80px;}
.emptySection #contentwrapper, .emptySection #umb-notifications-wrapper {left: 80px;}
.emptySection #speechbubble {left: 0;}
.emptySection #navigation {display: none}
@@ -202,7 +206,7 @@ body {
@media (max-width: 767px) {
// make leftcolumn smaller on tablets
#leftcolumn {
width: 60px;
@@ -219,7 +223,7 @@ body {
#navigation {
left: 60px;
}
#contentwrapper, #contentcolumn {
#contentwrapper, #contentcolumn, #umb-notifications-wrapper {
left: 30px;
}
#umbracoMainPageBody .umb-modal-left.fade.in {
@@ -230,7 +234,7 @@ body {
@media (max-width: 500px) {
// make leftcolumn smaller on mobiles
#leftcolumn {
width: 40px;
@@ -259,7 +263,7 @@ body {
#navigation {
left: 40px;
}
#contentwrapper, #contentcolumn {
#contentwrapper, #contentcolumn, #umb-notifications-wrapper {
left: 20px;
}
#umbracoMainPageBody .umb-modal-left.fade.in {

View File

@@ -1,4 +1,4 @@
<div class="umb-notifications" ng-cloak>
<div class="umb-notifications" id="umb-notifications-wrapper" ng-cloak>
<ul class="umb-notifications__notifications">
<li ng-repeat="notification in notifications"
class="alert alert-block alert-{{notification.type}} umb-notifications__notification animated -half-second fadeIn"

View File

@@ -54,16 +54,17 @@
</head>
<noscript><h5><strong>&nbsp; JavaScript is disabled. Please enable to continue!</strong></h5></noscript>
<body ng-class="{touch:touchDevice,emptySection:emptySection}" ng-controller="Umbraco.MainController" id="umbracoMainPageBody">
<div ng-hide="!authenticated" ng-cloak id="mainwrapper" id="mainwrapper" class="clearfix" ng-click="closeDialogs($event)">
<div ng-hide="!authenticated" ng-cloak id="mainwrapper" class="clearfix" ng-click="closeDialogs($event)">
<umb-navigation></umb-navigation>
<section id="contentwrapper">
<div id="contentcolumn" ng-view>
</div>
<umb-notifications></umb-notifications>
</section>
<umb-notifications></umb-notifications>
</div>
@Html.BareMinimumServerVariablesScript(Url, Url.Action("ExternalLogin", "BackOffice", new { area = ViewBag.UmbracoPath }))