From 46261af7517cdb54db482675a1111480270b44ff Mon Sep 17 00:00:00 2001
From: Pierre-Olivier Mercier <nemunaire@nemunai.re>
Date: Thu, 2 Sep 2021 13:15:27 +0200
Subject: [PATCH] ui: Center display of hints buttons

---
 .../ui/src/components/ExerciceHints.svelte    | 36 ++++++++++---------
 1 file changed, 20 insertions(+), 16 deletions(-)

diff --git a/frontend/ui/src/components/ExerciceHints.svelte b/frontend/ui/src/components/ExerciceHints.svelte
index 41bb643e..38b0f5c6 100644
--- a/frontend/ui/src/components/ExerciceHints.svelte
+++ b/frontend/ui/src/components/ExerciceHints.svelte
@@ -93,22 +93,6 @@
                         </h1>
                     {/if}
                     <div class="flex-fill" style="min-width:0">
-                        {#if !(hint.content || hint.file)}
-		            <button type="button" on:click={openHint(hint)} class="float-end btn btn-info" class:disabled={hints_submitted[hint.id]}>
-                                {#if hints_submitted[hint.id]}
-                                    <Spinner size="sm" class="me-2" />
-                                {:else}
-                                    <Icon name="lock" aria-hidden="true" />
-                                {/if}
-                                Débloquer
-                            </button>
-                        {/if}
-                        {#if !hint.file && hint.hidden}
-		            <button type="button" ng-click="hint.hidden = false;" class="float-end btn btn-info">
-                                <Icon name="lock" aria-hidden="true" />
-                                Afficher
-                            </button>
-                        {/if}
 		        <h4 class="fw-bold">{hint.title}</h4>
                         {#if hint.file}
 		            <p style="overflow-x: auto">
@@ -124,6 +108,26 @@
                             </p>
                         {/if}
                     </div>
+                    {#if !(hint.content || hint.file) || (!hint.file && hint.hidden)}
+                    <div>
+                        {#if !(hint.content || hint.file)}
+		            <button type="button" on:click={openHint(hint)} class="btn btn-info" class:disabled={hints_submitted[hint.id]}>
+                                {#if hints_submitted[hint.id]}
+                                    <Spinner size="sm" class="me-2" />
+                                {:else}
+                                    <Icon name="lock" aria-hidden="true" />
+                                {/if}
+                                Débloquer
+                            </button>
+                        {/if}
+                        {#if !hint.file && hint.hidden}
+		            <button type="button" ng-click="hint.hidden = false;" class="btn btn-info">
+                                <Icon name="lock" aria-hidden="true" />
+                                Afficher
+                            </button>
+                        {/if}
+                    </div>
+                    {/if}
                 </ListGroupItem>
             {/each}
         </ListGroup>