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

feat(aio): search results and code margins styling

This commit is contained in:
Stefanie Fluin 2017-03-23 11:58:59 -07:00 committed by Pete Bacon Darwin
parent 45983301d5
commit 4918cd241f
3 changed files with 21 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -17,6 +17,8 @@
</section> </section>
</md-sidenav-container> </md-sidenav-container>
<aio-search-results #searchResults></aio-search-results>
<footer> <footer>
<div class="footer"> <div class="footer">
<p>Powered by Google ©2010-2017. Code licensed under an <a href="/license">MIT-style License</a>.</p> <p>Powered by Google ©2010-2017. Code licensed under an <a href="/license">MIT-style License</a>.</p>
@ -25,5 +27,3 @@
<p class="version-info">Version Info | {{ (versionInfo | async)?.full }}</p> <p class="version-info">Version Info | {{ (versionInfo | async)?.full }}</p>
</div> </div>
</footer> </footer>
<aio-search-results #searchResults></aio-search-results>

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

@ -1,12 +1,16 @@
aio-search-results { aio-search-results {
z-index: 10; z-index: 10;
padding: 20px;
} }
.search-results { .search-results {
display: flex;
flex-direction: row;
overflow: scroll;
padding: 80px 20px 20px; padding: 80px 20px 20px;
color: $offwhite; color: $offwhite;
width: 100%; width: 100%;
height: auto; max-height: 40%;
position: fixed; position: fixed;
display: flex; display: flex;
top: 0; top: 0;
@ -16,6 +20,9 @@ aio-search-results {
} }
.search-area { .search-area {
display: flex;
flex-direction: column;
margin: 0px 10px;
h2 { h2 {
font-size: 16px; font-size: 16px;
margin: 10px 0px 5px; margin: 10px 0px 5px;
@ -24,6 +31,7 @@ aio-search-results {
font-size: 14px; font-size: 14px;
color: $lightgray; color: $lightgray;
text-decoration: none; text-decoration: none;
font-weight: 300;
&:hover { &:hover {
color: $blue; color: $blue;
font-weight: 500; font-weight: 500;

12
aio/src/styles/2-modules/_code.scss
View File

@ -3,13 +3,21 @@
color: $darkgray; color: $darkgray;
} }
.code-shell code { code-example[language=bash] code {
width: 100%;
}
.prettyprint {
margin: 24px auto;
display: flex;
}
.prettyprint.lang-bash code {
@include codeblock($darkgray); @include codeblock($darkgray);
color: $codegreen; color: $codegreen;
} }
.code-example pre, code-example pre { .code-example pre, code-example pre {
margin: 0px;
padding: 0px; padding: 0px;
white-space: pre-wrap; white-space: pre-wrap;
} }