diff --git a/website/docs/tutorials/helloworld.mdx b/website/docs/tutorials/helloworld.mdx
index 86ebae7e..837313d4 100644
--- a/website/docs/tutorials/helloworld.mdx
+++ b/website/docs/tutorials/helloworld.mdx
@@ -109,6 +109,6 @@ You should see the application working as expected:
 
 <div class="text--center">
     <img src="/img/windows-default-app.png" width="50%"
-         style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
+         style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
 </div>
 <br/>
diff --git a/website/i18n/ja/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx b/website/i18n/ja/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx
index e720153f..faf33af6 100644
--- a/website/i18n/ja/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx
+++ b/website/i18n/ja/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx
@@ -10,7 +10,7 @@ tags:
 
 
 <div class="text--center">
-    <img src="/img/wails.png" width="40%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -31,7 +31,7 @@ No, I'm not joking: *No* *CGO* *dependency* 🤯! The thing about Windows is tha
 ### WebView2 Chromium Renderer
 
 <div class="text--center">
-    <img src="/img/devtools.png" width="75%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/devtools.png" width="75%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -47,7 +47,7 @@ Gophers rejoice! The single binary dream lives on!
 ### New Features
 
 <div class="text--center">
-    <img src="/img/wails-menus.png" width="60%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-menus.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -59,7 +59,7 @@ There were a huge number of requests in v1 for the ability to have greater contr
 There is now the option to generate IDE configuration along with your project. This means that if you open your project in a supported IDE, it will already be configured for building and debugging your application. Currently VSCode is supported but we hope to support other IDEs such as Goland soon.
 
 <div class="text--center">
-    <img src="/img/vscode.png" width="100%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/vscode.png" width="100%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -79,7 +79,7 @@ You just pass a single `embed.FS` that contains all your assets into your applic
 ### New Development Experience
 
 <div class="text--center">
-    <img src="/img/browser.png" width="60%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/browser.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -101,7 +101,7 @@ In addition to this, another JS module is dynamically generated wrapping all you
 ### Remote Templates
 
 <div class="text--center">
-    <img src="/img/remote.png" width="60%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/remote.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/ja/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx b/website/i18n/ja/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx
index 81493f0d..7b1f3822 100644
--- a/website/i18n/ja/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx
+++ b/website/i18n/ja/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx
@@ -10,7 +10,7 @@ tags:
 
 
 <div class="text--center">
-    <img src="/img/wails-mac.png" width="60%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-mac.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -24,7 +24,7 @@ So what's new for Wails v2 for Mac vs v1? Hint: It's pretty similar to the Windo
 ### New Features
 
 <div class="text--center">
-    <img src="/img/wails-menus-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-menus-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -72,7 +72,7 @@ In addition to this, another JS module is dynamically generated wrapping all you
 ### Remote Templates
 
 <div class="text--center">
-    <img src="/img/remote-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/remote-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -86,7 +86,7 @@ With v2, I wanted to empower the community by giving you the ability to create a
 Thanks to the amazing support of [Mat Ryer](https://github.com/matryer/), the Wails project now supports M1 native builds:
 
 <div class="text--center">
-    <img src="/img/build-darwin-arm.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/build-darwin-arm.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -94,7 +94,7 @@ Thanks to the amazing support of [Mat Ryer](https://github.com/matryer/), the Wa
 You can also specify `darwin/amd64` as a target too:
 
 <div class="text--center">
-    <img src="/img/build-darwin-amd.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/build-darwin-amd.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -102,7 +102,7 @@ You can also specify `darwin/amd64` as a target too:
 Oh, I almost forgot.... you can also do `darwin/universal`.... :wink:
 
 <div class="text--center">
-    <img src="/img/build-darwin-universal.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/build-darwin-universal.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -112,7 +112,7 @@ Oh, I almost forgot.... you can also do `darwin/universal`.... :wink:
 Because Wails v2 for Windows is pure Go, you can target Windows builds without docker.
 
 <div class="text--center">
-    <img src="/img/build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/ja/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx b/website/i18n/ja/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx
index 6d00c8ae..fbff5a39 100644
--- a/website/i18n/ja/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx
+++ b/website/i18n/ja/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx
@@ -10,7 +10,7 @@ tags:
 
 
 <div class="text--center">
-    <img src="/img/wails-linux.png" width="40%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-linux.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -20,7 +20,7 @@ I'm pleased to finally announce that Wails v2 is now in beta for Linux! It is so
 ### New Features
 
 <div class="text--center">
-    <img src="/img/wails-menus-linux.png" width="50%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-menus-linux.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -59,7 +59,7 @@ In addition to this, another JS module is dynamically generated wrapping all you
 ### Remote Templates
 
 <div class="text--center">
-    <img src="/img/remote-linux.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/remote-linux.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -73,7 +73,7 @@ With v2, I wanted to empower the community by giving you the ability to create a
 Because Wails v2 for Windows is pure Go, you can target Windows builds without docker.
 
 <div class="text--center">
-    <img src="/img/linux-build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/linux-build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx
index efefd4bb..4532995a 100644
--- a/website/i18n/ja/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx
+++ b/website/i18n/ja/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx
@@ -9,7 +9,7 @@ From the project directory, run `wails build`. This will compile your project an
 If you run the binary, you should see the default application:
 
 <div class="text--center">
-    <img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/current/reference/options.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/current/reference/options.mdx
index 9a6fd8f7..15f017ca 100644
--- a/website/i18n/ja/docusaurus-plugin-content-docs/current/reference/options.mdx
+++ b/website/i18n/ja/docusaurus-plugin-content-docs/current/reference/options.mdx
@@ -669,7 +669,7 @@ func main() {
 The "About" menu item will appear in the app menu:
 
 <div class="text--center">
-    <img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -677,7 +677,7 @@ The "About" menu item will appear in the app menu:
 When clicked, that will open an about message box:
 
 <div class="text--center">
-    <img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/current/reference/runtime/dialog.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/current/reference/runtime/dialog.mdx
index 3da74095..a2760199 100644
--- a/website/i18n/ja/docusaurus-plugin-content-docs/current/reference/runtime/dialog.mdx
+++ b/website/i18n/ja/docusaurus-plugin-content-docs/current/reference/runtime/dialog.mdx
@@ -154,7 +154,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
 ```
 the first button is shown as default:
 <div class="text--center">
-    <img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -170,7 +170,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
 ```
 the second button is shown as default. When `return` is pressed, the value "two" is returned.
 <div class="text--center">
-    <img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -187,7 +187,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
 ```
 the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned:
 <div class="text--center">
-    <img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -220,7 +220,7 @@ type FileFilter struct {
 Windows allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the dialog:
 
 <div class="text--center">
-    <img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -232,7 +232,7 @@ Windows allows you to use multiple file filters in dialog boxes. Each FileFilter
 Linux allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the dialog:
 
 <div class="text--center">
-  <img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 >
+  <img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/current/tutorials/helloworld.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/current/tutorials/helloworld.mdx
index 30e3d51a..430f4f70 100644
--- a/website/i18n/ja/docusaurus-plugin-content-docs/current/tutorials/helloworld.mdx
+++ b/website/i18n/ja/docusaurus-plugin-content-docs/current/tutorials/helloworld.mdx
@@ -107,6 +107,6 @@ You should see the application working as expected:
 
 <div class="text--center">
     <img src="/img/windows-default-app.png" width="50%"
-         style={{"box-shadow": "rgb(255 255 >
+         style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 <br/>
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx
index 1953d557..5470bb77 100644
--- a/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx
+++ b/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx
@@ -10,7 +10,7 @@ tags:
 
 
 <div class="text--center">
-    <img src="/img/wails.png" width="40%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -31,7 +31,7 @@ tags:
 ### WebView2 Chromium 渲染引擎
 
 <div class="text--center">
-    <img src="/img/devtools.png" width="75%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/devtools.png" width="75%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -47,7 +47,7 @@ Gophers 欢呼吧！ 单个二进制文件的构想依然存在！
 ### 新功能
 
 <div class="text--center">
-    <img src="/img/wails-menus.png" width="60%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-menus.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -59,7 +59,7 @@ Gophers 欢呼吧！ 单个二进制文件的构想依然存在！
 现在可以选择随项目生成 IDE 配置。 这意味着如果您在受支持的 IDE 中打开您的项目，它已经被配置为构建和调试您的应用程序。 目前支持 VSCode，但我们希望尽快支持其他 IDE，例如 Goland。
 
 <div class="text--center">
-    <img src="/img/vscode.png" width="100%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/vscode.png" width="100%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -79,7 +79,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 ### 全新的开发体验
 
 <div class="text--center">
-    <img src="/img/browser.png" width="60%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/browser.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -101,7 +101,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 ### 远程模板
 
 <div class="text--center">
-    <img src="/img/remote.png" width="60%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/remote.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx
index aad2712e..2e8febe3 100644
--- a/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx
+++ b/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx
@@ -10,7 +10,7 @@ tags:
 
 
 <div class="text--center">
-    <img src="/img/wails-mac.png" width="60%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-mac.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -24,7 +24,7 @@ tags:
 ### 新特性
 
 <div class="text--center">
-    <img src="/img/wails-menus-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-menus-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -72,7 +72,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 ### 远程模板
 
 <div class="text--center">
-    <img src="/img/remote-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/remote-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -86,7 +86,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 感谢[Mat Ryer](https://github.com/matryer/)的惊人支持，Wails 项目现在支持 M1 原生构建：
 
 <div class="text--center">
-    <img src="/img/build-darwin-arm.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/build-darwin-arm.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -94,7 +94,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 您也可以指定`darwin/amd64`为目标：
 
 <div class="text--center">
-    <img src="/img/build-darwin-amd.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/build-darwin-amd.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -102,7 +102,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 哦，我差点忘了....你也可以做`darwin/universal`....😉
 
 <div class="text--center">
-    <img src="/img/build-darwin-universal.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/build-darwin-universal.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -112,7 +112,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 因为 Windows 的 Wails v2 是纯 Go，所以你可以在没有 docker 的情况下针对 Windows 构建。
 
 <div class="text--center">
-    <img src="/img/build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx
index 91757a65..bc849990 100644
--- a/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx
+++ b/website/i18n/zh-Hans/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx
@@ -10,7 +10,7 @@ tags:
 
 
 <div class="text--center">
-    <img src="/img/wails-linux.png" width="40%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-linux.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -20,7 +20,7 @@ tags:
 ### 新功能
 
 <div class="text--center">
-    <img src="/img/wails-menus-linux.png" width="50%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/wails-menus-linux.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -59,7 +59,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 ### 远程模板
 
 <div class="text--center">
-    <img src="/img/remote-linux.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/remote-linux.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -73,7 +73,7 @@ v1 的一个巨大痛点是需要将整个应用程序压缩为单个 JS 和 CSS
 因为适用于 Windows 的 Wails v2 是纯 Go，所以您可以在没有 docker 的情况下针对 Windows 构建。
 
 <div class="text--center">
-    <img src="/img/linux-build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/linux-build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx
index b6dae829..1dd41d09 100644
--- a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx
+++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx
@@ -9,7 +9,7 @@ sidebar_position: 6
 如果您运行二进制文件，您应该会看到默认应用程序：
 
 <div class="text--center">
-    <img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/gettingstarted/firstproject.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/gettingstarted/firstproject.mdx
index 13062f1e..ee994ea3 100644
--- a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/gettingstarted/firstproject.mdx
+++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/gettingstarted/firstproject.mdx
@@ -10,7 +10,8 @@ sidebar_position: 2
 
 Pick your favourite framework:
 
-import TabsFrameworks from "../../src/components/frameworktabs";
+import TabsFrameworks from "../../../../../src/components/frameworktabs";
+
 <TabsFrameworks/>
 
 <hr />
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/reference/options.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/reference/options.mdx
index ab9a8a17..891165d8 100644
--- a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/reference/options.mdx
+++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/reference/options.mdx
@@ -673,7 +673,7 @@ func main() {
 The "About" menu item will appear in the app menu:
 
 <div class="text--center">
-    <img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
@@ -681,7 +681,7 @@ The "About" menu item will appear in the app menu:
 When clicked, that will open an about message box:
 
 <div class="text--center">
-    <img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 
 <br/>
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/reference/runtime/dialog.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/reference/runtime/dialog.mdx
index 618f1284..03bf0414 100644
--- a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/reference/runtime/dialog.mdx
+++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/reference/runtime/dialog.mdx
@@ -152,7 +152,10 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
     Buttons:      []string{"one", "two", "three", "four"},
 })
 ```
-第一个按钮显示为默认值：div class="text--center"> <img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 > </div>
+第一个按钮显示为默认值：
+<div class="text--center">
+<img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
+</div>
 <br/>
 
 如果我们指定`DefaultButton`为“two”：
@@ -166,7 +169,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
 ```
 第二个按钮显示为默认值。 当 `return` 被按下时，则返回数值“two”。
 <div class="text--center">
-    <img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
 </div>
 
 <br/>
@@ -183,7 +186,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
 ```
 带有“three”的按钮显示在对话框的底部。 当`escape`被按下时，则返回值“three”：
 <div class="text--center">
-    <img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
 </div>
 
 <br/>
@@ -216,7 +219,7 @@ type FileFilter struct {
 Windows 允许您在对话框中使用多个文件过滤器。 每个 FileFilter 将在对话框中显示为一个单独的条目：
 
 <div class="text--center">
-    <img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 >
+    <img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
 </div>
 
 <br/>
@@ -228,7 +231,7 @@ Windows 允许您在对话框中使用多个文件过滤器。 每个 FileFilter
 Linux 允许您在对话框中使用多个文件过滤器。 每个 FileFilter 将在对话框中显示为一个单独的条目：
 
 <div class="text--center">
-  <img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 >
+  <img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
 </div>
 
 <br/>
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorials/helloworld.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorials/helloworld.mdx
index 632b0e97..ee3910a0 100644
--- a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorials/helloworld.mdx
+++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/tutorials/helloworld.mdx
@@ -113,6 +113,6 @@ You should see the application working as expected:
 
 <div class="text--center">
     <img src="/img/windows-default-app.png" width="50%"
-         style={{"box-shadow": "rgb(255 255 >
+         style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>>
 </div>
 <br/>
diff --git a/website/versioned_docs/version-v2.0.0-beta.40/tutorials/helloworld.mdx b/website/versioned_docs/version-v2.0.0-beta.40/tutorials/helloworld.mdx
index 86ebae7e..837313d4 100644
--- a/website/versioned_docs/version-v2.0.0-beta.40/tutorials/helloworld.mdx
+++ b/website/versioned_docs/version-v2.0.0-beta.40/tutorials/helloworld.mdx
@@ -109,6 +109,6 @@ You should see the application working as expected:
 
 <div class="text--center">
     <img src="/img/windows-default-app.png" width="50%"
-         style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
+         style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
 </div>
 <br/>
diff --git a/website/versioned_docs/version-v2.0.0-beta.43/tutorials/helloworld.mdx b/website/versioned_docs/version-v2.0.0-beta.43/tutorials/helloworld.mdx
index 86ebae7e..837313d4 100644
--- a/website/versioned_docs/version-v2.0.0-beta.43/tutorials/helloworld.mdx
+++ b/website/versioned_docs/version-v2.0.0-beta.43/tutorials/helloworld.mdx
@@ -109,6 +109,6 @@ You should see the application working as expected:
 
 <div class="text--center">
     <img src="/img/windows-default-app.png" width="50%"
-         style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
+         style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
 </div>
 <br/>