diff --git a/public/_includes/_cta-bar.jade b/public/_includes/_cta-bar.jade index 58dcf8812b..9431bc1cb3 100644 --- a/public/_includes/_cta-bar.jade +++ b/public/_includes/_cta-bar.jade @@ -1,3 +1,3 @@ .cta-bar a(href="/docs/js/latest/quickstart.html" class="button button-large button-shield md-raised md-primary" md-button) Learn in 5 Min - a(href="download.html" class="button button-large button-secondary" md-button) Download + a(href="download/" class="button button-large button-secondary" md-button) Download diff --git a/public/_includes/_hero-home.jade b/public/_includes/_hero-home.jade index aa9c685ee0..3a0a172c63 100644 --- a/public/_includes/_hero-home.jade +++ b/public/_includes/_hero-home.jade @@ -4,7 +4,7 @@ header(class="background-sky") .hero-cta a(href="/docs/js/latest/quickstart.html" class="md-raised button button-large button-plain" md-button) Learn in 5 mins - a(href="/download.html" class="button button-large button-navy" md-button) Download + a(href="/download/" class="button button-large button-navy" md-button) Download != partial("_social-icons") diff --git a/public/_includes/_main-nav.jade b/public/_includes/_main-nav.jade index a2a83754b3..073980f87f 100644 --- a/public/_includes/_main-nav.jade +++ b/public/_includes/_main-nav.jade @@ -7,4 +7,4 @@ md-toolbar(class="main-nav background-regal l-pinned-top l-layer-5") li Docs li About li Contribute - a(class="cta main-nav-button has-icon" href="/download.html" md-button) Download \ No newline at end of file + a(class="cta main-nav-button has-icon" href="/download/" md-button) Download \ No newline at end of file diff --git a/public/download/_data.json b/public/download/_data.json index ca0ea9d492..eacf067dd4 100644 --- a/public/download/_data.json +++ b/public/download/_data.json @@ -1,13 +1,52 @@ { "index": { - "title": "Angular Docs", - "subtitle": "Choose a language for Angular", + "title": "Setup & Install Angular", + "subtitle": "Choose from our list of Frameworks", "downloads": { - "angular2": { + "Angular_2": { + "description": "Angular 2.0 is currently in alpha preview. Angular 2 is a development platform for building mobile and desktop web applications", + "2.0.0-alpha.11": { + "npm": "https://www.npmjs.com/package/angular2" + } + }, + "AngularDart_2": { + "description": "AngularDart 2.0 is currently in alpha preview. AngularDart 2.0 is a development platform for building mobile and desktop web applications", + "2.0.0-alpha.12": { + "npm": "https://pub.dartlang.org/packages/angular2" + } + }, + + "Angular_1.X": { + "description": "The production ready version of Angular JS", + + "1.X": { + "file": "https://code.angularjs.org/" + } + }, + + "AngularDart_1.X": { + "description": "The production ready version of AngularDart", + + "1.X": { + "file": "https://angulardart.org/" + } + }, + + "AngularFire_1.X": { + "description": "AngularFire is the officially supported AngularJS binding for Firebase.", + "1.X": { + "file": "https://www.firebase.com/docs/web/libraries/angular/index.html" + } + }, + + "AngularMaterial_1.X": { + "description": "The Angular Material project is an implementation of Material Design in Angular.js.", + "1.X": { + "file": "https://material.angularjs.org/#/getting-started" + } } - } } } diff --git a/public/download/index.jade b/public/download/index.jade index e69de29bb2..0c55be8b63 100644 --- a/public/download/index.jade +++ b/public/download/index.jade @@ -0,0 +1,23 @@ +.grid-fluid.l-space-bottom-8 + for versions, framework in downloads + div.c9.card + frameworkName = framework.replace(/\_/gm, ' ') + header + h2.text-headline #{frameworkName} + + + for version, name in versions + if name == "description" + p #{version} + + else + .card-content + h3.text-body Version #{name} + + ul + if version.file + li Download for #{name} + + if version.npm + li NPM installion for #{name} + diff --git a/public/resources/css/main.scss b/public/resources/css/main.scss index 1af1c17dfc..581465495c 100644 --- a/public/resources/css/main.scss +++ b/public/resources/css/main.scss @@ -29,6 +29,7 @@ @import 'module/bio-card'; @import 'module/overlay'; @import 'module/alert'; +@import 'module/card'; /* diff --git a/public/resources/css/module/_card.scss b/public/resources/css/module/_card.scss new file mode 100644 index 0000000000..f1c7efefd9 --- /dev/null +++ b/public/resources/css/module/_card.scss @@ -0,0 +1,54 @@ +.card { + margin-bottom: $unit * 4; + box-shadow: 0 2px 5px 0 rgba(0,0,0,.26); + border-radius: 2px; + + header { + background: $mist; + padding: $unit * 2; + border-radius: 2px 2px 0px 0px; + + h2 { + margin: ($unit * 2) 0px 0px 0px; + } + } + + p { + padding: 0px ($unit * 2); + margin-bottom: 0px; + } + + .card-content { + border-bottom: 1px solid $mist; + padding: $unit * 2; + + &:last-child { + border-bottom: none; + } + + + + h3 { + margin: 0px; + } + + ul { + padding: 0px; + margin: 0px 0px 0px ($unit * 4); + + a { + font-size: 14px; + display: block; + line-height: 24px; + text-decoration: none; + padding: 0px 4px; + + &:hover { + text-decoration: underline; + background: $mist; + } + } + + } + } +} \ No newline at end of file