Merge pull request #158 from PolymerElements/302

Fixes for webcomponents.org
PolymerElements · Jun 27, 2017 · c06ccd7 · c06ccd7
2 parents 61c95d0 + 9c1d7ed
commit c06ccd7
Show file tree

Hide file tree

Showing 14 changed files with 94 additions and 82 deletions.
diff --git a/README.md b/README.md
@@ -53,7 +53,7 @@ The following custom properties and mixins are available for styling:
 
 Custom property | Description | Default
 ----------------|-------------|----------
-`--iron-doc-accent-color` | Color for emphasis (e.g. hyperlink hover). | ``
+`--iron-doc-accent-color` | Color for emphasis (e.g. hyperlink hover). | `#1565c0`
 `--iron-doc-font-body` | Mixin applied to non-code text. | `{}`
 `--iron-doc-font-code` | Mixin applied to code snippets. | `{}`
 `--iron-doc-title` | Mixin applied to page titles. | `{}`

diff --git a/iron-doc-api.html b/iron-doc-api.html
@@ -46,10 +46,6 @@ <h2>
       </template>
 
       <template is="dom-if" if="[[_protectedCount(descriptor.properties)]]">
-        <iron-doc-hide-bar visible="{{_showProtectedProperties}}">
-          [[_protectedCount(descriptor.properties)]] protected properties
-        </iron-doc-hide-bar>
-
         <template is="dom-if" if="[[_showProtectedProperties]]">
           <template is="dom-repeat"
                     items="[[_protected(descriptor.properties)]]"
@@ -59,6 +55,10 @@ <h2>
             </iron-doc-property>
           </template>
         </template>
+
+        <iron-doc-hide-bar visible="{{_showProtectedProperties}}">
+          [[_protectedCount(descriptor.properties)]] protected properties
+        </iron-doc-hide-bar>
       </template>
     </section>
 
@@ -85,11 +85,6 @@ <h2>
       </template>
 
       <template is="dom-if" if="[[_protectedCount(descriptor.methods, descriptor.staticMethods)]]">
-        <iron-doc-hide-bar visible="{{_showProtectedMethods}}">
-          [[_protectedCount(descriptor.methods, descriptor.staticMethods)]]
-          protected methods
-        </iron-doc-hide-bar>
-
         <template is="dom-if" if="[[_showProtectedMethods]]">
           <template is="dom-repeat"
                     items="[[_protected(descriptor.staticMethods)]]"
@@ -107,6 +102,11 @@ <h2>
             </iron-doc-function>
           </template>
         </template>
+
+        <iron-doc-hide-bar visible="{{_showProtectedMethods}}">
+          [[_protectedCount(descriptor.methods, descriptor.staticMethods)]]
+          protected methods
+        </iron-doc-hide-bar>
       </template>
     </section>
 
@@ -125,10 +125,6 @@ <h2>
       </template>
 
       <template is="dom-if" if="[[_protectedCount(descriptor.events)]]">
-        <iron-doc-hide-bar visible="{{_showProtectedEvents}}">
-          [[_protectedCount(descriptor.events)]] protected events
-        </iron-doc-hide-bar>
-
         <template is="dom-if" if="[[_showProtectedEvents]]">
           <template is="dom-repeat"
                     items="[[_protected(descriptor.events)]]"
@@ -138,6 +134,10 @@ <h2>
             </iron-doc-property>
           </template>
         </template>
+
+        <iron-doc-hide-bar visible="{{_showProtectedEvents}}">
+          [[_protectedCount(descriptor.events)]] protected events
+        </iron-doc-hide-bar>
       </template>
     </section>
 

diff --git a/iron-doc-behavior.html b/iron-doc-behavior.html
@@ -40,10 +40,13 @@ <h1>Behavior [[descriptor.name]]</h1>
 
     <div>Path: <code>[[descriptor.path]]</code></div>
 
-    <div hidden$="[[!descriptor.mixins]]">Mixins: &#8203;
-      <template is="dom-repeat" items="[[descriptor.mixins]]" sort="_compareDescriptors">
-        <a class="name deeplink mixin" href$="[[baseHref]]/mixins/[[item]]">[[item]]</a>
-      </template>
+    <div hidden$="[[!descriptor.mixins]]">Mixins:
+      <span>
+        <template is="dom-repeat" items="[[descriptor.mixins]]" sort="_compareDescriptors"><!--
+       --><span hidden$="[[!index]]">, </span>
+          <a class="name deeplink mixin" href$="[[baseHref]]/mixins/[[item]]">[[item]]</a><!--
+     --></template>
+      </span>
     </div>
 
     <section id="description"

diff --git a/iron-doc-element.html b/iron-doc-element.html
@@ -24,7 +24,7 @@
 -->
 
 <dom-module id="iron-doc-element">
-  <template strip-whitespace>
+  <template>
     <style include="iron-doc-viewer-styles prism-theme-default">
       :host {
         @apply --iron-doc-docs;
@@ -43,10 +43,12 @@ <h1>[[title]]</h1>
         <a class="name deeplink"
             target$="[[_superclassTarget(descriptor.superclass)]]"
             href$="[[_superclassUrl(descriptor.superclass)]]">[[descriptor.superclass]]</a>
-        <span hidden$="[[!descriptor.mixins]]">&#8203; with &#8203;
-          <template is="dom-repeat" items="[[descriptor.mixins]]" sort="_compareDescriptors">
-            <a class="name deeplink mixin" href$="[[baseHref]]/mixins/[[item]]">[[item]]</a>
-          </template>
+        <span hidden$="[[!descriptor.mixins]]"> with
+          <span>
+            <template is="dom-repeat" items="[[descriptor.mixins]]" sort="_compareDescriptors">
+              <a class="name deeplink mixin" href$="[[baseHref]]/mixins/[[item]]">[[item]]</a>
+            </template>
+          </span>
         </span>
       </code>
     </div>

diff --git a/iron-doc-function.html b/iron-doc-function.html
@@ -22,7 +22,7 @@
       }
 
       .paramName {
-        color: var(--iron-doc-accent-color);
+        color: var(--iron-doc-accent-color-internal);
       }
 
       .paramType, .returnType {
@@ -37,7 +37,8 @@
       #paramList marked-element,
       #paramList .markdown-html,
       #paramList .markdown-html p {
-        display: inline;
+        display: inline-block;
+        margin: 0;
       }
 
       .static {

diff --git a/iron-doc-hide-bar.html b/iron-doc-hide-bar.html
@@ -30,14 +30,14 @@
       }
 
       a:hover {
-        color: var(--iron-doc-accent-color);
+        color: var(--iron-doc-accent-color-internal);
       }
     </style>
 
     <a href="" on-tap="_toggle">
       <span hidden$="[[visible]]">Show</span>
       <span hidden$="[[!visible]]">Hide</span>
-      &#8203;<slot></slot>
+      <span><slot></slot></span>
     </a>
 
   </template>
@@ -58,10 +58,6 @@
         _toggle(ev) {
           ev.preventDefault();
           this.visible = !this.visible;
-          Polymer.dom.flush();
-          Polymer.RenderStatus.afterNextRender(this, function() {
-            this.scrollIntoView({behavior: 'smooth'});
-          });
         }
       });
     })();

diff --git a/iron-doc-mixin.html b/iron-doc-mixin.html
@@ -38,10 +38,13 @@ <h1>[[title]]</h1>
 
     <div>Path: <code>[[descriptor.path]]</code></div>
 
-    <div hidden$="[[!descriptor.mixins]]">Mixins: &#8203;
-      <template is="dom-repeat" items="[[descriptor.mixins]]" sort="_compareDescriptors">
-        <a class="name deeplink mixin" href$="[[baseHref]]/mixins/[[item]]">[[item]]</a>
-      </template>
+    <div hidden$="[[!descriptor.mixins]]">Mixins:
+      <span>
+        <template is="dom-repeat" items="[[descriptor.mixins]]" sort="_compareDescriptors"><!--
+       --><span hidden$="[[!index]]">, </span>
+          <a class="name deeplink mixin" href$="[[baseHref]]/mixins/[[item]]">[[item]]</a><!--
+     --></template>
+      </span>
     </div>
 
     <section id="description"

diff --git a/iron-doc-namespace.html b/iron-doc-namespace.html
@@ -38,8 +38,8 @@ <h1>[[title]]</h1>
     <p hidden$="[[!descriptor.summary]]">[[descriptor.summary]]</p>
 
     <section id="description"
-             hidden$="[[!descriptor.description]]"
-             anchor-id$="[[fragmentPrefix]]description">
+             anchor-id$="[[fragmentPrefix]]description"
+             hidden$="[[!descriptor.description]]">
       <h2>
         <a href$="#[[fragmentPrefix]]description" class="deeplink">Description</a>
       </h2>
@@ -48,7 +48,8 @@ <h2>
       </marked-element>
     </section>
 
-    <section anchor-id$="[[fragmentPrefix]]elements" hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'elements')]]">
+    <section anchor-id$="[[fragmentPrefix]]elements"
+             hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'elements')]]">
       <h2>
         <a href$="#[[fragmentPrefix]]elements" class="deeplink">Elements</a>
       </h2>
@@ -61,7 +62,8 @@ <h2>
       </template>
     </section>
 
-    <section anchor-id$="[[fragmentPrefix]]classes" hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'classes')]]">
+    <section anchor-id$="[[fragmentPrefix]]classes"
+             hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'classes')]]">
       <h2>
         <a href$="#[[fragmentPrefix]]classes" class="deeplink">Classes</a>
       </h2>
@@ -74,7 +76,8 @@ <h2>
       </template>
     </section>
 
-    <section anchor-id$="[[fragmentPrefix]]mixins" hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'mixins')]]">
+    <section anchor-id$="[[fragmentPrefix]]mixins"
+             hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'mixins')]]">
       <h2>
         <a href$="#[[fragmentPrefix]]mixins" class="deeplink">Mixins</a>
       </h2>
@@ -87,7 +90,8 @@ <h2>
       </template>
     </section>
 
-    <section anchor-id$="[[fragmentPrefix]]behaviors" hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'behaviors')]]">
+    <section anchor-id$="[[fragmentPrefix]]behaviors"
+             hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'behaviors')]]">
       <h2>
         <a href$="#[[fragmentPrefix]]behaviors" class="deeplink">Behaviors</a>
       </h2>
@@ -100,7 +104,8 @@ <h2>
       </template>
     </section>
 
-    <section anchor-id$="[[fragmentPrefix]]functions" hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'functions')]]">
+    <section anchor-id$="[[fragmentPrefix]]functions"
+             hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'functions')]]">
       <h2>
         <a href$="#[[fragmentPrefix]]functions" class="deeplink">Functions</a>
       </h2>
@@ -112,7 +117,8 @@ <h2>
       </template>
     </section>
 
-    <section anchor-id$="[[fragmentPrefix]]namespaces" hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'namespaces')]]">
+    <section anchor-id$="[[fragmentPrefix]]namespaces"
+             hidden$="[[_noneToShow(_showProtected,_showInherited,descriptor,'namespaces')]]">
       <h2>
         <a href$="#[[fragmentPrefix]]namespaces" class="deeplink">Namespaces</a>
       </h2>

diff --git a/iron-doc-nav.html b/iron-doc-nav.html
@@ -10,16 +10,17 @@
 
 <link rel="import" href="../polymer/polymer.html">
 
+<link rel="import" href="iron-doc-viewer-styles.html">
+
 <dom-module id="iron-doc-nav">
   <template>
-    <style>
+    <style include="iron-doc-viewer-styles">
       :host {
         display: block;
       }
 
       section {
         @apply --iron-doc-font-body;
-        font-family: sans-serif;
         border-bottom: 1px solid #e0e0e0;
       }
 
@@ -46,11 +47,11 @@
       }
 
       a:hover {
-        color: var(--iron-doc-accent-color, #1565c0) !important;
+        color: var(--iron-doc-accent-color-internal) !important;
       }
 
       a[selected] {
-        color: var(--iron-doc-accent-color, #1565c0);
+        color: var(--iron-doc-accent-color-internal);
       }
 
       .tray {
@@ -186,11 +187,11 @@ <h3>[[section.heading]]</h3>
         var sectionItems = [];
         for (var i = 0; i < (descriptorItems || []).length; i++) {
           var item = descriptorItems[i];
-          var name = item.tagname || item.name;
+          var name = item.tagname ? '<' + item.tagname + '>' : item.name;
           if (!name) {
             continue;
           }
-          var path = pathPrefix + name;
+          var path = pathPrefix + (item.tagname || item.name);
 
           var demos = [];
           for (var d = 0; d < (item.demos || []).length; d++) {

diff --git a/iron-doc-property.html b/iron-doc-property.html
@@ -31,7 +31,7 @@
 
       #polymer > * {
         background-color: #efefef;
-        color: var(--iron-doc-accent-color);
+        color: var(--iron-doc-accent-color-internal);
         padding: 1px 6px;
         margin-left: 8px;
         border-radius: 8px;
@@ -42,7 +42,7 @@
       }
 
       .default {
-        color: var(--iron-doc-accent-color);
+        color: var(--iron-doc-accent-color-internal);
       }
 
       .privacy {

diff --git a/iron-doc-summary.html b/iron-doc-summary.html
@@ -34,19 +34,22 @@
 
       a {
         color: currentcolor;
-        font-size: 14px;
         text-decoration: none;
       }
 
       a:hover {
-        color: var(--iron-doc-accent-color);
+        color: var(--iron-doc-accent-color-internal);
+      }
+
+      #description {
+        margin-top: 6px;
       }
     </style>
 
     <div class="name">
       <a href$="[[href]]">{{name}}</a>
     </div>
-    <div id="description" markdown="[[description]]" hidden$="[[!description]]">
+    <div id="description" hidden$="[[!description]]">
       [[description]]
     </div>
   </template>

diff --git a/iron-doc-viewer-behavior.html b/iron-doc-viewer-behavior.html
@@ -143,9 +143,6 @@
        * display name.
        */
       _compareDescriptors: function(a, b) {
-        if (a.inheritedFrom || '' !== b.inheritedFrom || '') {
-          return (a.inheritedFrom || '').localeCompare(b.inheritedFrom || '');
-        }
         // Elements display as "<tagname> (name)" or "name", while
         // everything else displays as "name".
         if (a.name != b.name) {