Add mascot to configure warning modal

2 files changed, 14 insertions, 1 deletions

diff --git a/client/src/app/modal/instance-config-warning-modal.component.html b/client/src/app/modal/instance-config-warning-modal.component.html
index 64f14e69b..93391c0a8 100644
--- a/client/src/app/modal/instance-config-warning-modal.component.html
+++ b/client/src/app/modal/instance-config-warning-modal.component.html
@@ -5,6 +5,7 @@
   </div>
 
   <div class="modal-body">
+    <img class="mascot" src="/client/assets/images/mascot/oh.png" alt="mascot" />
 
     <p i18n>Hello dear administrator. You enabled user registration on your instance but you did not configure the following fields:</p>
 
@@ -26,7 +27,7 @@
     </p>
 
     <div class="configure-instance">
-      <a i18n href="/admin/config/edit-custom" target="_blank" rel="noopener noreferrer">Configure these fields</a>
+      <a i18n class="action-button action-button-configure" href="/admin/config/edit-custom" target="_blank" rel="noopener noreferrer">Configure these fields</a>
     </div>
 
   </div>
diff --git a/client/src/app/modal/instance-config-warning-modal.component.scss b/client/src/app/modal/instance-config-warning-modal.component.scss
index ff62a1b9c..4a76a1319 100644
--- a/client/src/app/modal/instance-config-warning-modal.component.scss
+++ b/client/src/app/modal/instance-config-warning-modal.component.scss
@@ -20,3 +20,15 @@ li {
   margin-top: 40px;
   margin-bottom: 10px;
 }
+
+.mascot {
+  display: block;
+  margin: 0 auto 50px;
+}
+
+.action-button-configure {
+  display: inline-block;
+
+  @include peertube-button;
+  @include orange-button;
+}