diff --git a/lms/static/sass/base/_variables.scss b/lms/static/sass/base/_variables.scss index 8d8833d380..128c3f3850 100644 --- a/lms/static/sass/base/_variables.scss +++ b/lms/static/sass/base/_variables.scss @@ -98,6 +98,10 @@ $m-blue-d1: #1790C7; $m-blue-d2: #1580B0; $m-blue-d3: #126F9A; $m-blue-d4: #0A4A67; +$m-blue-t0: rgba($m-blue,0.125); +$m-blue-t1: rgba($m-blue,0.25); +$m-blue-t2: rgba($m-blue,0.50); +$m-blue-t3: rgba($m-blue,0.75); $m-pink: #B52A67; $m-pink-l1: #CA2F73; diff --git a/lms/static/sass/views/_verification.scss b/lms/static/sass/views/_verification.scss index 250365f204..ec974b194e 100644 --- a/lms/static/sass/views/_verification.scss +++ b/lms/static/sass/views/_verification.scss @@ -297,6 +297,65 @@ // ==================== + // UI: reports/tables + .wrapper-report { + + .report { + @extend .ui-window; + width: flex-grid(12,12); + border-color: $m-gray-t3; + border-collapse:collapse; + + tr { + text-align: left; + } + + td { + @extend .t-weight3; + vertical-align: middle; + padding: ($baseline*0.75) $baseline; + color: $m-gray-d3; + } + + th { + @extend .t-weight2; + padding: ($baseline/2) $baseline; + } + + thead { + + tr { + border-bottom: 1px solid $m-gray-l3; + } + + th[scope="col"] { + @extend .t-title7; + @extend .t-weight2; + vertical-align: middle; + color: $m-gray-l1; + background: $m-gray-l4; + } + } + + tbody { + + tr { + border-bottom: 1px solid $m-gray-l3; + } + } + + tfoot { + background: $m-blue-t0; + + th[scope="row"] { + + } + } + } + } + + // ==================== + // UI: help .help-item { @@ -443,7 +502,7 @@ @include line-height(28); @extend .t-weight4; display: block; - + text-transform: none; } } } @@ -1668,74 +1727,69 @@ width: 100%; } - .info-item { - margin-bottom: ($baseline*1.5); - padding: ($baseline*0.75) $baseline; - border-radius: ($baseline/10); - background: $m-gray-l4; + // information elements + .list-info { - &:last-child { - margin-bottom: 0; - } + .info-item { + margin-bottom: ($baseline*1.5); + border-bottom: ($baseline/4) solid $m-gray-l4; + padding-bottom: ($baseline*1.5); - > .title { - @extend .hd-lv3; - } - - .copy { - @extend .copy-base; - - strong { - @extend .t-weight5; - color: $m-gray-d4; + &:last-child { + margin-bottom: 0; + border-bottom: none; + padding-bottom: none; } - table { - width: 100%; + > .title { + @extend .hd-lv3; margin-bottom: $baseline; - - tr { - } - - th { - padding: ($baseline/2) ($baseline/2) ($baseline/2) 0; - text-align: left; - } - - td { - border-ts: 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; - } - - .action-course a { - @include font-size(14); - padding: ($baseline/2) ($baseline*.75); - } - - + .copy { + @extend .copy-base; + margin-bottom: $baseline; + } } } + // information - course + .course-info { + .options { + .action-course { + @extend .btn-primary-blue; + @include font-size(14); + padding: 5px 10px; + } + } + .course-actions { + + .action-dashboard { + @extend .btn-primary-blue; + } + } + } + + // information - verification + .verification-info { + + } + + // information - payment + .payment-info { + + } + + // UI: table/report + .wrapper-report { + + .report { + + } + } } } diff --git a/lms/templates/shoppingcart/verified_cert_receipt.html b/lms/templates/shoppingcart/verified_cert_receipt.html index a5e7e3e39b..063e32e173 100644 --- a/lms/templates/shoppingcart/verified_cert_receipt.html +++ b/lms/templates/shoppingcart/verified_cert_receipt.html @@ -81,126 +81,176 @@
-
+
+

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

+
+

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

+
-

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

+
    +
  • +

    ${_("You are registered for:")}

    -
    -

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

    +
    + + + + + + + + + + + + % for item in order_items: + + + + + + % endfor + + + + + + +
    ${_("A list of courses you have just registered for as a verified student")}
    ${_("Course")}${_("Status")}${_("Options")}
    ${item.line_desc} + ${_("Starts: {start_date}").format(start_date=course.start_date_text)} + + %if course.start > datetime.today().replace(tzinfo=pytz.utc): + ${_("Starts: {start_date}").format(start_date=course.start_date_text)} + %else: + ${_("Go to Course")} + %endif +
    + ${_("Go to your Dashboard")} +
    +
    +
    • + +
  • +

    ${_("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.")}

    -
      -
    • -

      ${_("You are registered for:")}

      +
      + + + + + + + + + -
      -
      ${_("Order No.")}${_("Description")}${_("Date")}${_("Description")}
      - - - - - - - - - % for item in order_items: - - - - - % endfor - -
      ${_("A list of courses you have just registered for as a verified student")}
      ${_("Course")}${_("Status")}
      ${item.line_desc} - %if course.start > datetime.today().replace(tzinfo=pytz.utc): - ${_("Starts: {start_date}").format(start_date=course.start_date_text)} - %else: - - %endif -
      + + % for item in order_items: + + % if item.status == "purchased": + ${order.id} + ${item.line_desc} + ${order.purchase_time.date().isoformat()} + ${"{0:0.2f}".format(item.line_cost)} (${item.currency.upper()}) - -
      + % elif item.status == "refunded": + ${order.id} + ${item.line_desc} + ${order.purchase_time.date().isoformat()} + ${"{0:0.2f}".format(item.line_cost)} (${item.currency.upper()}) + % endif + + % endfor + -
      • + + + ${_("Total")} + + ${"{0:0.2f}".format(order.total_cost)} + (${item.currency.upper()}) + + + + -
    • -

      ${_("Verified Status")}

      + % if any_refunds: +
      +

      Please Note:

      +
      +

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

      +
      +
      + % endif +
+ -
-

${_("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.")}

+
  • +

    ${_("Billing Information")}

    -

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

    -
    • +
    + + + + + + + + + - + + + -
  • +
    • -
    ${_("Billed To")}${_("Billing Address")}${_("Payment Method Type")}${_("Payment Method Details")}
    + ${order.bill_to_first} ${order.bill_to_last} + + ${order.bill_to_street1} + ${order.bill_to_street2} -

    ${_("Payment Details")}

    + ${order.bill_to_street2}, + ${order.bill_to_state} + ${order.bill_to_postalcode} -
    -

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

    + ${order.bill_to_country.upper()} +
    - - - - - - - - - - % 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 -
    + + ${order.bill_to_cardtype} + + + ${order.bill_to_ccnum} + + + -

    ${_("Billing details:")}

    -
    -

    - ${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()}
    - ${order.bill_to_cardtype} ${order.bill_to_ccnum} -

    -
    - - - - - + + + ${_("Total")} + ${"{0:0.2f}".format(order.total_cost)} (${item.currency.upper()}) + + + + + + +