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

Update flex links, add discount

pull/4016/head
Cagatay Civici 2023-06-01 14:08:18 +03:00
parent 1f03dcda6f
commit 8e9eb52639
5 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
assets/data/news.json
View File

@ -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;"

2
assets/menu/menu.json
View File

@ -481,7 +481,7 @@
{
"name": "PrimeFlex CSS",
"icon": "pi pi-table",
"href": "https://www.primefaces.org/primeflex"
"href": "https://primeflex.org"
},
{
"name": "Support",

6
doc/theming/PrimeFlexDoc.vue
View File

@ -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>

2
pages/landing/HeroSection.vue
View File

@ -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">

16
pages/uikit/index.vue
View File

@ -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">