⬆️ Update to latest dependencies

js/src/App.jsx

@@ -1,16 +1,16 @@
 import logo from "./logo.svg";
-import "./App.css";
+import styles from "./App.module.css";
 
 function App() {
   return (
-    <div class="App">
-      <header class="App-header">
-        <img src={logo} class="App-logo" alt="logo" />
+    <div class={styles.App}>
+      <header class={styles.header}>
+        <img src={logo} class={styles.logo} alt="logo" />
         <p>
           Edit <code>src/App.js</code> and save to reload.
         </p>
         <a
-          class="App-link"
+          class={styles.link}
           href="https://github.com/ryansolid/solid"
           target="_blank"
           rel="noopener noreferrer"

js/src/App.module.css

@@ -2,13 +2,13 @@
   text-align: center;
 }
 
-.App-logo {
-  animation: App-logo-spin infinite 20s linear;
+.logo {
+  animation: logo-spin infinite 20s linear;
   height: 40vmin;
   pointer-events: none;
 }
 
-.App-header {
+.header {
   background-color: #282c34;
   min-height: 100vh;
   display: flex;
@@ -19,11 +19,11 @@
   color: white;
 }
 
-.App-link {
+.link {
   color: #b318f0;
 }
 
-@keyframes App-logo-spin {
+@keyframes logo-spin {
   from {
     transform: rotate(0deg);
   }

js/src/index.jsx

@@ -1,4 +1,4 @@
-import { render } from "solid-js/dom";
+import { render } from "solid-js/web";
 
 import "./index.css";
 import App from "./App";
@@ -6,6 +6,6 @@ import App from "./App";
 const dispose = render(App, document.getElementById("root"));
 
 if (import.meta.hot) {
-  import.meta.hot.accept()
-  import.meta.hot.dispose(dispose)
+  import.meta.hot.accept();
+  import.meta.hot.dispose(dispose);
 }