vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Update FeaturesSection.vue

pull/4649/head
Tuğçe Küçükoğlu 2023-10-17 15:39:53 +03:00
parent c7a5ffd351
commit a37fb0d010
1 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
pages/landing/FeaturesSection.vue
View File

@ -6,56 +6,56 @@
<div class="features-container"> <div class="features-container">
<div class="grid"> <div class="grid">
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center"> <div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div v-animate="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500"> <div v-animate.once="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-components.svg" alt="components icon" class="block mb-3" /> <img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-components.svg" alt="components icon" class="block mb-3" />
<div class="font-semibold mb-3 text-lg">80+ UI Components</div> <div class="font-semibold mb-3 text-lg">80+ UI Components</div>
<p class="m-0 text-secondary font-medium">The ultimate set of UI Components to assist you with 80+ impressive Vue Components.</p> <p class="m-0 text-secondary font-medium">The ultimate set of UI Components to assist you with 80+ impressive Vue Components.</p>
</div> </div>
</div> </div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center"> <div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div v-animate="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500"> <div v-animate.once="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-theme.svg" alt="components icon" class="block mb-3" /> <img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-theme.svg" alt="components icon" class="block mb-3" />
<div class="font-semibold mb-3 text-lg">Styled or Unstyled</div> <div class="font-semibold mb-3 text-lg">Styled or Unstyled</div>
<p class="m-0 text-secondary font-medium">Choose from a variety of pre-built themes or implement your design systems with the CSS library of your choice like TailwindCSS.</p> <p class="m-0 text-secondary font-medium">Choose from a variety of pre-built themes or implement your design systems with the CSS library of your choice like TailwindCSS.</p>
</div> </div>
</div> </div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center"> <div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div v-animate="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500"> <div v-animate.once="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-community.svg" alt="components icon" class="block mb-3" /> <img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-community.svg" alt="components icon" class="block mb-3" />
<div class="font-semibold mb-3 text-lg">Community</div> <div class="font-semibold mb-3 text-lg">Community</div>
<p class="m-0 text-secondary font-medium">Connect with the other open source community members, collaborate and have a voice in the project roadmap.</p> <p class="m-0 text-secondary font-medium">Connect with the other open source community members, collaborate and have a voice in the project roadmap.</p>
</div> </div>
</div> </div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center"> <div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div v-animate="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500"> <div v-animate.once="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-accessibility.svg" alt="components icon" class="block mb-3" /> <img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-accessibility.svg" alt="components icon" class="block mb-3" />
<div class="font-semibold mb-3 text-lg">Accessibility</div> <div class="font-semibold mb-3 text-lg">Accessibility</div>
<p class="m-0 text-secondary font-medium">Compliant with the Web Content Accessibility Guidelines (WCAG 2.0).</p> <p class="m-0 text-secondary font-medium">Compliant with the Web Content Accessibility Guidelines (WCAG 2.0).</p>
</div> </div>
</div> </div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center"> <div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div v-animate="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500"> <div v-animate.once="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-support.svg" alt="components icon" class="block mb-3" /> <img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-support.svg" alt="components icon" class="block mb-3" />
<div class="font-semibold mb-3 text-lg">Enterprise Support</div> <div class="font-semibold mb-3 text-lg">Enterprise Support</div>
<p class="m-0 text-secondary font-medium">Exceptional support service featuring response within 1 business day and option to request enhancements and new features for the library.</p> <p class="m-0 text-secondary font-medium">Exceptional support service featuring response within 1 business day and option to request enhancements and new features for the library.</p>
</div> </div>
</div> </div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center"> <div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div v-animate="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500"> <div v-animate.once="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-mobile.svg" alt="components icon" class="block mb-3" /> <img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-mobile.svg" alt="components icon" class="block mb-3" />
<div class="font-semibold mb-3 text-lg">Mobile</div> <div class="font-semibold mb-3 text-lg">Mobile</div>
<p class="m-0 text-secondary font-medium">First class support for responsive design led by touch optimized elements.</p> <p class="m-0 text-secondary font-medium">First class support for responsive design led by touch optimized elements.</p>
</div> </div>
</div> </div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center"> <div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div v-animate="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500"> <div v-animate.once="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-productivity.svg" alt="components icon" class="block mb-3" /> <img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-productivity.svg" alt="components icon" class="block mb-3" />
<div class="font-semibold mb-3 text-lg">Blocks</div> <div class="font-semibold mb-3 text-lg">Blocks</div>
<p class="m-0 text-secondary font-medium">400+ pre-designed copy paste ready UI blocks to build spectacular apps in no time.</p> <p class="m-0 text-secondary font-medium">400+ pre-designed copy paste ready UI blocks to build spectacular apps in no time.</p>
</div> </div>
</div> </div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center"> <div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div v-animate="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500"> <div v-animate.once="{ enterClass: 'fadein' }" class="box p-4 w-full animation-duration-500">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-ts.svg" alt="components icon" class="block mb-3" /> <img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-ts.svg" alt="components icon" class="block mb-3" />
<div class="font-semibold mb-3 text-lg">Typescript</div> <div class="font-semibold mb-3 text-lg">Typescript</div>
<p class="m-0 text-secondary font-medium">Top-notch support for Typescript with types and tooling assistance.</p> <p class="m-0 text-secondary font-medium">Top-notch support for Typescript with types and tooling assistance.</p>