Fix for progressbar styling

Modified the styling for the progressbar as the last fix didn't seem to work in latest updates of Chrome.
umbraco · Sep 9, 2014 · 7f3ab15 · 7f3ab15
1 parent 7444363
commit 7f3ab15
Show file tree

Hide file tree

Showing 6 changed files with 43 additions and 23 deletions.
diff --git a/src/Umbraco.Web.UI.Client/src/less/tree.less b/src/Umbraco.Web.UI.Client/src/less/tree.less
@@ -377,6 +377,14 @@ div.not-allowed > i.icon,div.not-allowed > a{
 // Loading Animation 
 // ------------------------
 
+div.umb-loader-wrapper {
+overflow:hidden;
+position:absolute;
+left:0;
+right:0;
+margin: 10px 0;
+}
+
 .umb-tree li div.l{
 width:100%;
 height:1px;

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html
@@ -98,8 +98,10 @@
 	</div>
 
 	<div class="umb-panel-body with-footer">
-        <div style="height: 10px; margin: 10px 0px 10px 0px" class="umb-loader" 
-        	ng-hide="active() == 0"></div>
+		<div class="umb-loader-wrapper" style="position:relative; margin: 0px -20px;">
+	        <div style="height: 10px; margin: 10px 0px 10px 0px" class="umb-loader" 
+	        	ng-hide="active() == 0"></div>
+        </div>
 
         <umb-photo-folder 
         	min-height="75" 

diff --git a/src/Umbraco.Web.UI/umbraco/developer/Packages/installedPackage.aspx b/src/Umbraco.Web.UI/umbraco/developer/Packages/installedPackage.aspx
@@ -141,8 +141,10 @@
                 <cc2:PropertyPanel ID="pp_confirm" runat="server" Text="&nbsp;">
                     <p>
                         <asp:Button ID="bt_confirmUninstall" OnClick="confirmUnInstall" OnClientClick="$('#loadingbar').show()" Text="Confirm uninstall" CssClass="btn btn-primary" runat="server" />
-                        <div style="display: none" id="loadingbar">
-                            <cc2:ProgressBar ID="progbar" runat="server" Title="Please wait..." />    
+                        <div id="loadingbar" style="display: none">
+                            <div class="umb-loader-wrapper">
+                                <cc2:ProgressBar ID="progbar" runat="server" Title="Please wait..." />
+                            </div>
                         </div>
                     </p>
                 </cc2:PropertyPanel>

diff --git a/src/Umbraco.Web.UI/umbraco/developer/Packages/installer.aspx b/src/Umbraco.Web.UI/umbraco/developer/Packages/installer.aspx
@@ -74,9 +74,11 @@
             <cc1:PropertyPanel runat="server" Text="&nbsp;">
                 <asp:Button ID="ButtonLoadPackage" runat="server" Enabled="false" Text="Load Package"
                     OnClick="uploadFile"></asp:Button>
-                <span id="loadingbar" style="display: none;">
-                    <cc1:ProgressBar ID="progbar1" runat="server" Title="Please wait..." />
-                </span>
+                <div id="loadingbar" style="display: none;">
+                    <div class="umb-loader-wrapper">
+                        <cc1:ProgressBar ID="progbar1" runat="server" Title="Please wait..." />
+                    </div>
+                </div>
             </cc1:PropertyPanel>
         </cc1:Pane>
         <cc1:Pane ID="pane_authenticate" runat="server" Visible="false" Text="Repository authentication">
@@ -98,16 +100,17 @@
         </cc1:Pane>
 
         <asp:Panel ID="pane_acceptLicense" runat="server" Visible="false">
-            <br />
-            <div class="alert alert-warning">
-                <p>
-                    <strong>Please note:</strong> Installing a package containing several items and
-                    files can take some time. Do not refresh the page or navigate away before, the installer
-                    notifies you the install is completed.
-                </p>
-            </div>
-
+
             <cc1:Pane ID="pane_acceptLicenseInner" runat="server">
+
+                <div class="alert alert-warning">
+                    <p>
+                        <strong>Please note:</strong> Installing a package containing several items and
+                        files can take some time. Do not refresh the page or navigate away before, the installer
+                        notifies you the install is completed.
+                    </p>
+                </div>
+
                 <cc1:PropertyPanel ID="PropertyPanel3" runat="server" Text="Name">
                     <asp:Label ID="LabelName" runat="server" /></cc1:PropertyPanel>
                 <cc1:PropertyPanel ID="PropertyPanel5" runat="server" Text="Author">
@@ -251,10 +254,11 @@
 
                 <cc1:PropertyPanel runat="server" Text=" ">
                     <br />
-                    <div style="display: none;" id="installingMessage">
-                        <cc1:ProgressBar runat="server" ID="_progbar1" />
-                        <br />
-                        <em>&nbsp; &nbsp;Installing package, please wait...</em><br />
+                    <div id="installingMessage" style="display: none;">
+                        <div class="umb-loader-wrapper">
+                            <cc1:ProgressBar runat="server" ID="_progbar1" />
+                        </div>
+                        <em>Installing package, please wait...</em><br /><br />
                     </div>
                     <asp:Button ID="ButtonInstall" runat="server" Text="Install Package" CssClass="btn btn-primary" Enabled="False"
                         OnClick="startInstall"></asp:Button>

diff --git a/src/Umbraco.Web.UI/umbraco/dialogs/republish.aspx b/src/Umbraco.Web.UI/umbraco/dialogs/republish.aspx
@@ -24,7 +24,9 @@
     </div>     
 
     <div id="progress" style="visibility: hidden;">
-		<cc1:ProgressBar ID="progbar" runat="server" Title="Please wait..." />
+      <div class="umb-loader-wrapper">
+		    <cc1:ProgressBar ID="progbar" runat="server" Title="Please wait..." />
+      </div>
     </div>
 
     </asp:Panel>

diff --git a/src/Umbraco.Web.UI/umbraco/dialogs/sort.aspx b/src/Umbraco.Web.UI/umbraco/dialogs/sort.aspx
@@ -19,12 +19,14 @@
     <div class="umb-dialog-body">
         <cc1:Pane runat="server">
 
-          <div id="loading" style="display: none;">
+          <div id="loading" style="display: none; margin-bottom: 10px;">
                 <div class="notice">
                     <p><%= umbraco.ui.Text("sort", "sortPleaseWait") %></p>
                 </div>
                 <br />
-                <cc1:ProgressBar ID="prog1" runat="server" Title="sorting.." />
+                <div class="umb-loader-wrapper">
+                    <cc1:ProgressBar ID="prog1" runat="server" Title="sorting.." />
+                </div>
             </div>
 
             <div id="sortingDone" style="display: none;" class="success">