From 453aca8c438c3d7e6517032d2715e7e86e7a1154 Mon Sep 17 00:00:00 2001 From: Tony Ruscoe Date: Mon, 24 Apr 2023 14:42:52 +0100 Subject: [PATCH] Update the HTML Line-Wrapping guidance This relaxes the guidance around indenting by 4 additional spaces and provides the Prettier format as one of the examples to ensure the style guide is compatible with the Prettier formatter. --- htmlcssguide.html | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/htmlcssguide.html b/htmlcssguide.html index 96a88c3..ab961e2 100644 --- a/htmlcssguide.html +++ b/htmlcssguide.html @@ -447,9 +447,19 @@ instead of an error.)

While there is no column limit recommendation for HTML, you may consider wrapping long lines if it significantly improves readability.

-

When line-wrapping, each continuation line should be indented at least 4 -additional spaces from the original line to distinguish wrapped attributes from -child elements.

+

When line-wrapping, each continuation line should be indented to distinguish +wrapped attributes from child elements. Lines should be wrapped consistently +within a project, ideally enforced by automated code formatting tools.

+ +
<button
+  mat-icon-button
+  color="primary"
+  class="menu-button"
+  (click)="openMenu()"
+>
+  <mat-icon>menu</mat-icon>
+</button>
+
<button mat-icon-button color="primary" class="menu-button"
     (click)="openMenu()">