fix(aio): style mods and content udpates (#16138)

Fixed capitalization in sidenav menu items
Add min height property to sidenav-content for better viewing on short pages or high resolution screens
Add dividier between change log items as before to h2
Table adjustments to reduce off-screen items
Update home page banner text and icon change, and fix banner img and mobile alignment
Fix and add links in doc landing page and change card footer text to reflect correct name
Removed docs landing page to rebase with master

PR Close #16138
This commit is contained in:
Stefanie Fluin 2017-04-18 16:29:55 -07:00 committed by Miško Hevery
parent f99cb96533
commit e9db74f937
13 changed files with 58 additions and 38 deletions

View File

@ -44,7 +44,7 @@ Angular supports most recent browsers. This includes the following specific vers
</th>
<th>
IE mobile
IE Mobile
</th>
</tr>
@ -251,11 +251,11 @@ These are the polyfills required to run an Angular application on each supported
<tr style="vertical-align: top">
<th>
Browsers (desktop & mobile)
Browsers (Desktop & Mobile)
</th>
<th>
Polyfills required
Polyfills Required
</th>
</tr>
@ -327,7 +327,7 @@ Here are the features which may require additional polyfills:
</th>
<th style="width: 50%">
Browsers (desktop & mobile)
Browsers (Desktop & Mobile)
</th>
</tr>

View File

@ -2,6 +2,7 @@
Cheat Sheet
@description
<div class="l-content-small grid-fluid docs-content cheatsheet">
<table>

View File

@ -1,3 +1,6 @@
@title
CLI QuickStart
@description

View File

@ -1,3 +1,6 @@
@title
Angular Glossary
@description

View File

@ -1,3 +1,6 @@
@title
QuickStart
@description

View File

@ -1,5 +1,5 @@
@title
Webpack: an introduction
Webpack: An Introduction
@intro
Create Angular applications with a Webpack based tooling.

View File

@ -1 +1,2 @@
<h1>API List</h1>
<aio-api-list></aio-api-list>

View File

@ -5,11 +5,11 @@
href="guide/quickstart" md-button="md-button"
class="hero-cta mat-raised button button-large button-plain">Get Started</a>
<announcement-bar class="announcement-bar">
<div class="announcement-bar-slide cleafix is-visible"><img
src="assets/images/logos/anglebrackets/devintersection.png" width="64"/>
<p>Join us for <strong>DEVintersection Amsterdam</strong> Nov 14-16!</p><a
href="https://www.devintersectioneurope.com/#!/" target="_blank" class="button mat-button">Register
now</a></div>
<div class="announcement-bar-slide cleafix is-visible">
<img src="assets/images/logos/angular/angular-banner-logo-grey.png" width="64"/>
<p>Angular v4.0 is out! Smaller, faster, no biggie...</p>
<a href="http://angularjs.blogspot.com/2017/03/angular-400-now-available.html" target="_blank" class="button mat-button">Learn More</a>
</div>
</announcement-bar>
</div>
</header>

View File

@ -28,7 +28,7 @@
},
{
"title": "Getting started",
"title": "Getting Started",
"tooltip": "A gentle introduction to Angular.",
"children": [
{
@ -63,13 +63,13 @@
{
"url": "guide/appmodule",
"title": "The root AppModule",
"title": "The Root AppModule",
"tooltip": "Tell Angular how to construct and bootstrap the app in the root \"AppModule\"."
},
{
"url": "guide/displaying-data",
"title": "Displaying data",
"title": "Displaying Data",
"tooltip": "Property binding helps show app data in the UI."
},
@ -103,17 +103,17 @@
},
{
"url": "tutorial/toh-pt1",
"title": "The hero editor",
"title": "The Hero Editor",
"tooltip": "Build a simple hero editor"
},
{
"url": "tutorial/toh-pt2",
"title": "Master/detail",
"title": "Master/Detail",
"tooltip": "Build a master/detail page with a list of heroes."
},
{
"url": "tutorial/toh-pt3",
"title": "Multiple components",
"title": "Multiple Components",
"tooltip": "Refactor the master/detail view into separate components."
},
{
@ -151,14 +151,14 @@
{
"url": "guide/ngmodule-faq",
"title": "Angular module FAQs",
"title": "Angular Module FAQs",
"tooltip": "Answers to frequently asked questions about @NgModule."
}
]},
{
"url": "guide/component-communication",
"title": "Component interaction",
"title": "Component Interaction",
"tooltip": "Share information between different directives and components."
},
@ -168,20 +168,20 @@
"children": [
{
"url": "guide/cb-dependency-injection",
"title": "Dependency injection",
"title": "Dependency Injection",
"tooltip": "Techniques for Dependency Injection."
},
{
"url": "guide/hierarchical-dependency-injection",
"title": "Hierarchical injectors",
"title": "Hierarchical Injectors",
"tooltip": "Angular's hierarchical dependency injection system supports nested injectors in parallel with the component tree."
}
]},
{
"url": "guide/dynamic-component-loader",
"title": "Dynamic components",
"title": "Dynamic Components",
"tooltip": "Load components dynamically."
},
@ -191,12 +191,12 @@
"children": [
{
"url": "guide/attribute-directives",
"title": "Attribute directives",
"title": "Attribute Directives",
"tooltip": "Attribute directives attach behavior to elements."
},
{
"url": "guide/structural-directives",
"title": "Structural directives",
"title": "Structural Directives",
"tooltip": "Structural directives manipulate the layout of the page."
}
]
@ -214,26 +214,26 @@
{
"url": "guide/form-validation",
"title": "Form validation",
"title": "Form Validation",
"tooltip": "Validate user's form entries."
},
{
"url": "guide/reactive-forms",
"title": "Reactive forms",
"title": "Reactive Forms",
"tooltip": "Create a reactive form using FormBuilder, groups, and arrays."
}
]},
{
"url": "guide/server-communication",
"title": "HTTP client",
"title": "HTTP Client",
"tooltip": "Use an HTTP Client to talk to a remote server."
},
{
"url": "guide/lifecycle-hooks",
"title": "Lifecycle hooks",
"title": "Lifecycle Hooks",
"tooltip": "Angular calls lifecycle hook methods on directives and components as it creates, changes, and destroys them."
},
@ -245,7 +245,7 @@
{
"url": "guide/router",
"title": "Routing & navigation",
"title": "Routing & Navigation",
"tooltip": "Discover the basics of screen navigation with the Angular Router."
},
@ -269,7 +269,7 @@
"children": [
{
"url": "guide/aot-compiler",
"title": "Ahead-of-Time compilation",
"title": "Ahead-of-Time Compilation",
"tooltip": "Learn why and how to use the Ahead-of-Time (AOT) compiler."
},
@ -287,7 +287,7 @@
{
"url": "guide/component-styles",
"title": "Component styles",
"title": "Component Styles",
"tooltip": "Learn how to apply CSS styles to components."
},
@ -321,19 +321,19 @@
{
"url": "guide/browser-support",
"title": "Browser support",
"title": "Browser Support",
"tooltip": "Browser support and polyfills guide."
},
{
"url": "guide/npm-packages",
"title": "Npm packages",
"title": "Npm Packages",
"tooltip": "Recommended npm packages, and how to specify package dependencies."
},
{
"url": "guide/typescript-configuration",
"title": "TypeScript configuration",
"title": "TypeScript Configuration",
"tooltip": "TypeScript configuration for Angular developers."
}
]},
@ -364,7 +364,7 @@
{
"url": "guide/webpack",
"title": "Webpack: an introduction",
"title": "Webpack: An Introduction",
"tooltip": "Create Angular applications with a Webpack based tooling."
}
]
@ -393,7 +393,7 @@
{
"url": "guide/style-guide",
"title": "Style guide",
"title": "Style Guide",
"tooltip": "Write Angular with style."
}
]

View File

@ -99,7 +99,6 @@
border-radius: 2px;
border-spacing: 0;
margin: 0 0 32px 0;
width: 100%;
}
table tbody th {

View File

@ -1,6 +1,7 @@
.sidenav-content {
padding: 1rem 3rem 3rem;
margin: auto;
min-height: 100vh;
}
.fill-remaining-space {
@ -24,3 +25,11 @@
.sidenav-content button {
min-width: 50px;
}
#guide-change-log h2::before {
content: "";
display: block;
height: 1px;
margin: 24px 0px;
background: $lightgray;
}

View File

@ -88,7 +88,7 @@ $announcement-bar-width: 784px;
img {
height: 40px;
margin: 8px auto;
margin: 0 0 8px;
}
p {
@ -146,6 +146,7 @@ $announcement-bar-width: 784px;
@media (max-width: 480px) {
padding: 16px;
align-items: center;
}
}
}

View File

@ -34,7 +34,7 @@ table {
th,
td {
border-bottom: 1px solid $lightgray;
padding: 16px 32px;
padding: 16px;
text-align: left;
line-height: 24px;
vertical-align: top;