honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(aio): search result stying, add footer

This commit is contained in:
Stefanie Fluin 2017-03-22 20:22:06 -07:00 committed by Pete Bacon Darwin
parent c837b3dfb9
commit 159c98c202
4 changed files with 51 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
aio/src/app/app.component.html
View File

@ -8,7 +8,6 @@
<md-sidenav-container class="sidenav-container"> <md-sidenav-container class="sidenav-container">
<md-sidenav #sidenav class="sidenav" [opened]="isSideBySide" [mode] = "isSideBySide ? 'side' : 'over'"> <md-sidenav #sidenav class="sidenav" [opened]="isSideBySide" [mode] = "isSideBySide ? 'side' : 'over'">
<div class="version-info vertical-menu-item">{{ (versionInfo | async)?.full }}</div>
<aio-top-menu *ngIf="!isSideBySide" class="small" [nodes]="(navigationViews | async)?.TopBar" [homeImageUrl]="homeImageUrl"></aio-top-menu> <aio-top-menu *ngIf="!isSideBySide" class="small" [nodes]="(navigationViews | async)?.TopBar" [homeImageUrl]="homeImageUrl"></aio-top-menu>
<aio-nav-menu [nodes]="(navigationViews | async)?.SideNav" [selectedNodes]="selectedNodes | async"></aio-nav-menu> <aio-nav-menu [nodes]="(navigationViews | async)?.SideNav" [selectedNodes]="selectedNodes | async"></aio-nav-menu>
</md-sidenav> </md-sidenav>
@ -16,5 +15,14 @@
<section class="sidenav-content"> <section class="sidenav-content">
<aio-search-results #searchResults></aio-search-results> <aio-search-results #searchResults></aio-search-results>
<aio-doc-viewer [doc]="currentDocument | async" (docRendered)="onDocRendered($event)"></aio-doc-viewer> <aio-doc-viewer [doc]="currentDocument | async" (docRendered)="onDocRendered($event)"></aio-doc-viewer>
<footer>
<div class="footer">
<p>Powered by Google ©2010-2017. Code licensed under an <a href="/license">MIT-style License</a>.</p>
<p>Documentation licensed under <a href="http://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.
</p>
<p class="version-info">Version Info | {{ (versionInfo | async)?.full }}</p>
</div>
</footer>
</section> </section>
</md-sidenav-container> </md-sidenav-container>

17
aio/src/styles/1-layouts/_footer.scss Normal file
View File

@ -0,0 +1,17 @@
footer .footer {
background-color: $blue;
color: $offwhite;
text-align: center;
font-weight: 300;
a {
color: $offwhite;
text-decoration: none;
&:hover {
color: $darkgray;
font-weight: 500;
}
&:visited {
text-decoration: none;
}
}
}

3
aio/src/styles/1-layouts/_layouts-dir.scss
View File

@ -5,4 +5,5 @@
@import 'sidenav'; @import 'sidenav';
@import 'content-layout'; @import 'content-layout';
@import 'search-results'; @import 'search-results';
@import 'top-menu'; @import 'top-menu';
@import 'footer';

30
aio/src/styles/1-layouts/_search-results.scss
View File

@ -1,15 +1,31 @@
.search-results { .search-results {
background-color: $lightgray;
padding: 20px; padding: 20px;
color: $offwhite;
width: 100%;
height: auto;
position: fixed;
display: flex;
top: 0;
left: 0;
right: 0;
background-color: $darkgray;
} }
.search-result-item { .search-area {
color: $darkgray; h2 {
text-decoration: none; font-size: 16px;
&:hover { margin: 10px 0px 5px;
color: $blue
} }
&:visited { a {
font-size: 14px;
color: $lightgray;
text-decoration: none; text-decoration: none;
&:hover {
color: $blue;
font-weight: 500;
}
&:visited {
text-decoration: none;
}
} }
} }