Skip to content
This repository has been archived by the owner on Feb 27, 2020. It is now read-only.

Homepage/Bedpage cleanup #45

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Homepage/Bedpage cleanup #45

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
04a21da
Add searchbar clear button
Hoff0899 Apr 14, 2017
e94f952
Merge branches 'garden-navbar' and 'master' of https://github.com/UMM…
Hoff0899 Apr 14, 2017
a48e5e9
Remove 'x' icon on not-found search
Hoff0899 Apr 14, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions client/src/app/homepage/homepage.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,7 @@
<th class="bed-col text-center flower-header list-group-item-success">Bed</th>
</tr>
<tr *ngIf="(currentList | filterBy: {commonName: nav.currentCN}).length === 0">
<th class="flower-col flower-header text-center list-group-item-success">No flowers found for<br> "{{nav.currentCN}}"</th>
<th class="flower-col flower-header text-center list-group-item-success"><span class="x-icon"><i class="fa fa-window-close" aria-hidden="true"></i></span></th>
<th class="col-xs-12 flower-header text-center list-group-item-success">No flowers found for<br> "{{nav.currentCN}}"</th>
</tr>
<tr *ngFor="let each of currentList | filterBy: {commonName: nav.currentCN}">
<td class="flower-col" (click)="this.goToPlant(['/plants', each.id])">
Expand Down
41 changes: 40 additions & 1 deletion client/src/app/navbar/garden-navbar.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,11 @@
</div>
<div class="row search-tab">
<div class="searchField col-xs-8">
<input type="text" placeholder="Find a flower" class="form-control search-field"
<form>
<input type="text" placeholder="Find a flower" name="searchbar" required class="form-control search-field search-box"
[(ngModel)]="currentCN">
<button class="close-icon" type="reset"></button>
</form>
</div>
<div class="col-xs-4 bed-tab">
<select class="form-control bed-field" (change)="this.router.navigate(['/bed', this.bed])" [(ngModel)]="bed">
Expand Down Expand Up @@ -51,4 +54,40 @@
border-radius: 20px;
}

.close-icon {
border:1px solid transparent;
background-color: transparent;
display: inline-block;
vertical-align: middle;
outline: 0;
cursor: pointer;
}
.close-icon:after {
content: "x";
display: block;
width: 22px;
height: 22px;
position: absolute;
background-color: maroon;
z-index:1;
right: 35px;
top: 0;
bottom: 0;
margin: auto;
/*padding: 2px;*/
border-radius: 50%;
text-align: center;
color: gold;
font-weight: bold;
font-size: 16px;
box-shadow: 0 0 2px gold;
cursor: pointer;
}
.search-box:not(:valid) ~ .close-icon {
display: none;
}

form {
margin-bottom: 0px;
}
</style>
7 changes: 5 additions & 2 deletions client/src/app/plants/bed.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,7 @@
<strong>Flowers</strong>
</li>
<li class="text-center list-group-item flower-header list-group-item-success row" *ngIf="(plants | filterBy: {commonName: nav.currentCN}).length === 0">
<strong class="col-xs-9">No flowers found for <br>"{{nav.currentCN}}"</strong>
<span class="x-icon"><i class="fa fa-window-close" aria-hidden="true"></i></span>
<strong class="col-xs-12">No flowers found for <br>"{{nav.currentCN}}"</strong>
</li>
<li *ngFor="let plant of plants | filterBy: {commonName: nav.currentCN}" class="list-group-item text-center">
<!--Button is a hyperlink to a plant page "/plants/:plantID"-->
Expand All @@ -27,4 +26,8 @@
a:active {
background-color: #ffe87c;
}

.center-not-found {
font-size: 18px;
}
</style>