Skip to content

Commit f8417b4

Browse files
committed
docs app css/js/html rewrite
1 parent 7f1e2e4 commit f8417b4

5 files changed

Lines changed: 133 additions & 38 deletions

File tree

docs/src/templates/doc_widgets.css

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,3 +84,42 @@ div.tabs-content-inner {
8484
-moz-border-radius: 6px;
8585
-webkit-border-radius: 6px;
8686
}
87+
88+
89+
/* Tutorial Nav Bar */
90+
91+
#tutorial-nav {
92+
margin: 0.5em 0 1em 0;
93+
padding: 0;
94+
list-style-type: none;
95+
background: #7989D6;
96+
97+
-moz-border-radius: 15px;
98+
-webkit-border-radius: 15px;
99+
border-radius: 15px;
100+
101+
-moz-box-shadow: 4px 4px 6px #48577D;
102+
-webkit-box-shadow: 4px 4px 6px #48577D;
103+
box-shadow: 4px 4px 6px #48577D;
104+
}
105+
106+
107+
#tutorial-nav li {
108+
display: inline;
109+
}
110+
111+
112+
#tutorial-nav a:link, #tutorial-nav a:visited {
113+
font-size: 1.2em;
114+
color: #FFF;
115+
text-decoration: none;
116+
text-align: center;
117+
display: inline-block;
118+
width: 11em;
119+
padding: 0.2em 0;
120+
}
121+
122+
123+
#tutorial-nav a:hover {
124+
color: #000;
125+
}

docs/src/templates/doc_widgets.js

Lines changed: 41 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@
8686
};
8787

8888
var HTML_TPL =
89-
'<a ng:init="showInstructions = {show}" ng:show="!showInstructions" ng:click="showInstructions = true" href>Show Instructions</a>' +
89+
'<p><a ng:init="showInstructions = {show}" ng:show="!showInstructions" ng:click="showInstructions = true" href>Workspace Reset Instructions</a></p>' +
9090
'<div ng:controller="TutorialInstructionsCtrl" ng:show="showInstructions">' +
9191
'<div class="tabs-nav">' +
9292
'<ul>' +
@@ -111,7 +111,7 @@
111111
'<ol>' +
112112
'<li><p>Reset the workspace to step {step}.</p>' +
113113
'<pre><code> git checkout -f step-{step}</code></pre></li>' +
114-
'<li><p>Refresh your browser or check the app out on <a href="http://angular.github.com/angular-phonecat/step-{step}/app">anglar\'s server</a>.</p></li>' +
114+
'<li><p>Refresh your browser or check the app out on <a href="http://angular.github.com/angular-phonecat/step-{step}/app">angular\'s server</a>.</p></li>' +
115115
'</ol>' +
116116
'</div>' +
117117

@@ -135,7 +135,7 @@
135135
'<ol>' +
136136
'<li><p>Reset the workspace to step {step}.</p>' +
137137
'<pre><code> ./goto_step.bat {step}</code></pre></li>' +
138-
'<li><p>Refresh your browser or check the app out on <a href="http://angular.github.com/angular-phonecat/step-{step}/app">anglar\'s server</a>.</p></li>' +
138+
'<li><p>Refresh your browser or check the app out on <a href="http://angular.github.com/angular-phonecat/step-{step}/app">angular\'s server</a>.</p></li>' +
139139
'</ol>' +
140140
'</div>';
141141

@@ -167,4 +167,42 @@
167167
element.append(tabs);
168168
element.show();
169169
});
170+
171+
172+
angular.directive('doc:tutorial-nav', function(step) {
173+
return function(element) {
174+
var prevStep, codeDiff, nextStep,
175+
content;
176+
177+
step = parseInt(step, 10);
178+
179+
if (step === 0) {
180+
prevStep = '';
181+
nextStep = 'step_01';
182+
codeDiff = 'step-0~7...step-0';
183+
} else if (step === 11){
184+
prevStep = 'step_10';
185+
nextStep = 'the_end';
186+
codeDiff = 'step-10...step-11';
187+
} else {
188+
prevStep = 'step_' + pad(step - 1)
189+
nextStep = 'step_' + pad(step + 1);
190+
codeDiff = 'step-' + step + '...step-' + step;
191+
}
192+
193+
content = angular.element(
194+
'<li><a href="#!tutorial/' + prevStep + '">Previous</a></li>' +
195+
'<li><a href="http://angular.github.com/angular-phonecat/step-' + step + '/app">Live Demo</a></li>' +
196+
'<li><a href="https://github.com/angular/angular-phonecat/compare/' + codeDiff + '">Code Diff</a></li>' +
197+
'<li><a href="#!tutorial/' + nextStep + '">Next</a></li>'
198+
);
199+
200+
element.attr('id', 'tutorial-nav');
201+
element.append(content);
202+
}
203+
204+
function pad(step) {
205+
return (step < 10) ? ('0' + step) : step;
206+
}
207+
});
170208
})();

docs/src/templates/docs.css

Lines changed: 50 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -8,38 +8,37 @@ body {
88
/*----- Layout Generic Styles -----*/
99

1010
body,td,th {
11-
font-family: Arial, Helvetica, sans-serif;
12-
font-size: 14px;
13-
color: #000;
14-
margin: 0px;
11+
font-family: Arial, Helvetica, sans-serif;
12+
font-size: 14px;
13+
color: #000;
14+
margin: 0px;
1515
}
1616

1717
a:link, a:visited, a:hover {
18-
color: #5d6db6;
19-
text-decoration: none;
18+
color: #5d6db6;
19+
text-decoration: none;
2020
}
2121

2222
a:active {
23-
text-decoration: none;
23+
text-decoration: none;
2424
}
2525

2626
p {
27-
font-size: 14px;
28-
padding-right: 10px;
29-
padding-left: 15px;
27+
font-size: 14px;
28+
padding: 0.1em 1em;
29+
line-height: 1.4em;
30+
}
31+
32+
h2 {
33+
margin: 1.5em 0 1em 0;
3034
}
3135

32-
.h1 {
33-
font-size: 24px;
34-
color: #000;
35-
text-align: left;
36-
font-weight: bold;
36+
h3 {
37+
margin: 1.8em 0 1em 0;
3738
}
3839

39-
.h2 {
40-
font-size: 18px;
41-
text-align: left;
42-
text-indent: 10px;
40+
h4 {
41+
margin: 2em 0 1em 0;
4342
}
4443

4544

@@ -53,6 +52,7 @@ p {
5352
padding: 5px 0;
5453
}
5554

55+
5656
#oldIePrompt a,
5757
#oldIePrompt a:visited {
5858
color: yellow;
@@ -89,10 +89,12 @@ p {
8989
border-bottom: 4px solid #808080;
9090
}
9191

92+
9293
#navbar li {
9394
display: inline;
9495
}
9596

97+
9698
#navbar a:link, #navbar a:visited {
9799
font-size: 1.2em;
98100
color: #FFF;
@@ -104,21 +106,26 @@ p {
104106
padding: 0.5em 0;
105107
}
106108

109+
107110
#navbar a:hover {
108111
color: #000;
109112
}
110113

114+
111115
#navbar a.current {
112116
font-weight: bold;
113117
background-color: #333;
118+
114119
border-radius: 10px;
115120
-webkit-border-radius:10px;
116121
-moz-border-radius: 10px;
122+
117123
box-shadow: 4px 4px 6px #48577D;
118124
-webkit-box-shadow: 4px 4px 6px #48577D;
119125
-moz-box-shadow: 4px 4px 6px #48577D;
120126
}
121127

128+
122129
#navbar a.current:hover {
123130
color: #fff;
124131
}
@@ -156,17 +163,17 @@ p {
156163

157164
#content-list {
158165
background: #fff;
159-
padding: 1em 0em 1em 2.5em;
166+
padding: 1em 0.4em 1em 2em;
160167
margin: 0.95em -1em -1em -0.6em;
161168
line-height: 1.5em;
162169
}
163170

164171

165172
#content-list .level-0 {
166-
font-size: 1.8em;
173+
font-size: 1.3em;
167174
list-style: none;
168-
margin-left: -0.8em;
169-
padding-bottom: 0.7em;
175+
margin-left: -1.2em;
176+
padding-bottom: 0.2em;
170177
}
171178

172179
#content-list .level-1 {
@@ -187,6 +194,7 @@ p {
187194

188195

189196
/*----- content styles -----*/
197+
190198
#content-panel {
191199
float: left;
192200
margin-top: 4em;
@@ -209,7 +217,7 @@ p {
209217
font-size: 2em;
210218
font-weight: normal;
211219
color: #fff;
212-
margin: 0;
220+
margin: 0 4em 0 0;
213221
height: 1em;
214222
}
215223

@@ -222,6 +230,16 @@ p {
222230
}
223231

224232

233+
#feedback {
234+
float: right;
235+
margin-top: -2.3em;
236+
margin-right: 0.5em;
237+
width: 8em;
238+
font-size: 0.8em;
239+
color: #fff;
240+
}
241+
242+
225243
#content > h1 {
226244
display: none;
227245
}
@@ -237,17 +255,17 @@ p {
237255
-webkit-box-shadow: 4px 4px 6px #48577D;
238256
box-shadow: 4px 4px 6px #48577D;
239257

240-
241258
-moz-border-radius: 15px;
242259
-webkit-border-radius: 15px;
243260
border-radius: 15px;
244261
}
245262

246-
#feedback {
247-
float: right;
248-
margin-top: -2.3em;
249-
margin-right: 0.5em;
250-
width: 8em;
251-
font-size: 0.8em;
252-
color: #fff;
263+
264+
#content > div > pre {
265+
padding-left: 1.5em;
266+
}
267+
268+
269+
#content .syntaxhighlighter {
270+
margin: 1.5em 0 1.5em 0 !important;;
253271
}

docs/src/templates/docs.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ function DocsController($location, $browser, $window) {
66
this.$location = $location;
77

88
if (!HAS_HASH.test($location.href)) {
9-
$location.hashPath = '!api/angular';
9+
$location.hashPath = '!api/';
1010
}
1111

1212
this.$watch('$location.hashPath', function(hashPath) {
@@ -65,7 +65,7 @@ angular.widget('code', function(element){
6565
});
6666

6767
SyntaxHighlighter['defaults'].toolbar = false;
68-
SyntaxHighlighter['defaults'].gutter = false;
68+
SyntaxHighlighter['defaults'].gutter = true;
6969

7070
/**
7171
* Controller for tutorial instructions

docs/src/templates/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@
5454
<li><a href="#!guide" ng:class="selectedSection('guide')">Developer Guide</a></li>
5555
<li><a href="#!api" ng:class="selectedSection('api')">API Reference</a></li>
5656
<li><a href="#!cookbook" ng:class="selectedSection('cookbook')">Examples</a></li>
57-
<li><a href="#!intro/started" ng:class="selectedSection('intro')">Getting Started</a></li>
57+
<li><a href="#!misc/started" ng:class="selectedSection('intro')">Getting Started</a></li>
5858
<li><a href="#!tutorial" ng:class="selectedSection('tutorial')">Tutorial</a></li>
5959
</ul>
6060

0 commit comments

Comments
 (0)