Fix styling issues on learner profile.

LEARNER-2485

1) Joined Date is shown in bold and there is no line below to separate
it from the next section.
2) The bio shows up below the certificates.
3) Switching to 'limited profile' does not correctly hide the language,
location and joined date fields.

lms/static/sass/features/_learner-profile.scss

@@ -325,8 +325,8 @@
                 margin: 0 $baseline/2;
 
                 .social-links {
+                    @include padding($baseline/4, 0, 0, $baseline/4);
                     font-size: 2rem;
-                    padding-top: $baseline/4;
 
                     & > span {
                         color: $gray-l4;
@@ -348,33 +348,34 @@
                 }
 
                 .u-field {
-                    @extend %t-weight4;
+                    font-weight: $font-semibold;
                     @include padding(0, 0, 0, 3px);
                     color: $base-font-color;
                     margin-top: $baseline/5;
 
                     .u-field-value, .u-field-title {
-                        @extend %t-weight4;
+                        font-weight: 500;
                         width: calc(100% - 40px);
+                        color: $lightest-base-font-color;
                     }
 
                     .u-field-value-readonly {
-                        @extend %t-weight3;
                         font-family: $sans-serif;
                         color: $darkest-base-font-color;
                     }
 
-                    .u-field-title {
-                        color: $lightest-base-font-color;
-                        display: block;
-                    }
-
                     &.u-field-dropdown {
                         position: relative;
 
                         &:not(.editable-never) {
                             cursor: pointer;
                         }
+                    }
+
+                    &:not(.u-field-readonly) {
+                        &.u-field-value {
+                            @extend %t-weight3;
+                        }
 
                         &:not(:last-child) {
                             padding-bottom: $baseline/4;

openedx/features/learner_profile/static/learner_profile/js/views/learner_profile_view.js

@@ -118,6 +118,9 @@
                         fieldView.delegateEvents();
                     }
 
+                    // Clear existing content in user profile card
+                    this.$('.profile-section-one-fields').html('');
+
                     // Do not show name when in limited mode or no name has been set
                     if (this.showFullProfile() && this.options.accountSettingsModel.get('name')) {
                         this.$('.profile-section-one-fields').append(this.options.nameFieldView.render().el);

openedx/features/learner_profile/templates/learner_profile/learner_profile.html

@@ -53,11 +53,10 @@ from openedx.core.djangolib.markup import HTML
                     </div>
                 </div>
                 <div class="wrapper-profile-section-container-two is-hidden">
+                    <div class="wrapper-profile-bio"></div>
                     % if achievements_fragment:
                         ${HTML(achievements_fragment.body_html())}
                     % endif
-                    <div class="wrapper-profile-bio">
-                    </div>
                 </div>
             </div>
         </div>