Skip to content

E
edx-platform
Commit 96ca09f4 by Chris Rodriguez
Options

Membership page label additions and fixes

parent 07fb1645
Showing with 72 additions and 74 deletions
common/test/acceptance/pages/lms/instructor_dashboard.py
......@@ -755,7 +755,7 @@ class MembershipPageAutoEnrollSection(PageObject):
"""
Fill in the form with the provided email and submit it.
"""
email_selector = "{} >p>textarea".format(self.batch_enrollment_selector)
email_selector = "{} textarea".format(self.batch_enrollment_selector)
enrollment_button = "{} .enrollment-button[data-action='enroll']".format(self.batch_enrollment_selector)
# Fill the email addresses after the email selector is visible.
......
lms/static/sass/course/instructor/_instructor_2.scss
......@@ -435,6 +435,12 @@
&:last-child {
margin-bottom: 0;
}
legend {
// use the same styles as H3s
font-size: 1.2em;
margin-bottom: 15px;
}
}
.batch-enrollment, .batch-beta-testers {
......@@ -478,19 +484,15 @@
margin: ($baseline/2) 0;
position: relative;
label {
border-bottom: 1px dotted $base-font-color;
}
.hint {
@extend %t-copy-sub2;
display: none;
display: block;
position: absolute;
top: 15px;
@include left($baseline*10);
top: ($baseline/2);
left: -9999em;
padding: ($baseline/2);
width: 50%;
background-color: $light-gray;
background-color: $light-gray3;
box-shadow: 2px 2px 3px $shadow;
.hint-caret {
......@@ -498,30 +500,24 @@
position: absolute;
top: 0;
@include left(-15px);
@include border-right(8px solid $light-gray);
@include border-right(8px solid $light-gray3);
@include border-left(8px solid transparent);
border-top: 8px solid $light-gray;
border-top: 8px solid $light-gray3;
border-bottom: 8px solid transparent;
}
}
}
label[for="auto-enroll"]:hover + .auto-enroll-hint {
display: block;
}
label[for="auto-enroll-beta"]:hover + .auto-enroll-beta-hint {
width: 30%;
display: block;
/* ***
* Ideally we want to handle functionality with JS.
* This functionality should eventually be moved into CS/JS, and out of here. */
.has-hint:hover > .hint {
@include left($baseline*10);
}
label[for="email-students"]:hover + .email-students-hint {
display: block;
.has-hint input:focus ~ .hint {
@include left($baseline*10);
}
label[for="email-students-beta"]:hover + .email-students-beta-hint {
width: 30%;
display: block;
/* *** */
}
.enroll-actions {
......@@ -595,6 +591,7 @@
border-bottom: 1px solid $light-gray;
}
th,
td {
@extend %t-copy-sub1;
vertical-align: middle;
......
lms/templates/instructor/instructor_dashboard_2/membership.html
......@@ -17,7 +17,7 @@ from openedx.core.djangoapps.course_groups.partition_scheme import get_cohorted_
<thead>
<tr>
{{#labels}}
<td class="label">{{.}}</td>
<th class="label" scope="column">{{.}}</th>
{{/labels}}
</tr>
</thead>
......@@ -25,132 +25,133 @@ from openedx.core.djangoapps.course_groups.partition_scheme import get_cohorted_
</table>
</div>
<div class="bottom-bar">
<label for="add-field" class="sr">{{add_placeholder}}</label>
<label>
<span class="label-text sr">{{add_placeholder}}</span>
<input type="text" id="add-field" name="add-field" class="add-field" placeholder="{{add_placeholder}}">
</label>
<input type="button" name="add" class="add" value="{{add_btn_label}}">
</div>
</div>
</script>
<div class="batch-enrollment membership-section">
<h2> ${_("Batch Enrollment")} </h2>
<p>
<label for="student-ids">
<h2 class="hd hd-2">Enrollment</h2>
<fieldset class="batch-enrollment membership-section">
<legend id="heading-batch-enrollment" class="hd hd-2">${_("Batch Enrollment")}</legend>
<label>
${_("Enter email addresses and/or usernames separated by new lines or commas.")}
${_("You will not get notification for emails that bounce, so please double-check spelling.")} </label>
${_("You will not get notification for emails that bounce, so please double-check spelling.")}
<textarea rows="6" name="student-ids" placeholder="${_("Email Addresses/Usernames")}" spellcheck="false"></textarea>
</p>
</label>
<input type="hidden" id="is_course_white_label" value="${section_data['is_white_label']}">
% if section_data['is_white_label']:
<p>
<label for="reason-field-id">
<label>
${_("Enter the reason why the students are to be manually enrolled or unenrolled.")}
${_("This cannot be left blank and will be recorded and presented in Enrollment Reports.")}
${_("Therefore, please give enough detail to account for this action.")} </label>
${_("Therefore, please give enough detail to account for this action.")}
<textarea rows="2" id="reason-field-id" name="reason-field" placeholder="${_('Reason')}" spellcheck="false"></textarea>
</p>
</label>
%endif
<div class="enroll-option">
<input type="checkbox" name="auto-enroll" value="Auto-Enroll" checked="yes">
<label for="auto-enroll">${_("Auto Enroll")}</label>
<label class="has-hint">
<input type="checkbox" name="auto-enroll" id="auto-enroll" value="Auto-Enroll" checked="yes" aria-describedby="heading-batch-enrollment">
<span class="label-text">${_("Auto Enroll")}</span>
<div class="hint auto-enroll-hint">
<span class="hint-caret"></span>
<p>
<p id="auto-enroll-tip">
${_("If this option is <em>checked</em>, users who have not yet registered for {platform_name} will be automatically enrolled.").format(platform_name=settings.PLATFORM_NAME)}
${_("If this option is left <em>unchecked</em>, users who have not yet registered for {platform_name} will not be enrolled, but will be allowed to enroll once they make an account.").format(platform_name=settings.PLATFORM_NAME)}
<br /><br />
${_("Checking this box has no effect if 'Unenroll' is selected.")}
</p>
</div>
</label>
</div>
<div class="enroll-option">
<input type="checkbox" name="email-students" value="Notify-students-by-email" checked="yes">
<label for="email-students">${_("Notify users by email")}</label>
<label class="has-hint">
<input type="checkbox" name="email-students" id="email-students" value="Notify-students-by-email" checked="yes" aria-describedby="heading-batch-enrollment">
<span class="label-text">${_("Notify users by email")}</span>
<div class="hint email-students-hint">
<span class="hint-caret"></span>
<p>
<p id="email-students-tip">
${_("If this option is <em>checked</em>, users will receive an email notification.")}
</p>
</div>
</label>
</div>
<div>
<input type="button" name="enrollment-button" class="enrollment-button" value="${_("Enroll")}" data-endpoint="${ section_data['enroll_button_url'] }" data-action="enroll" >
<input type="button" name="enrollment-button" class="enrollment-button" value="${_("Unenroll")}" data-endpoint="${ section_data['unenroll_button_url'] }" data-action="unenroll" >
</div>
<div class="request-response"></div>
<div class="request-response-error"></div>
</div>
</fieldset>
%if static.get_value('ALLOW_AUTOMATED_SIGNUPS', settings.FEATURES.get('ALLOW_AUTOMATED_SIGNUPS', False)):
<hr class="divider" />
<hr class="divider" />
<div class="auto_enroll auto_enroll_csv">
<h2> ${_("Register/Enroll Students")} </h2>
<p>
${_("To register and enroll a list of users in this course, choose a CSV file that contains the following columns in this exact order: email, username, name, and country. Please include one student per row and do not include any headers, footers, or blank lines.")}
</p>
<div class="auto_enroll auto_enroll_csv">
<h2>${_("Register/Enroll Students")}</h2>
<p>${_("To register and enroll a list of users in this course, choose a CSV file that contains the following columns in this exact order: email, username, name, and country. Please include one student per row and do not include any headers, footers, or blank lines.")}</p>
<form id="student-auto-enroll-form" method="post" action="${ section_data['upload_student_csv_button_url'] }" enctype="multipart/form-data">
<div class="customBrowseBtn">
<label for="browseFile" class="sr">${_("Upload a CSV for bulk enrollment")}</label>
<input disabled="disabled" id="browseFile" placeholder="choose file" />
<div class="file-browse btn btn-primary">
<span class="browse"> Browse </span>
<label for="browseBtn" class="sr">${_("Upload a CSV for bulk enrollment")}</label>
<input class="file_field" id="browseBtn" name="students_list" type="file" accept=".csv"/>
</div>
</div>
<button type="submit" name="enrollment_signup_button">${_("Upload CSV")}</button>
<input type="hidden" name="csrfmiddlewaretoken" value="${ csrf_token }">
</form>
<div class="results"></div>
</div>
</div>
%endif
<hr class="divider" />
%if section_data['access']['instructor']:
<div class="batch-beta-testers membership-section">
<h2> ${_("Batch Beta Tester Addition")} </h2>
<p>
<label for="student-ids-for-beta">
<fieldset class="batch-beta-testers membership-section">
<legend id="heading-batch-beta-testers" class="hd hd-2">${_("Batch Beta Tester Addition")}</legend>
<label>
${_("Enter email addresses and/or usernames separated by new lines or commas.")}<br/>
${_("Note: Users must have an activated {platform_name} account before they can be enrolled as beta testers.").format(platform_name=settings.PLATFORM_NAME)}
</label>
<textarea rows="6" cols="50" name="student-ids-for-beta" placeholder="${_("Email Addresses/Usernames")}" spellcheck="false"></textarea>
</p>
</label>
<div class="enroll-option">
<input type="checkbox" name="auto-enroll" value="Auto-Enroll" checked="yes">
<label for="auto-enroll-beta">${_("Auto Enroll")}</label>
<label class="has-hint">
<input type="checkbox" name="auto-enroll-beta" id="auto-enroll-beta" value="Auto-Enroll" checked="yes" aria-describedby="heading-batch-beta-testers">
<span class="label-text">${_("Auto Enroll")}</span>
<div class="hint auto-enroll-beta-hint">
<span class="hint-caret"></span>
<p>
<p id="auto-enroll-beta-tip">
${_("If this option is <em>checked</em>, users who have not enrolled in your course will be automatically enrolled.")}
<br /><br />
${_("Checking this box has no effect if 'Remove beta testers' is selected.")}
</p>
</div>
</label>
</div>
<div class="enroll-option">
<input type="checkbox" name="email-students-beta" value="Notify-students-by-email" checked="yes">
<label for="email-students-beta">${_("Notify users by email")}</label>
<label class="has-hint">
<input type="checkbox" name="email-students-beta" id="email-students-beta" value="Notify-students-by-email" checked="yes" aria-describedby="heading-batch-beta-testers">
<span class="label-text">${_("Notify users by email")}</span>
<div class="hint email-students-beta-hint">
<span class="hint-caret"></span>
<p> ${_("If this option is <em>checked</em>, users will receive an email notification.")}</p>
<p id="email-students-beta-tip">
${_("If this option is <em>checked</em>, users will receive an email notification.")}
</p>
</div>
</label>
</div>
<div>
<input type="button" name="beta-testers" class="enrollment-button" value="${_("Add beta testers")}" data-endpoint="${ section_data['modify_beta_testers_button_url'] }" data-action="add" >
<input type="button" name="beta-testers" class="enrollment-button" value="${_("Remove beta testers")}" data-endpoint="${ section_data['modify_beta_testers_button_url'] }" data-action="remove" >
</div>
<div class="request-response"></div>
<div class="request-response-error"></div>
</div>
</fieldset>
<hr class="divider" />
%endif
......@@ -163,11 +164,11 @@ from openedx.core.djangoapps.course_groups.partition_scheme import get_cohorted_
<div class="wrapper-member-select">
## Translators: an "Administrator Group" is a group, such as Course Staff, that users can be added to.
<label for="member-lists-selector">${_("Select a course team role:")}</label>
<label>${_("Select a course team role:")}
<select id="member-lists-selector" class="member-lists-selector">
<option> ${_("Getting available lists...")} </option>
</select>
</label>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment