added a whole bunch of the size-specific css classes (lg/md/sm/xs/) on the...

added a whole bunch of the size-specific css classes (lg/md/sm/xs/) on the update_student form template rendering to make things not appear absolutely nutty

roomlist/accounts/templates/update_student.html

@@ -40,7 +40,7 @@
       <div class="panel-body">
         <p class="text-center">Verify your social media accounts to link them to other students.</p>
         <div class="row text-center">
-          <div class="col-md-6">
+          <div class="col-xs-6">
           {% if accounts.facebook %}
           <p><i class="fa fa-check-square-o"></i> Verified!</p>
             <h4><i class="fa fa-facebook fa-2x"></i></h4>
@@ -52,7 +52,7 @@
           </a>
           {% endif %}
           </div>
-          <div class="col-md-6">
+          <div class="col-xs-6">
           {% if accounts.google %}
             <p><i class="fa fa-check-square-o"></i> Verified!</p>
             <h4><i class="fa fa-google fa-2x"></i></h4>
@@ -67,7 +67,7 @@
         </div>
         <br />
         <div class="row text-center">
-          <div class="col-md-6">
+          <div class="col-xs-6">
           {% if accounts.twitter %}
             <p><i class="fa fa-check-square-o"></i> Verified!</p>
             <h4><i class="fa fa-twitter fa-2x"></i></h4>
@@ -79,7 +79,7 @@
           </a>
           {% endif %}
           </div>
-          <div class="col-md-6">
+          <div class="col-xs-6">
           {% if accounts.instagram %}
             <p><i class="fa fa-check-square-o"></i> Verified!</p>
             <h4><i class="fa fa-instagram fa-2x"></i></h4>
@@ -94,7 +94,7 @@
         </div>
         <br />
         <div class="row text-center">
-          <div class="col-md-6">
+          <div class="col-xs-6">
           {% if accounts.tumblr %}
             <p><i class="fa fa-check-square-o"></i> Verified!</p>
             <h4><i class="fa fa-tumblr fa-2x"></i></h4>
@@ -106,7 +106,7 @@
           </a>
           {% endif %}
           </div>
-          <div class="col-md-6">
+          <div class="col-xs-6">
           {% if accounts.github %}
             <p><i class="fa fa-check-square-o"></i> Verified!</p>
             <h4><i class="fa fa-github fa-2x"></i></h4>
@@ -199,11 +199,12 @@
             {% endfor %}
           {% endif %}
           <div class="form-group">
-            <label for="{{ my_form.gender.id_for_label }}" class="col-md-3">
-              Gender Identity<br />(choose all that apply)
+            <label for="{{ my_form.gender.id_for_label }}" class="col-lg-3 col-md-12 col-sm-12 col-xs-12">
+              Gender Identity
+              <p class="help-block">(choose all that apply)</p>
             </label>
               {% for checkbox in my_form.gender %}
-                <div class="checkbox col-md-3">
+                <div class="checkbox col-lg-2 col-md-3 col-sm-3 col-sm-offset-1 col-xs-5 col-xs-offset-1">
                   <label for="{{ checkbox.id_for_label }}">
                     {{ checkbox.choice_label|gender_icon }}
                     {{ checkbox.tag }}
@@ -217,7 +218,7 @@
             {% endfor %}
           {% endif %}
           <div class="form-group">
-            <label for="{{ my_form.show_gender.id_for_label }}" class="col-md-3">
+            <label for="{{ my_form.show_gender.id_for_label }}" class="col-md-3 col-sm-4 col-xs-5">
               Show Gender on Profile?
             </label>
               {% for option in my_form.show_gender %}
@@ -243,10 +244,10 @@
             {% endfor %}
           {% endif %}
           <div class="form-group">
-            <label for="{{ my_form.graduating_year.id_for_label }}" class="col-md-2">
+            <label for="{{ my_form.graduating_year.id_for_label }}" class="col-md-2 col-sm-12 col-xs-12">
               Graduating Year
             </label>
-              <div class="col-md-2">
+              <div class="col-md-2 col-sm-3 col-xs-3">
                 {{ my_form.graduating_year }}
               </div>
           </div>
@@ -258,7 +259,7 @@
             {% endfor %}
           {% endif %}
           <div class="form-group">
-            <label for="{{ my_form.on_campus.id_for_label }}" class="col-md-3">
+            <label for="{{ my_form.on_campus.id_for_label }}" class="col-md-3 col-sm-4 col-xs-5">
               Do You Live on Campus?
             </label>
               {% for option in my_form.on_campus %}