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

change class and directive template.

This commit is contained in:
Eric Jimenez 2016-04-07 12:54:24 -04:00 committed by Naomi Black
parent 3547e4cc15
commit 5ea7738ad3
12 changed files with 281 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
public/resources/css/base/_type.scss
View File

@ -18,12 +18,19 @@ a {
}
code {
background: $lightgrey;
background: #eef1f2;
border-radius: 2px;
font-family: $mono-font;
color: $darkgrey;
color: $regal;
padding: 0px 4px;
font-size: 90%;
}
p code {
border-bottom: 1px dotted $regal;
&:hover {
border-bottom: 1px solid $regal;
}
}
.location-badge {
@ -103,7 +110,9 @@ code {
opacity: 0.87;
}
h2 {
font-size: 20px;
font-size: 15px;
text-transform: uppercase;
color: #78909C;
}
h3 {
font-size: 16px;
@ -111,6 +120,11 @@ code {
h4 {
font-size: 16px;
}
p {
font-size: 15px;
color: #5c7078;
line-height: 28pt;
}
}
table th,
@ -213,8 +227,8 @@ table td {
&[layout="row"] {
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
& > div {
flex-direction: column;
& > div {
& > .card {
margin-left: 0;
margin-right: 0;

2
public/resources/css/main.scss
View File

@ -54,4 +54,4 @@
* PRINT STYLES
*
*/
@import 'print';
@import 'print';

75
public/resources/css/module/_api.scss
View File

@ -102,4 +102,79 @@ input.api-filter {
}
}
}
a {
code {
color: $ocean;
}
}
p {
color: #1a2326;
&.selector {
margin: 0 0 8px 0;
}
&.location-badge {
margin: 0 0 16px 16px !important;
}
code {
border-bottom: 0px;
:hover {
border-bottom: none;
}
}
}
.row-margin {
margin-bottom: 36px;
h2 {
line-height: 28px;
}
}
.code-margin {
margin-bottom: $unit;
}
.hr-margin {
display: block;
height: 1px;
border: 0;
border-top: 1px solid $lightgrey;
margin-top: 15px;
margin-bottom: 20px;
padding: 0;
}
.no-bg {
background: none;
padding: 0;
}
code {
font-size: 14px;
color: #1a2326;
// Override highlight.js
&.no-pln {
.pln {
display: none;
}
}
}
}
@media screen and (max-width: 600px) {
code {
font-size: 12px;
}
p.location-badge {
position: relative;
font-size: 11px;
}
}

32
public/resources/css/module/_code-box.scss
View File

@ -1,7 +1,6 @@
.code-box {
border-radius: 4px;
background: $lightgrey;
// box-shadow: 0px 2px 5px rgba($coal, .3);
margin-bottom: $unit * 2;
header {
@ -11,6 +10,30 @@
border-radius: 4px 4px 0px 0px;
}
&__live-code {
background-color: #cfd8dc;
height: 36px;
color: $snow;
padding: 0 $unit;
border-radius: 4px 4px 0px 0px;
margin-bottom: 0;
& a {
font-size: 14px;
text-decoration: none;
border-bottom: 1px $regal dotted;
&:hover {
border-bottom: 1px $regal solid;
}
}
&--icon {
font-size: 14px;
color: $regal;
}
}
nav {
button {
line-height: $unit * 3.5;
@ -21,12 +44,11 @@
background: #3F94E9;
color: $snow;
border-radius: 4px 4px 0px 0px;
// font-weight: 500;
text-transform: none;
&.is-selected,
&.selected
{
{
background: $lightgrey;
color: $darkgrey;
}
@ -38,3 +60,7 @@
margin: 0px;
}
}
pre {
margin-top: 0;
}

2
tools/api-builder/angular.io-package/tag-defs/index.js
View File

@ -1,6 +1,6 @@
module.exports = [
require('./deprecated'),
require('./howToUse'),
require('./whatItIs'),
require('./whatItDoes'),
require('./internal')
];

2
tools/api-builder/angular.io-package/tag-defs/whatItIs.js → tools/api-builder/angular.io-package/tag-defs/whatItDoes.js
View File

@ -1,5 +1,5 @@
module.exports = function() {
return {
name: 'whatItIs'
name: 'whatItDoes'
};
};

177
tools/api-builder/angular.io-package/templates/class.template.html
View File

@ -1,6 +1,3 @@
<!-- TODO: API design proposal section will use doc.howToUse and doc.whatItIs -->
<!-- TODO: API design proposal badges will use doc.deprecated -->
{% include "lib/githubLinks.html" -%}
{% include "lib/paramList.html" -%}
{% extends 'layout/base.template.html' -%}
@ -8,91 +5,135 @@
{% block body %}
include {$ relativePath(doc.path, '_util-fns') $}
h2(class="{$ doc.docType $} export")
pre.prettyprint
code.
export {$ doc.docType $} {$ doc.name $}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 What it does
div(flex="80" flex-xs="100")
:marked
{%- if doc.whatItDoes %}
{$ doc.whatItDoes | indentForMarkdown(6) $}
{% else %}
*Not yet documented*
{% endif %}
p.location-badge.
exported from {@link {$ doc.moduleDoc.id $} {$doc.moduleDoc.id $} }
defined in {$ githubViewLink(doc) $}
:marked
{%- if doc.notYetDocumented %}
*Not Yet Documented*
{% else %}
{$ doc.description | indentForMarkdown(2) | trimBlankLines $}
{% endif %}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 How to use
div(flex="80" flex-xs="100")
:marked
{%- if doc.howToUse %}
{$ doc.howToUse | indentForMarkdown(6) $}
{% else %}
*Not yet documented*
{% endif %}
{% block additional %}
{% endblock %}
{% block annotations %}
{%- if doc.decorators.length %}
.l-main-section
h2 Annotations
{%- for decorator in doc.decorators %}
.l-sub-section
h3.annotation
pre.prettyprint
code.
@{$ decorator.name $}{$ paramList(decorator.arguments) | indent(10, false) $}{% endfor %}{% endif %}
{% endblock %}
{%- if doc.constructorDoc and not doc.constructorDoc.internal %}
.l-main-section
h2 Constructor
.l-sub-section
h3#{$ doc.constructorDoc.name | toId $}
pre.prettyprint
code.
{$ doc.constructorDoc.name $}{$ paramList(doc.constructorDoc.parameters) | indent(8, false) | trim $}
.div(class="row-margin" layout="row" layout-xs="column")
div(flex="20" flex-xs="100")
h2 Class Description
div(class="class-description-content" flex="80" flex-xs="100")
:marked
{%- if doc.constructorDoc.notYetDocumented %}
*Not Yet Documented*
{%- if doc.description.length > 2 %}
{$ doc.description | indentForMarkdown(6) | trimBlankLines $}
{% else %}
*Not yet documented*
{% endif %}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 Class Export
div(flex="80" flex-xs="100")
pre.prettyprint.no-bg
code.no-pln.
export {$ doc.docType $} {$ doc.name $}
{%- if doc.decorators.length %}
{% block annotations %}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 Annotations
div(flex="80" flex-xs="100")
{%- for decorator in doc.decorators %}
pre.prettyprint.no-bg
code.
@{$ decorator.name $}{$ paramList(decorator.arguments) | indent(10, false) $}
:marked
{%- if decorator.notYetDocumented %}
*Not yet documented*
{% else %}
{$ doc.constructorDoc.description | indentForMarkdown(6) | replace('## Example', '') | replace('# Example', '') | trimBlankLines $}
{% endif -%}
{$ decorator.description | indentForMarkdown(8) | trimBlankLines $}
{% endif %}
{% endfor %}
{% endblock %}
{% endif %}
{% if doc.statics.length -%}
.l-main-section
h2 Static Members
{%- for member in doc.statics %}{% if not member.internal %}
.l-sub-section
h3#{$ member.name | toId $}
pre.prettyprint
code.
{$ member.name $}{$ paramList(member.parameters) | indent(8, false) | trim $}{$ returnType(member.returnType) $}
{%- if doc.constructorDoc and not doc.constructorDoc.internal %}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 Constructor
div(flex="80" flex-xs="100")
pre.prettyprint.no-bg
code.
{$ doc.constructorDoc.name $}{$ paramList(doc.constructorDoc.parameters) | indent(8, false) | trim $}
:marked
{%- if doc.constructorDoc.notYetDocumented %}
*Not yet documented*
{% else %}
{$ doc.constructorDoc.description | indentForMarkdown(6) | replace('### Example', '') | replace('## Example', '') | replace('# Example', '') | trimBlankLines $}
{% endif %}
{% endif %}
{% if doc.statics.length %}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 Static Members
div(flex="80" flex-xs="100")
{% for member in doc.statics %}{% if not member.internal %}
pre.prettyprint.no-bg
code.
{$ member.name $}{$ paramList(member.parameters) | indent(8, false) | trim $}{$ returnType(member.returnType) $}
:marked
{%- if member.notYetDocumented %}
*Not Yet Documented*
*Not yet documented*
{% else %}
{$ member.description | indentForMarkdown(6) | replace('## Example', '') | replace('# Example', '') | trimBlankLines $}
{% endif %}
{% endif %}{% endfor %}
{%- endif -%}
{% if not loop.last %}
.hr(class="hr-margin")
{% endif %}
{% if doc.members.length -%}
.l-main-section
h2 Instance Members
{%- for member in doc.members %}{% if not member.internal %}
.l-sub-section
h3#{$ member.name | toId $}
pre.prettyprint
code.
{$ member.name $}{$ paramList(member.parameters) | indent(8, false) | trim $}{$ returnType(member.returnType) $}
{% endif %}{% endfor %}
{% endif %}
{% if doc.members.length %}
.div(layout="row" layout-xs="column" class="instance-members" class="row-margin")
div(flex="20" flex-xs="100")
h2 Instance Members
div(flex="80" flex-xs="100")
{% for member in doc.members %}{% if not member.internal %}
pre.prettyprint.no-bg
code.
{$ member.name $}{$ paramList(member.parameters) | indent(8, false) | trim $}{$ returnType(member.returnType) $}
:marked
{%- if member.notYetDocumented %}
*Not Yet Documented*
*Not yet documented*
{% else %}
{$ member.description | indentForMarkdown(6) | replace('## Example', '') | replace('# Example', '') | trimBlankLines $}
{% endif %}
{% endif %}{% endfor %}
{%- endif -%}
{$ member.description | indentForMarkdown(6) | replace('### Example', '') | replace('## Example', '') | replace('# Example', '') | trimBlankLines $}
{% endif -%}
{% if not loop.last %}
.hr(class="hr-margin")
{% endif %}
{% endif %}{% endfor %}
{% endif %}
.p(class="location-badge")
exported from {@link {$ doc.moduleDoc.id $} {$doc.moduleDoc.id $} }
defined in {$ githubViewLink(doc) $}
{% endblock %}

2
tools/api-builder/angular.io-package/templates/decorator.template.html
View File

@ -16,7 +16,7 @@ include {$ relativePath(doc.path, '_util-fns') $}
:marked
{%- if doc.notYetDocumented %}
*Not Yet Documented*
*Not yet documented*
{% else %}
{$ doc.description | indentForMarkdown(4) | trimBlankLines $}
{% endif -%}

65
tools/api-builder/angular.io-package/templates/directive.template.html
View File

@ -5,44 +5,55 @@
{% block annotations %}
{% endblock %}
{% block additional -%}
.l-main-section
h2 Selectors
.l-sub-section{% for selector in doc.directiveOptions.selector.split(',') %}
h3.selector
code {$ selector $}{% endfor %}
{% if doc.inputs %}
.l-main-section
h2 Inputs
.l-sub-section{% for binding, property in doc.inputs %}
h3.input
code {$ property.bindingName $}
| &nbsp;bound to&nbsp;
code {$ property.memberDoc.classDoc.name $}.{$ property.propertyName $}
:marked
{$ property.memberDoc.description | indentForMarkdown(2) | trimBlankLines $}{% endfor %}
{%- if doc.directiveOptions.selector.split(',').length %}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 Selectors
div(flex="80" flex-xs="100")
{% for selector in doc.directiveOptions.selector.split(',') %}
p.selector
code {$ selector $}
{% endfor %}
{% endif %}
{% if doc.outputs %}
.l-main-section
h2 Outputs
.l-sub-section{% for binding, property in doc.outputs %}
h3.output
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 Outputs
div(flex="80" flex-xs="100")
{% for binding, property in doc.outputs %}
div(class="code-margin")
code {$ property.bindingName $}
| &nbsp;bound to&nbsp;
code {$ property.memberDoc.classDoc.name $}.{$ property.propertyName $}
:marked
{$ event.memberDoc.description | indentForMarkdown(2) | trimBlankLines $}
{% endfor %}
{$ event.memberDoc.description | indentForMarkdown(6) | trimBlankLines $}
{% endfor %}
{% endif %}
{% if doc.directiveOptions.exportAs %}
.l-main-section
h2 Exported As
.l-sub-section
h3.export-as
{% if doc.inputs %}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 Inputs
div(flex="80" flex-xs="100")
{% for binding, property in doc.inputs %}
div(class="code-margin")
code {$ property.bindingName $}
| &nbsp;bound to&nbsp;
code {$ property.memberDoc.classDoc.name $}.{$ property.propertyName $}
:marked
{$ event.memberDoc.description | indentForMarkdown(4) | trimBlankLines $}
{% endfor %}
{% endif %}
{%- if doc.directiveOptions.exportAs %}
.div(layout="row" layout-xs="column" class="row-margin")
div(flex="20" flex-xs="100")
h2 Exported as
div(flex="80" flex-xs="100")
p.input
code {$ doc.directiveOptions.exportAs $}
{% endif %}
{% endblock %}

2
tools/api-builder/angular.io-package/templates/interface.template.html
View File

@ -1 +1 @@
{% extends 'class.template.html' -%}
{% extends 'class.template.html' %}

4
tools/api-builder/docs-package/processors/convertBackticksToCodeBlocks.js
View File

@ -44,7 +44,9 @@ module.exports = function convertBackticksToCodeBlocks() {
var replaceVal = '\n' + newPrePad + codeExamplePrefix + escapeHtml(blockContents) + '\n';
// if nextBlock does NOT start with a '.' then we want to restart a markdown block.
// and that block needs to be exdented from the preceding code-example content.
if (nextBlockStartChar != '.') {
// There is also a case where immediately after the backticks, an @example (aka +makeExample) is created.
// In this case a markdown block is not needed.
if (nextBlockStartChar !== '.' && nextBlockStartChar !== '+') {
if (postPad.length >= 2) {
// modulo op in next line insures that pad is always a multiple of 2 ( jade whitespace).
postPad = postPad.substr(2 + (postPad.length % 2)); // exdent

3
tools/api-builder/links-package/inline-tag-defs/example.js
View File

@ -32,7 +32,8 @@ module.exports = function exampleInlineTagDef(getLinkInfo, parseArgString, getAp
log.warn(createDocMessage('Invalid example (unable to locate fragment file: ' + quote(fragFileName) + ")", doc));
}
var comma = ', '
var comma = ', ';
// the '+' character is a jade thing for mixins http://jade-lang.com/reference/mixins/
var res = [ "+makeExample(", quote(mixinFilePath), comma, region ? quote(region) : 'null', comma, title ? quote(title) : 'null', ")" ].join('');
return res;
}