docbrown/app/views/users/_profile.html.erb

<%= javascript_pack_tag "colorPreview", defer: true %>

<% unless @user.identities.exists?(provider: 'github') %>
  <div class="field">
    <a href="/users/auth/github" class="big-button cta" data-no-instant>
      <img src="<%= asset_path("github-logo.svg") %>" alt="github logo" /> CONNECT GITHUB ACCOUNT
    </a>
  </div>
<% end %>

<% unless @user.identities.exists?(provider: 'twitter') %>
  <div class="field">
    <a href="/users/auth/twitter?callback_url=<%= ApplicationConfig["APP_PROTOCOL"] %><%= ApplicationConfig["APP_DOMAIN"] %>/users/auth/twitter/callback" class="big-button cta" data-no-instant>
      <img src="<%= asset_path("twitter-logo.svg") %>" alt="twitter logo" /> CONNECT TWITTER ACCOUNT
    </a>
  </div>
<% end %>
<h4>
  <a href="https://<%= ApplicationConfig["APP_DOMAIN"] %>/<%= current_user.username %>" aria-label="Go to your profile page">
    <img src="https://d2fltix0v2e0sb.cloudfront.net/dev-badge.svg"
         alt="DEV badge"
         height="28" width="28"
         style="vertical-align:-7px;margin-right:4px;" class="dev-badge" />
  </a>
  Add the DEV badge to your personal site. <a href="/p/badges">Click here for the code</a>
</h4>
<%= form_for(@user) do |f| %>
  <div class="field">
    <%= f.label :email %>
    <%= f.text_field :email %>
  </div>
  <div class="field checkbox-label-first">
    <%= f.label :email_public, "Display email on profile" %>
    <%= f.check_box :email_public %>
  </div>
  <div class="field">
    <%= f.label :username %>
    <%= f.text_field :username, maxlength: 30 %>
  </div>
  <div class="field">
    <%= f.label :name %>
    <%= f.text_field :name %>
  </div>
  <%= f.label :profile_image %>
  <div class="field">
    <% if @user.profile_image_url.present? %>
      <span class="image-present">
        <img alt="<%= @user.username %> profile image" src="<%= ProfileImage.new(@user).get(width: 50) %>" />
        <%= f.file_field :profile_image %>
      </span>
    <% end %>
  </div>

  <div class="field checkbox-label-first">
    <%= f.label :looking_for_work %>
    <%= f.check_box :looking_for_work %>
  </div>
  <div class="field checkbox-label-first">
    <%= f.label :looking_for_work_publicly, "Display \"looking for work\" on profile" %>
    <%= f.check_box :looking_for_work_publicly %>
  </div>
  <div class="field checkbox-label-first">
    <%= f.label :contact_consent, "Recruiters can contact me about job opportunities" %>
    <%= f.check_box :contact_consent %>
  </div>
  <div class="field">
    <%= f.label :website_url %>
    <%= f.url_field :website_url, maxlength: 100, placeholder: "https://yoursite.com" %>
  </div>
  <div class="field">
    <%= f.label :summary %>
    <%= f.text_area :summary, placeholder: "a short bio.", maxlength: 200 %>
  </div>
  <%= render partial: "shared/logo_design", locals: { f: f, account: @user } %>
  <div class="field">
    <%= f.label :location %>
    <%= f.text_field :location, maxlength: 100 %>
  </div>
  <div class="field">
    <%= f.label :education %>
    <%= f.text_field :education, maxlength: 100 %>
  </div>
  <div class="field">
    <%= f.label :employer_name %>
    <%= f.text_field :employer_name, maxlength: 100 %>
  </div>
  <div class="field">
    <%= f.label :employer_url, "Employer URL" %>
    <%= f.text_field :employer_url, maxlength: 100 %>
  </div>
  <div class="field">
    <%= f.label :employment_title %>
    <%= f.text_field :employment_title, maxlength: 100 %>
  </div>
  <div class="field">
    <%= f.label :mostly_work_with, "Skills/Languages" %>
    <%= f.text_area :mostly_work_with, placeholder: "What tools and languages are you most experienced with? Are you specialized or more of a generalist?", maxlength: 500 %>
  </div>
  <div class="field">
    <%= f.label :currently_learning, "I'm getting into" %>
    <%= f.text_area :currently_learning, placeholder: "What are you learning right now? What are the new tools and languages you're picking up in #{Time.zone.now.year}?", maxlength: 500 %>
  </div>
  <div class="field">
    <%= f.label :currently_hacking_on, "My projects and hacks" %>
    <%= f.text_area :currently_hacking_on, placeholder: "What projects are currently occupying most of your time?", maxlength: 500 %>
  </div>
  <div class="field">
    <%= f.label :available_for %>
    <%= f.text_area :available_for, placeholder: "What kinds of collaborations or discussions are you available for? What's a good reason to say hey to you these days?", maxlength: 500 %>
  </div>
  <p><strong>Links</strong></p>
  <div class="field">
    <%= f.label :facebook_url, "Facebook URL" %>
    <%= f.text_field :facebook_url %>
  </div>
  <div class="field">
    <%= f.label :stackoverflow_url, "Stack Overflow URL" %>
    <%= f.url_field :stackoverflow_url %>
  </div>
  <div class="field">
    <%= f.label :linkedin_url, "LinkedIn URL" %>
    <%= f.url_field :linkedin_url %>
  </div>
  <div class="field">
    <%= f.label :behance_url, "Behance URL" %>
    <%= f.url_field :behance_url %>
  </div>
  <div class="field">
    <%= f.label :dribbble_url, "Dribbble URL" %>
    <%= f.url_field :dribbble_url %>
  </div>
  <div class="field">
    <%= f.label :medium_url, "Medium URL" %>
    <%= f.url_field :medium_url %>
  </div>
  <div class="field">
    <%= f.label :gitlab_url, "GitLab URL" %>
    <%= f.url_field :gitlab_url %>
  </div>
  <div class="field">
    <%= f.label :instagram_url, "Instagram URL" %>
    <%= f.url_field :instagram_url %>
  </div>
  <div class="field">
    <%= f.label :mastodon_url, "Mastodon URL" %>
    <%= f.url_field :mastodon_url %>
  </div>
   <div class="field">
    <%= f.label :twitch_url, "Twitch URL" %>
    <%= f.url_field :twitch_url %>
  </div>
  <div class="field">
    <label></label>
    <%= f.hidden_field :tab, value: @tab %>
    <%= f.submit "SUBMIT", class: "cta" %>
  </div>
<% end %>