From 304a329b089e4eefb5b857feedc1e6703a4c521e Mon Sep 17 00:00:00 2001 From: Frances Botsford Date: Thu, 5 Sep 2013 12:24:03 -0400 Subject: [PATCH] initial receipt html and styling for vcert --- lms/static/sass/views/_verification.scss | 84 ++++++- .../shoppingcart/verified_cert_receipt.html | 228 ++++++++++++++---- .../verify_student/photo_verification.html | 2 +- 3 files changed, 261 insertions(+), 53 deletions(-) diff --git a/lms/static/sass/views/_verification.scss b/lms/static/sass/views/_verification.scss index 6b78d483c9..6058ba4385 100644 --- a/lms/static/sass/views/_verification.scss +++ b/lms/static/sass/views/_verification.scss @@ -239,7 +239,7 @@ } // reset: lists - .list-actions, .list-steps, .progress-steps, .list-controls, .list-fields, .list-help, .list-faq, .nav-wizard, .list-reqs, .list-faq, .review-tasks, .list-tips, .wrapper-photos, .field-group { + .list-actions, .list-steps, .progress-steps, .list-controls, .list-fields, .list-help, .list-faq, .nav-wizard, .list-reqs, .list-faq, .review-tasks, .list-tips, .wrapper-photos, .field-group, .list-info { @extend .ui-no-list; } @@ -451,9 +451,9 @@ @extend .ui-depth1; position: absolute; top: 43px; - left: 70px; + left: 7%; display: block; - width: 77%; + width: 83%; margin: 0 auto; background: $m-gray-l4; @@ -474,14 +474,15 @@ @include clearfix(); position: relative; top: ($baseline/4); + display: table; + width: 100%; } .progress-step { @extend .ui-depth2; position: relative; - width: flex-grid(2,12); + display: table-cell; height: ($baseline*6); - float: left; padding: $baseline $baseline ($baseline*1.5) $baseline; text-align: center; @@ -1497,7 +1498,7 @@ // progress indicator .progress-sts-value { - width: 20%; + width: 14%; } } @@ -1537,7 +1538,7 @@ // progress indicator .progress-sts-value { - width: 40%; + width: 36%; } } @@ -1612,7 +1613,7 @@ // progress indicator .progress-sts-value { - width: 60%; + width: 55%; } } @@ -1654,6 +1655,70 @@ .progress-sts-value { width: 100%; } + + .info-item { + margin-bottom: ($baseline*1.5); + padding: ($baseline*0.75) $baseline; + border-radius: ($baseline/10); + background: $m-gray-l4; + + &:last-child { + margin-bottom: 0; + } + + > .title { + @extend .hd-lv3; + } + + .copy { + @extend .copy-base; + + strong { + @extend .t-weight5; + color: $m-gray-d4; + } + + table { + width: 100%; + margin-bottom: $baseline; + + tr { + } + + th { + padding: ($baseline/2) ($baseline/2) ($baseline/2) 0; + text-align: left; + } + + td { + border-top: 1px solid #ccc; + vertical-align: middle; + padding: ($baseline/2) ($baseline/2) ($baseline/2) 0; + text-transform: capitalize; + } + + tfoot td { + font-weight: 600; + + &.total { + text-align: right; + } + } + } + + + + .action a { + @extend .btn-primary-blue; + } + + + } + } + + + + } } @@ -1700,7 +1765,8 @@ // progress indicator .progress-sts { - width: 47%; + width: 75%; + left: 13%; } .progress-sts-value { diff --git a/lms/templates/shoppingcart/verified_cert_receipt.html b/lms/templates/shoppingcart/verified_cert_receipt.html index 0386b6b353..5335746c64 100644 --- a/lms/templates/shoppingcart/verified_cert_receipt.html +++ b/lms/templates/shoppingcart/verified_cert_receipt.html @@ -3,58 +3,200 @@ <%! from django.conf import settings %> <%inherit file="../main.html" /> +<%block name="bodyclass">register verification-process step-confirmation -<%block name="title">${_("Receipt for Order")} ${order.id} +<%block name="title">${_("Register for [Course Name] | Receipt (Order")} ${order.id}) +<%block name="content"> % if notification is not UNDEFINED:
${notification}
% endif -
-

${_(settings.PLATFORM_NAME + " (" + settings.SITE_NAME + ")" + " Electronic Receipt")}

-

${_("Order #")}${order.id}

-

${_("Date:")} ${order.purchase_time.date().isoformat()}

-

${_("Items ordered:")}

+
+
- - - ${_("")} - - - % for item in order_items: - - % if item.status == "purchased": - - - - - % elif item.status == "refunded": - - - - - % endif - % endfor - - - -
QtyDescriptionUnit PricePriceCurrency
${item.qty}${item.line_desc}${"{0:0.2f}".format(item.unit_cost)}${"{0:0.2f}".format(item.line_cost)}${item.currency.upper()}
${item.qty}${item.line_desc}${"{0:0.2f}".format(item.unit_cost)}${"{0:0.2f}".format(item.line_cost)}${item.currency.upper()}
${_("Total Amount")}
${"{0:0.2f}".format(order.total_cost)}
- % if any_refunds: -

- ${_("Note: items with strikethough like ")}this${_(" have been refunded.")} -

- % endif +
+

+ + ${_("You are registering for")} + [Course Name] + + + + ${_("Registering as: ")} ${_("ID Verified")} + + +

+
-

${_("Billed To:")}

-

- ${order.bill_to_cardtype} ${_("#:")} ${order.bill_to_ccnum}
- ${order.bill_to_first} ${order.bill_to_last}
- ${order.bill_to_street1}
- ${order.bill_to_street2}
- ${order.bill_to_city}, ${order.bill_to_state} ${order.bill_to_postalcode}
- ${order.bill_to_country.upper()}
-

+ +
+
+

${_("Your Progress")}

+ +
    +
  1. + 0 + ${_("Current Step: ")}${_("Intro")} +
    2. + +
  2. + 1 + ${_("Take Photo")} +
    3. + +
  3. + 2 + ${_("Take ID Photo")} +
    4. + +
  4. + 3 + ${_("Review")} +
    5. + +
  5. + 4 + ${_("Make Payment")} +
    6. + +
  6. + + + + ${_("Confirmation")} +
    7. +
+ + + + +
+
+ +
+
+ + +

Congratulations! You are now verified on ${_(settings.PLATFORM_NAME)}.

+ +
+

${_("You are now registered as a verified student! Your registration details are below.")}

+
+ +
    +
  • +

    You are registered for:

    + +
    + + + + + + + + + + % for item in order_items: + + + + + % endfor + +
    A list of courses you have just registered for as a verified student
    CourseStatus
    ${item.line_desc}Start date: [date] + +
    + + +
    + +
    • + +
  • +

    Verified Status

    + +
    +

    We have received your identification details to verify your identity. If there is a problem with any of the items, we will contact you to resubmit. You can now register for any of the verified certificate courses this semester without having to re-verify.

    + +

    The professor will ask you to periodically submit a new photo to verify your work during the course (usually at exam times).

    +
    + +
    • + +
  • + +

    ${_("Payment Details")}

    + +
    +

    ${_("Please print this page for your records; it serves as your receipt. You will also receive an email with the same information.")}

    + + + + + + + + + + + + % for item in order_items: + + % if item.status == "purchased": + + + + + + % elif item.status == "refunded": + + + + + % endif + % endfor + + + + + + + +
    ${_("Order No.")}${_("Description")}${_("Date")}${_("Description")}
    ${order.id}${item.line_desc}${order.purchase_time.date().isoformat()}${"{0:0.2f}".format(item.line_cost)} (${item.currency.upper()})
    ${order.id}${item.line_desc}${order.purchase_time.date().isoformat()}${"{0:0.2f}".format(item.line_cost)} (${item.currency.upper()})
    ${_("Total")}${"{0:0.2f}".format(order.total_cost)} (${item.currency.upper()})
    + % if any_refunds: +

    + ${_("Note: items with strikethough like ")}this${_(" have been refunded.")} +

    + % endif +
    + +<%doc> +

    ${_("Billing details:")}

    +
    +

    + ${order.bill_to_cardtype} ${order.bill_to_ccnum}
    + ${order.bill_to_first} ${order.bill_to_last}, + ${order.bill_to_street1} ${order.bill_to_street2} + ${order.bill_to_city}, ${order.bill_to_state} ${order.bill_to_postalcode} + ${order.bill_to_country.upper()} +

    +
    + + +
    • +
+ +
+
+
+ diff --git a/lms/templates/verify_student/photo_verification.html b/lms/templates/verify_student/photo_verification.html index fccdf0e5da..7ef3b350a5 100644 --- a/lms/templates/verify_student/photo_verification.html +++ b/lms/templates/verify_student/photo_verification.html @@ -256,7 +256,7 @@