Update features section

pull/4591/head
Cagatay Civici 2023-10-10 18:20:54 +03:00
parent 70a9978e6b
commit 49f24b6a85
3 changed files with 15 additions and 14 deletions

View File

@ -46,7 +46,7 @@ const useStackBlitz = (language, code, service, extPages, dependencies, componen
template: 'node',
description: embedded
? "This example demonstrates how to style components with Tailwind CSS using PrimeVue's unstyled property. As mentioned in the PrimeVue documentation, components can be styled or have HTML attributes added using a global or inline pass through approach. In this example, we utilize the global PT approach with Tailwind CSS."
: '**\n PrimeVue is an open source UI library for Vue featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock, which has 400+ ready to use UI blocks to build spectacular applications in no time.',
: '**\n PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock, which has 400+ ready to use UI blocks to build spectacular applications in no time.',
dependencies: stackBlitzParameters.dependencies,
files
};

View File

@ -30,7 +30,7 @@
</p>
<DocSectionCode :code="code3" hideToggleCode importCode hideCodeSandbox hideStackBlitz />
<p>Voilà 💚, you now have access to 90+ awesome Vue UI components styled with Tailwind that will work in harmony with the rest of your application.</p>
<p>Voilà 💚, you now have access to 80+ awesome Vue UI components styled with Tailwind that will work in harmony with the rest of your application.</p>
</DocSectionText>
</template>

View File

@ -8,8 +8,16 @@
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div class="box p-4 w-full">
<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">90+ UI Components</div>
<p class="m-0 text-secondary font-medium">The ultimate set of UI Components to assist you with 90+ impressive Vue Components.</p>
<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>
</div>
</div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div class="box p-4 w-full">
<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>
<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 class="col-12 md:col-6 xl:col-3 flex justify-content-center">
@ -19,13 +27,6 @@
<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 class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div class="box p-4 w-full">
<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">Productivity</div>
<p class="m-0 text-secondary font-medium">Boost your productivity by achieving more in less time and accomplish amazing results.</p>
</div>
</div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div class="box p-4 w-full">
<img src="https://primefaces.org/cdn/primevue/images/landing/features/icon-accessibility.svg" alt="components icon" class="block mb-3" />
@ -49,9 +50,9 @@
</div>
<div class="col-12 md:col-6 xl:col-3 flex justify-content-center">
<div class="box p-4 w-full">
<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">Themes</div>
<p class="m-0 text-secondary font-medium">Built on a design-agnostic api, choose from a vast amount of themes such as material, bootstrap, custom or develop your own.</p>
<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>
<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 class="col-12 md:col-6 xl:col-3 flex justify-content-center">