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

feat(nav reorg): reorganize footer and top nav

This commit is contained in:
Eric Jimenez 2016-04-28 15:31:38 -04:00 committed by Naomi Black
parent ff985c7059
commit d8fcd5ef3d
6 changed files with 35 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
public/_includes/_footer.jade
View File

@ -8,16 +8,18 @@ else
- var styleguide = "/docs/ts/latest/styleguide.html"
.main-footer
nav.background-silver.grid-fluid
nav.background-blue-grey-900.grid-fluid
.c3.main-footer-branding
.logo-inverse-large
.c2
h3.text-headline LIBRARIES
h3.text-headline RESOURCES
ul.text-body
li <a href="/"> Angular 2.0</a>
li <a href="/presskit.html">Press Kit</a>
// TODO: (ericjim) make a libraries page to showcase all angular 2 libraries
//li <a href="/libraries.html">Libraries</a>
li <a href="https://angularjs.org/"> Angular 1 for JS</a>
li <a href="https://material.angularjs.org"> Angular Material</a>
li <a href="https://www.firebase.com/docs/web/libraries/angular/"> AngularFire</a>
@ -26,25 +28,26 @@ else
h3.text-headline LEARN
ul.text-body
li <a href="/docs/ts/latest/quickstart.html"> 5 Min Quickstart</a>
li <a href="/docs/ts/latest/guide/"> Step by Step Guide</a>
li <a href="/docs/ts/latest/api/"> Full API</a>
li <a href="/docs/ts/latest/resources.html"> Resources</a>
li <a href="http://goo.gl/sj0Nk1">Design Docs &amp; Notes</a>
li <a href="/docs/ts/latest/api/">Docs</a>
li <a href="/docs/ts/latest/guide/">Basics</a>
li <a href="/docs/ts/latest/resources.html">Videos and Posts</a>
//li <a href="http://goo.gl/sj0Nk1">Design Docs &amp; Notes</a>
.c2
h3.text-headline HELP
ul.text-body
li <a href="https://groups.google.com/forum/#!forum/angular"> Google Group</a>
li <a href="https://gitter.im/angular/angular"> Chat Room</a>
li <a href="https://github.com/angular/angular/issues"> Report an Issue</a>
li <a class="main-nav-button" href="/contribute.html"> Contribute</a>
li <a href="/support.html">Support Page</a>
li <a href="https://github.com/angular/angular/issues"> File a Ticket</a>
li <a ng-click="appCtrl.openFeedback()" aria-label="Submit feedback on this page"> Product Feedback</a>
.c3
h3.text-headline COMMUNITY
ul.text-body
li <a href="https://blog.angularjs.org/"> Blog</a>
li <a href="/events.html"> Events & Meetups</a>
li <a href="https://groups.google.com/forum/#!forum/angular"> Google Group</a>
li <a href="https://plus.sandbox.google.com/+AngularJS/posts"> Google+</a>
li <a href="https://twitter.com/angularjs"> Twitter</a>
li <a href="https://github.com/angular/angular"> GitHub</a>

3
public/_includes/_hero-home.jade
View File

@ -3,8 +3,7 @@ header(class="background-sky")
h1.text-headline.hero-logo #{title}<br>#{subtitle}
.hero-cta
a(href="/docs/ts/latest/quickstart.html" class="md-raised button button-large button-plain"
md-button) Get Started
a(href="/docs/ts/latest/quickstart.html" class="md-raised button button-large button-plain" md-button) Get Started
.banner.is-centered
.banner-ng-annoucement

8
public/_includes/_main-nav.jade
View File

@ -10,9 +10,7 @@ md-toolbar(class="main-nav background-regal l-pinned-top l-layer-5",scroll-y-off
ul(ng-class="appCtrl.showMainNav ? 'is-visible' : ''")
li.l-left <a class="main-nav-button" href="/features.html" md-button>Features</a>
li.l-left <a class="main-nav-button" href="/docs/#{language}/latest/" md-button>Docs</a>
li.l-left <a class="main-nav-button" href="/about/" md-button>About</a>
li.l-left <a class="main-nav-button" href="/contribute.html" md-button>Contribute</a>
li.l-left <a class="main-nav-button" href="/support.html" md-button>Support</a>
li.l-left <a class="main-nav-button" href="/news.html" md-button>News</a>
li.l-left <a class="main-nav-button" href="/events.html" md-button>Events</a>
li.l-right.feedback-button <md-button ng-click="appCtrl.openFeedback()" class="md-icon-button top-nav-icon" aria-label="Submit feedback on this page"><span class="material-icons">feedback</span></md-button>
li.l-left <a class="main-nav-button" href="/news.html" md-button>Blog</a>
li.l-left <a class="main-nav-button" href="/about/" md-button>About</a>
li.l-right <a class="main-nav-button" href="/docs/ts/latest/quickstart.html" md-button>Get Started</a>

4
public/resources/css/_theme.scss
View File

@ -30,6 +30,10 @@
color: $snow;
}
.background-blue-grey-900 {
background: #263238;
color: $snow;
}
/*
* Background Images

5
public/resources/css/module/_footer.scss
View File

@ -9,6 +9,10 @@
.main-footer {
nav {
h3 {
font-size: 21px;
}
padding: $unit * 6;
@media handheld and (max-width: $phone-breakpoint),
@ -63,7 +67,6 @@
display: block;
text-decoration: none;
padding: 0px ($unit * 2);
background: $steel;
margin-bottom: $unit;
border-radius: 3px;
line-height: $unit * 5;

11
public/resources/css/module/_main-nav.scss
View File

@ -56,7 +56,8 @@
.main-nav-button {
@media handheld and (max-width: $phone-breakpoint),
screen and (max-device-width: $phone-breakpoint),
screen and (max-width: $tablet-breakpoint) {
screen and (max-width: $tablet-breakpoint),
screen and (max-width: 960px) {
display: block;
float: none;
line-height: $unit * 6;
@ -75,9 +76,11 @@
}
}
// Make main nav icons disappear in favor of site map menu
@media handheld and (max-width: $phone-breakpoint),
screen and (max-device-width: $phone-breakpoint),
screen and (max-width: $tablet-breakpoint) {
screen and (max-width: $tablet-breakpoint),
screen and (max-width: 960px) {
box-shadow: 0px 2px 5px rgba(0, 0, 0, .3);
float: none;
position: absolute;
@ -146,9 +149,11 @@
opacity: .56;
}
// Show sitemap menu
@media handheld and (max-width: $phone-breakpoint),
screen and (max-device-width: $phone-breakpoint),
screen and (max-width: $tablet-breakpoint) {
screen and (max-width: $tablet-breakpoint),
screen and (max-width: 960px) {
display: inline-block;
}
}