Site: (liferay#547) Sheet add .sheet-subtitle examples with `.autof…

…it-row`

packages/clay/src/content/sheet.html

@@ -18,6 +18,41 @@ <h2 class="sheet-title">Sheet Title</h2>
 			</div>
 			<div class="sheet-section">
 				<h3 class="sheet-subtitle">Sheet Subtitle</h3>
+				<h3 class="autofit-row sheet-subtitle">
+					<span class="autofit-col autofit-col-expand">
+						<span class="heading-text">Sheet Subtitle 2</span>
+					</span>
+				</h3>
+				<h3 class="autofit-row sheet-subtitle">
+					<span class="autofit-col autofit-col-expand">
+						<span class="heading-text">Sheet Subtitle 3 with Button and ReallySuperInsanelyJustIncrediblyLongAndTotallyNotPossibleWordButWeAreReallyTryingToCoverAllOurBasesHereJustInCaseSomeoneIsNutsAsPerUsual</span>
+					</span>
+					<span class="autofit-col">
+						<span class="heading-end">
+							<button class="btn btn-secondary btn-sm">Add</button>
+						</span>
+					</span>
+				</h3>
+				<h3 class="autofit-row autofit-float sheet-subtitle">
+					<span class="autofit-col">
+						<span class="heading-start">
+							<a class="component-action" href="#1">
+								<svg aria-hidden="true" class="lexicon-icon lexicon-icon-link">
+									<use xlink:href="{{rootPath}}/images/icons/icons.svg#link" />
+								</svg>
+							</a>
+						</span>
+					</span>
+					<span class="autofit-col autofit-col-expand">
+						<span class="heading-text">Sheet Subtitle 4 with Autofit Float</span>
+					</span>
+					<span class="autofit-col autofit-col-end">
+						<span class="heading-end">
+							<button class="btn btn-secondary btn-sm">Add</button>
+							<button class="btn btn-secondary btn-sm">Remove</button>
+						</span>
+					</span>
+				</h3>
 				<h4 class="sheet-tertiary-title">Sheet Tertiary Title</h4>
 				<div class="sheet-text">Sheet Subtitle and Sheet Tertiary Title are contained inside a sheet-section.</div>
 			</div>