docs(eol): update docs website for End-of-Life

- fix alignment of text in banner
- update home page for EOL
- update banner messaging for EOL
- update `SECURITY.md` for EOL
- update `package-lock.json` to v2
- add `path-type` devDependency required by cssnano
- fix resolutions for npm-force-resolutions to remove ^ and ~ that can break w/ npm v8
- update karma to fix log4js vulnerability
- add `cliui` devDependency required by karma

Author: Splaktar

SECURITY.md

@@ -1,22 +1,21 @@
 # Security Policy
 
-## Supported Versions
-
-| Version     | Supported          | Status                | Comments                             |
-| ----------- | ------------------ | --------------------- | ------------------------------------ |
-| 1.2.x       | :white_check_mark: | Long Term Support     | See [Long Term Support policy][lts]  |
-| 1.1.x       | :warning:          | Security patches only |                                      |
-| <1.1.x      | :x:                |                       |                                      |
-
-## Reporting a Vulnerability
-
-Email us at [security@angularjs.org](mailto:security@angularjs.org) to report any potential security
-issues in AngularJS Material.
+**AngularJS Material support has officially ended as of January 2022.**
+[See what ending support means](https://docs.angularjs.org/misc/version-support-status)
+and [read the end of life announcement](https://goo.gle/angularjs-end-of-life). Visit
+[material.angular.io](https://material.angular.io) for the actively supported Angular Material.
 
 Please [use the latest AngularJS][latest-ng] and [AngularJS Material][releases] possible and keep in
 mind the guidance around AngularJS' [expression language][ng-expressions].
 
+## Supported Versions
+
+| Version | Supported | Status            | Comments |
+|---------|-----------|-------------------|----------|
+| 1.2.x   | :x:       | All support ended |          |
+| 1.1.x   | :x:       | All support ended |          |
+| <1.1.x  | :x:       | All support ended |          |
+
 [latest-ng]: https://docs.angularjs.org/guide/security#use-the-latest-angularjs-possible
 [releases]: https://github.com/angular/material/releases
 [ng-expressions]: https://docs.angularjs.org/guide/security#angularjs-templates-and-expressions
-[lts]: https://material.angularjs.org/#long-term-support

docs/app/css/style.css

@@ -603,10 +603,13 @@ md-toolbar.demo-toolbar .md-button {
 .eol-notice {
   background: #ECEFF1;
   padding: 4px 16px;
-  text-align: center;
   font-size: 13px;
   margin: 0;
 }
+.eol-notice div {
+  max-width: 864px;
+  text-align: center;
+}
 
 /***************
  * Landing Page

docs/app/partials/getting-started.tmpl.html

@@ -21,7 +21,7 @@ <h2><em>New to AngularJS?</em> Before getting into AngularJS Material, it might
     <h2>How do I start with AngularJS Material?</h2>
     <ul style="margin-bottom: 2em;">
       <li>
-        Get jump started with a free 30 minute video course: <a
+        Get jump started with a free 30-minute video course: <a
           href="https://egghead.io/courses/introduction-to-angular-material" target="_blank"
           title="AngularJS Framework">Introduction to AngularJS Material</a>
       </li>
@@ -82,7 +82,8 @@ <h3>Installing the AngularJS Material Libraries</h3>
       <li>
         <a href="https://docs.angularjs.org/api/ngMessages">ngMessages</a>
         - Provides a consistent mechanism for displaying form errors and other messages.
-          <b>Required</b> for some AngularJS Material components like <code>md-input</code>.
+          <strong>Required</strong> for some AngularJS Material components like
+          <code>md-input</code>.
       </li>
       <li>
         <a href="https://docs.angularjs.org/api/ngSanitize">ngSanitize</a>

docs/app/partials/home.tmpl.html

@@ -9,7 +9,7 @@ <h2 class="md-headline" style="margin-top: 0;">What is AngularJS Material?</h2>
       <a href="https://angularjs.org" target="_blank" rel="noopener">AngularJS</a> developers.
     </p>
     <p>
-      AngularJS Material has entered the Long Term Support (LTS) period.
+      AngularJS Material Long Term Support (LTS) has officially ended as of January 2022.
       <a href="#long-term-support">Find out more</a>.
     </p>
     <ul class="buckets" layout layout-align="center center" layout-wrap>
@@ -35,9 +35,9 @@ <h2 class="md-headline">AngularJS versus Angular?</h2>
       The AngularJS Material library is a mature and stable product that is ready for production
       use. Developers should note that AngularJS Material works only with
       <a href="https://angularjs.org/" target="_blank" rel="noopener">AngularJS 1.x</a>.
-      AngularJS 1.x is now in
+      AngularJS 1.x
       <a href="https://docs.angularjs.org/misc/version-support-status" target="_blank" rel="noopener">
-      Long Term Support (LTS) mode</a>.
+      Long Term Support (LTS)</a> has ended as of January 2022.
     </p>
     <i>
       The Angular Material and Component Dev Kit (CDK) libraries (for Angular v2+) can be found in the
@@ -50,43 +50,24 @@ <h2 class="md-headline">The Latest Material Design</h2>
     <p>
       The latest update to Material Design
       (<a href="https://www.youtube.com/playlist?list=PLJ21zHI2TNh-rX-Xr_xi9KIEcbdee_1Ah" target="_blank" rel="noopener">video playlist</a>)
-      was announced at Google I/O in May, 2018
+      was announced at Google I/O in May 2018
       (<a href="https://design.google/library/io-2018-our-definitive-guide-design/" target="_blank" rel="noopener">recap blog post</a>).
       For an implementation of this new
       <a href="https://material.io/design" target="_blank" rel="noopener">Material Design Specification</a>,
       please see the <a href="https://github.com/angular/components" target="_blank" rel="noopener">Angular Material</a>
       project which is built for <a href="https://angular.io" target="_blank" rel="noopener">Angular</a>
       developers.
     </p>
-    <h2 id="long-term-support" class="md-headline">Long Term Support</h2>
+    <h2 id="long-term-support" class="md-headline">End-Of-Life</h2>
     <p>
-      AngularJS Material has entered a Long Term Support (LTS) period which ends on December 31st,
-      2021. This date aligns with the
-      <a href="https://docs.angularjs.org/misc/version-support-status" target="_blank" rel="noopener">
-      AngularJS LTS</a> period. Explore End Of Life (EOL) options
-      <a href="https://blog.angular.io/finding-a-path-forward-with-angularjs-7e186fdd4429" target="_blank" rel="noopener">here</a>.
-    </p>
-    <p>
-      We now focus exclusively on providing fixes to bugs, in the 1.2.x branch of the library, that
-      satisfy at least one of the following criteria:
-    </p>
-    <ul>
-      <li>We receive a report of, or detect, a security weakness which is then verified</li>
-      <li>
-        A major browser releases a version that will cause current production applications
-        to stop working
-      </li>
-      <li>
-        The <a href="https://jquery.com/">jQuery library</a> releases a version that will cause
-        current production applications to stop working
-      </li>
-    </ul>
-    <p>
-      AngularJS Material 1.1.x will get a new version, if and only if, we verify a new severe
-      security weakness.
+      AngularJS Material support has officially ended as of January 2022. This date aligns with the end of
+      the <a href="https://docs.angularjs.org/misc/version-support-status" target="_blank" rel="noopener">
+      AngularJS LTS</a> period. Read the
+      <a href="https://goo.gle/angularjs-end-of-life" target="_blank" rel="noopener">
+        end-of-life announcement</a> for more details.
     </p>
     <p>
-      Learn how to report security issues
+      Find details on reporting security issues
       <a href="https://github.com/angular/material/blob/master/SECURITY.md">here</a>.
     </p>
     <h2 class="md-headline">Change Log</h2>

docs/config/template/index.template.html

@@ -150,8 +150,11 @@ <h2 class="md-toolbar-item md-breadcrumb md-headline" tabindex="-1">
       </div>
 
       <div class="eol-notice">
-        AngularJS Material is now in <a ng-href="/#long-term-support">Long Term Support (LTS) mode</a>.
-        Explore End Of Life (EOL) options <a href="https://blog.angular.io/finding-a-path-forward-with-angularjs-7e186fdd4429">here</a>.
+        <div>
+          AngularJS Material <a ng-href="https://docs.angularjs.org/misc/version-support-status">Long Term Support</a>
+          has officially ended as of January 2022. Read the
+          <a href="https://goo.gle/angularjs-end-of-life">End-Of-Life announcement</a>.
+        </div>
       </div>
 
     </md-toolbar>