Update link styles

primefaces · Nov 27, 2023 · 027e4b3 · 027e4b3 · vercel · Nov 27, 2023
1 parent 6143455
commit 027e4b3
Show file tree

Hide file tree

Showing 6 changed files with 202 additions and 100 deletions.
diff --git a/src/app/showcase/doc/chart/accessibilitydoc.ts b/src/app/showcase/doc/chart/accessibilitydoc.ts
@@ -8,7 +8,7 @@ import { Code } from '../../domain/code';
             <div class="doc-section-description">
                 <h3>Screen Reader</h3>
                 <p>
-                    Chart components internally use <i>canvas</i> element, refer to the <a class="text-primary hover:underline font-semibold" href="https://www.chartjs.org/docs/latest/general/accessibility.html">Chart.js accessibility</a> guide for
+                    Chart components internally use <i>canvas</i> element, refer to the <a class="text-primary font-medium hover:underline" href="https://www.chartjs.org/docs/latest/general/accessibility.html">Chart.js accessibility</a> guide for
                     more information. The canvas element can be customized with <i>canvasProps</i> property to define aria roles and properties, in addition any content inside the component is directly passed as a child of the canvas to be able to
                     provide fallback content like a table.
                 </p>

diff --git a/src/app/showcase/pages/lts/lts.component.html b/src/app/showcase/pages/lts/lts.component.html
@@ -1,22 +1,31 @@
 <div>
-    <img alt="LTS Support" src="https://primefaces.org/cdn/primeng/images/lts/lts-header.jpg" class="w-full block mb-5" style=" border-radius: '20px'" />
+    <img alt="LTS Support" src="https://primefaces.org/cdn/primeng/images/lts/lts-header.jpg" class="w-full block mb-5"
+        style=" border-radius: '20px'" />
 
     <div class="flex flex-column xl:flex-row mb-5 gap-5">
         <div class="card xl:w-3 m-0 relative overflow-hidden">
-            <i class="pi pi-github absolute text-200" style="bottom: -50px; right: -50px; font-size: 200px; transform: rotateX(45deg) rotateY(0deg) rotateZ(-45deg)"></i>
+            <i class="pi pi-github absolute text-200"
+                style="bottom: -50px; right: -50px; font-size: 200px; transform: rotateX(45deg) rotateY(0deg) rotateZ(-45deg)"></i>
             <div class="text-2xl text-900 font-semibold mb-3 relative">Community Versions</div>
             <p class="m-0 line-height-3 relative text-lg text-800">
-                Angular is a fast paced technology with a new major version every 6 months. PrimeNG release cycle is aligned with Angular and every 6 months a new major PrimeNG version is released as open source that is compatible with the latest Angular core.
-                The maintenance releases of the latest PrimeNG version are provided as free and open source for the following 6 months until the new major Angular version is ready.
+                Angular is a fast paced technology with a new major version every 6 months. PrimeNG release cycle is
+                aligned with Angular and every 6 months a new major PrimeNG version is released as open source that is
+                compatible with the latest Angular core.
+                The maintenance releases of the latest PrimeNG version are provided as free and open source for the
+                following 6 months until the new major Angular version is ready.
             </p>
         </div>
-        <div class="card m-0 xl:w-9 text-white bg-cover" style="background-image: url('https://primefaces.org/cdn/primeng/images/lts/card-lts.jpg')">
+        <div class="card m-0 xl:w-9 text-white bg-cover"
+            style="background-image: url('https://primefaces.org/cdn/primeng/images/lts/card-lts.jpg')">
             <div class="text-2xl font-semibold mb-3">LTS Versions</div>
             <p class="m-0 line-height-3 text-lg">
-                Majority of the existing applications prefer to remain at a previous version due to stability requirements instead of upgrading to the latest version immediately.  
-                PrimeNG LTS is a support service to provide a license for the finest compatible version suited to you. 
-                LTS covers the prior two versions from the latest release, this means up to 18 months of almost bi-weekly releases to bring the latest defect fixes and security updates to your project. 
-                As an example, when PrimeNG moves to Angular 16, PrimeNG 15 and 14 will move to LTS support whereas STS (short term support) versions of PrimeNG 16 will be open source under MIT license 
+                Majority of the existing applications prefer to remain at a previous version due to stability
+                requirements instead of upgrading to the latest version immediately.
+                PrimeNG LTS is a support service to provide a license for the finest compatible version suited to you.
+                LTS covers the prior two versions from the latest release, this means up to 18 months of almost
+                bi-weekly releases to bring the latest defect fixes and security updates to your project.
+                As an example, when PrimeNG moves to Angular 16, PrimeNG 15 and 14 will move to LTS support whereas STS
+                (short term support) versions of PrimeNG 16 will be open source under MIT license
                 for at least 6 months until Angular/PrimeNG 17 is released.
             </p>
         </div>
@@ -25,7 +34,8 @@
         <div class="text-2xl text-900 font-semibold mb-3">Version Support</div>
         <p class="m-0 line-height-3 mb-5 text-secondary text-lg text-800">
             The following table provides the status for PrimeNG versions under support by LTS.
-            Legacy versions are only supported by <a [routerLink]="['/support']" class="font-semibold text-primary-500 no-underline hover:underline">PrimeNG PRO</a>.
+            Legacy versions are only supported by <a [routerLink]="['/support']"
+                class="text-primary font-medium hover:underline">PrimeNG PRO</a>.
         </p>
 
         <div class="doc-tablewrapper">
@@ -108,28 +118,36 @@
                     <i class="pi pi-check-circle mr-3 text-green-500"></i>
                     <span class="text-900 font-semibold text-xl">Security</span>
                 </div>
-                <p class="m-0 line-height-3 mb-3 text-secondary text-lg text-800">PrimeNG comes with a commitment to provide long-term support, including regular security updates to keep your system protected against emerging threats.</p>
+                <p class="m-0 line-height-3 mb-3 text-secondary text-lg text-800">PrimeNG comes with a commitment to
+                    provide long-term support, including regular security updates to keep your system protected against
+                    emerging threats.</p>
             </div>
             <div class="flex-1">
                 <div class="flex align-items-center mb-2">
                     <i class="pi pi-check-circle mr-3 text-green-500"></i>
                     <span class="text-900 font-semibold text-xl">Maintenance</span>
                 </div>
-                <p class="m-0 line-height-3 mb-3 text-secondary text-lg text-800">We understand the importance of maintaining a stable and reliable software system. Our team will provide ongoing maintenance to ensure that the software continues to function seamlessly and efficiently.</p>
+                <p class="m-0 line-height-3 mb-3 text-secondary text-lg text-800">We understand the importance of
+                    maintaining a stable and reliable software system. Our team will provide ongoing maintenance to
+                    ensure that the software continues to function seamlessly and efficiently.</p>
             </div>
             <div class="flex-1">
                 <div class="flex align-items-center mb-2">
                     <i class="pi pi-check-circle mr-3 text-green-500"></i>
                     <span class="text-900 font-semibold text-xl">Enhancements</span>
                 </div>
-                <p class="m-0 line-height-3 mb-3 text-secondary text-lg text-800">We are dedicated to continuously improving PrimeNG to meet the evolving needs of our users. As part of our long-term support, we will provide regular updates and enhancements to add new features and functionality.</p>
+                <p class="m-0 line-height-3 mb-3 text-secondary text-lg text-800">We are dedicated to continuously
+                    improving PrimeNG to meet the evolving needs of our users. As part of our long-term support, we will
+                    provide regular updates and enhancements to add new features and functionality.</p>
             </div>
         </div>
     </div>
     <div class="card mb-5">
         <div class="text-900 font-bold text-5xl mb-4 text-center">Pricing</div>
         <div class="mb-2 text-center line-height-3 text-lg">Choose the right plan for your business.</div>
-        <a href="https://www.primefaces.org/lts/licenses" class="mb-6 text-primary-500 no-underline hover:underline text-center block font-semibold">View License Details</a>
+        <a href="https://www.primefaces.org/lts/licenses"
+            class="mb-6 text-primary font-medium hover:underline text-center block">View License
+            Details</a>
 
         <div class="grid">
             <div class="col-12 lg:col-6">
@@ -141,7 +159,7 @@
                         <div class="flex gap-3 flex-wrap">
                             <div class="flex gap-3 flex-wrap">
                                 <span class="text-2xl font-medium text-600 line-through">$249</span>
-                            <span class="text-2xl font-bold text-900">$149</span>
+                                <span class="text-2xl font-bold text-900">$149</span>
                             </div>
                         </div>
                         <hr class="my-3 mx-0 border-top-1 border-none surface-border" />
@@ -168,7 +186,9 @@
                             </li>
                         </ul>
                         <hr class="mb-3 mx-0 border-top-1 border-none surface-border mt-auto" />
-                        <a href="https://www.primefaces.org/store/uikit.xhtml" pRipple class="bg-blue-500 text-white hover:bg-blue-400 p-3 w-full border-round text-center transition-colors transition-duration-300 font-bold">Buy Now</a>
+                        <a href="https://www.primefaces.org/store/uikit.xhtml" pRipple
+                            class="bg-blue-500 text-white hover:bg-blue-400 p-3 w-full border-round text-center transition-colors transition-duration-300 font-bold">Buy
+                            Now</a>
                     </div>
                 </div>
             </div>
@@ -182,7 +202,7 @@
                         <div class="flex gap-3 flex-wrap">
                             <div class="flex gap-3 flex-wrap">
                                 <span class="text-2xl font-medium text-600 line-through">$990</span>
-                            <span class="text-2xl font-bold text-900">$490</span>
+                                <span class="text-2xl font-bold text-900">$490</span>
                             </div>
                         </div>
                         <hr class="my-3 mx-0 border-top-1 border-none surface-border" />
@@ -209,7 +229,9 @@
                             </li>
                         </ul>
                         <hr class="mb-3 mx-0 border-top-1 border-none surface-border" />
-                        <a href="https://www.primefaces.org/store/uikit.xhtml" pRipple class="bg-purple-500 text-white hover:bg-purple-400 p-3 w-full border-round text-center transition-colors transition-duration-300 font-bold">Buy Now</a>
+                        <a href="https://www.primefaces.org/store/uikit.xhtml" pRipple
+                            class="bg-purple-500 text-white hover:bg-purple-400 p-3 w-full border-round text-center transition-colors transition-duration-300 font-bold">Buy
+                            Now</a>
                     </div>
                 </div>
             </div>
@@ -218,7 +240,11 @@
     <div class="card mb-5">
         <div class="text-2xl text-900 font-semibold mb-3">Usage</div>
         <p class="m-0 line-height-3 mb-5 text-secondary text-lg text-800">
-            LTS versions require a license key and a pass key to be verified at your main app component or main.ts before bootstrap process. The keys would be available at <a href="https://www.primefaces.org/store/lts.xhtml" class="font-semibold text-primary-500 no-underline hover:underline">PrimeStore</a> under LTS Licenses section.
+            LTS versions require a license key and a pass key to be verified at your main app component or main.ts
+            before bootstrap process. The keys would be available at <a
+                href="https://www.primefaces.org/store/lts.xhtml"
+                class="text-primary font-medium hover:underline">PrimeStore</a> under LTS Licenses
+            section.
         </p>
         <app-code [code]="code" [hideToggleCode]="true"></app-code>
     </div>
@@ -227,45 +253,64 @@
         <div class="flex flex-wrap text-lg -ml-5 -mt-5">
             <div class="w-full lg:w-4 p-5">
                 <div class="text-900 line-height-3 mb-2 font-medium">Is LTS License mandatory to use PrimeNG?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">No, all releases of the latest PrimeNG version are free to use under MIT License until a new major version comes which happens every 6 months.</p>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">No, all releases of the latest PrimeNG version are free
+                    to use under MIT License until a new major version comes which happens every 6 months.</p>
 
                 <div class="text-900 line-height-3 mb-2 font-medium">How long is the duration of the LTS license?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">Duration is 1 year for Basic License, for Extended License there is no limit.</p>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">Duration is 1 year for Basic License, for Extended
+                    License there is no limit.</p>
 
                 <div class="text-900 line-height-3 mb-2 font-medium">What happens after the license duration ends?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">A message will be displayed at the application screen and license needs to be renewed at PrimeStore. This only applies to Basic License as Extended License has no time limit.</p>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">A message will be displayed at the application screen
+                    and license needs to be renewed at PrimeStore. This only applies to Basic License as Extended
+                    License has no time limit.</p>
 
-                <div class="text-900 line-height-3 mb-2 font-medium">Is a license bound to a specific major version?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">Yes, a license key is tied to the major version such as 15 and same license key cannot be used on another major version like 14.</p>
+                <div class="text-900 line-height-3 mb-2 font-medium">Is a license bound to a specific major version?
+                </div>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">Yes, a license key is tied to the major version such as
+                    15 and same license key cannot be used on another major version like 14.</p>
 
                 <div class="text-900 line-height-3 mb-2 font-medium">How can I assign my license to a version?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">At PrimeStore, there is an "Assign" feature that activates your license by selecting a version.</p>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">At PrimeStore, there is an "Assign" feature that
+                    activates your license by selecting a version.</p>
             </div>
             <div class="w-full lg:w-4 p-5">
                 <div class="text-900 line-height-3 mb-2 font-medium">Does the license renew automatically?</div>
                 <p class="mt-0 mb-5 p-0 line-height-3 text-800">No, renewal should be done manually at PrimeStore.</p>
 
-                <div class="text-900 line-height-3 mb-2 font-medium">How are LTS and Community versions differentiated at NPM?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">LTS releases have <span class="font-bold">-lts</span> suffix such as <span class="font-bold">14.2.4-lts</span>.</p>
+                <div class="text-900 line-height-3 mb-2 font-medium">How are LTS and Community versions differentiated
+                    at NPM?</div>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">LTS releases have <span class="font-bold">-lts</span>
+                    suffix such as <span class="font-bold">14.2.4-lts</span>.</p>
 
-                <div class="text-900 line-height-3 mb-2 font-medium">Is the license per organization, per developer or per cpu/server?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">LTS license is per organization, there is no limit on the number of developers, projects or hardware.</p>
+                <div class="text-900 line-height-3 mb-2 font-medium">Is the license per organization, per developer or
+                    per cpu/server?</div>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">LTS license is per organization, there is no limit on
+                    the number of developers, projects or hardware.</p>
 
-                <div class="text-900 line-height-3 mb-2 font-medium">Can subsidiary companies share the license of a parent company?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">No, license owner needs to be a separate entity as a result each company requires a separate license.</p>
+                <div class="text-900 line-height-3 mb-2 font-medium">Can subsidiary companies share the license of a
+                    parent company?</div>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">No, license owner needs to be a separate entity as a
+                    result each company requires a separate license.</p>
 
                 <div class="text-900 line-height-3 mb-2 font-medium"> Does LTS provide a support contact?</div>
-                <p class="mt-0 p-0 line-height-3 text-800">No, PrimeNG PRO is the service where response of PrimeTek engineers is secured within 1 business day.</p>
+                <p class="mt-0 p-0 line-height-3 text-800">No, PrimeNG PRO is the service where response of PrimeTek
+                    engineers is secured within 1 business day.</p>
             </div>
             <div class="w-full lg:w-4 p-5">
-                <div class="text-900 line-height-3 mb-2 font-medium">Can LTS releases be used in open source projects?</div>
-                <p class="mt-0 mb-5 p-0 line-height-3 text-800">No, this means violation of the license as keys cannot be shared.</p>
+                <div class="text-900 line-height-3 mb-2 font-medium">Can LTS releases be used in open source projects?
+                </div>
+                <p class="mt-0 mb-5 p-0 line-height-3 text-800">No, this means violation of the license as keys cannot
+                    be shared.</p>
 
                 <div class="text-900 line-height-3 mb-2 font-medium">Does PRO provide access to the LTS releases?</div>
                 <p class="mt-0 mb-5 p-0 line-height-3 text-800">Yes, PRO users are granted a basic license.</p>
 
                 <div class="text-900 line-height-3 mb-2 font-medium">What is the difference between LTS and PRO?</div>
-                <p class="mt-0 p-0 line-height-3 text-800">PrimeNG PRO is a premium support service delivered via an exclusive JIRA instance where support engineers of PrimeTek provide assistance within 1 business day to the raised tickets. LTS on the other hand provides a license to utilize the long term support versions.</p>
+                <p class="mt-0 p-0 line-height-3 text-800">PrimeNG PRO is a premium support service delivered via an
+                    exclusive JIRA instance where support engineers of PrimeTek provide assistance within 1 business day
+                    to the raised tickets. LTS on the other hand provides a license to utilize the long term support
+                    versions.</p>
             </div>
         </div>
     </div>