diff --git a/assets/js/main.js b/assets/js/main.js index 3725c53..bfc03f6 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -86,7 +86,7 @@ class Square extends React.Component{ class Board extends React.Component{ renderSquare(i, classId){ - let customClassName = `square col-sm-4 box-${classId}`; + let customClassName = `square col-xs-4 box-${classId + 1}`;//could be sm let sq = ; squareLocation.push(sq); puzzle.push(i); @@ -95,22 +95,20 @@ class Board extends React.Component{ } render(){ return( -
-

Cy Sliding Puzzle

-
{status}
-
+
+
{this.renderSquare(0, 0)} {this.renderSquare(1, 1)} {this.renderSquare(2, 2)}
-
+
{this.renderSquare(3, 3)} {this.renderSquare(4, 4)} {this.renderSquare(5, 5)}
-
+
{this.renderSquare(6, 6)} {this.renderSquare(7, 7)} {this.renderSquare(8, 8)} @@ -125,15 +123,21 @@ class Board extends React.Component{ class Game extends React.Component { render() { return ( -
-
+
+

Cy Sliding Puzzle

+
{status}
+
{/* status */}
    {/* TODO */}
-
Moves: {moves}
-
Score: {score}
+
+
+

Moves: {moves}

+

Score: {score}

+
+
diff --git a/index.html b/index.html index f249cc4..fd61733 100644 --- a/index.html +++ b/index.html @@ -1,59 +1,54 @@ - - - - - + - - + - - - Cy Sliding Puzzle - - -

Cy Sliding Puzzle


-
- - -
-
-
-
Square 1
-
Square 2
-
Square 3
-
-
-
Square 4
-
Square 5
-
Square 6
-
-
-
Square 7
-
Square 8
-
Square 9
-
-
+ + +
+ + + + + + + + + + + + + + + + + + +
-
-
- -
-
-

Moves:

-
-
+
+ + + + + + - + + + + + + +