refactor: move mnswpr.css import into mnswpr.js

eslint.config.js

@@ -21,8 +21,7 @@ export default defineConfig([
       'css/no-empty-blocks': 'error',
       'css/no-invalid-at-rules': 'error',
       'css/no-invalid-properties': 'error'
-    },
+    }
-    ignores: ['./src/modules/loading/loading.css']
   },
   {
     files: ['**/*.{js,mjs,cjs}'],

index.html

@@ -19,10 +19,6 @@
             <div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div>
         </div>
     </div>
-    <script type="module">
+    <script type="module" src="./src/main.js"></script>
-        import MineSweeper from './src/main.js'
-        const mnswpr = new MineSweeper('app', 'dev')
-        mnswpr.initialize()
-    </script>
 </body>
 </html>

src/main.js

@@ -1,5 +1,4 @@
-import './modules/loading/loading.css'
+import MineSweeper from './mnswpr.js'
-import './mnswpr.css'
-import Minesweeper from './mnswpr.js'
 
-export default Minesweeper
+const mnswpr = new MineSweeper('app', 'dev')
+mnswpr.initialize()

src/mnswpr.js

@@ -1,5 +1,6 @@
 // @ts-check
 
+import './mnswpr.css'
 import {
   LoggerService,
   StorageService,

src/modules/index.js

@@ -1,4 +1,3 @@
-export * from './loading/loading.js'
 export * from './logger/logger.js'
 export * from './storage/storage.js'
 export * from './timer/timer.js'

src/modules/loading/loading.css

@@ -1,55 +0,0 @@
-.lds-ellipsis {
-  display: inline-block;
-  position: relative;
-  width: 80px;
-  height: 80px;
-}
-.lds-ellipsis div {
-  position: absolute;
-  top: 33px;
-  width: 13px;
-  height: 13px;
-  border-radius: 50%;
-  background: #fff;
-  animation-timing-function: cubic-bezier(0, 1, 1, 0);
-}
-.lds-ellipsis div:nth-child(1) {
-  left: 8px;
-  animation: lds-ellipsis1 0.6s infinite;
-}
-.lds-ellipsis div:nth-child(2) {
-  left: 8px;
-  animation: lds-ellipsis2 0.6s infinite;
-}
-.lds-ellipsis div:nth-child(3) {
-  left: 32px;
-  animation: lds-ellipsis2 0.6s infinite;
-}
-.lds-ellipsis div:nth-child(4) {
-  left: 56px;
-  animation: lds-ellipsis3 0.6s infinite;
-}
-@keyframes lds-ellipsis1 {
-  0% {
-    transform: scale(0);
-  }
-  100% {
-    transform: scale(1);
-  }
-}
-@keyframes lds-ellipsis3 {
-  0% {
-    transform: scale(1);
-  }
-  100% {
-    transform: scale(0);
-  }
-}
-@keyframes lds-ellipsis2 {
-  0% {
-    transform: translate(0, 0);
-  }
-  100% {
-    transform: translate(24px, 0);
-  }
-}

src/modules/loading/loading.js

@@ -1,8 +0,0 @@
-export class LoadingService {
-  addLoading(element) {
-    element.innerHTML = '<div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div>'
-  }
-  removeLoading(element) {
-    element.innerHTML = ''
-  }
-}