Merge branch 'prod'
Cagatay Civici
commit
88adc65f22
|
|
@ -1,8 +1,8 @@
|
|||
{
|
||||
"id": 37,
|
||||
"content": "Unstyled mode preview featuring Tailwind.",
|
||||
"linkText": "Learn More",
|
||||
"linkHref": "https://youtu.be/JpYIX3V96gs",
|
||||
"id": 38,
|
||||
"content": "Summer Sale - Up to 50% Off at PrimeStore.",
|
||||
"linkText": "Buy Now",
|
||||
"linkHref": "https://www.primefaces.org/store",
|
||||
"backgroundStyle": "background-color:#4f8ff7",
|
||||
"textStyle": "color:#ffffff;font-weight:500",
|
||||
"linkStyle": "color:#ffffff;font-weight:700;text-decoration: underline;"
|
||||
|
|
|
|||
|
|
@ -481,7 +481,7 @@
|
|||
{
|
||||
"name": "PrimeFlex CSS",
|
||||
"icon": "pi pi-table",
|
||||
"href": "https://www.primefaces.org/primeflex"
|
||||
"href": "https://primeflex.org"
|
||||
},
|
||||
{
|
||||
"name": "Support",
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<DocSectionText v-bind="$attrs">
|
||||
<p>
|
||||
<a href="https://www.primefaces.org/primeflex/">PrimeFlex</a> is a lightweight responsive CSS utility library to accompany Prime UI libraries and static webpages as well. PrimeVue can be used with any CSS utility library like bootstrap
|
||||
and tailwind however PrimeFlex has benefits like integration with PrimeVue themes using CSS variables so that colors classes e.g. <i>bg-blue-500</i> receive the color code from the PrimeVue theme being used. PrimeVue follows the CSS
|
||||
utility approach of PrimeFlex and currently does not provide an extended style property like <i>sx</i>. Same approach is also utilized in <a href="https://blocks.primevue.org">PrimeBlocks for PrimeVue</a> project as well.
|
||||
<a href="https://primeflex.org/">PrimeFlex</a> is a lightweight responsive CSS utility library to accompany Prime UI libraries and static webpages as well. PrimeVue can be used with any CSS utility library like bootstrap and tailwind
|
||||
however PrimeFlex has benefits like integration with PrimeVue themes using CSS variables so that colors classes e.g. <i>bg-blue-500</i> receive the color code from the PrimeVue theme being used. PrimeVue follows the CSS utility approach
|
||||
of PrimeFlex and currently does not provide an extended style property like <i>sx</i>. Same approach is also utilized in <a href="https://blocks.primevue.org">PrimeBlocks for PrimeVue</a> project as well.
|
||||
</p>
|
||||
|
||||
<p>Here is an example to demonstrate how to align 3 buttons horizontally on bigger screens and display them as stacked on smaller ones.</p>
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</router-link>
|
||||
<div class="hero-box w-10rem h-10rem md:w-12rem md:h-12rem animation flex ml-4 md:ml-0 align-items-center justify-content-center" @click="navigateTo('https://www.primefaces.org/primeflex')">
|
||||
<div class="hero-box w-10rem h-10rem md:w-12rem md:h-12rem animation flex ml-4 md:ml-0 align-items-center justify-content-center" @click="navigateTo('https://primeflex.org')">
|
||||
<div class="flex flex-column align-items-center">
|
||||
<img src="https://primefaces.org/cdn/primevue/images/landing/css-icon.svg" alt="primevue icons" />
|
||||
<div class="name">
|
||||
|
|
|
|||
|
|
@ -127,9 +127,9 @@
|
|||
<div class="text-900 font-medium text-xl mb-2">Single Designer</div>
|
||||
<div class="text-600 font-medium">For individual designers</div>
|
||||
<hr class="my-3 mx-0 border-top-1 border-none surface-border" />
|
||||
<div v-if="pricing && pricing.single" class="flex flex-wrap gap-3">
|
||||
<span v-if="pricing.single.old" :class="pricing.single.old.class ? pricing.single.old.class : ''">{{ pricing.single.old.value || '' }}</span>
|
||||
<span v-if="pricing.single.new" :class="pricing.single.new.class ? pricing.single.new.class : ''">{{ pricing.single.new.value || '' }}</span>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<span class="text-2xl text-600 line-through">$49</span>
|
||||
<span class="text-2xl font-bold text-900">$99</span>
|
||||
</div>
|
||||
<hr class="my-3 mx-0 border-top-1 border-none surface-border" />
|
||||
<ul class="list-none p-0 m-0 flex-grow-1 text-lg">
|
||||
|
|
@ -168,9 +168,9 @@
|
|||
<div class="text-900 font-medium text-xl mb-2">Team</div>
|
||||
<div class="text-600 font-medium">For small teams</div>
|
||||
<hr class="my-3 mx-0 border-top-1 border-none surface-border" />
|
||||
<div v-if="pricing && pricing.team" class="flex flex-wrap gap-3">
|
||||
<span v-if="pricing.team.old" :class="pricing.team.old.class ? pricing.team.old.class : ''">{{ pricing.team.old.value || '' }}</span>
|
||||
<span v-if="pricing.team.new" :class="pricing.team.new.class ? pricing.team.new.class : ''">{{ pricing.team.new.value || '' }}</span>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<span class="text-2xl text-600 line-through">$249</span>
|
||||
<span class="text-2xl font-bold text-900">$149</span>
|
||||
</div>
|
||||
<hr class="my-3 mx-0 border-top-1 border-none surface-border" />
|
||||
<ul class="list-none p-0 m-0 flex-grow-1 text-lg">
|
||||
|
|
@ -209,8 +209,8 @@
|
|||
<div class="text-900 font-medium text-xl mb-2">Enterprise</div>
|
||||
<div class="text-600 font-medium">For large teams</div>
|
||||
<hr class="my-3 mx-0 border-top-1 border-none surface-border" />
|
||||
<div v-if="pricing && pricing.enterprise" class="flex flex-wrap gap-3">
|
||||
<span v-if="pricing.enterprise.new" :class="pricing.enterprise.new.class ? pricing.enterprise.new.class : ''">{{ pricing.enterprise.new.value || '' }}</span>
|
||||
<div class="flex gap-3 flex-wrap">
|
||||
<span class="text-2xl font-bold text-900">EXCLUSIVE DEALS</span>
|
||||
</div>
|
||||
<hr class="my-3 mx-0 border-top-1 border-none surface-border" />
|
||||
<ul class="list-none p-0 m-0 flex-grow-1 text-lg">
|
||||
|
|
|
|||
Loading…
Reference in New Issue