Fix about the width on mobile view
of the grid
This commit is contained in:
@@ -7,3 +7,13 @@ table {
|
|||||||
height: 600px;
|
height: 600px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mat-row td {
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spanWithBreakWord {
|
||||||
|
display: inline-block;
|
||||||
|
min-width: 200px;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|||||||
@@ -20,7 +20,10 @@
|
|||||||
|
|
||||||
<ng-container matColumnDef="name">
|
<ng-container matColumnDef="name">
|
||||||
<th mat-header-cell *matHeaderCellDef>Name</th>
|
<th mat-header-cell *matHeaderCellDef>Name</th>
|
||||||
<td mat-cell *matCellDef="let element">{{element.name}} <a href='http://{{element.website}}'>ici</a></td>
|
<td mat-cell *matCellDef="let element">
|
||||||
|
<span class="spanWithBreakWord" [innerHTML]="element.name"></span>
|
||||||
|
<a href='http://{{element.website}}'>ici</a>
|
||||||
|
</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
<ng-container matColumnDef="latitude">
|
<ng-container matColumnDef="latitude">
|
||||||
@@ -34,7 +37,9 @@
|
|||||||
|
|
||||||
<ng-container matColumnDef="address">
|
<ng-container matColumnDef="address">
|
||||||
<th mat-header-cell *matHeaderCellDef>Address</th>
|
<th mat-header-cell *matHeaderCellDef>Address</th>
|
||||||
<td mat-cell *matCellDef="let element"><span [innerHTML]="element.address"></span></td>
|
<td mat-cell *matCellDef="let element">
|
||||||
|
<span class="spanWithBreakWord" [innerHTML]="element.address"></span>
|
||||||
|
</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container matColumnDef="email">
|
<ng-container matColumnDef="email">
|
||||||
<th mat-header-cell *matHeaderCellDef>E-mail</th>
|
<th mat-header-cell *matHeaderCellDef>E-mail</th>
|
||||||
|
|||||||
@@ -1,16 +1,20 @@
|
|||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>SkydivelogsApp</title>
|
<title>SkydivelogsApp</title>
|
||||||
<base href="/">
|
<base href="/">
|
||||||
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<!-- <meta name="viewport" content="width=device-width, initial-scale=1"> -->
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||||
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
||||||
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
|
<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">
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<app-root></app-root>
|
<app-root></app-root>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user