diff --git a/src/components/GameBoard.component.js b/src/components/GameBoard.component.js
index 3805d73..c08665f 100644
--- a/src/components/GameBoard.component.js
+++ b/src/components/GameBoard.component.js
@@ -55,12 +55,20 @@ export default class GameBoardComponent extends Component {
      */
     // rows = []
     column_labels = ["A", "B", "C", "D", "E", "F", "G", "H", "I"]
+<<<<<<< Updated upstream
+=======
+
+>>>>>>> Stashed changes
 
     async vue_on_create() {
         this.ready = true
     }
 
+<<<<<<< Updated upstream
     on_cell_click(row_i, cell_i) {
         alert(`${row_i} : ${cell_i}`)
     }
+=======
+    
+>>>>>>> Stashed changes
 }
diff --git a/src/components/TopLevel.component.js b/src/components/TopLevel.component.js
index ea86f0c..f362d8f 100644
--- a/src/components/TopLevel.component.js
+++ b/src/components/TopLevel.component.js
@@ -3,6 +3,7 @@ import {GameState} from '../module/util.js'
 import game_service from '../services/GameState.service.js'
 
 const template = `
+<<<<<<< Updated upstream
 <div class="top-level-container">
     <div class="top-level-component">
         <div v-if="current_state === GameState.ChoosingNumberOfShips">
@@ -12,6 +13,24 @@ const template = `
             <button @click="ship(3)" class="shipBtn">3 ships</button>
             <button @click="ship(4)" class="shipBtn">4 ships</button>
             <button @click="ship(5)" class="shipBtn">5 ships</button>
+=======
+<div class="top-level-component">
+    <div v-if="current_state === GameState.ChoosingNumberOfShips">
+        Choose number of ships:
+        <button @click="ship1" class="shipBtn">1 ship</button>
+        <button @click="ship2" class="shipBtn">2 ships</button>
+        <button @click="ship3" class="shipBtn">3 ships</button>
+        <button @click="ship4" class="shipBtn">4 ships</button>
+        <button @click="ship5" class="shipBtn">5 ships</button>
+    </div>
+<<<<<<< HEAD
+=======
+>>>>>>> 19aa3733d0604f37e6875b825eb51ccd4092d4c4
+    <div v-if="current_state !== GameState.ChoosingNumberOfShips" class="game-boards-container">
+        <!-- Opponent's board -->
+        <div class="game-board">
+            <app-game-board v-bind:rows="opponent_rows"></app-game-board>
+>>>>>>> Stashed changes
         </div>
         <div v-if="current_state !== GameState.ChoosingNumberOfShips" class="game-boards-container">
             <!-- Opponent's board -->
diff --git a/src/services/GameState.service.js b/src/services/GameState.service.js
index 64e1652..a1335d9 100644
--- a/src/services/GameState.service.js
+++ b/src/services/GameState.service.js
@@ -57,17 +57,34 @@ export class GameStateService {
     }
 
     /**
-     * sets the number of boats to a valid number 
+     * sets the number of boats to a valid number
      * @private
-     * @return none 
+     * @return none
      */
     set_n_boats(number){
         if(number >= 1 && number <= 5 )
         {
-            this.n_boats = number; 
+            this.n_boats = number;
         }
     }
 
+    get_possible_boats(number){
+      if (get_n_boats == 1) {
+          return (ships:x1)
+      }
+      if (get_n_boats == 2) {
+          return (ships:x1, x2)
+      }
+      if (get_n_boats == 3) {
+          return (ships:x1, x2, x3)
+      }
+      if (get_n_boats == 4) {
+          return (ships:x1, x2, x3,x4)
+      }
+      if (get_n_boats == 5) {
+          return (ships:x1, x2, x3, x4, x5)
+      }
+    }
     /**
      * The current state of the game.
      * @private
@@ -174,10 +191,10 @@ export class GameStateService {
     }
 
     /**
-     * get the "score" (the number of hits) that the 
+     * get the "score" (the number of hits) that the
      * current player has (counting sunk ships)
      * @return {number}
-     * @private 
+     * @private
      */
     get_player_score(player) {
         let i = 1;
@@ -201,7 +218,7 @@ export class GameStateService {
      * gets the number of the boats (sunken, damaged or not) that the opponent has
      * used to help keep get progress method looking clean
      * @return {number}
-     * @private 
+     * @private
      */
     get_boat_count(player){
         let i = 1;
@@ -224,7 +241,7 @@ export class GameStateService {
     /**
      * gets the progress (hits/total boats) that the player has
      * @return {number}
-     * @private 
+     * @private
      */
     get_progress(player){
         return(this.get_player_score(player) / this.get_boat_count(player))
@@ -239,10 +256,10 @@ export class GameStateService {
     }
 
     /**
-     * responsible for advancing the game state 
-     * will be consisting of 
-     * @return 
-     * @private 
+     * responsible for advancing the game state
+     * will be consisting of
+     * @return
+     * @private
      */
     advance_game_state() {
         /** functions to be made that validate:
@@ -271,7 +288,7 @@ export class GameStateService {
                 // all you need to do is make sure they have placed all the appropriate ships
                 if ( this.get_ship_entities(this.current_player).length === this.n_boats ) {
                     this.current_player = Player.Two;
-                    this.current_opponent = Player.One; 
+                    this.current_opponent = Player.One;
                 }
                 else{
                     throw new InvalidAdvanceStateError("Player One has a problem with the number of boats selected");
@@ -309,7 +326,7 @@ export class GameStateService {
 
         let winner = this.get_winner();
         if(winner) {
-            this.current_state = GameState.PlayerVictory; 
+            this.current_state = GameState.PlayerVictory;
             this.current_player = winner;
         }
 
diff --git a/src/style/components.css b/src/style/components.css
index 6f5a05b..5891f56 100644
--- a/src/style/components.css
+++ b/src/style/components.css
@@ -29,6 +29,7 @@
 /* Styles for the various grid cell states. */
 
 .game-board-cell-component {
+
     width: 40px;
     height: 40px;
     border: 1px solid grey;