Change import css

.github/workflows/ci.yml

@@ -1,10 +1,10 @@
-name: Build and Deploy
+name: Build
 on:
   push:
-    branches:
+    branches-ignore:
       - main
 jobs:
-  build-and-deploy:
+  build:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout 🛎️
@@ -14,9 +14,3 @@ jobs:
         run: |
           npm install
           npm run build
-
-      - name: Deploy 🚀
-        uses: JamesIves/github-pages-deploy-action@4.1.5
-        with:
-          branch: gh-pages
-          folder: dist

.github/workflows/deploy-gh-pages.yml

@@ -0,0 +1,22 @@
+name: Build and Deploy
+on:
+  push:
+    branches:
+      - main
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/checkout@v2.3.1
+
+      - name: Install and Build 🔧
+        run: |
+          npm install
+          npm run build
+
+      - name: Deploy 🚀
+        uses: JamesIves/github-pages-deploy-action@4.1.5
+        with:
+          branch: gh-pages
+          folder: dist

package.json

@@ -31,33 +31,33 @@
     "@cher-ami/router": "^1.1.0",
     "@solid-js/css-flat": "^1.0.1",
     "@solid-js/signal": "^1.0.0-beta.1",
-    "@use-gesture/react": "^10.0.0",
+    "@use-gesture/react": "^10.1.0",
     "@wbe/deferred-promise": "^2.4.0",
     "@wbe/react-image": "^2.4.1",
     "@wbe/use-window-size": "^2.4.0",
     "encoding": "^0.1.13",
     "face-api.js": "^0.22.2",
     "file-saver": "^2.0.5",
-    "gsap": "^3.7.1",
+    "gsap": "^3.8.0",
     "jszip": "^3.7.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   },
   "devDependencies": {
-    "@parcel/transformer-image": "^2.0.0-rc.0",
-    "@parcel/transformer-less": "^2.0.0-rc.0",
-    "@types/node": "^16.9.6",
-    "@types/react": "^17.0.24",
+    "@parcel/transformer-image": "^2.0.0",
+    "@parcel/transformer-less": "^2.0.0",
+    "@types/node": "^16.11.0",
+    "@types/react": "^17.0.30",
     "@types/react-dom": "^17.0.9",
     "debug": "^4.3.2",
     "husky": "^7.0.2",
-    "less": "^4.1.1",
-    "lint-staged": "^11.1.2",
-    "parcel": "^2.0.0-rc.0",
+    "less": "^4.1.2",
+    "lint-staged": "^11.2.3",
+    "parcel": "^2.0.0",
     "parcel-reporter-static-files-copy": "^1.3.0",
     "prettier": "^2.4.1",
     "tslib": "^2.3.1",
-    "typescript": "^4.4.3"
+    "typescript": "^4.4.4"
   },
   "lint-staged": {
     "*.{tsx,ts,jsx,js,less,css,json,md}": [

src/components/app/App.tsx

@@ -1,4 +1,4 @@
-import css from "./App.module.less"
+import * as css from "./App.module.less"
 import React, { useEffect, useState } from "react"
 import { AppContext, IImageData } from "../../index"
 import JSZip from "jszip"

src/components/blurZone/BlurZone.tsx

@@ -1,4 +1,4 @@
-import css from "./BlurZone.module.less"
+import * as css from "./BlurZone.module.less"
 import React, { useEffect, useState } from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 

src/components/blurZoneBuilder/BlurZoneBuilder.tsx

@@ -1,4 +1,4 @@
-import css from "./BlurZoneBuilder.module.less"
+import * as css from "./BlurZoneBuilder.module.less"
 import React, { useEffect, useRef, useState } from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 import BlurZone, { TBlurZone } from "../blurZone/BlurZone"

src/components/downloadButton/DownloadButton.tsx

@@ -1,4 +1,4 @@
-import css from "./DownloadButton.module.less"
+import * as css from "./DownloadButton.module.less"
 import React, { forwardRef, MutableRefObject, useContext } from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 import { AppContext } from "../../index"

src/components/github/Github.tsx

@@ -1,4 +1,4 @@
-import css from "./Github.module.less"
+import * as css from "./Github.module.less"
 import React from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 

src/components/image/Image.tsx

@@ -1,4 +1,4 @@
-import css from "./Image.module.less"
+import * as css from "./Image.module.less"
 import React, { useContext, useEffect, useRef, useState } from "react"
 import { useWindowSize } from "@wbe/use-window-size"
 import { FaceDetection } from "face-api.js"

src/components/inputImages/InputImages.tsx

@@ -1,4 +1,4 @@
-import css from "./InputImages.module.less"
+import * as css from "./InputImages.module.less"
 import React, { forwardRef, MutableRefObject, useContext, useRef } from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 import { AppContext, IImageData } from "../../index"

src/components/loader/Loader.tsx

@@ -1,4 +1,4 @@
-import css from "./Loader.module.less"
+import * as css from "./Loader.module.less"
 import React from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 

src/components/logo/Logo.tsx

@@ -1,4 +1,4 @@
-import css from "./Logo.module.less"
+import * as css from "./Logo.module.less"
 import React, { forwardRef, MutableRefObject } from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 import { DICO } from "../../data/dico"

src/components/mainButton/MainButton.tsx

@@ -1,4 +1,4 @@
-import css from "./MainButton.module.less"
+import * as css from "./MainButton.module.less"
 import React from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 

src/components/polaroid/Polaroid.tsx

@@ -1,4 +1,4 @@
-import css from "./Polaroid.module.less"
+import * as css from "./Polaroid.module.less"
 import React, { forwardRef, MutableRefObject } from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 

src/components/restartButton/RestartButton.tsx

@@ -1,4 +1,4 @@
-import css from "./RestartButton.module.less"
+import * as css from "./RestartButton.module.less"
 import React, { forwardRef, MutableRefObject, useContext } from "react"
 import { merge } from "../../lib/utils/arrayUtils"
 import { AppContext } from "../../index"

src/pages/galleryPage/GalleryPage.tsx

@@ -1,4 +1,4 @@
-import css from "./GalleryPage.module.less"
+import * as css from "./GalleryPage.module.less"
 import React, {
   forwardRef,
   ForwardedRef,

src/pages/homePage/HomePage.tsx

@@ -1,4 +1,4 @@
-import css from "./HomePage.module.less"
+import * as css from "./HomePage.module.less"
 import React, { forwardRef, ForwardedRef, useRef, useLayoutEffect } from "react"
 import { useStack } from "@cher-ami/router"
 import { gsap } from "gsap"