fix(CSS): #127 include nested childs from css module

Viijay-Kr · Feb 2, 2024 · 96f6d37 · 96f6d37
1 parent 107f887
commit 96f6d37
Show file tree

Hide file tree

Showing 8 changed files with 248 additions and 130 deletions.
diff --git a/examples/jsx-project/src/App.jsx b/examples/jsx-project/src/App.jsx
@@ -1,6 +1,7 @@
 import { useState } from "react";
 import reactLogo from "./assets/react.svg";
 import styles from "./scss.module.scss";
+import css from './App.module.css';
 
 function App() {
   const [count, setCount] = useState(0);
@@ -16,11 +17,11 @@ function App() {
         </a>
       </div>
       <h1>Vite + React</h1>
-      <div className={styles['test-child']}>
+      <div className={styles['nested-child']}>
         <button onClick={() => setCount((count) => count + 1)}>
           count is {count}
         </button>
-        <p>
+        <p className={css.nestedLogo2}>
           Edit <code>src/App.jsx</code> and save to test HMR
         </p>
       </div>

diff --git a/examples/jsx-project/src/App.module.css b/examples/jsx-project/src/App.module.css
@@ -10,6 +10,14 @@
   padding: 1.5em;
   will-change: filter;
   transition: filter 300ms;
+
+  .nestedLogo {
+    margin: 1rem;
+  }
+
+  .nestedLogo2 {
+    display: inline;
+  }
 }
 
 .logo:hover {

diff --git a/examples/react-app/src/App.js b/examples/react-app/src/App.js
diff --git a/examples/react-app/src/App.js.map b/examples/react-app/src/App.js.map
diff --git a/examples/react-app/src/styles/button.module.css b/examples/react-app/src/styles/button.module.css
@@ -1,3 +1,11 @@
 .btn-primary {
     background: #000;
+}
+
+.btn-secondary {
+    background: #0019;
+
+    .btn-secondary-nested {
+        background: cyan;
+    }
 }