fix: PictureInPicture (#1839)

Co-authored-by: V <vendicated@riseup.net>

src/plugins/pictureInPicture/index.tsx

@@ -4,8 +4,6 @@
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
-import "./styles.css";
-
 import { definePluginSettings } from "@api/Settings";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
@@ -26,13 +24,12 @@ export default definePlugin({
     description: "Adds picture in picture to videos (next to the Download button)",
     authors: [Devs.Lumap],
     settings,
-
     patches: [
         {
-            find: ".onRemoveAttachment,",
+            find: ".nonMediaAttachment]",
             replacement: {
-                match: /\.nonMediaAttachment,!(\i).{0,7}children:\[(\i),/,
-                replace: "$&$1&&$2&&$self.renderPiPButton(),"
+                match: /\.nonMediaAttachment\].{0,10}children:\[\S{3}/,
+                replace: "$&&&$self.renderPiPButton(),"
             },
         },
     ],
@@ -43,7 +40,6 @@ export default definePlugin({
                 {tooltipProps => (
                     <div
                         {...tooltipProps}
-                        className="vc-pip-button"
                         role="button"
                         style={{
                             cursor: "pointer",
@@ -74,7 +70,7 @@ export default definePlugin({
                     >
                         <svg width="24px" height="24px" viewBox="0 0 24 24">
                             <path
-                                fill="currentColor"
+                                fill="var(--interactive-normal)"
                                 d="M21 3a1 1 0 0 1 1 1v7h-2V5H4v14h6v2H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h18zm0 10a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1h-8a1 1 0 0 1-1-1v-6a1 1 0 0 1 1-1h8zm-1 2h-6v4h6v-4z"
                             />
                         </svg>