diff --git a/src/app/create-joins-page/create-joins-page.component.html b/src/app/create-joins-page/create-joins-page.component.html
index 7511cb6..efeb827 100644
--- a/src/app/create-joins-page/create-joins-page.component.html
+++ b/src/app/create-joins-page/create-joins-page.component.html
@@ -43,7 +43,7 @@
         <div *ngIf="baseTableName">
           <div *ngFor="let hop of requestInfoJoin; index as i" >
             <app-joins-table [allAlias]="aliasData" [passJoinData]="allData[i]" (data)="retrieveData($event, i)" id="{{hop}}"></app-joins-table>
-            <div class="flex inline-flex space-x-4">
+            <div class="sm:inline-flex sm:space-x-4">
               <button (click)="addTable()" type="button" class="text-white bg-gradient-to-br from-pink-500 to-orange-400 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-pink-200 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2">Ajouter une Jointure</button>
 
               <button *ngIf="!oneJoinRemaining" (click)="removeTable(i)" type="button" class="text-gray-900 bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2">Supprimer cette jointure</button>
@@ -56,7 +56,7 @@
         <div *ngIf="whereCardList.length != 0">
           <div *ngFor="let whereCards of whereCardList; index as i" >
             <app-where-card [allAlias]="aliasData" [childIndex]="i" id="{{whereCards}}" (conditionData)="getConditionData($event, i)"></app-where-card>
-            <div class="flex inline-flex space-x-4">
+            <div class="sm:inline-flex sm:space-x-4">
               <button (click)="addCondition()" type="button" class="text-white bg-gradient-to-br from-green-400 to-blue-600 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-green-200 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2">Ajouter une Condition</button>
 
               <button (click)="removeWhereCard(i)" type="button" class="text-white bg-gradient-to-r from-cyan-500 to-blue-500 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-cyan-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2">Supprimer cette Condition</button>
diff --git a/src/app/create-joins-page/create-joins-page.component.ts b/src/app/create-joins-page/create-joins-page.component.ts
index 6958bd0..07fdbad 100644
--- a/src/app/create-joins-page/create-joins-page.component.ts
+++ b/src/app/create-joins-page/create-joins-page.component.ts
@@ -9,7 +9,6 @@ import { Join } from '../model/join';
 import { Alias } from '../model/alias';
 import { WhereCardComponent } from '../where-card/where-card.component';
 import { Condition } from '../model/condition';
-import { ColumnData } from '../model/column-data';
 import { ClipboardModule } from '@angular/cdk/clipboard';
 import { MatIconRegistry } from '@angular/material/icon';
 import { DomSanitizer } from '@angular/platform-browser';
@@ -441,10 +440,8 @@ export class CreateJoinsPageComponent implements OnInit, AfterViewInit{
     }
 
     public checkValue(event: any){
-      if(this.isChecked){
-        this.tablesByBaseSchema = this.tablesByBaseSchemaAll;
-      } else {
-        this.tablesByBaseSchema = this.tablesByBaseSchemaNoViews;
-      }
+      this.tablesByBaseSchema = this.isChecked ?
+        this.tablesByBaseSchemaAll
+        : this.tablesByBaseSchemaNoViews;
     }
 }
diff --git a/src/app/landing-page/landing-page.component.html b/src/app/landing-page/landing-page.component.html
index 1840dc9..86056da 100644
--- a/src/app/landing-page/landing-page.component.html
+++ b/src/app/landing-page/landing-page.component.html
@@ -1,17 +1,24 @@
-<div class="grid grid-cols-2 gap-4">
+
+<div class="mx-auto">
+  <img src="assets/images/logo-apsidetop-blanc.png" alt="Apside logo" class="mx-auto">
+  <div class="text-center text-lg text-white">Produit créé par APSIDE TOP</div>
+</div>
+<div class="text-center text-white my-4">
+  <p>Cette application, AssistDB  a pour objectif de vous aider à rechercher des informations, créer des jointures et gérer un ensemble de scripts et de requêtes de manière centralisée entre tous les membres de l'équipe.</p>
+  <p class="mt-4">L'application est composée de plusieurs pages correspondant à des fonctionnalités bien disctintes :</p>
+</div>
+
+
+<div class="grid md:grid-cols-2 gap-4">
   <div class="text-justify text-white">
-    <p>Cette application, AssistDB  a pour objectif de vous aider à rechercher des informations, créer des jointures et gérer un ensemble de scripts et de requêtes de manière centralisée entre tous les membres de l'équipe.</p>
-    <p class="mt-4">L'application est composée de plusieurs pages correspondant à des fonctionnalités bien disctintes :</p>
     <p class="mt-2">-|- La page de Recherche : Permet de récupérer les informations d'une ou plusieurs colonnes spécifiques.</p>
     <p class="mt-2">-|- La page de Jointures : Permet de générer automatiquement des jointures entre des tables possédant des colonnes identiques.</p>
+  </div>
+  <div class="text-justify text-white">
     <p class="mt-2">-|- La page de Création : Permet de créer des requêtes SQL complexes avec des jointures sur plusieurs colonnes ainsi que des conditions.</p>
     <p class="mt-2">-|- La page de Gestionnaire : Permet de voir, ajouter, modifier et supprimer des scripts ou requêtes. Un système de Tags permet aussi une classification et une catégorisation complète. Les tags peuvent aussi être ajoutés, modifiés et supprimés. L'ensemble de cette page est actualisé et centralisé via GitHub pour l'ensemble des utilisateurs de l'application.
     </p>
-
-  </div>
-  <div class="my-auto">
-     <img src="assets/images/logo-apsidetop-blanc.png" alt="Apside logo">
-     <div class="text-center text-white">Produit créé par APSIDE TOP</div>
   </div>
-
 </div>
+
+
diff --git a/src/app/navbar/navbar.component.html b/src/app/navbar/navbar.component.html
index cdadd74..444fe83 100644
--- a/src/app/navbar/navbar.component.html
+++ b/src/app/navbar/navbar.component.html
@@ -1,8 +1,8 @@
 
 <nav class="sticky top-0 left-0 right-0 z-50 bg-slate-900 hover:border-solid hover:border-b-2 hover:border-white border-b-2 border-slate-900 hover:ease-in-out duration-300">
-  <div class="mx-auto max-w-7xl px-2 sm:px-6 lg:px-8">
+  <div class="mx-auto max-w-7xl px-2 md:px-6 lg:px-8">
     <div class="relative flex h-16 items-center justify-between">
-      <div class="absolute inset-y-0 left-0 flex items-center sm:hidden">
+      <div class="absolute inset-y-0 left-0 flex items-center md:hidden">
         <!-- Mobile menu button-->
         <button type="button" class="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white" aria-controls="mobile-menu" aria-expanded="false">
           <svg (click)="openMobileMenu()" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
@@ -10,12 +10,12 @@
           </svg>
         </button>
       </div>
-      <div class="flex flex-1 items-center justify-center sm:items-stretch sm:justify-start">
+      <div class="flex flex-1 items-center justify-center md:items-stretch md:justify-start">
         <div class="flex flex-shrink-0 items-center">
           <img routerLink="" class="block h-8 w-auto lg:hidden hover:cursor-pointer" src="../../assets/images/logo-apsidetop-blanc.png" alt="Your Company">
           <img routerLink="" class="hidden h-8 w-auto lg:block hover:cursor-pointer" src="../../assets/images/logo-apsidetop-blanc.png" alt="Your Company">
         </div>
-        <div class="hidden sm:ml-6 sm:block" id="extend-menu">
+        <div class="hidden md:ml-6 md:block" id="extend-menu">
           <div class="flex space-x-4">
 
             <a routerLinkActive="active" routerLink="request" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium ">Recherche</a>
@@ -32,7 +32,7 @@
           </div>
         </div>
       </div>
-      <div class="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
+      <div class="absolute inset-y-0 right-0 flex items-center pr-2 md:static md:inset-auto md:ml-6 md:pr-0">
         <!-- Profile dropdown -->
 
         <div class="relative ml-3">
@@ -47,14 +47,16 @@
   </div>
 
   <!-- Mobile menu, show/hide based on menu state. -->
-  <div *ngIf="mobileOpen" class="sm:hidden" id="mobile-menu">
+  <div *ngIf="mobileOpen" class="md:hidden" id="mobile-menu">
     <div class="space-y-1 px-2 pt-2 pb-3">
       <!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white" -->
       <a routerLink="request" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Recherche</a>
 
       <a routerLink="joins" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Jointures</a>
 
-      <a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Calendar</a>
+      <a routerLink="createjoins" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Création</a>
+
+      <a routerLink="scriptmanagement" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Gestionnaire</a>
 
       <button (click)="applyResetDatabase()" class="ml-2 text-white bg-orange-400 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium hover:animate-pulse">MAJ BDD</button>
 
diff --git a/src/app/script-management/script-management.component.html b/src/app/script-management/script-management.component.html
index 9e04331..62c8ed8 100644
--- a/src/app/script-management/script-management.component.html
+++ b/src/app/script-management/script-management.component.html
@@ -1,21 +1,20 @@
 <div class="max-w-full rounded-2xl overflow-hidden shadow-lg bg-white">
-  <div class="m-2 grid grid-cols-12 gap-4 justify-items-center">
-    <div class="col-span-3 my-auto ">
+  <div class="m-2 justify-items-center grid grid-cols-1 sm:grid-cols-12 gap-4 ">
+    <div class="sm:col-span-3 my-auto">
       <button class="flex text-white bg-gradient-to-br from-purple-600 to-blue-500 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-blue-300 font-semibold py-2 px-4 rounded shadow m-2" (click)="getAllScriptsWithTags(); getAllScripts()">Rafraichir</button>
-
     </div>
-    <div class="col-span-6 my-auto text-2xl font-bold">
-      || Gestionnaire de Scripts ||
+    <div class="sm:col-span-6 my-auto text-2xl font-bold">
+      Gestionnaire de Scripts
     </div>
-    <div class="col-span-3 my-auto flex">
-      <a routerLink="/tagsmanagement" class="flex text-black bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 dark:focus:ring-red-400 font-semibold py-2 px-4 rounded shadow m-2" >Gérer les Tags</a>
+    <div class="sm:col-span-3 my-auto md:flex">
+      <a routerLink="/tagsmanagement" class="flex text-black text-center bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 dark:focus:ring-red-400 font-semibold py-2 px-4 rounded shadow m-2" >Gérer les Tags</a>
       <button (click)="addScript()" class="flex text-black bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 dark:focus:ring-red-400 font-semibold py-2 px-4 rounded shadow m-2" >Ajouter un Script</button>
 
     </div>
   </div>
 </div>
 <div class="max-w-full rounded-2xl overflow-hidden shadow-lg bg-white my-4 p-4">
-  <div class="grid grid-cols-3 gap-4">
+  <div class="grid grid-cols-1 md:grid-cols-3 md:gap-4">
     <div class="col-span-2 rounded-lg overflow-hidden shadow-lg bg-slate-100 border-solid border-orange-400 border-2 p-4">
       <div class="flex space-x-2">
         <input [(ngModel)]="filterScriptName" type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" (ngModelChange)="sortWithFilter()" placeholder="Rechercher par nom ou description...">
@@ -35,10 +34,10 @@
 </ng-multiselect-dropdown>
       </div>
       <div class="overflow-y-auto h-96">
-        <div class="grid grid-cols-2">
+        <div class="grid grid-cols-1 md:grid-cols-2">
           <div *ngFor="let script of allScripts, index as i" class="grid grid-cols-2 rounded-2xl overflow-hidden shadow-lg bg-gray-300 p-4 m-2 " (click)="displayText(script)">
             <div class="flex justify-start">
-              <div class="font-bold font-mono mr-2 text-lg rounded-full overflow-hidden shadow-lg bg-green-300 p-2">
+              <div class="hidden xl:block font-bold font-mono mr-2 text-lg rounded-full overflow-hidden shadow-lg bg-green-300 p-2">
                 {{script.extension}}
               </div>
               <div class="my-auto font-bold ">
@@ -54,7 +53,7 @@
     </div>
 
     </div>
-    <div>
+    <div class="mt-4 md:mt-0">
 
 
         <cdk-accordion>
diff --git a/src/app/script-management/script-management.component.ts b/src/app/script-management/script-management.component.ts
index 0726b72..c763f29 100644
--- a/src/app/script-management/script-management.component.ts
+++ b/src/app/script-management/script-management.component.ts
@@ -16,7 +16,6 @@ import { LinkScriptTag } from '../model/link-script-tag';
   styleUrls: ['./script-management.component.scss']
 })
 export class ScriptManagementComponent implements OnInit {
-  listScript: String[] = ['INNER JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN'];
   textTo: String | undefined;
   descText: String | undefined;
   tagsListOfSpecScript: String[] | undefined;
@@ -39,7 +38,8 @@ export class ScriptManagementComponent implements OnInit {
     private domSanitizer: DomSanitizer
   ){
     this.matIconRegistry.addSvgIcon('edit', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/edit.svg')),
-    this.matIconRegistry.addSvgIcon('trash', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/trash.svg'))
+    this.matIconRegistry.addSvgIcon('trash', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/trash.svg')),
+    this.matIconRegistry.addSvgIcon('refresh', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/arrows.svg'))
 
   }
 
diff --git a/src/assets/svg/arrows.svg b/src/assets/svg/arrows.svg
new file mode 100644
index 0000000..73fc6bc
--- /dev/null
+++ b/src/assets/svg/arrows.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M105.1 202.6c7.7-21.8 20.2-42.3 37.8-59.8c62.5-62.5 163.8-62.5 226.3 0L386.3 160H336c-17.7 0-32 14.3-32 32s14.3 32 32 32H463.5c0 0 0 0 0 0h.4c17.7 0 32-14.3 32-32V64c0-17.7-14.3-32-32-32s-32 14.3-32 32v51.2L414.4 97.6c-87.5-87.5-229.3-87.5-316.8 0C73.2 122 55.6 150.7 44.8 181.4c-5.9 16.7 2.9 34.9 19.5 40.8s34.9-2.9 40.8-19.5zM39 289.3c-5 1.5-9.8 4.2-13.7 8.2c-4 4-6.7 8.8-8.1 14c-.3 1.2-.6 2.5-.8 3.8c-.3 1.7-.4 3.4-.4 5.1V448c0 17.7 14.3 32 32 32s32-14.3 32-32V396.9l17.6 17.5 0 0c87.5 87.4 229.3 87.4 316.7 0c24.4-24.4 42.1-53.1 52.9-83.7c5.9-16.7-2.9-34.9-19.5-40.8s-34.9 2.9-40.8 19.5c-7.7 21.8-20.2 42.3-37.8 59.8c-62.5 62.5-163.8 62.5-226.3 0l-.1-.1L125.6 352H176c17.7 0 32-14.3 32-32s-14.3-32-32-32H48.4c-1.6 0-3.2 .1-4.8 .3s-3.1 .5-4.6 1z"/></svg>
\ No newline at end of file