From 53c236d3c7003960d1ed0c0ab1aeec507416f07f Mon Sep 17 00:00:00 2001
From: Axel Peter <axel.peter@corp.ovh.com>
Date: Thu, 28 Jun 2018 13:41:03 +0200
Subject: [PATCH 1/2] fix(oui-tile): fix loading state

---
 packages/oui-tile/README.md     | 18 ++++++++++++++++++
 packages/oui-tile/src/tile.html |  8 +++++++-
 2 files changed, 25 insertions(+), 1 deletion(-)

diff --git a/packages/oui-tile/README.md b/packages/oui-tile/README.md
index b7c6e39b..fe1c44db 100644
--- a/packages/oui-tile/README.md
+++ b/packages/oui-tile/README.md
@@ -53,6 +53,24 @@
 </oui-tile>
 ```
 
+### Loading state
+
+```html:preview
+<div ng-init="$ctrl.loading = true" class="oui-doc-preview-only-keep-children">
+<button class="oui-button oui-doc-preview-only" type="button"
+    ng-class="{
+        'oui-button_primary': $ctrl.loading,
+        'oui-button_secondary': !$ctrl.loading
+    }"
+    ng-click="$ctrl.loading = !$ctrl.loading">
+    Toggle loading
+</button>
+<oui-tile heading="Title" description="A great legend for this tile." loading="$ctrl.loading">
+    <p>Nulla ac dui a est varius eleifend nec vitae ipsum. Nunc venenatis luctus nisi quis pulvinar. Duis justo massa, mattis nec metus scelerisque, mattis tristique quam. Sed eget neque elementum, facilisis velit eget, iaculis lectus. Quisque at molestie justo. Ut tincidunt augue non tortor tincidunt facilisis. Donec ut lectus a leo porttitor eleifend. Morbi venenatis turpis eu rutrum consectetur. Sed auctor ligula at erat euismod, imperdiet posuere est feugiat. Quisque maximus ultricies risus sed varius.</p>
+</oui-tile>
+</div>
+```
+
 ## API
 
 ### oui-tile
diff --git a/packages/oui-tile/src/tile.html b/packages/oui-tile/src/tile.html
index fe66440d..30b537ae 100644
--- a/packages/oui-tile/src/tile.html
+++ b/packages/oui-tile/src/tile.html
@@ -1,5 +1,11 @@
 <div class="oui-tile">
     <h4 class="oui-header_4 oui-tile__title" ng-bind="::$ctrl.heading"></h4>
     <p class="oui-tile__legend" ng-if="!!$ctrl.description" ng-bind="::$ctrl.description"></p>
-    <div class="oui-tile__body" ng-transclude></div>
+    <div class="oui-tile__body"
+        ng-if="!$ctrl.loading"
+        ng-transclude>
+    </div>
+    <oui-spinner size="m"
+        ng-if="$ctrl.loading">
+    </oui-spinner>
 </div>

From 2a8b83ebf0e848809f32c03be6d312925bf34fe6 Mon Sep 17 00:00:00 2001
From: Axel Peter <axel.peter@corp.ovh.com>
Date: Thu, 28 Jun 2018 15:21:18 +0200
Subject: [PATCH 2/2] style(oui-tile): center spinner

---
 packages/oui-tile/src/tile.html | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/oui-tile/src/tile.html b/packages/oui-tile/src/tile.html
index 30b537ae..efa24957 100644
--- a/packages/oui-tile/src/tile.html
+++ b/packages/oui-tile/src/tile.html
@@ -5,7 +5,8 @@ <h4 class="oui-header_4 oui-tile__title" ng-bind="::$ctrl.heading"></h4>
         ng-if="!$ctrl.loading"
         ng-transclude>
     </div>
-    <oui-spinner size="m"
+    <div class="oui-tile__loader"
         ng-if="$ctrl.loading">
-    </oui-spinner>
+        <oui-spinner size="m"></oui-spinner>
+    </div>
 </div>