From e340d190bd0cadc1edb8de7e4c02e41bd01e8374 Mon Sep 17 00:00:00 2001
From: Kapunahele Wong <kapunahelewong@gmail.com>
Date: Tue, 2 Mar 2021 09:47:46 -0500
Subject: [PATCH] docs: add some boilerplate button, h3, and hr styles (#41052)

PR Close #41052
---
 .../interpolation/e2e/src/app.e2e-spec.ts     |  2 +-
 .../shared/boilerplate/common/src/styles.css  | 25 +++++++++++++++----
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/aio/content/examples/interpolation/e2e/src/app.e2e-spec.ts b/aio/content/examples/interpolation/e2e/src/app.e2e-spec.ts
index d12b2c47f3..a2ce3747e7 100644
--- a/aio/content/examples/interpolation/e2e/src/app.e2e-spec.ts
+++ b/aio/content/examples/interpolation/e2e/src/app.e2e-spec.ts
@@ -40,6 +40,6 @@ describe('Interpolation e2e tests', () => {
     const label = element(by.css('label'));
     expect(await label.getText()).toEqual('Type something:');
     await input.sendKeys('abc');
-    expect(await label.getText()).toEqual('Type something: abc');
+    expect(await label.getText()).toMatch(/^Type something:\s+abc$/);
   });
 });
diff --git a/aio/tools/examples/shared/boilerplate/common/src/styles.css b/aio/tools/examples/shared/boilerplate/common/src/styles.css
index 1e9f1c865d..0584e4a793 100644
--- a/aio/tools/examples/shared/boilerplate/common/src/styles.css
+++ b/aio/tools/examples/shared/boilerplate/common/src/styles.css
@@ -4,20 +4,23 @@
 }
 h1 {
   color: #264D73;
-  font-size: 250%;
+  font-size: 2.5rem;
 }
 h2, h3 {
   color: #444;
   font-weight: lighter;
 }
+h3 {
+  font-size: 1.3rem;
+}
 body {
-  padding: .5em;
+  padding: .5rem;
   max-width: 1000px;
   margin: auto;
 }
 @media (min-width: 600px) {
   body {
-    padding: 2em;
+    padding: 2rem;
   }
 }
 body, input[text] {
@@ -30,13 +33,17 @@ a {
 button {
   background-color: #eee;
   border: none;
-  padding: 5px 10px;
   border-radius: 4px;
   cursor: pointer;
   color: black;
+  font-size: 1.2rem;
+  padding: 1rem;
+  margin-right: 1rem;
+  margin-bottom: 1rem;
 }
 button:hover {
-  background-color: #cfd8dc;
+  background-color: black;
+  color: white;
 }
 button:disabled {
   background-color: #eee;
@@ -64,3 +71,11 @@ nav a.active {
   background-color: black;
   color: white;
 }
+hr {
+  margin: 1.5rem 0;
+}
+input[type="text"] {
+  box-sizing: border-box;
+  width: 100%;
+  padding: .5rem;
+}