📝 Docs: 移除 Messenger 移动端预期外的蓝色遮罩 (#1842)

website/src/components/Messenger/index.tsx

@@ -71,10 +71,18 @@ export default function Messenger({
       <div className="px-3">
         <div className="flex flex-row items-center">
           <div className="flex-1 p-1 max-w-full">
-            <input className="w-full rounded bg-light dark:bg-dark" />
+            <input
+              className="w-full rounded bg-light dark:bg-dark focus:outline-none focus:ring focus:border-blue-500"
+              readOnly
+            />
           </div>
           <div className="flex-initial grow-0 w-fit">
-            <button className="h-7 px-3 rounded-full bg-blue-500 text-white">
+            <button
+              className={clsx(
+                "h-7 px-3 rounded-full bg-blue-500 text-white",
+                styles.messageSendButton
+              )}
+            >
               <span>发送</span>
             </button>
           </div>

website/src/components/Messenger/styles.module.css

@@ -28,3 +28,13 @@
 .message.messageRight .messageBox::after {
   @apply !left-full !right-auto !rounded-bl-[0] !rounded-br-lg;
 }
+
+.messageSendButton {
+  -webkit-tap-highlight-color: transparent;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}