From 0292deece15fb279978e3d5eb4b365958ec4fbee Mon Sep 17 00:00:00 2001
From: Peter Bacon Darwin <pete@bacondarwin.com>
Date: Tue, 3 Nov 2015 12:30:11 +0000
Subject: [PATCH] api-templates: display members as simple formatted code

See https://github.com/angular/angular/issues/4258
---
 .../templates/class.template.html             | 33 +++++-------
 .../templates/function.template.html          | 11 ++--
 public/resources/css/main.scss                |  1 +
 .../resources/css/module/_heading-code.scss   | 53 +++++++++++++++++++
 4 files changed, 70 insertions(+), 28 deletions(-)
 create mode 100644 public/resources/css/module/_heading-code.scss

diff --git a/public/api-builder/angular.io-package/templates/class.template.html b/public/api-builder/angular.io-package/templates/class.template.html
index 4c049a3764..ca06518aa6 100644
--- a/public/api-builder/angular.io-package/templates/class.template.html
+++ b/public/api-builder/angular.io-package/templates/class.template.html
@@ -20,10 +20,10 @@ p.location-badge.
   h2 Annotations
 {%- for decorator in doc.decorators %}
   .l-sub-section
-    h3.annotation {$ decorator.name $}
-    pre.prettyprint
-      code.
-        @{$ decorator.name $}{$ paramList(decorator.arguments) | indent(8, false) $}
+    h3.annotation
+      pre.prettyprint
+        code.
+          @{$ decorator.name $}{$ paramList(decorator.arguments) | indent(8, false) $}
 {% endfor %}
 {%- endif %}
 
@@ -34,33 +34,24 @@ p.location-badge.
 
 {%- if doc.constructorDoc %}
   .l-sub-section
-    h3#{$ doc.constructorDoc.name | toId $} {$ doc.constructorDoc.name $}
-
-    {% if doc.constructorDoc.parameters %}
-    pre.prettyprint
-      code.
-        {$ doc.constructorDoc.name $}{$ paramList(doc.constructorDoc.parameters) | indent(8, false) | trim $}
-    {% endif %}
+    h3#{$ doc.constructorDoc.name | toId $}
+      pre.prettyprint
+        code.
+          {$ doc.constructorDoc.name $}{$ paramList(doc.constructorDoc.parameters) | indent(8, false) | trim $}
     :markdown
 {$ doc.constructorDoc.description | indentForMarkdown(6) | replace('## Example', '') | replace('# Example', '') | trimBlankLines $}
-
-
 {% endif -%}
 
 {%- for member in doc.members %}{% if not member.internal %}
   .l-sub-section
-    h3#{$ member.name | toId $} {$ member.name $}{% if member.optional %}?{% endif %}
+    h3#{$ member.name | toId $}
+      pre.prettyprint
+        code.
+          {$ member.name $}{$ paramList(member.parameters) | indent(8, false) | trim $}{$ returnType(member.returnType) $}
 
-    {% if member.parameters %}
-    pre.prettyprint
-      code.
-        {$ member.name $}{$ paramList(member.parameters) | indent(8, false) | trim $}{$ returnType(doc.returnType) $}
-    {% endif %}
     :markdown
 {$ member.description | indentForMarkdown(6) | replace('## Example', '') | replace('# Example', '') | trimBlankLines $}
 
-
-
 {% endif %}{% endfor %}
 {%- endif -%}
 
diff --git a/public/api-builder/angular.io-package/templates/function.template.html b/public/api-builder/angular.io-package/templates/function.template.html
index 06f2b87296..130f579b6f 100644
--- a/public/api-builder/angular.io-package/templates/function.template.html
+++ b/public/api-builder/angular.io-package/templates/function.template.html
@@ -5,13 +5,10 @@
 {% block body %}
 include ../../_util-fns
 .l-main-section
-  h2(class="function export") {$ doc.name $}
-
-  {% if doc.parameters %}
-  pre.prettyprint
-    code.
-      {$ doc.name $}{$ paramList(doc.parameters) | indent(4, true) | trim $}{$ returnType(doc.returnType) $}
-  {% endif %}
+  h2(class="function export")
+    pre.prettyprint
+      code.
+        export {$ doc.name $}{$ paramList(doc.parameters) | indent(4, true) | trim $}{$ returnType(doc.returnType) $}
 
   p.location-badge.
     exported from {@link {$ doc.moduleDoc.id $} {$doc.moduleDoc.id $} }
diff --git a/public/resources/css/main.scss b/public/resources/css/main.scss
index 556fa8ea3c..bdb4d27988 100644
--- a/public/resources/css/main.scss
+++ b/public/resources/css/main.scss
@@ -28,6 +28,7 @@
 @import 'module/buttons';
 @import 'module/table';
 @import 'module/code';
+@import 'module/heading-code';
 @import 'module/code-box';
 @import 'module/sticker';
 @import 'module/bio-card';
diff --git a/public/resources/css/module/_heading-code.scss b/public/resources/css/module/_heading-code.scss
new file mode 100644
index 0000000000..d67b2ea396
--- /dev/null
+++ b/public/resources/css/module/_heading-code.scss
@@ -0,0 +1,53 @@
+h1, h2, h3, h4 {
+  .prettyprint {
+    background: $snow;
+    font-family: $mono-font;
+    color: $steel;
+    overflow: hidden;
+    position: relative;
+    font-size: 15px;
+    font-weight: 600;
+    line-height: 24px;
+    margin: 0;
+    border: none;
+    box-shadow: none;
+    padding: 0;
+
+    code {
+      background: none;
+      font-size: 15px;
+      padding: 0px;
+    }
+
+
+    .kwd {
+      color: $steel;
+    }
+    .typ,
+    .tag {
+      color: $ruby;
+    }
+    .str,
+    .atv {
+      color: darken($sunshine, 50%);
+    }
+    .atn {
+      color: darken($cactus, 10%);
+    }
+    .com {
+      color: $cloud;
+    }
+    .lit {
+      color: darken($sunshine, 50%);
+    }
+    .pun {
+      color: $coal;
+    }
+    .pln {
+      color: $coal;
+    }
+    .dec {
+      color: darken($grape, 5%);
+    }
+  }
+}
\ No newline at end of file