rjanjic · aaalmanza · Jan 15, 2026 · Jan 20, 2026 · Jan 20, 2026 · Jan 22, 2026
diff --git a/README.md b/README.md
@@ -1,5 +1,9 @@
 # JavaScript Solitaire Game
 
+This is a fork of rjanjic's repository, the original repo can be found here: http://radovanjanjic.com/js-solitaire/
+
+Everything below this text is from the original repo's README.
+
 DEV env: `yarn && yarn start`
 
 Production build: `yarn build`

diff --git a/config/paths.js b/config/paths.js
@@ -1,6 +1,7 @@
 const path = require('path');
 
 module.exports = {
+    root: path.resolve(__dirname, '../'),
     src: path.resolve(__dirname, '../src'),
     index: path.resolve(__dirname, '../src/index.js'),
     build: path.resolve(__dirname, '../build')

diff --git a/config/webpack.config.js b/config/webpack.config.js
@@ -10,7 +10,22 @@ const config = env === 'development'
 
 const { inject } = config;
 
+const fs = require('fs');
+const path = require('path');
+
 const plugins = [
+    // Copy root index.html to build
+    new CopyWebpackPlugin([{
+        from: path.join(paths.root, 'index.html'),
+        to: path.join(paths.build, 'index.html'),
+        transform: (content) => {
+            let changed = content.toString();
+            for (const key in inject) {
+                changed = changed.replace(`%${key}%`, inject[key]);
+            }
+            return changed;
+        }
+    }]),
     new CopyWebpackPlugin([{
         from: '**/*',
         transform: (content, path) => {

diff --git a/fonts/WindowsRegular.ttf b/fonts/WindowsRegular.ttf
diff --git a/src/index.html → index.html b/src/index.html → index.html
@@ -5,7 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Solitaire</title>
 </head>
-<body style="display: none">
+<body>
     <div class="window">
         <div class="window__inner">
             <div class="window__heading">

diff --git a/package.json b/package.json
@@ -22,7 +22,6 @@
         "file-loader": "0.11.2",
         "fs-extra": "3.0.1",
         "html-webpack-plugin": "2.29.0",
-        "node-sass": "^4.5.3",
         "object-assign": "4.1.1",
         "postcss-flexbugs-fixes": "3.0.0",
         "postcss-loader": "^2.0.6",
@@ -37,5 +36,9 @@
     "scripts": {
         "start": "node scripts/start.js",
         "build": "node scripts/build.js"
+    },
+    "dependencies": {
+        "node-sass": "^9.0.0",
+        "sass": "^1.97.2"
     }
 }
diff --git a/src/index.js b/src/index.js
@@ -227,6 +227,13 @@ function dealCards() {
     }
 }
 
+function shuffleInPlace(a) {
+    for (let i = a.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1));
+        [a[i], a[j]] = [a[j], a[i]];
+    }
+}
+
 function resetGame() {
     // clear decks
     for (let i = 0; i < 7; i++) {
@@ -238,8 +245,8 @@ function resetGame() {
     state.deal.pile.cards = [];
     state.deal.deal.cards = [];
 
-    // randomise cards
-    state.cards.sort(() => (Math.random() < .5) ? -1 : 1);
+    // randomize cards
+    shuffleInPlace(state.cards);
 
     // re-assign indexes
     requestAnimationFrame(() => {

diff --git a/src/index.scss b/src/index.scss
@@ -16,13 +16,13 @@ body {
 }
 
 body {
-    background: #008080;
+    background: #54aaa9;
     display: block !important;
 }
 
 .solitaire {
     width: 660px;
-    background-color: green;
+    background-color: #00aa54;
     height: 440px;
     position: relative;
 }
@@ -104,7 +104,7 @@ body {
         border: 1px dotted;
         border-radius: 4px;
         cursor: pointer;
-        background-image: radial-gradient(green 30%,white 30.1%,white 40%,green 40.1%, green 100%);
+        background-image: radial-gradient(#00aa54 30%,white 30.1%,white 40%,#00aa54 40.1%, #00aa54 100%);
         background-size: 90px 90px;
         background-position: center;
         background-repeat: no-repeat;
@@ -230,7 +230,8 @@ body {
     margin: 20px auto;
     width: 671px;
     color: #000;
-    font-family: 'Arial',sans-serif;
+    font-family: 'MyCustomFont';
+    src: url('fonts/WindowsRegular.ttf') format('truetype');
     background: #c0c0c0;
     border: 1px solid;
     border-top-color: #dfdfdf;
@@ -250,7 +251,7 @@ body {
         margin: 2px 2px 0;
         padding: 1px 2px;
         color: #fff;
-        background: linear-gradient(to right, #000080, #1084d0);
+        background: #0100aa;
         font-weight: bold;
         font-size: 12px;
         line-height: 16px;