Migrated shrink and grow
parent
d96f59fb59
commit
ec6156f1ce
|
@ -22,7 +22,7 @@
|
||||||
<div class="flex flex-col w-6/12 gap-8 pt-20 pr-4">
|
<div class="flex flex-col w-6/12 gap-8 pt-20 pr-4">
|
||||||
<div class="box p-6 animate-fadein animate-duration-500">
|
<div class="box p-6 animate-fadein animate-duration-500">
|
||||||
<div class="flex gap-2">
|
<div class="flex gap-2">
|
||||||
<div class="w-24 flex-shrink-0">
|
<div class="w-24 shrink-0">
|
||||||
<span class="text-surface-500 dark:text-surface-400 font-medium block mb-4">Amount</span>
|
<span class="text-surface-500 dark:text-surface-400 font-medium block mb-4">Amount</span>
|
||||||
<InputNumber v-model="value1" mode="currency" currency="USD" locale="en-US" class="w-full" inputClass="w-full" />
|
<InputNumber v-model="value1" mode="currency" currency="USD" locale="en-US" class="w-full" inputClass="w-full" />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
@contextmenu="onRightClick($event, product.id)"
|
@contextmenu="onRightClick($event, product.id)"
|
||||||
>
|
>
|
||||||
<div class="flex flex-wrap p-2 items-center gap-4">
|
<div class="flex flex-wrap p-2 items-center gap-4">
|
||||||
<img class="w-16 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + product.image" :alt="product.name" />
|
<img class="w-16 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + product.image" :alt="product.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-bold">{{ product.name }}</span>
|
<span class="font-bold">{{ product.name }}</span>
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
|
@ -87,7 +87,7 @@ export default {
|
||||||
@contextmenu="onRightClick($event, product.id)"
|
@contextmenu="onRightClick($event, product.id)"
|
||||||
>
|
>
|
||||||
<div class="flex flex-wrap p-2 items-center gap-4">
|
<div class="flex flex-wrap p-2 items-center gap-4">
|
||||||
<img class="w-16 flex-shrink-0 rounded" :src="'/images/product/' + product.image" :alt="product.name" />
|
<img class="w-16 shrink-0 rounded" :src="'/images/product/' + product.image" :alt="product.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-bold">{{ product.name }}</span>
|
<span class="font-bold">{{ product.name }}</span>
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
|
@ -122,7 +122,7 @@ export default {
|
||||||
@contextmenu="onRightClick($event, product.id)"
|
@contextmenu="onRightClick($event, product.id)"
|
||||||
>
|
>
|
||||||
<div class="flex flex-wrap p-2 items-center gap-4">
|
<div class="flex flex-wrap p-2 items-center gap-4">
|
||||||
<img class="w-16 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + product.image" :alt="product.name" />
|
<img class="w-16 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + product.image" :alt="product.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-bold">{{ product.name }}</span>
|
<span class="font-bold">{{ product.name }}</span>
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
|
@ -212,7 +212,7 @@ export default {
|
||||||
@contextmenu="onRightClick($event, product.id)"
|
@contextmenu="onRightClick($event, product.id)"
|
||||||
>
|
>
|
||||||
<div class="flex flex-wrap p-2 items-center gap-4">
|
<div class="flex flex-wrap p-2 items-center gap-4">
|
||||||
<img class="w-16 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + product.image" :alt="product.name" />
|
<img class="w-16 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + product.image" :alt="product.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-bold">{{ product.name }}</span>
|
<span class="font-bold">{{ product.name }}</span>
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
<Drawer v-model:visible="visible">
|
<Drawer v-model:visible="visible">
|
||||||
<template #container="{ closeCallback }">
|
<template #container="{ closeCallback }">
|
||||||
<div class="flex flex-col h-full">
|
<div class="flex flex-col h-full">
|
||||||
<div class="flex items-center justify-between px-6 pt-4 flex-shrink-0">
|
<div class="flex items-center justify-between px-6 pt-4 shrink-0">
|
||||||
<span class="inline-flex items-center gap-2">
|
<span class="inline-flex items-center gap-2">
|
||||||
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
<path
|
<path
|
||||||
|
@ -21,7 +21,7 @@
|
||||||
<span class="font-semibold text-2xl text-primary">Your Logo</span>
|
<span class="font-semibold text-2xl text-primary">Your Logo</span>
|
||||||
</span>
|
</span>
|
||||||
<span>
|
<span>
|
||||||
<Button type="button" @click="closeCallback" icon="pi pi-times" rounded outlined class="h-8 w-8"></Button>
|
<Button type="button" @click="closeCallback" icon="pi pi-times" rounded outlined></Button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="overflow-y-auto">
|
<div class="overflow-y-auto">
|
||||||
|
@ -202,7 +202,7 @@ export default {
|
||||||
<Drawer v-model:visible="visible">
|
<Drawer v-model:visible="visible">
|
||||||
<template #container="{ closeCallback }">
|
<template #container="{ closeCallback }">
|
||||||
<div class="flex flex-col h-full">
|
<div class="flex flex-col h-full">
|
||||||
<div class="flex items-center justify-between px-6 pt-4 flex-shrink-0">
|
<div class="flex items-center justify-between px-6 pt-4 shrink-0">
|
||||||
<span class="inline-flex items-center gap-2">
|
<span class="inline-flex items-center gap-2">
|
||||||
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
<path d="..." fill="var(--p-primary-color)" />
|
<path d="..." fill="var(--p-primary-color)" />
|
||||||
|
@ -211,7 +211,7 @@ export default {
|
||||||
<span class="font-semibold text-2xl text-primary">Your Logo</span>
|
<span class="font-semibold text-2xl text-primary">Your Logo</span>
|
||||||
</span>
|
</span>
|
||||||
<span>
|
<span>
|
||||||
<Button type="button" @click="closeCallback" icon="pi pi-times" rounded outlined class="h-8 w-8"></Button>
|
<Button type="button" @click="closeCallback" icon="pi pi-times" rounded outlined></Button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="overflow-y-auto">
|
<div class="overflow-y-auto">
|
||||||
|
@ -385,7 +385,7 @@ export default {
|
||||||
<Drawer v-model:visible="visible">
|
<Drawer v-model:visible="visible">
|
||||||
<template #container="{ closeCallback }">
|
<template #container="{ closeCallback }">
|
||||||
<div class="flex flex-col h-full">
|
<div class="flex flex-col h-full">
|
||||||
<div class="flex items-center justify-between px-6 pt-4 flex-shrink-0">
|
<div class="flex items-center justify-between px-6 pt-4 shrink-0">
|
||||||
<span class="inline-flex items-center gap-2">
|
<span class="inline-flex items-center gap-2">
|
||||||
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
<path
|
<path
|
||||||
|
@ -400,7 +400,7 @@ export default {
|
||||||
<span class="font-semibold text-2xl text-primary">Your Logo</span>
|
<span class="font-semibold text-2xl text-primary">Your Logo</span>
|
||||||
</span>
|
</span>
|
||||||
<span>
|
<span>
|
||||||
<Button type="button" @click="closeCallback" icon="pi pi-times" rounded outlined class="h-8 w-8"></Button>
|
<Button type="button" @click="closeCallback" icon="pi pi-times" rounded outlined></Button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="overflow-y-auto">
|
<div class="overflow-y-auto">
|
||||||
|
@ -586,7 +586,7 @@ export default {
|
||||||
<Drawer v-model:visible="visible">
|
<Drawer v-model:visible="visible">
|
||||||
<template #container="{ closeCallback }">
|
<template #container="{ closeCallback }">
|
||||||
<div class="flex flex-col h-full">
|
<div class="flex flex-col h-full">
|
||||||
<div class="flex items-center justify-between px-6 pt-4 flex-shrink-0">
|
<div class="flex items-center justify-between px-6 pt-4 shrink-0">
|
||||||
<span class="inline-flex items-center gap-2">
|
<span class="inline-flex items-center gap-2">
|
||||||
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
<path
|
<path
|
||||||
|
@ -601,7 +601,7 @@ export default {
|
||||||
<span class="font-semibold text-2xl text-primary">Your Logo</span>
|
<span class="font-semibold text-2xl text-primary">Your Logo</span>
|
||||||
</span>
|
</span>
|
||||||
<span>
|
<span>
|
||||||
<Button type="button" @click="closeCallback" icon="pi pi-times" rounded outlined class="h-8 w-8"></Button>
|
<Button type="button" @click="closeCallback" icon="pi pi-times" rounded outlined></Button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="overflow-y-auto">
|
<div class="overflow-y-auto">
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
<OrderList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
<OrderList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="flex flex-wrap p-1 items-center gap-4">
|
<div class="flex flex-wrap p-1 items-center gap-4">
|
||||||
<img class="w-12 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
<img class="w-12 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-medium">{{ item.name }}</span>
|
<span class="font-medium">{{ item.name }}</span>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
|
@ -33,7 +33,7 @@ export default {
|
||||||
<OrderList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
<OrderList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="flex flex-wrap p-1 items-center gap-4">
|
<div class="flex flex-wrap p-1 items-center gap-4">
|
||||||
<img class="w-12 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
<img class="w-12 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-medium">{{ item.name }}</span>
|
<span class="font-medium">{{ item.name }}</span>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
|
@ -52,7 +52,7 @@ export default {
|
||||||
<OrderList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
<OrderList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="flex flex-wrap p-1 items-center gap-4">
|
<div class="flex flex-wrap p-1 items-center gap-4">
|
||||||
<img class="w-12 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
<img class="w-12 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-medium">{{ item.name }}</span>
|
<span class="font-medium">{{ item.name }}</span>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
|
@ -87,7 +87,7 @@ export default {
|
||||||
<OrderList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
<OrderList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="flex flex-wrap p-1 items-center gap-4">
|
<div class="flex flex-wrap p-1 items-center gap-4">
|
||||||
<img class="w-12 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
<img class="w-12 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-medium">{{ item.name }}</span>
|
<span class="font-medium">{{ item.name }}</span>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
<PickList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
<PickList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem">
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="flex flex-wrap p-1 items-center gap-4">
|
<div class="flex flex-wrap p-1 items-center gap-4">
|
||||||
<img class="w-12 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
<img class="w-12 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-medium">{{ item.name }}</span>
|
<span class="font-medium">{{ item.name }}</span>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
|
@ -34,7 +34,7 @@ export default {
|
||||||
<PickList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem>
|
<PickList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem>
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="flex flex-wrap p-1 items-center gap-4">
|
<div class="flex flex-wrap p-1 items-center gap-4">
|
||||||
<img class="w-12 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
<img class="w-12 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-medium">{{ item.name }}</span>
|
<span class="font-medium">{{ item.name }}</span>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
|
@ -53,7 +53,7 @@ export default {
|
||||||
<PickList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem>
|
<PickList v-model="products" dataKey="id" breakpoint="1400px" scrollHeight="20rem>
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="flex flex-wrap p-1 items-center gap-4">
|
<div class="flex flex-wrap p-1 items-center gap-4">
|
||||||
<img class="w-12 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
<img class="w-12 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-medium">{{ item.name }}</span>
|
<span class="font-medium">{{ item.name }}</span>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
|
@ -88,7 +88,7 @@ export default {
|
||||||
<PickList v-model="products" dataKey="id" breakpoint="1400px">
|
<PickList v-model="products" dataKey="id" breakpoint="1400px">
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="flex flex-wrap p-1 items-center gap-4">
|
<div class="flex flex-wrap p-1 items-center gap-4">
|
||||||
<img class="w-12 flex-shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
<img class="w-12 shrink-0 rounded" :src="'https://primefaces.org/cdn/primevue/images/product/' + item.image" :alt="item.name" />
|
||||||
<div class="flex-1 flex flex-col gap-1">
|
<div class="flex-1 flex flex-col gap-1">
|
||||||
<span class="font-medium">{{ item.name }}</span>
|
<span class="font-medium">{{ item.name }}</span>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
<div class="overflow-auto">
|
<div class="overflow-auto">
|
||||||
<div style="min-width: 1200px">
|
<div style="min-width: 1200px">
|
||||||
<div class="flex gap-4 mb-4">
|
<div class="flex gap-4 mb-4">
|
||||||
<div class="flex-shrink-0 w-56"></div>
|
<div class="shrink-0 w-56"></div>
|
||||||
<div class="flex-1 bg-gray-500 text-white font-bold text-center p-4 text-xl rounded">Q1</div>
|
<div class="flex-1 bg-gray-500 text-white font-bold text-center p-4 text-xl rounded">Q1</div>
|
||||||
<div class="flex-1 bg-gray-500 text-white font-bold text-center p-4 text-xl rounded">Q2</div>
|
<div class="flex-1 bg-gray-500 text-white font-bold text-center p-4 text-xl rounded">Q2</div>
|
||||||
<div class="flex-1 bg-gray-500 text-white font-bold text-center p-4 text-xl rounded">Q3</div>
|
<div class="flex-1 bg-gray-500 text-white font-bold text-center p-4 text-xl rounded">Q3</div>
|
||||||
|
@ -25,7 +25,7 @@
|
||||||
|
|
||||||
<div class="flex flex-col gap-4">
|
<div class="flex flex-col gap-4">
|
||||||
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
||||||
<div class="flex-shrink-0 p-4 bg-blue-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">COMPONENTS</div>
|
<div class="shrink-0 p-4 bg-blue-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">COMPONENTS</div>
|
||||||
<div class="flex-1 flex gap-4 flex-col">
|
<div class="flex-1 flex gap-4 flex-col">
|
||||||
<div class="p-4 bg-surface-0 dark:bg-surface-900 rounded border-blue-500 border-l-8">
|
<div class="p-4 bg-surface-0 dark:bg-surface-900 rounded border-blue-500 border-l-8">
|
||||||
<h2 class="text-lg font-bold mt-0 mb-2">New Theming</h2>
|
<h2 class="text-lg font-bold mt-0 mb-2">New Theming</h2>
|
||||||
|
@ -99,7 +99,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
||||||
<div class="flex-shrink-0 p-4 bg-indigo-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">Figma UI Kit</div>
|
<div class="shrink-0 p-4 bg-indigo-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">Figma UI Kit</div>
|
||||||
<div class="flex-1 flex gap-4 flex-col"></div>
|
<div class="flex-1 flex gap-4 flex-col"></div>
|
||||||
<div class="flex-1 flex gap-4 flex-col">
|
<div class="flex-1 flex gap-4 flex-col">
|
||||||
<div class="p-4 bg-surface-0 dark:bg-surface-900 rounded border-indigo-500 border-l-8">
|
<div class="p-4 bg-surface-0 dark:bg-surface-900 rounded border-indigo-500 border-l-8">
|
||||||
|
@ -129,7 +129,7 @@
|
||||||
<div class="flex-1 flex gap-4 flex-col"></div>
|
<div class="flex-1 flex gap-4 flex-col"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
||||||
<div class="flex-shrink-0 p-4 bg-teal-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">SHOWCASE</div>
|
<div class="shrink-0 p-4 bg-teal-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">SHOWCASE</div>
|
||||||
<div class="flex-1 flex gap-4 flex-col"></div>
|
<div class="flex-1 flex gap-4 flex-col"></div>
|
||||||
<div class="flex-1 flex gap-4 flex-col"></div>
|
<div class="flex-1 flex gap-4 flex-col"></div>
|
||||||
<div class="flex-1 flex gap-4 flex-col">
|
<div class="flex-1 flex gap-4 flex-col">
|
||||||
|
@ -144,7 +144,7 @@
|
||||||
<div class="flex-1 flex gap-4 flex-col"></div>
|
<div class="flex-1 flex gap-4 flex-col"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
||||||
<div class="flex-shrink-0 p-4 bg-orange-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">PrimeBlocks</div>
|
<div class="shrink-0 p-4 bg-orange-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">PrimeBlocks</div>
|
||||||
<div class="flex-1 flex gap-4 flex-col"></div>
|
<div class="flex-1 flex gap-4 flex-col"></div>
|
||||||
<div class="flex-1 flex gap-4 flex-col">
|
<div class="flex-1 flex gap-4 flex-col">
|
||||||
<div class="p-4 bg-surface-0 dark:bg-surface-900 rounded border-orange-500 border-l-8">
|
<div class="p-4 bg-surface-0 dark:bg-surface-900 rounded border-orange-500 border-l-8">
|
||||||
|
@ -167,7 +167,7 @@
|
||||||
<div class="flex-1 flex gap-4 flex-col"></div>
|
<div class="flex-1 flex gap-4 flex-col"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
<div class="flex gap-4 border-b border-surface-200 dark:border-surface-700 pb-4">
|
||||||
<div class="flex-shrink-0 p-4 bg-pink-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">Design</div>
|
<div class="shrink-0 p-4 bg-pink-500 text-white rounded font-bold text-lg flex items-center justify-center w-56">Design</div>
|
||||||
<div class="flex-1 flex gap-4 flex-col">
|
<div class="flex-1 flex gap-4 flex-col">
|
||||||
<div class="p-4 bg-surface-0 dark:bg-surface-900 rounded border-pink-500 border-l-8">
|
<div class="p-4 bg-surface-0 dark:bg-surface-900 rounded border-pink-500 border-l-8">
|
||||||
<h2 class="text-lg font-bold mt-0 mb-2">New UI Theme</h2>
|
<h2 class="text-lg font-bold mt-0 mb-2">New UI Theme</h2>
|
||||||
|
|
|
@ -160,7 +160,7 @@
|
||||||
<span class="text-2xl font-bold text-surface-500 dark:text-surface-400">$99</span>
|
<span class="text-2xl font-bold text-surface-500 dark:text-surface-400">$99</span>
|
||||||
</div>
|
</div>
|
||||||
<hr class="my-4 mx-0 border-t border-0 border-surface-200 dark:border-surface-700" />
|
<hr class="my-4 mx-0 border-t border-0 border-surface-200 dark:border-surface-700" />
|
||||||
<ul class="list-none p-0 m-0 flex-grow-1 text-lg">
|
<ul class="list-none p-0 m-0 grow text-lg">
|
||||||
<li class="flex items-center mb-4">
|
<li class="flex items-center mb-4">
|
||||||
<i class="pi pi-check-circle text-green-500 mr-2"></i>
|
<i class="pi pi-check-circle text-green-500 mr-2"></i>
|
||||||
<span class="font-bold">1 Designer</span>
|
<span class="font-bold">1 Designer</span>
|
||||||
|
@ -202,7 +202,7 @@
|
||||||
<span class="text-2xl font-bold text-surface-500 dark:text-surface-400">$249</span>
|
<span class="text-2xl font-bold text-surface-500 dark:text-surface-400">$249</span>
|
||||||
</div>
|
</div>
|
||||||
<hr class="my-4 mx-0 border-t border-0 border-surface-200 dark:border-surface-700" />
|
<hr class="my-4 mx-0 border-t border-0 border-surface-200 dark:border-surface-700" />
|
||||||
<ul class="list-none p-0 m-0 flex-grow-1 text-lg">
|
<ul class="list-none p-0 m-0 grow text-lg">
|
||||||
<li class="flex items-center mb-4">
|
<li class="flex items-center mb-4">
|
||||||
<i class="pi pi-check-circle text-green-500 mr-2"></i>
|
<i class="pi pi-check-circle text-green-500 mr-2"></i>
|
||||||
<span class="font-bold">Up to 5 Designers</span>
|
<span class="font-bold">Up to 5 Designers</span>
|
||||||
|
@ -244,7 +244,7 @@
|
||||||
<span class="text-2xl font-bold">EXCLUSIVE DEALS</span>
|
<span class="text-2xl font-bold">EXCLUSIVE DEALS</span>
|
||||||
</div>
|
</div>
|
||||||
<hr class="my-4 mx-0 border-t border-0 border-surface-200 dark:border-surface-700" />
|
<hr class="my-4 mx-0 border-t border-0 border-surface-200 dark:border-surface-700" />
|
||||||
<ul class="list-none p-0 m-0 flex-grow-1 text-lg">
|
<ul class="list-none p-0 m-0 grow text-lg">
|
||||||
<li class="flex items-center mb-4">
|
<li class="flex items-center mb-4">
|
||||||
<i class="pi pi-check-circle text-green-500 mr-2"></i>
|
<i class="pi pi-check-circle text-green-500 mr-2"></i>
|
||||||
<span class="font-bold">Unlimited Designers</span>
|
<span class="font-bold">Unlimited Designers</span>
|
||||||
|
|
Loading…
Reference in New Issue