Improve style of seats show display name above sit button

app/views/tables/_seat.html.haml

@@ -1,6 +1,54 @@
 - if seat
   - @game = seat.game
   .seat{class: "position-#{@seats.index(seat) + 1}"}
+
+    - if seat.user_soft_token
+      -# = button_to remove_player_seat_path(seat), :data => { :confirm => 'Are you sure you want to remove this player?' } do
+      -# TODO: Remove Player button
+      -# = button_to remove_player_seat_path(seat) do
+        - "Remove Player"
+      .user{id: "user-#{seat.user_soft_token}", class: @game.try("controlling_player") == seat.player ? "taking-turn" : "",
+        data: {soft_token: seat.user_soft_token} }
+        .user-name= seat.user_soft_token[0..3]
+        -# .user-soft-token= seat.user.soft_token
+        -# TODO user principal
+        -# .user-principal= seat.user_soft_token[0..3]
+        - if @game.try("started?")
+          .inventory-count
+            Cards: 
+            = seat.player.inventory.count
+
+          -# Show player controls if player is owned by current_user 
+          - if seat.user.soft_token == current_user.soft_token
+            = form_for(@game,
+              url: play_hand_game_path(@game),
+              method: "post",
+              name: "player_controls_" + seat.user_id.to_s,
+              id: "player_controls_" + seat.user_id.to_s) do |f|
+              %ul#inventory
+                -# - seat.player.inventory.each do |card|
+                  %li
+                    %label
+                      = check_box_tag 'player_card_ids[]',
+                        card.id,
+                        false,
+                        data: {value: card.id, card_name: card.rank.gsub('11','J') .gsub('12','Q') .gsub('13','K') .gsub('14','A') .gsub('15','2') + ' ' + card.suit}
+
+                      -# %input{form: "player_controls_" + card.player_id.to_s,
+                        type: "checkbox",
+                        name: "player_card_ids[]",
+                        data: {value: card.id, card_name: card.rank.gsub('11','J') .gsub('12','Q') .gsub('13','K') .gsub('14','A') .gsub('15','2') + ' ' + card.suit}}
+                      = image_tag('cards/png/' + (card.rank.gsub('J','jack').gsub('Q','queen').gsub('K','king').gsub('A','ace') + '_of_' + card.suit.downcase + 's.png').gsub('11','jack') .gsub('12','queen') .gsub('13','king') .gsub('14','ace') .gsub('15','2'))
+              - disabled = @game.try("controlling_player") != seat.player
+              #play-buttons
+                %input{type: "submit", value: "Play Hand", name: "hand_type", disabled: disabled}
+                %input{type: "submit", value: "Pass", name: "hand_type", disabled: disabled}
+
+          - else
+            .inventory
+              - seat.player.inventory.count.times do |index|
+                = image_tag('cards/png/back-pink.png')
+
     .seat-controls
       - if seat.occupied?
         - if seat.player.try("is_bot?")
@@ -21,47 +69,3 @@
         -# = button_to add_bot_seat_path(seat) do
           - "+ Bot"
 
-    - if seat.player       
-      -# = button_to remove_player_seat_path(seat), :data => { :confirm => 'Are you sure you want to remove this player?' } do
-      = button_to remove_player_seat_path(seat) do
-        - "Remove Player"
-      .player{id: "player-#{seat.player.id}", class: @game.controlling_player == seat.player ? "taking-turn" : "",
-        data: {soft_token: seat.player.soft_token} }
-        .user-name= seat.player.display_name
-        -# .user-soft-token= seat.player.soft_token
-        .user-principal= seat.player.principal
-        - if @game.started?
-          .inventory-count
-            Cards: 
-            = seat.player.inventory.count
-
-          -# Show player controls if player is owned by current_user 
-          - if seat.player.soft_token == current_user.soft_token
-            = form_for(@game,
-              url: play_hand_game_path(@game),
-              method: "post",
-              name: "player_controls_" + seat.player_id.to_s,
-              id: "player_controls_" + seat.player_id.to_s) do |f|
-              %ul#inventory
-                - seat.player.inventory.each do |card|
-                  %li
-                    %label
-                      = check_box_tag 'player_card_ids[]',
-                        card.id,
-                        false,
-                        data: {value: card.id, card_name: card.rank.gsub('11','J') .gsub('12','Q') .gsub('13','K') .gsub('14','A') .gsub('15','2') + ' ' + card.suit}
-
-                      -# %input{form: "player_controls_" + card.player_id.to_s,
-                        type: "checkbox",
-                        name: "player_card_ids[]",
-                        data: {value: card.id, card_name: card.rank.gsub('11','J') .gsub('12','Q') .gsub('13','K') .gsub('14','A') .gsub('15','2') + ' ' + card.suit}}
-                      = image_tag('cards/png/' + (card.rank.gsub('J','jack').gsub('Q','queen').gsub('K','king').gsub('A','ace') + '_of_' + card.suit.downcase + 's.png').gsub('11','jack') .gsub('12','queen') .gsub('13','king') .gsub('14','ace') .gsub('15','2'))
-              - disabled = @game.controlling_player != seat.player
-              #play-buttons
-                %input{type: "submit", value: "Play Hand", name: "hand_type", disabled: disabled}
-                %input{type: "submit", value: "Pass", name: "hand_type", disabled: disabled}
-
-          - else
-            .inventory
-              - seat.player.inventory.count.times do |index|
-                = image_tag('cards/png/back-pink.png')