From 58932c7f38b4b5e9f30703c90b556210a3b970d8 Mon Sep 17 00:00:00 2001
From: Pete Bacon Darwin <pete@bacondarwin.com>
Date: Sun, 4 Mar 2018 21:11:54 +0000
Subject: [PATCH] build(aio): indicate whether properties are read-only in API
 pages (#22584)

PR Close #22584
---
 aio/src/styles/2-modules/_api-pages.scss                  | 2 +-
 aio/tools/transforms/templates/api/lib/memberHelpers.html | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/aio/src/styles/2-modules/_api-pages.scss b/aio/src/styles/2-modules/_api-pages.scss
index 8656691a04..f25126d2db 100644
--- a/aio/src/styles/2-modules/_api-pages.scss
+++ b/aio/src/styles/2-modules/_api-pages.scss
@@ -81,7 +81,7 @@
     background-color: rgba(241, 241, 241, 0.2);
   }
 
-  .from-constructor {
+  .from-constructor, .read-only-property {
     font-style: italic;
     color: $blue;
   }
diff --git a/aio/tools/transforms/templates/api/lib/memberHelpers.html b/aio/tools/transforms/templates/api/lib/memberHelpers.html
index d3469ceaec..ffeab09194 100644
--- a/aio/tools/transforms/templates/api/lib/memberHelpers.html
+++ b/aio/tools/transforms/templates/api/lib/memberHelpers.html
@@ -134,6 +134,7 @@
         <td><a id="{$ property.anchor $}"></a>{$ property.name $}</td>
         <td><label class="property-type-label"><code>{$ property.type | escape $}</code></label></td>
         <td>
+          {%- if (property.isGetAccessor or property.isReadonly) and not property.isSetAccessor %}<span class='read-only-property'>Read-only.</span>{% endif %}
           {$ (property.description or property.constructorParamDoc.description) | marked $}
           {% if property.constructorParamDoc %} <span class='from-constructor'>Declared in constructor.</span>{% endif %}
         </td>