Revize 10cf0fff
Přidáno uživatelem castic96 před téměř 5 roky(ů)
fe/fulltextsearch/src/app/components/pages/home/home.component.css | ||
---|---|---|
1 |
div {
|
|
1 |
.background {
|
|
2 | 2 |
background: url("../../../../assets/img/index_background.jpg") no-repeat center center fixed; |
3 | 3 |
-webkit-background-size: cover; |
4 | 4 |
-moz-background-size: cover; |
... | ... | |
10 | 10 |
top: 0; |
11 | 11 |
left: 0; |
12 | 12 |
} |
13 |
|
|
14 |
.container { |
|
15 |
height: 100%; |
|
16 |
} |
|
17 |
|
|
18 |
.row { |
|
19 |
height: 100%; |
|
20 |
} |
fe/fulltextsearch/src/app/components/pages/home/home.component.html | ||
---|---|---|
1 |
<div> |
|
2 |
<app-search-box></app-search-box> |
|
1 |
<div class="background"> |
|
2 |
<div class="container"> |
|
3 |
<div class="row justify-content-center align-items-center"> |
|
4 |
<app-search-box class="col-sm-10 col-md-8 col-lg-6"></app-search-box> |
|
5 |
</div> |
|
6 |
</div> |
|
3 | 7 |
</div> |
4 |
|
|
5 |
|
fe/fulltextsearch/src/app/components/shared-components/search-box/search-box.component.css | ||
---|---|---|
16 | 16 |
background-color: var(--search-background-color); |
17 | 17 |
color: grey; |
18 | 18 |
border-style: none; |
19 |
border-radius: 0; |
|
19 | 20 |
} |
20 | 21 |
|
21 | 22 |
.form-control { |
22 | 23 |
height: 35pt; |
23 | 24 |
border-style: none; |
24 | 25 |
} |
26 |
|
|
27 |
input:focus { |
|
28 |
box-shadow: none; |
|
29 |
} |
fe/fulltextsearch/src/app/components/shared-components/search-box/search-box.component.html | ||
---|---|---|
1 |
<div class="container"> |
|
2 |
|
|
3 |
<div class="row justify-content-center align-items-center" style="height: 500px"> |
|
4 |
|
|
5 |
<div class="col-sm-10 col-md-8 col-lg-6"> |
|
6 |
<div class="input-group mb-3"> |
|
7 |
<div class="input-group-prepend"> |
|
1 |
<div> |
|
2 |
<div class="input-group mb-3"> |
|
3 |
<div class="input-group-prepend"> |
|
4 |
<span class="input-group-text"> |
|
5 |
<mat-icon>search</mat-icon> |
|
6 |
</span> |
|
7 |
</div> |
|
8 |
<input type="text" class="form-control" [(ngModel)]="expression" placeholder="Enter text to search..." aria-label="Search" aria-describedby="basic-addon2"> |
|
9 |
<div class="input-group-append"> |
|
8 | 10 |
<span class="input-group-text"> |
9 |
<mat-icon>search</mat-icon>
|
|
11 |
<mat-icon *ngIf="expression" matSuffix aria-label="Clear" (click)="expression=''">clear</mat-icon>
|
|
10 | 12 |
</span> |
11 |
</div> |
|
12 |
<input type="text" class="form-control" [(ngModel)]="expression" placeholder="Enter text to search..." aria-label="Search" aria-describedby="basic-addon2"> |
|
13 |
<div class="input-group-append"> |
|
14 |
<button class="btn btn-outline-secondary" type="button" (click)="onSubmit()">Search</button> |
|
15 |
</div> |
|
16 |
</div> |
|
13 |
<button class="btn btn-outline-secondary" type="button" (click)="onSubmit()">Search</button> |
|
17 | 14 |
</div> |
18 |
|
|
19 | 15 |
</div> |
20 |
|
|
21 | 16 |
</div> |
fe/fulltextsearch/src/app/components/shared-components/search-box/search-box.component.ts | ||
---|---|---|
9 | 9 |
styleUrls: ['./search-box.component.css'] |
10 | 10 |
}) |
11 | 11 |
export class SearchBoxComponent implements OnInit { |
12 |
expression: string |
|
12 |
expression: string; |
|
13 |
|
|
13 | 14 |
|
14 | 15 |
constructor(private queryService: QueryService, private router: Router) { } |
15 | 16 |
|
... | ... | |
23 | 24 |
/* |
24 | 25 |
this.queryService.searchPost(searchRequest).subscribe (() => { |
25 | 26 |
//TODO: ulozit objekt SearchResponse[] |
27 |
|
|
26 | 28 |
this.router.navigate(['/search']); |
27 | 29 |
}); |
28 | 30 |
*/ |
29 | 31 |
} |
30 |
|
|
31 | 32 |
} |
Také k dispozici: Unified diff
#7724: Implementace architektury FE
- vylepšení stylů