From afeca1b9dbc9a255c1f807ade05f90bea55db1f6 Mon Sep 17 00:00:00 2001
From: Zoe Canoen <zoe.canoen.etu@univ-lille.fr>
Date: Sat, 5 Oct 2019 20:50:12 +0200
Subject: [PATCH] affichage
---
angular.json | 5 +++-
package-lock.json | 30 +++++++++++++++++++
package.json | 3 ++
src/app/app.component.html | 11 +++----
src/app/app.component.ts | 3 +-
src/app/app.module.ts | 7 +++--
.../articles-list/articles-list.component.css | 4 +++
.../articles-list.component.html | 23 ++++++++++++--
src/app/shared/mocks/articles.ts | 6 ----
src/index.html | 6 ++++
src/main.ts | 1 +
src/styles.css | 3 ++
12 files changed, 84 insertions(+), 18 deletions(-)
diff --git a/angular.json b/angular.json
index 344bf13..e14bdca 100644
--- a/angular.json
+++ b/angular.json
@@ -24,6 +24,7 @@
"src/assets"
],
"styles": [
+ "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
"src/styles.css"
],
"scripts": []
@@ -89,6 +90,7 @@
"src/assets"
],
"styles": [
+ "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
"src/styles.css"
],
"scripts": []
@@ -120,6 +122,7 @@
}
}
}
- }},
+ }
+ },
"defaultProject": "ifi"
}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index cc36f83..bfb7f8a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -134,6 +134,23 @@
"tslib": "^1.9.0"
}
},
+ "@angular/cdk": {
+ "version": "8.2.2",
+ "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-8.2.2.tgz",
+ "integrity": "sha512-e+BtFab0Vd1q/ZVu6l850Q4vvgyVYiugSX31oMRlp86fKHPowlAO7jL3z5JcAG7TybpLIqd7oqF8XQBR/yw83w==",
+ "requires": {
+ "parse5": "^5.0.0",
+ "tslib": "^1.7.1"
+ },
+ "dependencies": {
+ "parse5": {
+ "version": "5.1.0",
+ "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.0.tgz",
+ "integrity": "sha512-fxNG2sQjHvlVAYmzBZS9YlDp6PTSSDwa98vkD4QgVDDCAo84z5X1t5XyJQ62ImdLXx5NdIIfihey6xpum9/gRQ==",
+ "optional": true
+ }
+ }
+ },
"@angular/cli": {
"version": "8.3.8",
"resolved": "https://registry.npmjs.org/@angular/cli/-/cli-8.3.8.tgz",
@@ -993,6 +1010,14 @@
"integrity": "sha512-F6ReN0cToHIkCjEM2ECkBxCTsvFjVae8FpIr3Fz8IHZHOOYcS5mx/BWdEO7odI5/tQKl+cCWol7NjvJYV0zolg==",
"dev": true
},
+ "@angular/material": {
+ "version": "8.2.2",
+ "resolved": "https://registry.npmjs.org/@angular/material/-/material-8.2.2.tgz",
+ "integrity": "sha512-mR2ppE+Z1S5As2SUFK8wUH76Fj7YgrefhrwVGaeCLcAen//RHPw043+KL2apPAUaltdIFlGFtUuA6yJN6av0nQ==",
+ "requires": {
+ "tslib": "^1.7.1"
+ }
+ },
"@angular/platform-browser": {
"version": "8.2.9",
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-8.2.9.tgz",
@@ -5276,6 +5301,11 @@
"integrity": "sha512-IItsdsea19BoLC7ELy13q1iJFNmd7ofZH5+X/pJr90/nRoPEX0DJo1dHDbgtYWOhJhcCgMDTOw84RZ72q6lB+Q==",
"dev": true
},
+ "hammerjs": {
+ "version": "2.0.8",
+ "resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz",
+ "integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE="
+ },
"handle-thing": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.0.tgz",
diff --git a/package.json b/package.json
index 2817aaf..dfba503 100644
--- a/package.json
+++ b/package.json
@@ -12,14 +12,17 @@
"private": true,
"dependencies": {
"@angular/animations": "~8.2.9",
+ "@angular/cdk": "~8.2.2",
"@angular/common": "~8.2.9",
"@angular/compiler": "~8.2.9",
"@angular/core": "~8.2.9",
"@angular/forms": "~8.2.9",
"@angular/http": "^2.1.2",
+ "@angular/material": "^8.2.2",
"@angular/platform-browser": "~8.2.9",
"@angular/platform-browser-dynamic": "~8.2.9",
"@angular/router": "~8.2.9",
+ "hammerjs": "^2.0.8",
"rxjs": "~6.4.0",
"rxjs-compat": "^6.5.3",
"tslib": "^1.10.0",
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 520417c..5164b5b 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,7 +1,8 @@
-<app-header></app-header>
-
-<h1>
- Journal
-</h1>
+<div class="container">
+ <app-header></app-header>
+ <h1>
+ Journal
+ </h1>
<app-articles-list></app-articles-list>
+</div>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index b3e2fe0..b43ec36 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,9 +1,10 @@
import { Component } from '@angular/core';
-
+import { MatSliderModule } from '@angular/material/slider';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
+
})
export class AppComponent {
title = 'ifi';
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index f0fa381..6d9b128 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -1,6 +1,7 @@
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
-import { Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent } from 'rxjs';
+import {MatExpansionModule} from '@angular/material/expansion';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
@@ -15,7 +16,9 @@ import { ArticlesListComponent } from './components/articles-list/articles-list.
],
imports: [
BrowserModule,
- AppRoutingModule
+ AppRoutingModule,
+ MatExpansionModule,
+ BrowserAnimationsModule
],
providers: [],
bootstrap: [
diff --git a/src/app/components/articles-list/articles-list.component.css b/src/app/components/articles-list/articles-list.component.css
index e69de29..f227b7d 100644
--- a/src/app/components/articles-list/articles-list.component.css
+++ b/src/app/components/articles-list/articles-list.component.css
@@ -0,0 +1,4 @@
+.article {
+ margin:10px;
+ padding-bottom: 10px;
+}
diff --git a/src/app/components/articles-list/articles-list.component.html b/src/app/components/articles-list/articles-list.component.html
index c59b496..9b11548 100644
--- a/src/app/components/articles-list/articles-list.component.html
+++ b/src/app/components/articles-list/articles-list.component.html
@@ -1,5 +1,22 @@
<!--A supprimer-->
+<div class="row ">
+ <div class="col-12 card article" *ngFor="let article of articles; let i = index">
+ <div class="card-body">
+ {{article.name}}
+ </div>
+ <mat-expansion-panel>
+ <mat-expansion-panel-header>
+ <mat-panel-title>
+ Abstract
+ </mat-panel-title>
+ <mat-panel-description>
+ {{article.year}}
+ </mat-panel-description>
+ </mat-expansion-panel-header>
-<div *ngFor="let article of articles">
- {{article.name}}
- </div>
+ {{article.abstract}}
+
+ </mat-expansion-panel>
+
+ </div>
+</div>
diff --git a/src/app/shared/mocks/articles.ts b/src/app/shared/mocks/articles.ts
index ac3874d..0607111 100644
--- a/src/app/shared/mocks/articles.ts
+++ b/src/app/shared/mocks/articles.ts
@@ -87,11 +87,5 @@ export const articles: Article[] = [
'various negative workplace experiences reported feeling likethey “do not belong”. Exposures to discriminatory ' +
'expletivesor negative critiques from their male colleagues may furtherexacerbate those feelings.',
url: 'https://arxiv.org/pdf/1812.05560.pdf'
- },
- {
- name: 'Semantics-based program verifiers for all languages',
- year: 2016,
- abstract: '',
- url: 'https://dl.acm.org/citation.cfm?doid=2983990.2984027'
}
];
diff --git a/src/index.html b/src/index.html
index 7796287..bf58d96 100644
--- a/src/index.html
+++ b/src/index.html
@@ -6,8 +6,14 @@
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
+ <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
+ <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body>
<app-root></app-root>
+ <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
</body>
</html>
diff --git a/src/main.ts b/src/main.ts
index c7b673c..3b2b7d0 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,3 +1,4 @@
+import 'hammerjs';
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
diff --git a/src/styles.css b/src/styles.css
index 90d4ee0..7e7239a 100644
--- a/src/styles.css
+++ b/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; }
--
GitLab