4 files changed, 15 insertions, 21 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 5a8290cda..5a8adf726 100644
--- a/client/src/app/modal/instance-config-warning-modal.component.html
+++ b/client/src/app/modal/instance-config-warning-modal.component.html
@@ -7,7 +7,7 @@
   <div class="modal-body">
     <img class="mascot" src="/client/assets/images/mascot/oh.svg" alt="mascot" />
 
-    <p i18n>Hello dear administrator. You enabled user registration on your instance but you did not configure the following fields:</p>
+    <p i18n>You enabled user registration on your instance but did not configure the following fields:</p>
 
     <ul>
       <li i18n *ngIf="about.instance.name.toLowerCase() === 'peertube'">Instance name</li>
@@ -25,11 +25,6 @@
       Please consider configuring these fields to help people to choose <strong>the appropriate instance</strong>.
       Without them, your instance may not be referenced on the <a target="_blank" rel="noopener noreferrer" href="https://joinpeertube.org">JoinPeerTube website</a>.
     </p>
-
-    <div class="configure-instance">
-      <a i18n class="action-button action-button-configure" href="/admin/config/edit-custom" target="_blank" rel="noopener noreferrer">Configure these fields</a>
-    </div>
-
   </div>
 
   <div class="modal-footer inputs">
@@ -37,13 +32,16 @@
       inputName="stopDisplayModal" [(ngModel)]="stopDisplayModal"
       i18n-labelText labelText="Don't show me this warning anymore"
     >
-
     </my-peertube-checkbox>
 
     <input
       type="button" role="button" i18n-value value="Close" class="action-button action-button-cancel"
       (click)="hide()" (key.enter)="hide()"
     >
+    <a i18n class="action-button action-button-configure" ngbAutofocus
+       href="/admin/config/edit-custom" target="_blank" rel="noopener noreferrer">
+       Configure
+    </a>
   </div>
 
 </ng-template>
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 4a76a1319..cc97d64e4 100644
--- a/client/src/app/modal/instance-config-warning-modal.component.scss
+++ b/client/src/app/modal/instance-config-warning-modal.component.scss
@@ -13,17 +13,10 @@ li {
   margin-bottom: 10px;
 }
 
-.configure-instance {
-  text-align: center;
-  font-weight: 600;
-  font-size: 18px;
-  margin-top: 40px;
-  margin-bottom: 10px;
-}
-
 .mascot {
   display: block;
   margin: 0 auto 50px;
+  width: 25%;
 }
 
 .action-button-configure {
@@ -31,4 +24,5 @@ li {
 
   @include peertube-button;
   @include orange-button;
+  @include disable-default-a-behaviour;
 }
diff --git a/client/src/app/modal/welcome-modal.component.html b/client/src/app/modal/welcome-modal.component.html
index 8bfcc4bf6..81c12d4c0 100644
--- a/client/src/app/modal/welcome-modal.component.html
+++ b/client/src/app/modal/welcome-modal.component.html
@@ -33,9 +33,7 @@
 
     <div class="two-columns">
 
-      <div class="mascot">
-        <img src="/client/assets/images/mascot/pointing.png" alt="mascot">
-      </div>
+      <img class="mascot mascot-fw" src="/client/assets/images/mascot/pointing.svg" alt="mascot">
 
       <div class="block-links">
         <div i18n class="subtitle">Useful links</div>
@@ -51,9 +49,7 @@
     </div>
 
     <div class="two-columns">
-      <div class="mascot">
-        <img src="/client/assets/images/mascot/happy.png" alt="mascot">
-      </div>
+      <img class="mascot" src="/client/assets/images/mascot/happy.svg" alt="mascot">
 
       <div class="block-configuration">
         <div i18n class="subtitle">It's time to configure your instance!</div>
diff --git a/client/src/app/modal/welcome-modal.component.scss b/client/src/app/modal/welcome-modal.component.scss
index 6214f3b9d..c04772546 100644
--- a/client/src/app/modal/welcome-modal.component.scss
+++ b/client/src/app/modal/welcome-modal.component.scss
@@ -12,9 +12,14 @@
   margin-top: 50px;
 }
 
+.mascot-fw {
+  width: 170px;
+}
+
 .mascot {
   display: block;
   min-width: 170px;
+  margin-right: 2rem;
 }
 
 .subtitle {
@@ -73,6 +78,7 @@ li {
 .configure-instance-button {
   @include peertube-button;
   @include orange-button;
+  @include disable-default-a-behaviour;
 
   display: inline-block;
 }