diff --git a/public/_includes/_code-box.jade b/public/_includes/_code-box.jade new file mode 100644 index 0000000000..e69de29bb2 diff --git a/public/_includes/_head-include.jade b/public/_includes/_head-include.jade index 81c2036de8..d2a7fae96c 100644 --- a/public/_includes/_head-include.jade +++ b/public/_includes/_head-include.jade @@ -34,7 +34,7 @@ meta(itemprop="description" content="#{description}") meta(itemprop="image" content="https://angular.io/resources/images/logos/standard/shield-large.png") link(rel="icon" type="image/x-icon" href="/resources/images/icons/favicon.ico") -link(rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.7.1/angular-material.min.css") +link(rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.css") link(href='https://fonts.googleapis.com/css?family=Roboto:400,300,500,400italic,700' rel='stylesheet' type='text/css') link(rel="stylesheet" href="/resources/css/vendor/icomoon/style.css") link(rel="stylesheet" href="/resources/css/main.css") diff --git a/public/_includes/_scripts-include.jade b/public/_includes/_scripts-include.jade index 9fa737e688..e1c70b6270 100644 --- a/public/_includes/_scripts-include.jade +++ b/public/_includes/_scripts-include.jade @@ -9,7 +9,7 @@ script(src="/resources/js/vendor/jquery.js") script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js") script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-animate.js") script(src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-aria.js") -script(src="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.2/angular-material.min.js") +script(src="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.js") diff --git a/public/docs/js/latest/api.jade b/public/docs/js/latest/api.jade new file mode 100644 index 0000000000..c293164238 --- /dev/null +++ b/public/docs/js/latest/api.jade @@ -0,0 +1,18 @@ +.l-main-section + + .callout.is-helpful + header Developer Preview + p. + The Angular 2.0 API is currently in active development and not production ready. + This page will showcase a preview of proposed methods to help further the discussion + in the development community. If you're building a production app today, please + use Angular 1.X. + +number = 1; +ul + for page, slug in public.docs[current.path[1]][current.path[2]].api._data + url = "/docs/" + current.path[1] + "/" + current.path[2] + "/" + current.path[3] + "/" + slug + ".html" + num = number++ + + li.c8 + != partial("../../../_includes/_hover-card", { number: num, name: page.title, url: url }) diff --git a/public/docs/js/latest/guide/setup.jade b/public/docs/js/latest/guide/setup.jade index d5ab7577df..2aef31ff98 100644 --- a/public/docs/js/latest/guide/setup.jade +++ b/public/docs/js/latest/guide/setup.jade @@ -90,39 +90,44 @@ <my-app> element in index.html, and call Angular's bootstrap() to kick it all off like this: - pre.prettyprint.lang-javascript - code. - //ES5 - function AppComponent() {} + .code-box + nav.code-box-nav + a(href="#") - AppComponent.annotations = [ - new angular.Component({ - selector: 'my-app' - }), - new angular.View({ - template: '<h1>My first Angular 2 App</h1>' - }) - ]; + pre.prettyprint.lang-javascript + code. + //ES5 + function AppComponent() {} - document.addEventListener('DOMContentLoaded', function() { - angular.bootstrap(AppComponent); - }); + AppComponent.annotations = [ + new angular.Component({ + selector: 'my-app' + }), + new angular.View({ + template: '<h1>My first Angular 2 App</h1>' + }) + ]; - pre.prettyprint.lang-typescript - code. - //TypeScript - import {Component, View, bootstrap} from 'angular2/angular2'; + document.addEventListener('DOMContentLoaded', function() { + angular.bootstrap(AppComponent); + }); - @Component({ - selector: 'my-app' - }) - @View({ - template: '<h1>My first Angular 2 App</h1>' - }) - class AppComponent { - } + pre.prettyprint.lang-typescript + code. + //TypeScript + import {Component, View, bootstrap} from 'angular2/angular2'; + + @Component({ + selector: 'my-app' + }) + @View({ + template: '<h1>My first Angular 2 App</h1>' + }) + class AppComponent { + } + + bootstrap(AppComponent); - bootstrap(AppComponent); .l-main-section h2#section-run-it Run it! diff --git a/public/resources/css/base/_type.scss b/public/resources/css/base/_type.scss index a001bb63b7..22ee72f9d2 100644 --- a/public/resources/css/base/_type.scss +++ b/public/resources/css/base/_type.scss @@ -19,7 +19,8 @@ code { border-radius: 2px; font-family: $mono-font; color: $metal; - padding: 0px 2px; + padding: 0px 4px; + font-size: 90%; } .text-center { diff --git a/public/resources/css/main.scss b/public/resources/css/main.scss index 197c9852df..4facb1d628 100644 --- a/public/resources/css/main.scss +++ b/public/resources/css/main.scss @@ -27,6 +27,7 @@ @import 'module/buttons'; @import 'module/table'; @import 'module/code'; +@import 'module/code-box'; @import 'module/sticker'; @import 'module/bio-card'; @import 'module/overlay'; diff --git a/public/resources/css/module/_code-box.scss b/public/resources/css/module/_code-box.scss new file mode 100644 index 0000000000..ce41a4d3d8 --- /dev/null +++ b/public/resources/css/module/_code-box.scss @@ -0,0 +1,11 @@ +.code-box { + header { + + } + + nav { + a { + + } + } +} \ No newline at end of file diff --git a/public/resources/css/module/_dropdown.scss b/public/resources/css/module/_dropdown.scss index 17dff8bc3f..933fc58274 100644 --- a/public/resources/css/module/_dropdown.scss +++ b/public/resources/css/module/_dropdown.scss @@ -56,6 +56,7 @@ text-align: left; font-weight: 400; text-transform: uppercase; + color: $metal; } } } \ No newline at end of file diff --git a/public/resources/css/module/_side-nav.scss b/public/resources/css/module/_side-nav.scss index 0cd07d8baa..ac5e9fb38c 100644 --- a/public/resources/css/module/_side-nav.scss +++ b/public/resources/css/module/_side-nav.scss @@ -114,6 +114,7 @@ position: relative; text-decoration: none; display: block; + text-transform: uppercase; } .side-nav-icon { diff --git a/public/resources/js/site.js b/public/resources/js/site.js index 1f3d39988b..5b72936881 100644 --- a/public/resources/js/site.js +++ b/public/resources/js/site.js @@ -85,6 +85,17 @@ angularIO.controller('AppCtrl', ['$scope', '$mdDialog', function($scope, $mdDial } }; + /* + * Code Formatting + * + */ + + $scope.language = 'es5'; + + // TOGGLE CODE LANGUAGE + $scope.toggleCodeLanguage = function(event) { + $scope.showMenu = !$scope.showMenu; + }; var $codeBoxes = $('pre'); if($codeBoxes.length) {