diff --git a/apps/maarch_entreprise/xml/services.xml b/apps/maarch_entreprise/xml/services.xml
index 95c1eb6cb1a9dece6f2744bcaeba9c8c879b1e54..87329c02e9f820ac1ae11a7fb772610c2bd86bb2 100755
--- a/apps/maarch_entreprise/xml/services.xml
+++ b/apps/maarch_entreprise/xml/services.xml
@@ -258,9 +258,8 @@
     <name>_DOCSERVERS</name>
     <comment>_ADMIN_DOCSERVERS_DESC</comment>
     <servicepage>/administration/docservers</servicepage>
-    <!--<servicepage>index.php?page=admin_docservers&amp;admin=docservers&amp;mode=list</servicepage>-->
     <servicetype>admin</servicetype>
-    <category>supervision</category>
+    <category>technical_param</category>
     <system_service>false</system_service>
     <style>fa fa-hdd</style>
     <enabled>true</enabled>
@@ -358,7 +357,7 @@
     <comment>_PARAMETERS</comment>
     <servicepage>/administration/parameters</servicepage>
     <servicetype>admin</servicetype>
-    <category>supervision</category>
+    <category>technical_param</category>
     <style>fa fa-wrench</style>
     <system_service>false</system_service>
     <enabled>true</enabled>
@@ -416,7 +415,7 @@
     <comment>_SECURITIES</comment>
     <servicepage>/administration/securities</servicepage>
     <servicetype>admin</servicetype>
-    <category>supervision</category>
+    <category>technical_param</category>
     <system_service>false</system_service>
     <style>fas fa-lock</style>
     <enabled>true</enabled>
@@ -424,11 +423,23 @@
   </SERVICE>
   <SERVICE>
     <id>admin_technical_configuration</id>
+    <name>_PARAMETERS</name>
+    <comment>_PARAMETERS_DESC</comment>
+    <servicepage>/administration/technical</servicepage>
+    <servicetype>admin</servicetype>
+    <category>supervision</category>
+    <system_service>false</system_service>
+    <style>fas fa-cog</style>
+    <enabled>true</enabled>
+    <angular>true</angular>
+  </SERVICE>
+  <SERVICE>
+    <id>admin_sendmail</id>
     <name>_SENDMAIL_PARAM</name>
     <comment>_SENDMAIL_PARAM_DESC</comment>
     <servicepage>/administration/sendmail</servicepage>
     <servicetype>admin</servicetype>
-    <category>supervision</category>
+    <category>technical_param</category>
     <system_service>false</system_service>
     <style>fas fa-mail-bulk</style>
     <enabled>true</enabled>
diff --git a/src/frontend/app/administration/administration.component.html b/src/frontend/app/administration/administration.component.html
index 076e82ac373dfd529faeac87d5dc8c37e9bf568e..f63db40acb5275ce4cfc6108f46c2ab2b2541bc3 100755
--- a/src/frontend/app/administration/administration.component.html
+++ b/src/frontend/app/administration/administration.component.html
@@ -42,16 +42,17 @@
                             <i class="{{modService.style}} fa-4x"></i>
                             <br/>{{modService.name}}</button>
                     </div>
-
                     <div class="col-md-6 adminArea_4" *ngIf="supervisionServices">
                         <div style="font-size: 20px;
                         font-weight: bolder;
                         opacity: 0.2;
                         text-align: center">{{lang.supervision}}</div>
-                        <button style="white-space:inherit;height: 100px;line-height:20px;" class="col-md-4 col-xs-6" mat-button color="primary" matTooltip="{{modService.comment}}" *ngFor="let modService of supervisionServices"
+                        <ng-container>
+                            <button style="white-space:inherit;height: 100px;line-height:20px;" class="col-md-4 col-xs-6" mat-button color="primary" matTooltip="{{modService.comment}}" *ngFor="let modService of supervisionServices"
                             (click)="goToSpecifiedAdministration(modService)">
                             <i class="{{modService.style}} fa-4x"></i>
                             <br/>{{modService.name}}</button>
+                        </ng-container>
                     </div>
                 </div>
             </mat-card>
diff --git a/src/frontend/app/administration/administration.component.ts b/src/frontend/app/administration/administration.component.ts
index 8dbd5ccf755feb23ca573b58d4586c3fec892f3a..783ef18d5141644c036a385eebb19420ca26d1ae 100755
--- a/src/frontend/app/administration/administration.component.ts
+++ b/src/frontend/app/administration/administration.component.ts
@@ -3,8 +3,9 @@ import { MediaMatcher } from '@angular/cdk/layout';
 import { HttpClient } from '@angular/common/http';
 import { Router } from '@angular/router';
 import { LANG } from '../translate.component';
-import { MatSidenav } from '@angular/material';
-import {HeaderService} from "../../service/header.service";
+import { MatSidenav, MatBottomSheet } from '@angular/material';
+import { HeaderService } from "../../service/header.service";
+import { TechnicalAdministrationComponent } from "../administration/technical/technical-administration.component";
 
 declare function $j(selector: any): any;
 
@@ -31,7 +32,7 @@ export class AdministrationComponent implements OnInit {
     @ViewChild('snav') public sidenavLeft: MatSidenav;
     @ViewChild('snav2') public sidenavRight: MatSidenav;
 
-    constructor(changeDetectorRef: ChangeDetectorRef, media: MediaMatcher, public http: HttpClient, private router: Router, private headerService: HeaderService) {
+    constructor(changeDetectorRef: ChangeDetectorRef, media: MediaMatcher, public http: HttpClient, private router: Router, private headerService: HeaderService, private bottomSheet: MatBottomSheet) {
         $j("link[href='merged_css.php']").remove();
         this.mobileQuery = media.matchMedia('(max-width: 768px)');
         this._mobileQueryListener = () => changeDetectorRef.detectChanges();
@@ -61,9 +62,18 @@ export class AdministrationComponent implements OnInit {
 
     goToSpecifiedAdministration(service: any): void {
         if (service.angular == "true") {
-            this.router.navigate([service.servicepage]);
+            if (service.id == 'admin_technical_configuration') {
+                this.openTechnicalAdmin();
+            } else {
+                this.router.navigate([service.servicepage]);
+            }
+            
         } else {
             window.location.assign(service.servicepage);
         }
     }
+
+    openTechnicalAdmin(): void {
+        this.bottomSheet.open(TechnicalAdministrationComponent);
+    }
 }
diff --git a/src/frontend/app/administration/administration.module.ts b/src/frontend/app/administration/administration.module.ts
index 9876f8772f2ce9c7b3846a2cec9b1cad4bad27d9..4c681d5f2d0493fffc23c423c165036442ff1617 100755
--- a/src/frontend/app/administration/administration.module.ts
+++ b/src/frontend/app/administration/administration.module.ts
@@ -45,6 +45,8 @@ import { TemplateAdministrationComponent }              from './template/templat
 import { SecuritiesAdministrationComponent }            from './security/securities-administration.component';
 import { SendmailAdministrationComponent }            from './sendmail/sendmail-administration.component';
 
+import { TechnicalAdministrationComponent }            from './technical/technical-administration.component';
+
 @NgModule({
     imports:      [
         SharedModule,
@@ -95,7 +97,8 @@ import { SendmailAdministrationComponent }            from './sendmail/sendmail-
         TemplatesAdministrationComponent,
         TemplateAdministrationComponent,
         SecuritiesAdministrationComponent,
-        SendmailAdministrationComponent
+        SendmailAdministrationComponent,
+        TechnicalAdministrationComponent
     ],
     entryComponents: [
         UsersAdministrationRedirectModalComponent,
@@ -104,7 +107,8 @@ import { SendmailAdministrationComponent }            from './sendmail/sendmail-
         GroupsAdministrationRedirectModalComponent,
         BasketAdministrationSettingsModalComponent,
         BasketAdministrationGroupListModalComponent,
-        DoctypesAdministrationRedirectModalComponent
+        DoctypesAdministrationRedirectModalComponent,
+        TechnicalAdministrationComponent
     ],
 })
 export class AdministrationModule {}
\ No newline at end of file
diff --git a/src/frontend/app/administration/technical/technical-administration.component.html b/src/frontend/app/administration/technical/technical-administration.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..d6fbe66bd2c80ce2afd0544cc25a2a905946d8e3
--- /dev/null
+++ b/src/frontend/app/administration/technical/technical-administration.component.html
@@ -0,0 +1,10 @@
+<div class="adminTitle">{{lang.parameters}}</div>
+<div *ngIf="loading" class="adminLoading">
+    <mat-spinner></mat-spinner>
+</div>
+<mat-nav-list *ngIf="!loading">
+    <mat-list-item *ngFor="let modService of technicalServices">
+        <mat-icon color="primary" mat-list-icon class="{{modService.style}} fa-2x"></mat-icon>
+        <p mat-line> {{modService.name}} </p>
+      </mat-list-item>
+</mat-nav-list>
\ No newline at end of file
diff --git a/src/frontend/app/administration/technical/technical-administration.component.scss b/src/frontend/app/administration/technical/technical-administration.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..bc2547e329a6a8508ea2959b80dc3b27feeaad75
--- /dev/null
+++ b/src/frontend/app/administration/technical/technical-administration.component.scss
@@ -0,0 +1,18 @@
+.adminTitle {
+    text-align: center;
+    font-weight: bold;
+    opacity: 0.3;
+}
+
+.adminLoading {
+    display: flex;
+    height: 100%;
+
+    .mat-spinner {
+        margin: auto;
+    }
+}
+
+mat-icon {
+    height: auto;
+}
\ No newline at end of file
diff --git a/src/frontend/app/administration/technical/technical-administration.component.ts b/src/frontend/app/administration/technical/technical-administration.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6228db6e06245812e00f93c4044c6109197c2dba
--- /dev/null
+++ b/src/frontend/app/administration/technical/technical-administration.component.ts
@@ -0,0 +1,51 @@
+import { Component, OnInit } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { Router } from '@angular/router';
+import { LANG } from '../../translate.component';
+
+declare function $j(selector: any): any;
+
+declare const angularGlobals: any;
+
+
+@Component({
+    templateUrl: "technical-administration.component.html",
+    styleUrls: ['technical-administration.component.scss'],
+})
+export class TechnicalAdministrationComponent implements OnInit {
+
+    mobileQuery                     : MediaQueryList;
+
+    coreUrl                         : string;
+    lang                            : any       = LANG;
+    loading                         : boolean   = false;
+
+    technicalServices               : any[]     = [];
+
+    constructor(public http: HttpClient, private router: Router) {
+        $j("link[href='merged_css.php']").remove();
+    }
+
+    ngOnInit(): void {
+        this.coreUrl = angularGlobals.coreUrl;
+
+        this.loading = true;
+
+        // TO DO : change route for real technical services
+        this.http.get(this.coreUrl + 'rest/administration')
+            .subscribe((data: any) => {
+                this.technicalServices = data.administrations.supervision;
+                this.loading = false;
+            }, () => {
+                location.href = "index.php";
+            });
+    }
+
+    goToSpecifiedAdministration(service: any): void {
+        if (service.angular == "true") {
+            this.router.navigate([service.servicepage]);
+        } else {
+            window.location.assign(service.servicepage);
+        }
+    }
+}