Pablassso commited on
Commit
26e30d1
·
verified ·
1 Parent(s): 6f8b234

creat clean HTML template for pricing, extract data from provided html.

Browse files

design system:
colors: bg: #F29155; text: white and black, rounded cornenrs

<div class="elementor-container elementor-column-gap-default" bis_skin_checked="1">
<div class="elementor-column elementor-col-33 elementor-inner-column elementor-element elementor-element-f7ca4e2 animated fadeInUp" data-id="f7ca4e2" data-element_type="column" data-settings="{"animation":"fadeInUp"}" bis_skin_checked="1">
<div class="elementor-widget-wrap elementor-element-populated" bis_skin_checked="1">
<div class="elementor-element elementor-element-9881854 elementor-widget elementor-widget-price-table" data-id="9881854" data-element_type="widget" data-widget_type="price-table.default" bis_skin_checked="1">
<div class="elementor-widget-container" bis_skin_checked="1">

<div class="elementor-price-table" bis_skin_checked="1">
<div class="elementor-price-table__header" bis_skin_checked="1">
<h3 class="elementor-price-table__heading">
MINIMALISTINIS </h3>

</div>

<div class="elementor-price-table__price" bis_skin_checked="1">
<span class="elementor-price-table__integer-part">
1 VAL </span>



<span class="elementor-price-table__period elementor-typo-excluded">TRUKMĖ </span> </div>

<ul class="elementor-price-table__features-list">
<li class="elementor-repeater-item-1438ec5">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Pasirinktas personažas </span>
</div>
</li>
<li class="elementor-repeater-item-f2b7b4f">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Teminiai žaidimai </span>
</div>
</li>
<li class="elementor-repeater-item-757e106">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Šokių pamoka </span>
</div>
</li>
<li class="elementor-repeater-item-41d1af8">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Mikromagija ir fokusai </span>
</div>
</li>
<li class="elementor-repeater-item-f77789e">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Kūrybinės dirbtuvės </span>
</div>
</li>
<li class="elementor-repeater-item-c331e79">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Dovana kiekvienam vaikui - žaislas iš baliono </span>
</div>
</li>
<li class="elementor-repeater-item-b5ac99f">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
List Torto ceremonija </span>
</div>
</li>
<li class="elementor-repeater-item-d233b34">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Fotosesija su personažu </span>
</div>
</li>
</ul>

</div>

</div>
</div>
</div>
</div>
<div class="elementor-column elementor-col-33 elementor-inner-column elementor-element elementor-element-b6ed6bb animated fadeInUp" data-id="b6ed6bb" data-element_type="column" data-settings="{"animation":"fadeInUp","animation_delay":240}" bis_skin_checked="1">
<div class="elementor-widget-wrap elementor-element-populated" bis_skin_checked="1">
<div class="elementor-element elementor-element-5cc37ae elementor-widget elementor-widget-price-table" data-id="5cc37ae" data-element_type="widget" data-widget_type="price-table.default" bis_skin_checked="1">
<div class="elementor-widget-container" bis_skin_checked="1">

<div class="elementor-price-table" bis_skin_checked="1">
<div class="elementor-price-table__header" bis_skin_checked="1">
<h3 class="elementor-price-table__heading">
STANDARTINIS </h3>

</div>

<div class="elementor-price-table__price" bis_skin_checked="1">
<span class="elementor-price-table__integer-part">
1 VAL 30 MIN </span>



<span class="elementor-price-table__period elementor-typo-excluded">TRUKMĖ </span> </div>

<ul class="elementor-price-table__features-list">
<li class="elementor-repeater-item-1438ec5">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Pasirinktas personažas </span>
</div>
</li>
<li class="elementor-repeater-item-e96741b">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Teminiai žaidimai </span>
</div>
</li>
<li class="elementor-repeater-item-ee4ca4d">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Šokių pamoka </span>
</div>
</li>
<li class="elementor-repeater-item-4450f07">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Mikromagija ir fokusai </span>
</div>
</li>
<li class="elementor-repeater-item-c48b03b">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Kūrybinės dirbtuvės </span>
</div>
</li>
<li class="elementor-repeater-item-bd4b16d">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Dovana kiekvienam vaikui - žaislas iš baliono </span>
</div>
</li>
<li class="elementor-repeater-item-a162265">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Torto ceremonija </span>
</div>
</li>
<li class="elementor-repeater-item-748ef2a">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Fotosesija su personažu </span>
</div>
</li>
<li class="elementor-repeater-item-319701a">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
         + Piešimas ant veidukų </span>
</div>
</li>
<li class="elementor-repeater-item-0d423f4">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
         + Dovanos jubiliatui gamyba </span>
</div>
</li>
</ul>

</div>

</div>
</div>
</div>
</div>
<div class="elementor-column elementor-col-33 elementor-inner-column elementor-element elementor-element-83c68ad animated fadeInUp" data-id="83c68ad" data-element_type="column" data-settings="{"animation":"fadeInUp","animation_delay":480}" bis_skin_checked="1">
<div class="elementor-widget-wrap elementor-element-populated" bis_skin_checked="1">
<div class="elementor-element elementor-element-ee1a866 elementor-widget elementor-widget-price-table" data-id="ee1a866" data-element_type="widget" data-widget_type="price-table.default" bis_skin_checked="1">
<div class="elementor-widget-container" bis_skin_checked="1">

<div class="elementor-price-table" bis_skin_checked="1">
<div class="elementor-price-table__header" bis_skin_checked="1">
<h3 class="elementor-price-table__heading">
PRAMOGINIS </h3>

</div>

<div class="elementor-price-table__price" bis_skin_checked="1">
<span class="elementor-price-table__integer-part">
2 VAL </span>



<span class="elementor-price-table__period elementor-typo-excluded">TRUKMĖ </span> </div>

<ul class="elementor-price-table__features-list">
<li class="elementor-repeater-item-1438ec5">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Pasirinktas personažas </span>
</div>
</li>
<li class="elementor-repeater-item-f2b7b4f">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Teminiai žaidimai </span>
</div>
</li>
<li class="elementor-repeater-item-757e106">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Šokių pamoka </span>
</div>
</li>
<li class="elementor-repeater-item-41d1af8">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Mikromagija ir fokusai </span>
</div>
</li>
<li class="elementor-repeater-item-e7339ce">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Kūrybinės dirbtuvės </span>
</div>
</li>
<li class="elementor-repeater-item-e963134">
<div class="elementor-price-table__feature-inner" bis_skin_checked="1">
<span>
Dovana kiekvienam vaikui - žaislas iš baliono </span>
</di

Files changed (1) hide show
  1. pricing.html +190 -0
pricing.html ADDED
@@ -0,0 +1,190 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Pricing Plans</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <style>
9
+ .pricing-card:hover {
10
+ transform: translateY(-10px);
11
+ }
12
+ </style>
13
+ </head>
14
+ <body class="bg-[#F29155] text-black">
15
+ <div class="container mx-auto px-4 py-16">
16
+ <h1 class="text-4xl font-bold text-center mb-16">Our Pricing Plans</h1>
17
+
18
+ <div class="grid md:grid-cols-3 gap-8 max-w-6xl mx-auto">
19
+ <!-- Minimalist Plan -->
20
+ <div class="bg-white rounded-2xl shadow-xl overflow-hidden pricing-card transition duration-300">
21
+ <div class="p-8 text-center">
22
+ <h3 class="text-2xl font-bold mb-4">MINIMALISTINIS</h3>
23
+ <div class="text-3xl font-bold mb-6">1 VAL</div>
24
+ <p class="mb-6 font-medium">TRUKMĖ</p>
25
+
26
+ <ul class="space-y-4 mb-8">
27
+ <li class="flex items-start">
28
+ <span class="mr-2">✓</span>
29
+ <span>Pasirinktas personažas</span>
30
+ </li>
31
+ <li class="flex items-start">
32
+ <span class="mr-2">✓</span>
33
+ <span>Teminiai žaidimai</span>
34
+ </li>
35
+ <li class="flex items-start">
36
+ <span class="mr-2">✓</span>
37
+ <span>Šokių pamoka</span>
38
+ </li>
39
+ <li class="flex items-start">
40
+ <span class="mr-2">✓</span>
41
+ <span>Mikromagija ir fokusai</span>
42
+ </li>
43
+ <li class="flex items-start">
44
+ <span class="mr-2">✓</span>
45
+ <span>Kūrybinės dirbtuvės</span>
46
+ </li>
47
+ <li class="flex items-start">
48
+ <span class="mr-2">✓</span>
49
+ <span>Dovana kiekvienam vaikui - žaislas iš baliono</span>
50
+ </li>
51
+ <li class="flex items-start">
52
+ <span class="mr-2">✓</span>
53
+ <span>Torto ceremonija</span>
54
+ </li>
55
+ <li class="flex items-start">
56
+ <span class="mr-2">✓</span>
57
+ <span>Fotosesija su personažu</span>
58
+ </li>
59
+ </ul>
60
+
61
+ <button class="w-full bg-[#F29155] text-white py-3 rounded-lg font-bold hover:bg-opacity-90 transition">
62
+ Choose Plan
63
+ </button>
64
+ </div>
65
+ </div>
66
+
67
+ <!-- Standard Plan -->
68
+ <div class="bg-white rounded-2xl shadow-2xl overflow-hidden pricing-card transform scale-105 relative transition duration-300">
69
+ <div class="absolute top-0 right-0 bg-[#F29155] text-white px-4 py-1 rounded-bl-lg font-bold">Popular</div>
70
+ <div class="p-8 text-center">
71
+ <h3 class="text-2xl font-bold mb-4">STANDARTINIS</h3>
72
+ <div class="text-3xl font-bold mb-6">1 VAL 30 MIN</div>
73
+ <p class="mb-6 font-medium">TRUKMĖ</p>
74
+
75
+ <ul class="space-y-4 mb-8">
76
+ <li class="flex items-start">
77
+ <span class="mr-2">✓</span>
78
+ <span>Pasirinktas personažas</span>
79
+ </li>
80
+ <li class="flex items-start">
81
+ <span class="mr-2">✓</span>
82
+ <span>Teminiai žaidimai</span>
83
+ </li>
84
+ <li class="flex items-start">
85
+ <span class="mr-2">✓</span>
86
+ <span>Šokių pamoka</span>
87
+ </li>
88
+ <li class="flex items-start">
89
+ <span class="mr-2">✓</span>
90
+ <span>Mikromagija ir fokusai</span>
91
+ </li>
92
+ <li class="flex items-start">
93
+ <span class="mr-2">✓</span>
94
+ <span>Kūrybinės dirbtuvės</span>
95
+ </li>
96
+ <li class="flex items-start">
97
+ <span class="mr-2">✓</span>
98
+ <span>Dovana kiekvienam vaikui - žaislas iš baliono</span>
99
+ </li>
100
+ <li class="flex items-start">
101
+ <span class="mr-2">✓</span>
102
+ <span>Torto ceremonija</span>
103
+ </li>
104
+ <li class="flex items-start">
105
+ <span class="mr-2">✓</span>
106
+ <span>Fotosesija su personažu</span>
107
+ </li>
108
+ <li class="flex items-start">
109
+ <span class="mr-2">✓</span>
110
+ <span>Piešimas ant veidukų</span>
111
+ </li>
112
+ <li class="flex items-start">
113
+ <span class="mr-2">✓</span>
114
+ <span>Dovanos jubiliatui gamyba</span>
115
+ </li>
116
+ </ul>
117
+
118
+ <button class="w-full bg-[#F29155] text-white py-3 rounded-lg font-bold hover:bg-opacity-90 transition">
119
+ Choose Plan
120
+ </button>
121
+ </div>
122
+ </div>
123
+
124
+ <!-- Entertainment Plan -->
125
+ <div class="bg-white rounded-2xl shadow-xl overflow-hidden pricing-card transition duration-300">
126
+ <div class="p-8 text-center">
127
+ <h3 class="text-2xl font-bold mb-4">PRAMOGINIS</h3>
128
+ <div class="text-3xl font-bold mb-6">2 VAL</div>
129
+ <p class="mb-6 font-medium">TRUKMĖ</p>
130
+
131
+ <ul class="space-y-4 mb-8">
132
+ <li class="flex items-start">
133
+ <span class="mr-2">✓</span>
134
+ <span>Pasirinktas personažas</span>
135
+ </li>
136
+ <li class="flex items-start">
137
+ <span class="mr-2">✓</span>
138
+ <span>Teminiai žaidimai</span>
139
+ </li>
140
+ <li class="flex items-start">
141
+ <span class="mr-2">✓</span>
142
+ <span>Šokių pamoka</span>
143
+ </li>
144
+ <li class="flex items-start">
145
+ <span class="mr-2">✓</span>
146
+ <span>Mikromagija ir fokusai</span>
147
+ </li>
148
+ <li class="flex items-start">
149
+ <span class="mr-2">✓</span>
150
+ <span>Kūrybinės dirbtuvės</span>
151
+ </li>
152
+ <li class="flex items-start">
153
+ <span class="mr-2">✓</span>
154
+ <span>Dovana kiekvienam vaikui - žaislas iš baliono</span>
155
+ </li>
156
+ <li class="flex items-start">
157
+ <span class="mr-2">✓</span>
158
+ <span>Torto ceremonija</span>
159
+ </li>
160
+ <li class="flex items-start">
161
+ <span class="mr-2">✓</span>
162
+ <span>Fotosesija su personažu</span>
163
+ </li>
164
+ <li class="flex items-start">
165
+ <span class="mr-2">✓</span>
166
+ <span>Piešimas ant veidukų</span>
167
+ </li>
168
+ <li class="flex items-start">
169
+ <span class="mr-2">✓</span>
170
+ <span>Dovanos jubiliatui gamyba</span>
171
+ </li>
172
+ <li class="flex items-start">
173
+ <span class="mr-2">✓</span>
174
+ <span>Sidabrinė diskoteka, (patalpoje) arba dideli, muilo burbulai (lauke)</span>
175
+ </li>
176
+ <li class="flex items-start">
177
+ <span class="mr-2">✓</span>
178
+ <span>Laikinos tatuiruotės</span>
179
+ </li>
180
+ </ul>
181
+
182
+ <button class="w-full bg-[#F29155] text-white py-3 rounded-lg font-bold hover:bg-opacity-90 transition">
183
+ Choose Plan
184
+ </button>
185
+ </div>
186
+ </div>
187
+ </div>
188
+ </div>
189
+ </body>
190
+ </html>