diff --git a/apps/showcase/components/landing/samples/CardsApp.vue b/apps/showcase/components/landing/samples/CardsApp.vue
index 5f2f08d61..dd3588d9d 100644
--- a/apps/showcase/components/landing/samples/CardsApp.vue
+++ b/apps/showcase/components/landing/samples/CardsApp.vue
@@ -295,14 +295,14 @@
                                     v-model="memberSelectedTypes[0]"
                                     :options="memberTypes"
                                     optionLabel="name"
-                                    placeholder="Select a role"
-                                    class="w-16"
+                                    placeholder="Select"
+                                    class="!w-16"
                                     :pt="{
-                                        root: { class: 'border-0 shadow-none' },
-                                        label: { class: 'p-0 text-muted-color text-sm' },
-                                        dropdown: { class: 'p-0 w-auto' },
-                                        dropdownicon: { class: 'w-3 h-3' },
-                                        option: { class: 'text-sm px-2 py-1' }
+                                        root: { class: '!border-0 !shadow-none' },
+                                        label: { class: '!p-0 !text-muted-color !text-sm' },
+                                        dropdown: { class: '!p-0 !w-auto' },
+                                        dropdownicon: { class: '!w-3 !h-3' },
+                                        option: { class: '!text-sm !px-2 !py-1' }
                                     }"
                                 />
                             </div>
@@ -316,14 +316,14 @@
                                     v-model="memberSelectedTypes[1]"
                                     :options="memberTypes"
                                     optionLabel="name"
-                                    placeholder="Select a role"
-                                    class="w-16"
+                                    placeholder="Select"
+                                    class="!w-16"
                                     :pt="{
-                                        root: { class: 'border-0 shadow-none' },
-                                        label: { class: 'p-0 text-muted-color text-sm' },
-                                        dropdown: { class: 'p-0 w-auto' },
-                                        dropdownicon: { class: 'w-3 h-3' },
-                                        option: { class: 'text-sm px-2 py-1' }
+                                        root: { class: '!border-0 !shadow-none' },
+                                        label: { class: '!p-0 !text-muted-color !text-sm' },
+                                        dropdown: { class: '!p-0 !w-auto' },
+                                        dropdownicon: { class: '!w-3 !h-3' },
+                                        option: { class: '!text-sm !px-2 !py-1' }
                                     }"
                                 />
                             </div>
@@ -337,14 +337,14 @@
                                     v-model="memberSelectedTypes[2]"
                                     :options="memberTypes"
                                     optionLabel="name"
-                                    placeholder="Select a role"
-                                    class="w-16"
+                                    placeholder="Select"
+                                    class="!w-16"
                                     :pt="{
-                                        root: { class: 'border-0 shadow-none' },
-                                        label: { class: 'p-0 text-muted-color text-sm' },
-                                        dropdown: { class: 'p-0 w-auto' },
-                                        dropdownicon: { class: 'w-3 h-3' },
-                                        option: { class: 'text-sm px-2 py-1' }
+                                        root: { class: '!border-0 !shadow-none' },
+                                        label: { class: '!p-0 !text-muted-color !text-sm' },
+                                        dropdown: { class: '!p-0 !w-auto' },
+                                        dropdownicon: { class: '!w-3 !h-3' },
+                                        option: { class: '!text-sm !px-2 !py-1' }
                                     }"
                                 />
                             </div>
diff --git a/apps/showcase/components/landing/samples/MoviesApp.vue b/apps/showcase/components/landing/samples/MoviesApp.vue
index 405c0b89a..13025530e 100644
--- a/apps/showcase/components/landing/samples/MoviesApp.vue
+++ b/apps/showcase/components/landing/samples/MoviesApp.vue
@@ -51,10 +51,10 @@
                                     :showValue="false"
                                     :pt="{
                                         root: {
-                                            class: 'h-1.5 bg-surface-950 dark:bg-surface-50 rounded-full'
+                                            class: '!h-1.5 !bg-surface-950 dark:!bg-surface-50 !rounded-full'
                                         },
                                         value: {
-                                            class: 'bg-surface-0 dark:bg-surface-950 rounded-full'
+                                            class: '!bg-surface-0 dark:!bg-surface-950 !rounded-full'
                                         }
                                     }"
                                 ></ProgressBar>