From 67d71908bf0e55f442abfbabd121a49a5e230beb Mon Sep 17 00:00:00 2001
From: Mads Rasmussen <mads@umbraco.com>
Date: Mon, 13 Jun 2016 22:45:42 +0200
Subject: [PATCH] add back button when uninstalling package

---
 .../components/umb-package-local-install.less |   7 --
 .../src/views/packager/views/installed.html   | 110 ++++++++++--------
 2 files changed, 61 insertions(+), 56 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-package-local-install.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-package-local-install.less
index aa3dcb33d4..16abb46247 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-package-local-install.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-package-local-install.less
@@ -22,14 +22,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
-
     text-align: center;
-
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
 }
 
 .umb-upload-local form,
diff --git a/src/Umbraco.Web.UI.Client/src/views/packager/views/installed.html b/src/Umbraco.Web.UI.Client/src/views/packager/views/installed.html
index d9202d6598..d4c810d641 100644
--- a/src/Umbraco.Web.UI.Client/src/views/packager/views/installed.html
+++ b/src/Umbraco.Web.UI.Client/src/views/packager/views/installed.html
@@ -1,7 +1,8 @@
-<div class="umb-packages-view-wrapper" ng-controller="Umbraco.Editors.Packages.InstalledController as vm">
-    
+<div ng-controller="Umbraco.Editors.Packages.InstalledController as vm">
+
     <!-- Package list-->
-    <div ng-if="vm.state == 'list'">
+    <div class="umb-packages-view-wrapper" ng-if="vm.state == 'list'">
+
         <div class="umb-packages-view-title">Installed packages</div>
 
         <div class="umb-package-list">
@@ -26,65 +27,76 @@
 
             </div>
 
-        </div>    
+        </div>
     </div>
-    
+
     <!-- Package details -->
-    <div class="umb-info-local" ng-if="vm.state === 'packageDetails'">
-        <div class="umb-info-local-items">
+    <div ng-if="vm.state === 'packageDetails'">
 
-            <form novalidate name="uninstallForm">
-                <div class="umb-package-icon">
-                    <i ng-if="!vm.package.icon" class="icon-box"></i>
-                    <img ng-if="vm.package.icon" ng-src="{{vm.package.icon}}" alt="" />
-                </div>
+        <umb-editor-sub-header>
+            <umb-editor-sub-header-content-left>
+                <a class="umb-package-details__back-link" href="" ng-click="vm.state = 'list'">&larr; Take me back</a>
+            </umb-editor-sub-header-content-left>
+        </umb-editor-sub-header>
 
+        <div class="umb-info-local">
 
-                <div class="umb-package-info">
-                    <h4 class="umb-info-local-item"><strong>{{ vm.package.name }}</strong></h4>
+            <div class="umb-info-local-items">
 
-                    <div class="umb-info-local-item">
-                        <strong>Author</strong>
-                        <a href="{{ vm.package.authorLink }}" target="_blank">{{ vm.package.author }}</a>
+                <form novalidate name="uninstallForm">
+                    <div class="umb-package-icon">
+                        <i ng-if="!vm.package.icon" class="icon-box"></i>
+                        <img ng-if="vm.package.icon" ng-src="{{vm.package.icon}}" alt="" />
                     </div>
 
-                    <div class="umb-info-local-item">
-                        <strong>Version</strong>
-                        {{ vm.package.version }}
-                    </div>
 
-                    <div class="umb-info-local-item">
-                        <strong>License</strong>
-                        <a href="{{ vm.package.licenseUrl }}">{{ vm.package.license }}</a>
-                    </div>
+                    <div class="umb-package-info">
+                        <h4 class="umb-info-local-item"><strong>{{ vm.package.name }}</strong></h4>
 
-                    <div class="umb-info-local-item">
-                        <strong>Read me</strong>
-                        <br>
-                        <small> {{ vm.package.readme }} </small>
-                    </div>
+                        <div class="umb-info-local-item">
+                            <strong>Author</strong>
+                            <a href="{{ vm.package.authorLink }}" target="_blank">{{ vm.package.author }}</a>
+                        </div>
 
-                    <div class="umb-info-local-item mt-3" ng-if="vm.installState.status == ''">
-                        <button type="button"
-                                ng-class="{'-inactive' : uninstallForm.$invalid}"
-                                ng-disabled="uninstallForm.$invalid"
-                                class="umb-era-button -blue inline-flex"
-                                ng-click="vm.uninstallPackage(vm.package)">
-                            Uninstall package
-                        </button>
-                        <label for="confirm-uninstall" class="umb-package-installer-label">
-                            <input type="checkbox" id="confirm-uninstall" ng-model="vm.package.confirmUninstall" required>
-                            <strong class="label-text">Confirm package uninstall</strong>
-                        </label>
-                    </div>
-                    <div class="umb-info-local-item">
-                        <p>{{vm.installState.status}}</p>
-                    </div>
+                        <div class="umb-info-local-item">
+                            <strong>Version</strong>
+                            {{ vm.package.version }}
+                        </div>
 
-                </div>
-            </form>
+                        <div class="umb-info-local-item">
+                            <strong>License</strong>
+                            <a href="{{ vm.package.licenseUrl }}">{{ vm.package.license }}</a>
+                        </div>
+
+                        <div class="umb-info-local-item">
+                            <strong>Read me</strong>
+                            <br>
+                            <small> {{ vm.package.readme }} </small>
+                        </div>
+
+                        <div class="umb-info-local-item mt-3" ng-if="vm.installState.status == ''">
+                            <button type="button"
+                                    ng-class="{'-inactive' : uninstallForm.$invalid}"
+                                    ng-disabled="uninstallForm.$invalid"
+                                    class="umb-era-button -blue inline-flex"
+                                    ng-click="vm.uninstallPackage(vm.package)">
+                                Uninstall package
+                            </button>
+                            <label for="confirm-uninstall" class="umb-package-installer-label">
+                                <input type="checkbox" id="confirm-uninstall" ng-model="vm.package.confirmUninstall" required>
+                                <strong class="label-text">Confirm package uninstall</strong>
+                            </label>
+                        </div>
+                        <div class="umb-info-local-item">
+                            <p>{{vm.installState.status}}</p>
+                        </div>
+
+                    </div>
+                </form>
+
+            </div>
 
         </div>
     </div>
 
-</div>
\ No newline at end of file
+</div>