Merge pull request #117 from ruucm/framer-plugin

remove unused packages / update favicon
ruucm · Dec 1, 2024 · defa796 · defa796
2 parents 8785ef2 + 393c64b
commit defa796
Show file tree

Hide file tree

Showing 8 changed files with 12,403 additions and 9,964 deletions.
diff --git a/apps/framer-plugin/framer.json b/apps/framer-plugin/framer.json
@@ -2,5 +2,5 @@
   "id": "ab22de",
   "name": "ShaderGradient",
   "modes": ["canvas"],
-  "icon": "/icon.svg"
+  "icon": "/icon.png"
 }
diff --git a/apps/framer-plugin/index.html b/apps/framer-plugin/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/icon.svg" />
+    <link rel="icon" type="image/png" href="/logo.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>ShaderGradient</title>
   </head>

diff --git a/apps/framer-plugin/package.json b/apps/framer-plugin/package.json
@@ -17,10 +17,7 @@
     "vite-plugin-mkcert": "^1"
   },
   "devDependencies": {
-    "@react-three/fiber": "^8.17.10",
-    "@react-spring/three": "^9.7.3",
-    "three": "^0.169.0",
-    "@shadergradient/react": "workspace:*",
+
     "@eslint/js": "^9",
     "@types/react-dom": "^18",
     "@types/react": "^18",

diff --git a/apps/framer-plugin/public/icon.png b/apps/framer-plugin/public/icon.png
diff --git a/apps/framer-plugin/public/icon.svg b/apps/framer-plugin/public/icon.svg
diff --git a/apps/framer-plugin/src/App.css b/apps/framer-plugin/src/App.css
@@ -9,3 +9,11 @@ main {
   gap: 15px;
   overflow: hidden;
 }
+
+[data-framer-theme='dark'] #light-iframe {
+  display: none;
+}
+
+[data-framer-theme='light'] #dark-iframe {
+  display: none;
+}
diff --git a/apps/framer-plugin/src/App.tsx b/apps/framer-plugin/src/App.tsx
@@ -27,31 +27,45 @@ const handleAddShaderGradient = async (controls: { message: string }) => {
   })
 }
 
-function handleMessage(event: { origin: string; data: { message: string } }) {
-  if (event.origin === framerPluginURLOrigin) {
-    console.log(event)
+export function App() {
+  function handleMessage(event: { origin: string; data: { message: string } }) {
+    if (event.origin === framerPluginURLOrigin) {
+      console.log(event)
 
-    if (event.data.message === 'ADD_TO_CANVAS') {
-      handleAddShaderGradient(event.data)
+      if (event.data.message === 'ADD_TO_CANVAS') {
+        handleAddShaderGradient(event.data)
+      }
     }
   }
-}
-export function App() {
+
   useEffect(() => {
     window.addEventListener('message', handleMessage, false)
   }, [])
 
   return (
     <main>
       <iframe
-        id='framer-plugin-site'
+        id='light-iframe'
         src={framerPluginURLOrigin + '/framer-plugin'}
         style={{
           outline: 'none',
           border: 'none',
           width: 300,
           height: 446,
           overflow: 'hidden',
+          position: 'absolute',
+        }}
+      />
+      <iframe
+        id='dark-iframe'
+        src={framerPluginURLOrigin + '/framer-plugin-dark'}
+        style={{
+          outline: 'none',
+          border: 'none',
+          width: 300,
+          height: 446,
+          overflow: 'hidden',
+          position: 'absolute',
         }}
       />
     </main>