Better i18n (cont.)

1. Fix sentence breaks inside `photo_reverification.html` and `midcourse_photo_reverification.html`.
2. Combine three setences inside `choose.html`.
3. Adding some punctuation marks to reduce duplicated strings with only different Punctuation marks in translation.
4. Move the colons inside the strings to be translated. This may be not necessary for now, but I think this may help translation by removing potential word meaning conflict.
5. Sorry for

cms/templates/js/video/transcripts/messages/transcripts-choose.underscore

@@ -18,7 +18,11 @@
     <% _.each(html5_list, function(value, index) {
         var type = grouped_list[value][0].type,
             file_name = value + ((type) ? ('.' + type) : ''),
-            message = interpolate(gettext("Timed Transcript from %(filename)s"), { filename: file_name }, true);
+            message = interpolate(
+                gettext("Timed Transcript from %(filename)s"),
+                { filename: file_name },
+                true
+            );
     %>
         <button
             class="action setting-choose"

common/templates/course_modes/choose.html

@@ -82,9 +82,9 @@
                                                         ${_("Benefits of a verified Certificate")}
                                                     </h4>
                                                     <ul>
-                                                        <li><b>${_("Official")}: </b>${_("Receive an instructor-signed certificate with the institution's logo")}</li>
-                                                        <li><b>${_("Easily sharable")}: </b>${_("Add the certificate to your CV or resume, or post it directly on LinkedIn")}</li>
-                                                        <li><b>${_("Motivating")}: </b>${_("Give yourself an additional incentive to complete the course")}</li>
+                                                        <li>${_("{b_start}Official: {b_end}Receive an instructor-signed certificate with the institution's logo").format(b_start='<b>', b_end='</b>')}</li>
+                                                        <li>${_("{b_start}Easily sharable: {b_end}Add the certificate to your CV or resume, or post it directly on LinkedIn").format(b_start='<b>', b_end='</b>')}</li>
+                                                        <li>${_("{b_start}Motivating: {b_end}Give yourself an additional incentive to complete the course").format(b_start='<b>', b_end='</b>')}</li>
                                                     </ul>
                                                 </div>
                                                 <div class="copy-inline list-actions">

lms/templates/verify_student/midcourse_photo_reverification.html

@@ -115,8 +115,8 @@
                         <li class="help-item">${_("Make sure your face is well-lit")}</li>
                         <li class="help-item">${_("Be sure your entire face is inside the frame")}</li>
                         <li class="help-item">${_("Can we match the photo you took with the one on your ID?")}</li>
-                        <li class="help-item">${_("Once in position, use the camera button")} <span class="example">(<i class="icon fa fa-camera"></i>)</span> ${_("to capture your picture")}</li>
-                        <li class="help-item">${_("Use the checkmark button")} <span class="example">(<i class="icon fa fa-check-square-o"></i>)</span> ${_("once you are happy with the photo")}</li>
+                        <li class="help-item">${_("Once in position, use the camera button {btn_icon} to capture your picture").format(btn_icon='<span class="example">(<i class="icon fa fa-camera"></i>)</span>')}</li>
+                        <li class="help-item">${_("Use the checkmark button {btn_icon} once you are happy with the photo").format(btn_icon='<span class="example">(<i class="icon fa fa-check-square-o"></i>)</span>')}</li>
                       </ul>
                     </div>
                   </div>

lms/templates/verify_student/photo_reverification.html

@@ -161,8 +161,8 @@
                         <li class="help-item">${_("Make sure your face is well-lit")}</li>
                         <li class="help-item">${_("Be sure your entire face is inside the frame")}</li>
                         <li class="help-item">${_("Can we match the photo you took with the one on your ID?")}</li>
-                        <li class="help-item">${_("Once in position, use the camera button")} <span class="example">(<i class="icon fa fa-camera"></i>)</span> ${_("to capture your picture")}</li>
-                        <li class="help-item">${_("Use the checkmark button")} <span class="example">(<i class="icon fa fa-check-square-o"></i>)</span> ${_("once you are happy with the photo")}</li>
+                        <li class="help-item">${_("Once in position, use the camera button {btn_icon} to capture your picture").format(btn_icon='<span class="example">(<i class="icon fa fa-camera"></i>)</span>')}</li>
+                        <li class="help-item">${_("Use the checkmark button {btn_icon} once you are happy with the photo").format(btn_icon='<span class="example">(<i class="icon fa fa-check-square-o"></i>)</span>')}</li>
                       </ul>
                     </div>
                   </div>
@@ -245,12 +245,12 @@
                     <div class="copy">
                       <ul class="list-help">
                         <li class="help-item">${_("Make sure your ID is well-lit")}</li>
-                        <li class="help-item help-item-emphasis">${_("Acceptable IDs include drivers licenses, passports, or other goverment-issued IDs that include your name and photo")}</li>
+                        <li class="help-item help-item-emphasis">${_("Acceptable IDs include driver's licenses, passports, or other goverment-issued IDs that include your name and photo")}</li>
                         <li class="help-item">${_("Check that there isn't any glare")}</li>
                         <li class="help-item">${_("Ensure that you can see your photo and read your name")}</li>
                         <li class="help-item">${_("Try to keep your fingers at the edge to avoid covering important information")}</li>
-                        <li class="help-item">${_("Once in position, use the camera button")} <span class="example">(<i class="icon fa fa-camera"></i>)</span> ${_("to capture your ID")}</li>
-                        <li class="help-item">${_("Use the checkmark button")} <span class="example">(<i class="icon fa fa-check-square-o"></i>)</span> ${_("once you are happy with the photo")}</li>
+                        <li class="help-item">${_("Once in position, use the camera button {btn_icon} to capture your ID").format(btn_icon='<span class="example">(<i class="icon fa fa-camera"></i>)</span>')}</li>
+                        <li class="help-item">${_("Use the checkmark button {btn_icon} once you are happy with the photo").format(btn_icon='<span class="example">(<i class="icon fa fa-check-square-o"></i>)</span>')}</li>
                       </ul>
                     </div>
                   </div>