Updating bootstrap with material

2023-01-09 13:37:30 +01:00
parent d0c0668fad
commit 2425ecbd3b
10 changed files with 992 additions and 132 deletions
--- a/front/Dockerfile
+++ b/front/Dockerfile
@@ -10,6 +10,7 @@ WORKDIR /app
 COPY app/package*.json ./

 # install project dependencies
+RUN npm install -g @angular/cli
 RUN npm install

 # copy project files and folders to the current working directory (i.e. 'app' folder)
--- a/front/app/angular.json
+++ b/front/app/angular.json
@@ -25,7 +25,7 @@
              "src/assets"
            ],
            "styles": [
-              "node_modules/bootstrap/dist/css/bootstrap.min.css",
+              "@angular/material/prebuilt-themes/deeppurple-amber.css",
              "src/styles.css"
            ],
            "scripts": []
@@ -88,6 +88,7 @@
              "src/assets"
            ],
            "styles": [
+              "@angular/material/prebuilt-themes/deeppurple-amber.css",
              "src/styles.css"
            ],
            "scripts": []
--- a/front/app/package-lock.json
+++ b/front/app/package-lock.json
--- a/front/app/package.json
+++ b/front/app/package.json
@@ -11,25 +11,23 @@
  "private": true,
  "dependencies": {
    "@angular/animations": "^15.0.0",
+    "@angular/cdk": "^15.0.4",
    "@angular/common": "^15.0.0",
    "@angular/compiler": "^15.0.0",
    "@angular/core": "^15.0.0",
    "@angular/forms": "^15.0.0",
+    "@angular/material": "^15.0.4",
    "@angular/platform-browser": "^15.0.0",
    "@angular/platform-browser-dynamic": "^15.0.0",
    "@angular/router": "^15.0.0",
-    "@angular/cli": "~15.0.5",
-    "@ng-bootstrap/ng-bootstrap": "^14.0.0",
-    "@popperjs/core": "^2.11.6",
-    "bootstrap": "^5.2.3",
    "rxjs": "~7.5.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.12.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^15.0.5",
+    "@angular/cli": "~15.0.5",
    "@angular/compiler-cli": "^15.0.0",
-    "@angular/localize": "^15.0.0",
    "@types/jasmine": "~4.3.0",
    "jasmine-core": "~4.5.0",
    "karma": "~6.4.0",
@@ -39,4 +37,4 @@
    "karma-jasmine-html-reporter": "~2.0.0",
    "typescript": "~4.8.2"
  }
-}
+}
--- a/front/app/src/app/app.module.ts
+++ b/front/app/src/app/app.module.ts
@@ -3,18 +3,19 @@ import { BrowserModule } from '@angular/platform-browser';

 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { AuthComponent } from './auth/auth.component';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

@NgModule({
  declarations: [
    AppComponent,
    AuthComponent
+
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
-    NgbModule
+    BrowserAnimationsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
--- a/front/app/src/index.html
+++ b/front/app/src/index.html
@@ -6,8 +6,11 @@
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
+  <link rel="preconnect" href="https://fonts.gstatic.com">
+  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap" rel="stylesheet">
+  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 </head>
-<body>
+<body class="mat-typography">
  <app-root></app-root>
 </body>
 </html>
--- a/front/app/src/styles.css
+++ b/front/app/src/styles.css
@@ -1 +1,4 @@
 /* You can add global styles to this file, and also import other style files */
+
+html, body { height: 100%; }
+body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
--- a/front/app/tsconfig.app.json
+++ b/front/app/tsconfig.app.json
@@ -3,9 +3,7 @@
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/app",
-    "types": [
-      "@angular/localize"
-    ]
+    "types": []
  },
  "files": [
    "src/main.ts"
--- a/front/app/tsconfig.json
+++ b/front/app/tsconfig.json
@@ -19,9 +19,6 @@
    "target": "ES2022",
    "module": "ES2022",
    "useDefineForClassFields": false,
-    "types": [
-      "@angular/localize"
-    ],
    "lib": [
      "ES2022",
      "dom"
--- a/front/app/tsconfig.spec.json
+++ b/front/app/tsconfig.spec.json
@@ -4,8 +4,7 @@
  "compilerOptions": {
    "outDir": "./out-tsc/spec",
    "types": [
-      "jasmine",
-      "@angular/localize"
+      "jasmine"
    ]
  },
  "include": [