<div class="uk-child-width-1-2@s uk-child-width-1-1" uk-grid>
  <div>
    <h4>Discord Profile</h4>
    <div class="steam-profile" uk-grid>
      <div class="uk-width-1-3 uk-padding-remove">
        <%= image_tag current_user.avatar_url, class: "uk-border-circle", width: 150, height: 150 %>
      </div>
      <div class="uk-width-2-3">
        <form class="uk-form-stacked">
          <div class="uk-margin">
            <label class="uk-form-label">USERNAME</label>
            <div class="uk-form-controls"><%= current_user.user_name %></div>
          </div>
          <div class="uk-margin">
            <label class="uk-form-label">DISCORD ID</label>
            <div class="uk-form-controls"><%= current_user.discord_id %></div>
          </div>
          <div class="uk-margin">
            <label class="uk-form-label esm-text-color-red">NOT THE CORRECT ACCOUNT?</label>
            <div class="uk-form-controls">
              <p>Please read all instructions before proceeding</p>
              <ol class="uk-list uk-list-decimal">
                <li>
                  Log out of this account by hovering your mouse over your avatar in the top right and click log out.
                </li>
                <li>
                  Click Login at the top right.
                </li>
                <li>
                  When your on the Discord login screen, click the <span style="color: #7289da;">Not you?</span> link to change accounts.
                </li>
              </ol>
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>
  <div>
    <h4>Steam Profile</h4>
    <% if current_user.registered? %>
      <div class="steam-profile" uk-grid>
        <div class="uk-width-1-3 uk-padding-remove">
          <% if steam_info.avatar %>
            <%= link_to image_tag(steam_info.avatar, width: 150, height: 150, class: "uk-border-circle"), steam_info.profile_url %>
          <% else %>
            <%= link_to image_tag("default-steam-profile.png", width: 150, height: 150, class: "uk-border-circle"), steam_info.profile_url %>
          <% end %>
        </div>
        <div class="uk-width-2-3">
          <form class="uk-form-stacked">
            <div class="uk-margin">
              <label class="uk-form-label">USERNAME</label>
              <div class="uk-form-controls"><%= steam_info.username %></div>
            </div>
            <div class="uk-margin">
              <label class="uk-form-label">STEAM UID</label>
              <div class="uk-form-controls"><%= link_to current_user.steam_uid, steam_info.profile_url, target: "_blank" %></div>
            </div>
            <div class="uk-margin">
              <label class="uk-form-label">DANGER ZONE</label>
              <div class="uk-form-controls">
                <%= link_to "Deregister", deregister_user_path, class: "uk-button esm-button-danger", data: { confirm: "Are you sure you want to deregister?" } %>
              </div>
            </div>
          </form>
        </div>
      </div>
    <% else %>
      <p>Want to use Exile Server Manager to it's fullest? Sign into Steam to link your Steam account with ESM</p>
      <%= link_to image_tag("https://steamcommunity-a.akamaihd.net/public/images/signinthroughsteam/sits_01.png"), link_steam_path, method: :post  %>
    <% end %>
  </div>
</div>