@appcorp/app-corp-vista 0.2.1 → 0.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/organisms/vista-product-feature-v1/vista-product-feature-v1.d.ts +2 -0
- package/organisms/{vista-product-features-v1/vista-product-features-v1.js → vista-product-feature-v1/vista-product-feature-v1.js} +3 -3
- package/organisms/vista-product-feature-v2/vista-product-feature-v2.d.ts +2 -0
- package/organisms/{vista-product-features-v2/vista-product-features-v2.js → vista-product-feature-v2/vista-product-feature-v2.js} +3 -3
- package/organisms/vista-product-feature-v3/vista-product-feature-v3.d.ts +2 -0
- package/organisms/{vista-product-features-v3/vista-product-features-v3.js → vista-product-feature-v3/vista-product-feature-v3.js} +3 -3
- package/organisms/vista-product-feature-v4/vista-product-feature-v4.d.ts +2 -0
- package/organisms/{vista-product-features-v4/vista-product-features-v4.js → vista-product-feature-v4/vista-product-feature-v4.js} +3 -3
- package/organisms/vista-product-feature-v5/vista-product-feature-v5.d.ts +2 -0
- package/organisms/{vista-product-features-v5/vista-product-features-v5.js → vista-product-feature-v5/vista-product-feature-v5.js} +3 -3
- package/organisms/vista-product-feature-v6/vista-product-feature-v6.d.ts +2 -0
- package/organisms/{vista-product-features-v6/vista-product-features-v6.js → vista-product-feature-v6/vista-product-feature-v6.js} +3 -3
- package/organisms/vista-product-feature-v7/vista-product-feature-v7.d.ts +2 -0
- package/organisms/{vista-product-features-v7/vista-product-features-v7.js → vista-product-feature-v7/vista-product-feature-v7.js} +3 -3
- package/organisms/vista-product-feature-v8/vista-product-feature-v8.d.ts +2 -0
- package/organisms/{vista-product-features-v8/vista-product-features-v8.js → vista-product-feature-v8/vista-product-feature-v8.js} +3 -3
- package/organisms/vista-product-feature-v9/vista-product-feature-v9.d.ts +2 -0
- package/organisms/{vista-product-features-v9/vista-product-features-v9.js → vista-product-feature-v9/vista-product-feature-v9.js} +3 -3
- package/organisms/vista-promo-section-v1/vista-promo-section-v1.d.ts +2 -0
- package/organisms/vista-promo-section-v1/vista-promo-section-v1.js +47 -0
- package/organisms/vista-promo-section-v2/vista-promo-section-v2.d.ts +2 -0
- package/organisms/vista-promo-section-v2/vista-promo-section-v2.js +18 -0
- package/organisms/vista-promo-section-v3/vista-promo-section-v3.d.ts +2 -0
- package/organisms/vista-promo-section-v3/vista-promo-section-v3.js +41 -0
- package/organisms/vista-promo-section-v4/vista-promo-section-v4.d.ts +2 -0
- package/organisms/vista-promo-section-v4/vista-promo-section-v4.js +22 -0
- package/organisms/vista-promo-section-v5/vista-promo-section-v5.d.ts +2 -0
- package/organisms/vista-promo-section-v5/vista-promo-section-v5.js +62 -0
- package/organisms/vista-promo-section-v6/vista-promo-section-v6.d.ts +2 -0
- package/organisms/vista-promo-section-v6/vista-promo-section-v6.js +35 -0
- package/organisms/vista-promo-section-v7/vista-promo-section-v7.d.ts +2 -0
- package/organisms/vista-promo-section-v7/vista-promo-section-v7.js +39 -0
- package/organisms/vista-promo-section-v8/vista-promo-section-v8.d.ts +2 -0
- package/organisms/vista-promo-section-v8/vista-promo-section-v8.js +19 -0
- package/package.json +2 -2
- package/type/vista-product-feature-type.d.ts +27 -0
- package/type/vista-promo-section-type.d.ts +24 -0
- package/type/vista-promo-section-type.js +2 -0
- package/organisms/vista-product-features-v1/vista-product-features-v1.d.ts +0 -2
- package/organisms/vista-product-features-v2/vista-product-features-v2.d.ts +0 -2
- package/organisms/vista-product-features-v3/vista-product-features-v3.d.ts +0 -2
- package/organisms/vista-product-features-v4/vista-product-features-v4.d.ts +0 -2
- package/organisms/vista-product-features-v5/vista-product-features-v5.d.ts +0 -2
- package/organisms/vista-product-features-v6/vista-product-features-v6.d.ts +0 -2
- package/organisms/vista-product-features-v7/vista-product-features-v7.d.ts +0 -2
- package/organisms/vista-product-features-v8/vista-product-features-v8.d.ts +0 -2
- package/organisms/vista-product-features-v9/vista-product-features-v9.d.ts +0 -2
- package/type/vista-product-features-type.d.ts +0 -27
- /package/type/{vista-product-features-type.js → vista-product-feature-type.js} +0 -0
|
@@ -3,9 +3,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.
|
|
6
|
+
exports.VistaProductFeatureV1 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
|
-
var
|
|
8
|
+
var VistaProductFeatureV1 = function () {
|
|
9
9
|
return (react_1.default.createElement("div", { className: "bg-gray-50" },
|
|
10
10
|
react_1.default.createElement("div", { className: "mx-auto max-w-2xl px-4 py-24 sm:px-6 sm:py-32 lg:max-w-7xl lg:px-8" },
|
|
11
11
|
react_1.default.createElement("section", { "aria-labelledby": "details-heading" },
|
|
@@ -20,4 +20,4 @@ var VistaProductFeaturesV1 = function () {
|
|
|
20
20
|
react_1.default.createElement("img", { alt: "Front zipper pouch with included key ring.", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/product-page-04-detail-product-shot-02.jpg", className: "aspect-3/2 w-full rounded-lg object-cover" }),
|
|
21
21
|
react_1.default.createElement("p", { className: "mt-8 text-base text-gray-500" }, "Up your snack organization game with multiple compartment options. The quick-access stash pouch is ready for even the most unexpected snack attacks and sharing needs.")))))));
|
|
22
22
|
};
|
|
23
|
-
exports.
|
|
23
|
+
exports.VistaProductFeatureV1 = VistaProductFeatureV1;
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.
|
|
6
|
+
exports.VistaProductFeatureV2 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
8
|
var features = [
|
|
9
9
|
{ name: 'Origin', description: 'Designed by Good Goods, Inc.' },
|
|
@@ -13,7 +13,7 @@ var features = [
|
|
|
13
13
|
{ name: 'Includes', description: 'Pen Tray, Phone Tray, Small Tray, Large Tray, Sticky Note Holder' },
|
|
14
14
|
{ name: 'Considerations', description: 'Made from natural materials. Grain and color vary with each item.' },
|
|
15
15
|
];
|
|
16
|
-
var
|
|
16
|
+
var VistaProductFeatureV2 = function () {
|
|
17
17
|
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
18
18
|
react_1.default.createElement("div", { "aria-hidden": "true", className: "relative" },
|
|
19
19
|
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/product-feature-02-full-width.jpg", className: "h-96 w-full object-cover" }),
|
|
@@ -26,4 +26,4 @@ var VistaProductFeaturesV2 = function () {
|
|
|
26
26
|
react_1.default.createElement("dt", { className: "font-medium text-gray-900" }, feature.name),
|
|
27
27
|
react_1.default.createElement("dd", { className: "mt-2 text-sm text-gray-500" }, feature.description))); })))));
|
|
28
28
|
};
|
|
29
|
-
exports.
|
|
29
|
+
exports.VistaProductFeatureV2 = VistaProductFeatureV2;
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.
|
|
6
|
+
exports.VistaProductFeatureV3 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
8
|
var features = [
|
|
9
9
|
{ name: 'Origin', description: 'Designed by Good Goods, Inc.' },
|
|
@@ -13,7 +13,7 @@ var features = [
|
|
|
13
13
|
{ name: 'Includes', description: 'Wood card tray and 3 refill packs' },
|
|
14
14
|
{ name: 'Considerations', description: 'Made from natural materials. Grain and color vary with each item.' },
|
|
15
15
|
];
|
|
16
|
-
var
|
|
16
|
+
var VistaProductFeatureV3 = function () {
|
|
17
17
|
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
18
18
|
react_1.default.createElement("div", { className: "mx-auto grid max-w-2xl grid-cols-1 items-center gap-x-8 gap-y-16 px-4 py-24 sm:px-6 sm:py-32 lg:max-w-7xl lg:grid-cols-2 lg:px-8" },
|
|
19
19
|
react_1.default.createElement("div", null,
|
|
@@ -28,4 +28,4 @@ var VistaProductFeaturesV3 = function () {
|
|
|
28
28
|
react_1.default.createElement("img", { alt: "Side of walnut card tray with card groove and recessed card area.", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/product-feature-03-detail-03.jpg", className: "rounded-lg bg-gray-100" }),
|
|
29
29
|
react_1.default.createElement("img", { alt: "Walnut card tray filled with cards and card angled in dedicated groove.", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/product-feature-03-detail-04.jpg", className: "rounded-lg bg-gray-100" })))));
|
|
30
30
|
};
|
|
31
|
-
exports.
|
|
31
|
+
exports.VistaProductFeatureV3 = VistaProductFeatureV3;
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.
|
|
6
|
+
exports.VistaProductFeatureV4 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
8
|
var features = [
|
|
9
9
|
{
|
|
@@ -25,7 +25,7 @@ var features = [
|
|
|
25
25
|
imageAlt: 'Black canvas body with chrome zipper and key ring.',
|
|
26
26
|
},
|
|
27
27
|
];
|
|
28
|
-
var
|
|
28
|
+
var VistaProductFeatureV4 = function () {
|
|
29
29
|
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
30
30
|
react_1.default.createElement("div", { className: "mx-auto max-w-7xl py-24 sm:px-2 sm:py-32 lg:px-4" },
|
|
31
31
|
react_1.default.createElement("div", { className: "mx-auto max-w-2xl px-4 lg:max-w-none" },
|
|
@@ -40,4 +40,4 @@ var VistaProductFeaturesV4 = function () {
|
|
|
40
40
|
react_1.default.createElement("div", { className: "flex-auto lg:col-span-7 xl:col-span-8" },
|
|
41
41
|
react_1.default.createElement("img", { alt: feature.imageAlt, src: feature.imageSrc, className: "aspect-5/2 w-full rounded-lg bg-gray-100 object-cover" })))); }))))));
|
|
42
42
|
};
|
|
43
|
-
exports.
|
|
43
|
+
exports.VistaProductFeatureV4 = VistaProductFeatureV4;
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.
|
|
6
|
+
exports.VistaProductFeatureV5 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
8
|
var features = [
|
|
9
9
|
{
|
|
@@ -20,7 +20,7 @@ var features = [
|
|
|
20
20
|
},
|
|
21
21
|
{ name: 'Locally made', description: 'Responsibly and sustainably made real close to wherever you are, somehow.' },
|
|
22
22
|
];
|
|
23
|
-
var
|
|
23
|
+
var VistaProductFeatureV5 = function () {
|
|
24
24
|
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
25
25
|
react_1.default.createElement("section", { "aria-labelledby": "features-heading", className: "relative" },
|
|
26
26
|
react_1.default.createElement("img", { alt: "Black leather journal with silver steel disc binding resting on wooden shelf with machined steel pen.", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/confirmation-page-01-hero.jpg", className: "aspect-3/2 w-full object-cover sm:aspect-5/2 lg:absolute lg:aspect-auto lg:h-full lg:w-1/2 lg:pr-4 xl:pr-16" }),
|
|
@@ -33,4 +33,4 @@ var VistaProductFeaturesV5 = function () {
|
|
|
33
33
|
react_1.default.createElement("dt", { className: "font-medium text-gray-900" }, feature.name),
|
|
34
34
|
react_1.default.createElement("dd", { className: "mt-2 text-gray-500" }, feature.description))); })))))));
|
|
35
35
|
};
|
|
36
|
-
exports.
|
|
36
|
+
exports.VistaProductFeatureV5 = VistaProductFeatureV5;
|
|
@@ -33,7 +33,7 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
33
33
|
};
|
|
34
34
|
})();
|
|
35
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
-
exports.
|
|
36
|
+
exports.VistaProductFeatureV6 = void 0;
|
|
37
37
|
var react_1 = __importStar(require("react"));
|
|
38
38
|
var react_2 = require("@headlessui/react");
|
|
39
39
|
var tabs = [
|
|
@@ -82,7 +82,7 @@ var tabs = [
|
|
|
82
82
|
],
|
|
83
83
|
},
|
|
84
84
|
];
|
|
85
|
-
var
|
|
85
|
+
var VistaProductFeatureV6 = function () {
|
|
86
86
|
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
87
87
|
react_1.default.createElement("section", { "aria-labelledby": "features-heading", className: "mx-auto max-w-7xl py-32 sm:px-2 lg:px-8" },
|
|
88
88
|
react_1.default.createElement("div", { className: "mx-auto max-w-2xl px-4 lg:max-w-none lg:px-0" },
|
|
@@ -100,4 +100,4 @@ var VistaProductFeaturesV6 = function () {
|
|
|
100
100
|
react_1.default.createElement("div", { className: "lg:col-span-7" },
|
|
101
101
|
react_1.default.createElement("img", { alt: feature.imageAlt, src: feature.imageSrc, className: "aspect-2/1 w-full rounded-lg bg-gray-100 object-cover sm:aspect-5/2" })))); }))); })))))));
|
|
102
102
|
};
|
|
103
|
-
exports.
|
|
103
|
+
exports.VistaProductFeatureV6 = VistaProductFeatureV6;
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.
|
|
6
|
+
exports.VistaProductFeatureV7 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
8
|
var class_names_1 = require("../../utils/class-names");
|
|
9
9
|
var features = [
|
|
@@ -20,7 +20,7 @@ var features = [
|
|
|
20
20
|
imageAlt: 'Detail of zipper pull with tan leather and silver rivet.',
|
|
21
21
|
},
|
|
22
22
|
];
|
|
23
|
-
var
|
|
23
|
+
var VistaProductFeatureV7 = function () {
|
|
24
24
|
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
25
25
|
react_1.default.createElement("div", { className: "mx-auto max-w-2xl px-4 py-24 sm:px-6 sm:py-32 lg:max-w-7xl lg:px-8" },
|
|
26
26
|
react_1.default.createElement("div", { className: "mx-auto max-w-3xl text-center" },
|
|
@@ -33,4 +33,4 @@ var VistaProductFeaturesV7 = function () {
|
|
|
33
33
|
react_1.default.createElement("div", { className: (0, class_names_1.classNames)(featureIdx % 2 === 0 ? 'lg:col-start-6 xl:col-start-5' : 'lg:col-start-1', 'flex-auto lg:col-span-7 lg:row-start-1 xl:col-span-8') },
|
|
34
34
|
react_1.default.createElement("img", { alt: feature.imageAlt, src: feature.imageSrc, className: "aspect-5/2 w-full rounded-lg bg-gray-100 object-cover" })))); })))));
|
|
35
35
|
};
|
|
36
|
-
exports.
|
|
36
|
+
exports.VistaProductFeatureV7 = VistaProductFeatureV7;
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.
|
|
6
|
+
exports.VistaProductFeatureV8 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
8
|
var features = [
|
|
9
9
|
{
|
|
@@ -31,7 +31,7 @@ var features = [
|
|
|
31
31
|
imageAlt: 'Stack of three green cardstock boxes with 3 hole cutouts showing cards inside.',
|
|
32
32
|
},
|
|
33
33
|
];
|
|
34
|
-
var
|
|
34
|
+
var VistaProductFeatureV8 = function () {
|
|
35
35
|
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
36
36
|
react_1.default.createElement("div", { className: "mx-auto max-w-2xl px-4 py-24 sm:px-6 sm:py-32 lg:max-w-7xl lg:px-8" },
|
|
37
37
|
react_1.default.createElement("div", { className: "max-w-3xl" },
|
|
@@ -44,4 +44,4 @@ var VistaProductFeaturesV8 = function () {
|
|
|
44
44
|
react_1.default.createElement("p", { className: "mt-2 text-sm text-gray-500" }, feature.description)),
|
|
45
45
|
react_1.default.createElement("img", { alt: feature.imageAlt, src: feature.imageSrc, className: "aspect-square w-full rounded-lg bg-gray-100 object-cover" }))); })))));
|
|
46
46
|
};
|
|
47
|
-
exports.
|
|
47
|
+
exports.VistaProductFeatureV8 = VistaProductFeatureV8;
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.
|
|
6
|
+
exports.VistaProductFeatureV9 = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
8
|
var features = [
|
|
9
9
|
{
|
|
@@ -31,7 +31,7 @@ var features = [
|
|
|
31
31
|
imageAlt: 'Stack of three green cardstock boxes with 3 hole cutouts showing cards inside.',
|
|
32
32
|
},
|
|
33
33
|
];
|
|
34
|
-
var
|
|
34
|
+
var VistaProductFeatureV9 = function () {
|
|
35
35
|
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
36
36
|
react_1.default.createElement("div", { className: "mx-auto max-w-2xl px-4 py-24 sm:px-6 sm:py-32 lg:max-w-7xl lg:px-8" },
|
|
37
37
|
react_1.default.createElement("div", { className: "grid grid-cols-1 items-center gap-x-8 gap-y-16 lg:grid-cols-2" },
|
|
@@ -48,4 +48,4 @@ var VistaProductFeaturesV9 = function () {
|
|
|
48
48
|
react_1.default.createElement("img", { alt: "Detail of temperature setting button on kettle bass with digital degree readout.", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/product-feature-09-detail-01.jpg", className: "aspect-square w-full rounded-lg bg-gray-100 object-cover" }),
|
|
49
49
|
react_1.default.createElement("img", { alt: "Kettle spout pouring boiling water into coffee grounds in pour-over mug.", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/product-feature-09-detail-02.jpg", className: "aspect-square w-full rounded-lg bg-gray-100 object-cover" })))))));
|
|
50
50
|
};
|
|
51
|
-
exports.
|
|
51
|
+
exports.VistaProductFeatureV9 = VistaProductFeatureV9;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.VistaPromoSectionV1 = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var testimonials = [
|
|
9
|
+
{
|
|
10
|
+
id: 1,
|
|
11
|
+
quote: 'My order arrived super quickly. The product is even better than I hoped it would be. Very happy customer over here!',
|
|
12
|
+
attribution: 'Sarah Peters, New Orleans',
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
id: 2,
|
|
16
|
+
quote: 'I had to return a purchase that didnt fit. The whole process was so simple that I ended up ordering two new items!',
|
|
17
|
+
attribution: 'Kelly McPherson, Chicago',
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
id: 3,
|
|
21
|
+
quote: 'Now that Im on holiday for the summer, Ill probably order a few more shirts. Its just so convenient, and I know the quality will always be there.',
|
|
22
|
+
attribution: 'Chris Paul, Phoenix',
|
|
23
|
+
},
|
|
24
|
+
];
|
|
25
|
+
var VistaPromoSectionV1 = function () {
|
|
26
|
+
return (react_1.default.createElement("div", { className: "relative overflow-hidden bg-white" },
|
|
27
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0" },
|
|
28
|
+
react_1.default.createElement("div", { className: "absolute inset-0 mx-auto max-w-7xl overflow-hidden xl:px-8" },
|
|
29
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-02-sale-full-width.jpg", className: "size-full object-cover" })),
|
|
30
|
+
react_1.default.createElement("div", { className: "absolute inset-0 bg-white/75" }),
|
|
31
|
+
react_1.default.createElement("div", { className: "absolute inset-0 bg-linear-to-t from-white via-white" })),
|
|
32
|
+
react_1.default.createElement("section", { "aria-labelledby": "sale-heading", className: "relative mx-auto flex max-w-7xl flex-col items-center px-4 pt-32 text-center sm:px-6 lg:px-8" },
|
|
33
|
+
react_1.default.createElement("div", { className: "mx-auto max-w-2xl lg:max-w-none" },
|
|
34
|
+
react_1.default.createElement("h2", { id: "sale-heading", className: "text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl lg:text-6xl" }, "Get 25% off during our one-time sale"),
|
|
35
|
+
react_1.default.createElement("p", { className: "mx-auto mt-4 max-w-xl text-xl text-gray-600" }, "Most of our products are limited releases that wont come back. Get your favorite items while theyre in stock."),
|
|
36
|
+
react_1.default.createElement("a", { href: "#", className: "mt-6 inline-block w-full rounded-md border border-transparent bg-gray-900 px-8 py-3 font-medium text-white hover:bg-gray-800 sm:w-auto" }, "Get access to our one-time sale"))),
|
|
37
|
+
react_1.default.createElement("section", { "aria-labelledby": "testimonial-heading", className: "relative mx-auto max-w-7xl px-4 py-24 sm:px-6 lg:px-8 lg:py-32" },
|
|
38
|
+
react_1.default.createElement("div", { className: "mx-auto max-w-2xl lg:max-w-none" },
|
|
39
|
+
react_1.default.createElement("h2", { id: "testimonial-heading", className: "text-2xl font-bold tracking-tight text-gray-900" }, "What are people saying?"),
|
|
40
|
+
react_1.default.createElement("div", { className: "mt-16 space-y-16 lg:grid lg:grid-cols-3 lg:space-y-0 lg:gap-x-8" }, testimonials.map(function (testimonial) { return (react_1.default.createElement("blockquote", { key: testimonial.id, className: "sm:flex lg:block" },
|
|
41
|
+
react_1.default.createElement("svg", { width: 24, height: 18, viewBox: "0 0 24 18", "aria-hidden": "true", className: "shrink-0 text-gray-300" },
|
|
42
|
+
react_1.default.createElement("path", { d: "M0 18h8.7v-5.555c-.024-3.906 1.113-6.841 2.892-9.68L6.452 0C3.188 2.644-.026 7.86 0 12.469V18zm12.408 0h8.7v-5.555C21.083 8.539 22.22 5.604 24 2.765L18.859 0c-3.263 2.644-6.476 7.86-6.451 12.469V18z", fill: "currentColor" })),
|
|
43
|
+
react_1.default.createElement("div", { className: "mt-8 sm:mt-0 sm:ml-6 lg:mt-10 lg:ml-0" },
|
|
44
|
+
react_1.default.createElement("p", { className: "text-lg text-gray-600" }, testimonial.quote),
|
|
45
|
+
react_1.default.createElement("cite", { className: "mt-4 block font-semibold text-gray-900 not-italic" }, testimonial.attribution)))); }))))));
|
|
46
|
+
};
|
|
47
|
+
exports.VistaPromoSectionV1 = VistaPromoSectionV1;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.VistaPromoSectionV2 = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var VistaPromoSectionV2 = function () {
|
|
9
|
+
return (react_1.default.createElement("div", { className: "relative bg-gray-800 px-6 py-32 sm:px-12 sm:py-40 lg:px-16" },
|
|
10
|
+
react_1.default.createElement("div", { className: "absolute inset-0 overflow-hidden" },
|
|
11
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-feature-section-full-width.jpg", className: "size-full object-cover" })),
|
|
12
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 bg-gray-900/50" }),
|
|
13
|
+
react_1.default.createElement("div", { className: "relative mx-auto flex max-w-3xl flex-col items-center text-center" },
|
|
14
|
+
react_1.default.createElement("h2", { className: "text-3xl font-bold tracking-tight text-white sm:text-4xl" }, "Long-term thinking"),
|
|
15
|
+
react_1.default.createElement("p", { className: "mt-3 text-xl text-white" }, "Were committed to responsible, sustainable, and ethical manufacturing. Our small-scale approach allows us to focus on quality and reduce our impact. Were doing our best to delay the inevitable heat-death of the universe."),
|
|
16
|
+
react_1.default.createElement("a", { href: "#", className: "mt-8 block w-full rounded-md border border-transparent bg-white px-8 py-3 text-base font-medium text-gray-900 hover:bg-gray-100 sm:w-auto" }, "Read our story"))));
|
|
17
|
+
};
|
|
18
|
+
exports.VistaPromoSectionV2 = VistaPromoSectionV2;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.VistaPromoSectionV3 = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var VistaPromoSectionV3 = function () {
|
|
9
|
+
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
10
|
+
react_1.default.createElement("div", { className: "overflow-hidden pt-32 sm:pt-14" },
|
|
11
|
+
react_1.default.createElement("div", { className: "bg-gray-800" },
|
|
12
|
+
react_1.default.createElement("div", { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8" },
|
|
13
|
+
react_1.default.createElement("div", { className: "relative pt-48 pb-16 sm:pb-24" },
|
|
14
|
+
react_1.default.createElement("div", null,
|
|
15
|
+
react_1.default.createElement("h2", { id: "sale-heading", className: "text-4xl font-bold tracking-tight text-white md:text-5xl" },
|
|
16
|
+
"Final Stock.",
|
|
17
|
+
react_1.default.createElement("br", null),
|
|
18
|
+
"Up to 50% off."),
|
|
19
|
+
react_1.default.createElement("div", { className: "mt-6 text-base" },
|
|
20
|
+
react_1.default.createElement("a", { href: "#", className: "font-semibold text-white" },
|
|
21
|
+
"Shop the sale",
|
|
22
|
+
react_1.default.createElement("span", { "aria-hidden": "true" }, " \u2192")))),
|
|
23
|
+
react_1.default.createElement("div", { className: "absolute -top-32 left-1/2 min-w-max -translate-x-1/2 transform sm:top-6 sm:translate-x-0" },
|
|
24
|
+
react_1.default.createElement("div", { className: "ml-24 flex space-x-6 sm:ml-3 lg:space-x-8" },
|
|
25
|
+
react_1.default.createElement("div", { className: "flex space-x-6 sm:flex-col sm:space-y-6 sm:space-x-0 lg:space-y-8" },
|
|
26
|
+
react_1.default.createElement("div", { className: "shrink-0" },
|
|
27
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-category-01.jpg", className: "size-64 rounded-lg object-cover md:size-72" })),
|
|
28
|
+
react_1.default.createElement("div", { className: "mt-6 shrink-0 sm:mt-0" },
|
|
29
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-category-02.jpg", className: "size-64 rounded-lg object-cover md:size-72" }))),
|
|
30
|
+
react_1.default.createElement("div", { className: "flex space-x-6 sm:-mt-20 sm:flex-col sm:space-y-6 sm:space-x-0 lg:space-y-8" },
|
|
31
|
+
react_1.default.createElement("div", { className: "shrink-0" },
|
|
32
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-favorite-01.jpg", className: "size-64 rounded-lg object-cover md:size-72" })),
|
|
33
|
+
react_1.default.createElement("div", { className: "mt-6 shrink-0 sm:mt-0" },
|
|
34
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-favorite-02.jpg", className: "size-64 rounded-lg object-cover md:size-72" }))),
|
|
35
|
+
react_1.default.createElement("div", { className: "flex space-x-6 sm:flex-col sm:space-y-6 sm:space-x-0 lg:space-y-8" },
|
|
36
|
+
react_1.default.createElement("div", { className: "shrink-0" },
|
|
37
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-category-01.jpg", className: "size-64 rounded-lg object-cover md:size-72" })),
|
|
38
|
+
react_1.default.createElement("div", { className: "mt-6 shrink-0 sm:mt-0" },
|
|
39
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-category-02.jpg", className: "size-64 rounded-lg object-cover md:size-72" })))))))))));
|
|
40
|
+
};
|
|
41
|
+
exports.VistaPromoSectionV3 = VistaPromoSectionV3;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.VistaPromoSectionV4 = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var VistaPromoSectionV4 = function () {
|
|
9
|
+
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
10
|
+
react_1.default.createElement("div", { className: "mx-auto max-w-7xl px-4 py-16 sm:px-6 sm:py-24 lg:px-8" },
|
|
11
|
+
react_1.default.createElement("div", { className: "relative overflow-hidden rounded-lg" },
|
|
12
|
+
react_1.default.createElement("div", { className: "absolute inset-0" },
|
|
13
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-01-feature-section-01.jpg", className: "size-full object-cover" })),
|
|
14
|
+
react_1.default.createElement("div", { className: "relative bg-gray-900/75 px-6 py-32 sm:px-12 sm:py-40 lg:px-16" },
|
|
15
|
+
react_1.default.createElement("div", { className: "relative mx-auto flex max-w-3xl flex-col items-center text-center" },
|
|
16
|
+
react_1.default.createElement("h2", { className: "text-3xl font-bold tracking-tight text-white sm:text-4xl" },
|
|
17
|
+
react_1.default.createElement("span", { className: "block sm:inline" }, "Level up"),
|
|
18
|
+
react_1.default.createElement("span", { className: "block sm:inline" }, "your desk")),
|
|
19
|
+
react_1.default.createElement("p", { className: "mt-3 text-xl text-white" }, "Make your desk beautiful and organized. Post a picture to social media and watch it get more likes than life-changing announcements. Reflect on the shallow nature of existence. At least you have a really nice desk setup."),
|
|
20
|
+
react_1.default.createElement("a", { href: "#", className: "mt-8 block w-full rounded-md border border-transparent bg-white px-8 py-3 text-base font-medium text-gray-900 hover:bg-gray-100 sm:w-auto" }, "Shop Workspace")))))));
|
|
21
|
+
};
|
|
22
|
+
exports.VistaPromoSectionV4 = VistaPromoSectionV4;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.VistaPromoSectionV5 = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var collections = [
|
|
9
|
+
{
|
|
10
|
+
name: "Women's",
|
|
11
|
+
href: '#',
|
|
12
|
+
imageSrc: 'https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-04-collection-01.jpg',
|
|
13
|
+
imageAlt: 'Woman wearing an off-white cotton t-shirt.',
|
|
14
|
+
},
|
|
15
|
+
{
|
|
16
|
+
name: "Men's",
|
|
17
|
+
href: '#',
|
|
18
|
+
imageSrc: 'https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-04-collection-02.jpg',
|
|
19
|
+
imageAlt: 'Man wearing a charcoal gray cotton t-shirt.',
|
|
20
|
+
},
|
|
21
|
+
{
|
|
22
|
+
name: 'Desk Accessories',
|
|
23
|
+
href: '#',
|
|
24
|
+
imageSrc: 'https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-04-collection-03.jpg',
|
|
25
|
+
imageAlt: 'Person sitting at a wooden desk with paper note organizer, pencil and tablet.',
|
|
26
|
+
},
|
|
27
|
+
];
|
|
28
|
+
var VistaPromoSectionV5 = function () {
|
|
29
|
+
return (react_1.default.createElement("div", { className: "relative bg-white" },
|
|
30
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 hidden sm:flex sm:flex-col" },
|
|
31
|
+
react_1.default.createElement("div", { className: "relative w-full flex-1 bg-gray-800" },
|
|
32
|
+
react_1.default.createElement("div", { className: "absolute inset-0 overflow-hidden" },
|
|
33
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-04-hero-full-width.jpg", className: "size-full object-cover" })),
|
|
34
|
+
react_1.default.createElement("div", { className: "absolute inset-0 bg-gray-900 opacity-50" })),
|
|
35
|
+
react_1.default.createElement("div", { className: "h-32 w-full bg-white md:h-40 lg:h-48" })),
|
|
36
|
+
react_1.default.createElement("div", { className: "relative mx-auto max-w-3xl px-4 pb-96 text-center sm:px-6 sm:pb-0 lg:px-8" },
|
|
37
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 flex flex-col sm:hidden" },
|
|
38
|
+
react_1.default.createElement("div", { className: "relative w-full flex-1 bg-gray-800" },
|
|
39
|
+
react_1.default.createElement("div", { className: "absolute inset-0 overflow-hidden" },
|
|
40
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-04-hero-full-width.jpg", className: "size-full object-cover" })),
|
|
41
|
+
react_1.default.createElement("div", { className: "absolute inset-0 bg-gray-900 opacity-50" })),
|
|
42
|
+
react_1.default.createElement("div", { className: "h-48 w-full bg-white" })),
|
|
43
|
+
react_1.default.createElement("div", { className: "relative py-32" },
|
|
44
|
+
react_1.default.createElement("h1", { className: "text-4xl font-bold tracking-tight text-white sm:text-5xl md:text-6xl" }, "Mid-Season Sale"),
|
|
45
|
+
react_1.default.createElement("div", { className: "mt-4 sm:mt-6" },
|
|
46
|
+
react_1.default.createElement("a", { href: "#", className: "inline-block rounded-md border border-transparent bg-indigo-600 px-8 py-3 font-medium text-white hover:bg-indigo-700" }, "Shop Collection")))),
|
|
47
|
+
react_1.default.createElement("section", { "aria-labelledby": "collection-heading", className: "relative -mt-96 sm:mt-0" },
|
|
48
|
+
react_1.default.createElement("h2", { id: "collection-heading", className: "sr-only" }, "Collections"),
|
|
49
|
+
react_1.default.createElement("div", { className: "mx-auto grid max-w-md grid-cols-1 gap-y-6 px-4 sm:max-w-7xl sm:grid-cols-3 sm:gap-x-6 sm:gap-y-0 sm:px-6 lg:gap-x-8 lg:px-8" }, collections.map(function (collection) { return (react_1.default.createElement("div", { key: collection.name, className: "group relative h-96 rounded-lg bg-white shadow-xl sm:aspect-4/5 sm:h-auto" },
|
|
50
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 overflow-hidden rounded-lg" },
|
|
51
|
+
react_1.default.createElement("div", { className: "absolute inset-0 overflow-hidden group-hover:opacity-75" },
|
|
52
|
+
react_1.default.createElement("img", { alt: collection.imageAlt, src: collection.imageSrc, className: "size-full object-cover" })),
|
|
53
|
+
react_1.default.createElement("div", { className: "absolute inset-0 bg-linear-to-b from-transparent to-black opacity-50" })),
|
|
54
|
+
react_1.default.createElement("div", { className: "absolute inset-0 flex items-end rounded-lg p-6" },
|
|
55
|
+
react_1.default.createElement("div", null,
|
|
56
|
+
react_1.default.createElement("p", { "aria-hidden": "true", className: "text-sm text-white" }, "Shop the collection"),
|
|
57
|
+
react_1.default.createElement("h3", { className: "mt-1 font-semibold text-white" },
|
|
58
|
+
react_1.default.createElement("a", { href: collection.href },
|
|
59
|
+
react_1.default.createElement("span", { className: "absolute inset-0" }),
|
|
60
|
+
collection.name)))))); })))));
|
|
61
|
+
};
|
|
62
|
+
exports.VistaPromoSectionV5 = VistaPromoSectionV5;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.VistaPromoSectionV6 = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var offers = [
|
|
9
|
+
{ name: 'Download the app', description: 'Get an exclusive $5 off code', href: '#' },
|
|
10
|
+
{ name: "Return when you're ready", description: '60 days of free returns', href: '#' },
|
|
11
|
+
{ name: 'Sign up for our newsletter', description: '15% off your first order', href: '#' },
|
|
12
|
+
];
|
|
13
|
+
var VistaPromoSectionV6 = function () {
|
|
14
|
+
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
15
|
+
react_1.default.createElement("div", { className: "flex flex-col border-b border-gray-200 lg:border-0" },
|
|
16
|
+
react_1.default.createElement("nav", { "aria-label": "Offers", className: "order-last lg:order-first" },
|
|
17
|
+
react_1.default.createElement("div", { className: "mx-auto max-w-7xl lg:px-8" },
|
|
18
|
+
react_1.default.createElement("ul", { role: "list", className: "grid grid-cols-1 divide-y divide-gray-200 lg:grid-cols-3 lg:divide-x lg:divide-y-0" }, offers.map(function (offer) { return (react_1.default.createElement("li", { key: offer.name, className: "flex flex-col" },
|
|
19
|
+
react_1.default.createElement("a", { href: offer.href, className: "relative flex flex-1 flex-col justify-center bg-white px-4 py-6 text-center focus:z-10" },
|
|
20
|
+
react_1.default.createElement("p", { className: "text-sm text-gray-500" }, offer.name),
|
|
21
|
+
react_1.default.createElement("p", { className: "font-semibold text-gray-900" }, offer.description)))); })))),
|
|
22
|
+
react_1.default.createElement("div", { className: "relative" },
|
|
23
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute hidden h-full w-1/2 bg-gray-100 lg:block" }),
|
|
24
|
+
react_1.default.createElement("div", { className: "relative bg-gray-100 lg:bg-transparent" },
|
|
25
|
+
react_1.default.createElement("div", { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:grid lg:grid-cols-2 lg:px-8" },
|
|
26
|
+
react_1.default.createElement("div", { className: "mx-auto max-w-2xl py-24 lg:max-w-none lg:py-64" },
|
|
27
|
+
react_1.default.createElement("div", { className: "lg:pr-16" },
|
|
28
|
+
react_1.default.createElement("h1", { className: "text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl xl:text-6xl" }, "Focus on what matters"),
|
|
29
|
+
react_1.default.createElement("p", { className: "mt-4 text-xl text-gray-600" }, "All the charts, datepickers, and notifications in the world cant beat checking off some items on a paper card."),
|
|
30
|
+
react_1.default.createElement("div", { className: "mt-6" },
|
|
31
|
+
react_1.default.createElement("a", { href: "#", className: "inline-block rounded-md border border-transparent bg-indigo-600 px-8 py-3 font-medium text-white hover:bg-indigo-700" }, "Shop Productivity")))))),
|
|
32
|
+
react_1.default.createElement("div", { className: "h-48 w-full sm:h-64 lg:absolute lg:top-0 lg:right-0 lg:h-full lg:w-1/2" },
|
|
33
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-02-hero-half-width.jpg", className: "size-full object-cover" }))))));
|
|
34
|
+
};
|
|
35
|
+
exports.VistaPromoSectionV6 = VistaPromoSectionV6;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.VistaPromoSectionV7 = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var VistaPromoSectionV7 = function () {
|
|
9
|
+
return (react_1.default.createElement("div", { className: "relative overflow-hidden bg-white" },
|
|
10
|
+
react_1.default.createElement("div", { className: "pt-16 pb-80 sm:pt-24 sm:pb-40 lg:pt-40 lg:pb-48" },
|
|
11
|
+
react_1.default.createElement("div", { className: "relative mx-auto max-w-7xl px-4 sm:static sm:px-6 lg:px-8" },
|
|
12
|
+
react_1.default.createElement("div", { className: "sm:max-w-lg" },
|
|
13
|
+
react_1.default.createElement("h1", { className: "text-4xl font-bold tracking-tight text-gray-900 sm:text-6xl" }, "Summer styles are finally here"),
|
|
14
|
+
react_1.default.createElement("p", { className: "mt-4 text-xl text-gray-500" }, "This year, our new summer collection will shelter you from the harsh elements of a world that doesnt care if you live or die.")),
|
|
15
|
+
react_1.default.createElement("div", null,
|
|
16
|
+
react_1.default.createElement("div", { className: "mt-10" },
|
|
17
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "pointer-events-none lg:absolute lg:inset-y-0 lg:mx-auto lg:w-full lg:max-w-7xl" },
|
|
18
|
+
react_1.default.createElement("div", { className: "absolute transform sm:top-0 sm:left-1/2 sm:translate-x-8 lg:top-1/2 lg:left-1/2 lg:translate-x-8 lg:-translate-y-1/2" },
|
|
19
|
+
react_1.default.createElement("div", { className: "flex items-center space-x-6 lg:space-x-8" },
|
|
20
|
+
react_1.default.createElement("div", { className: "grid shrink-0 grid-cols-1 gap-y-6 lg:gap-y-8" },
|
|
21
|
+
react_1.default.createElement("div", { className: "h-64 w-44 overflow-hidden rounded-lg sm:opacity-0 lg:opacity-100" },
|
|
22
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-hero-image-tile-01.jpg", className: "size-full object-cover" })),
|
|
23
|
+
react_1.default.createElement("div", { className: "h-64 w-44 overflow-hidden rounded-lg" },
|
|
24
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-hero-image-tile-02.jpg", className: "size-full object-cover" }))),
|
|
25
|
+
react_1.default.createElement("div", { className: "grid shrink-0 grid-cols-1 gap-y-6 lg:gap-y-8" },
|
|
26
|
+
react_1.default.createElement("div", { className: "h-64 w-44 overflow-hidden rounded-lg" },
|
|
27
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-hero-image-tile-03.jpg", className: "size-full object-cover" })),
|
|
28
|
+
react_1.default.createElement("div", { className: "h-64 w-44 overflow-hidden rounded-lg" },
|
|
29
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-hero-image-tile-04.jpg", className: "size-full object-cover" })),
|
|
30
|
+
react_1.default.createElement("div", { className: "h-64 w-44 overflow-hidden rounded-lg" },
|
|
31
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-hero-image-tile-05.jpg", className: "size-full object-cover" }))),
|
|
32
|
+
react_1.default.createElement("div", { className: "grid shrink-0 grid-cols-1 gap-y-6 lg:gap-y-8" },
|
|
33
|
+
react_1.default.createElement("div", { className: "h-64 w-44 overflow-hidden rounded-lg" },
|
|
34
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-hero-image-tile-06.jpg", className: "size-full object-cover" })),
|
|
35
|
+
react_1.default.createElement("div", { className: "h-64 w-44 overflow-hidden rounded-lg" },
|
|
36
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-03-hero-image-tile-07.jpg", className: "size-full object-cover" })))))),
|
|
37
|
+
react_1.default.createElement("a", { href: "#", className: "inline-block rounded-md border border-transparent bg-indigo-600 px-8 py-3 text-center font-medium text-white hover:bg-indigo-700" }, "Shop Collection")))))));
|
|
38
|
+
};
|
|
39
|
+
exports.VistaPromoSectionV7 = VistaPromoSectionV7;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.VistaPromoSectionV8 = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var VistaPromoSectionV8 = function () {
|
|
9
|
+
return (react_1.default.createElement("div", { className: "bg-white" },
|
|
10
|
+
react_1.default.createElement("div", { className: "relative bg-gray-900" },
|
|
11
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 overflow-hidden" },
|
|
12
|
+
react_1.default.createElement("img", { alt: "", src: "https://tailwindcss.com/plus-assets/img/ecommerce-images/home-page-01-hero-full-width.jpg", className: "size-full object-cover" })),
|
|
13
|
+
react_1.default.createElement("div", { "aria-hidden": "true", className: "absolute inset-0 bg-gray-900 opacity-50" }),
|
|
14
|
+
react_1.default.createElement("div", { className: "relative mx-auto flex max-w-3xl flex-col items-center px-6 py-32 text-center sm:py-64 lg:px-0" },
|
|
15
|
+
react_1.default.createElement("h1", { className: "text-4xl font-bold tracking-tight text-white lg:text-6xl" }, "New arrivals are here"),
|
|
16
|
+
react_1.default.createElement("p", { className: "mt-4 text-xl text-white" }, "The new arrivals have, well, newly arrived. Check out the latest options from our summer small-batch release while theyre still in stock."),
|
|
17
|
+
react_1.default.createElement("a", { href: "#", className: "mt-8 inline-block rounded-md border border-transparent bg-white px-8 py-3 text-base font-medium text-gray-900 hover:bg-gray-100" }, "Shop New Arrivals")))));
|
|
18
|
+
};
|
|
19
|
+
exports.VistaPromoSectionV8 = VistaPromoSectionV8;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@appcorp/app-corp-vista",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.3",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"build": "yarn clean && yarn build:ts && cp package.json lib && cp README.md lib",
|
|
6
6
|
"build:next": "next build",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"@react-jvectormap/core": "^1.0.4",
|
|
44
44
|
"@react-jvectormap/world": "^1.1.2",
|
|
45
45
|
"@react-pakistan/react-icon-collection": "^3.5.0",
|
|
46
|
-
"@react-pakistan/util-functions": "^1.24.
|
|
46
|
+
"@react-pakistan/util-functions": "^1.24.14",
|
|
47
47
|
"@remixicon/react": "^4.6.0",
|
|
48
48
|
"@storybook/addon-essentials": "^8",
|
|
49
49
|
"@storybook/addon-interactions": "^8",
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export interface VistaProductFeatureV1Props {
|
|
2
|
+
id: string;
|
|
3
|
+
}
|
|
4
|
+
export interface VistaProductFeatureV2Props {
|
|
5
|
+
id: string;
|
|
6
|
+
}
|
|
7
|
+
export interface VistaProductFeatureV3Props {
|
|
8
|
+
id: string;
|
|
9
|
+
}
|
|
10
|
+
export interface VistaProductFeatureV4Props {
|
|
11
|
+
id: string;
|
|
12
|
+
}
|
|
13
|
+
export interface VistaProductFeatureV5Props {
|
|
14
|
+
id: string;
|
|
15
|
+
}
|
|
16
|
+
export interface VistaProductFeatureV6Props {
|
|
17
|
+
id: string;
|
|
18
|
+
}
|
|
19
|
+
export interface VistaProductFeatureV7Props {
|
|
20
|
+
id: string;
|
|
21
|
+
}
|
|
22
|
+
export interface VistaProductFeatureV8Props {
|
|
23
|
+
id: string;
|
|
24
|
+
}
|
|
25
|
+
export interface VistaProductFeatureV9Props {
|
|
26
|
+
id: string;
|
|
27
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
export interface VistaPromoSectionV1Props {
|
|
2
|
+
id: string;
|
|
3
|
+
}
|
|
4
|
+
export interface VistaPromoSectionV2Props {
|
|
5
|
+
id: string;
|
|
6
|
+
}
|
|
7
|
+
export interface VistaPromoSectionV3Props {
|
|
8
|
+
id: string;
|
|
9
|
+
}
|
|
10
|
+
export interface VistaPromoSectionV4Props {
|
|
11
|
+
id: string;
|
|
12
|
+
}
|
|
13
|
+
export interface VistaPromoSectionV5Props {
|
|
14
|
+
id: string;
|
|
15
|
+
}
|
|
16
|
+
export interface VistaPromoSectionV6Props {
|
|
17
|
+
id: string;
|
|
18
|
+
}
|
|
19
|
+
export interface VistaPromoSectionV7Props {
|
|
20
|
+
id: string;
|
|
21
|
+
}
|
|
22
|
+
export interface VistaPromoSectionV8Props {
|
|
23
|
+
id: string;
|
|
24
|
+
}
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
export interface VistaProductFeaturesV1Props {
|
|
2
|
-
id: string;
|
|
3
|
-
}
|
|
4
|
-
export interface VistaProductFeaturesV2Props {
|
|
5
|
-
id: string;
|
|
6
|
-
}
|
|
7
|
-
export interface VistaProductFeaturesV3Props {
|
|
8
|
-
id: string;
|
|
9
|
-
}
|
|
10
|
-
export interface VistaProductFeaturesV4Props {
|
|
11
|
-
id: string;
|
|
12
|
-
}
|
|
13
|
-
export interface VistaProductFeaturesV5Props {
|
|
14
|
-
id: string;
|
|
15
|
-
}
|
|
16
|
-
export interface VistaProductFeaturesV6Props {
|
|
17
|
-
id: string;
|
|
18
|
-
}
|
|
19
|
-
export interface VistaProductFeaturesV7Props {
|
|
20
|
-
id: string;
|
|
21
|
-
}
|
|
22
|
-
export interface VistaProductFeaturesV8Props {
|
|
23
|
-
id: string;
|
|
24
|
-
}
|
|
25
|
-
export interface VistaProductFeaturesV9Props {
|
|
26
|
-
id: string;
|
|
27
|
-
}
|
|
File without changes
|