fix: advanced rendering toggle in app barely worked (#6056)

Author: Prospector

apps/app-frontend/src/App.vue

@@ -1647,6 +1647,12 @@ provideAppUpdateDownloadProgress(appUpdateDownload)
 	&.app-contents::before {
 		box-shadow: none;
 	}
+
+	*,
+	:deep(*) {
+		box-shadow: none !important;
+		--tw-drop-shadow:;
+	}
 }
 
 .app-sidebar::before {

packages/ui/src/components/base/ButtonStyled.vue

@@ -241,7 +241,10 @@ const fontSize = computed(() => {
 <template>
 	<div
 		class="btn-wrapper"
-		:class="[{ outline: type === 'outlined', chip: type === 'chip' }, fontSize]"
+		:class="[
+			{ outline: type === 'outlined', transparent: type === 'transparent', chip: type === 'chip' },
+			fontSize,
+		]"
 		:style="`${colorVariables}--_height:${height};--_width:${width};--_radius: ${radius};--_padding-x:${paddingX};--_padding-y:${paddingY};--_gap:${gap};--_font-weight:${fontWeight};--_icon-size:${iconSize};--_outline-color:${color === 'standard' && type === 'outlined' ? 'var(--surface-5)' : 'currentColor'}`"
 	>
 		<slot />
@@ -314,6 +317,25 @@ const fontSize = computed(() => {
 	}
 }
 
+.disable-advanced-rendering {
+	.btn-wrapper:not(.outline):not(.transparent) :deep(:is(button, a, .button-like):first-child),
+	.btn-wrapper:not(.outline):not(.transparent) :slotted(:is(button, a, .button-like):first-child),
+	.btn-wrapper:not(.outline):not(.transparent)
+		:slotted(*)
+		> :is(button, a, .button-like):first-child,
+	.btn-wrapper:not(.outline):not(.transparent)
+		:slotted(*)
+		> *:first-child
+		> :is(button, a, .button-like):first-child,
+	.btn-wrapper
+		:slotted(*)
+		> *:first-child
+		> *:first-child
+		> :is(button, a, .button-like):first-child {
+		@apply border border-[rgba(0,0,0,0.2)];
+	}
+}
+
 .btn-wrapper.outline :deep(:is(button, a, .button-like):first-child),
 .btn-wrapper.outline :slotted(:is(button, a, .button-like):first-child),
 .btn-wrapper.outline :slotted(*) > :is(button, a, .button-like):first-child,