From f4c3a732be06060696359c73d15420d8f8229150 Mon Sep 17 00:00:00 2001 From: Brian Talbot Date: Fri, 20 Mar 2015 09:54:58 -0400 Subject: [PATCH] certificates: revising compiled CSS paths to match existing LMS patterns --- ...0_certificatehtmlviewconfiguration_data.py | 2 +- .../certificates/tests/factories.py | 2 +- lms/static/certificates/css/main.css | 1760 ----------------- .../certificates/{css => sass}/main-ltr.css | 2 - .../certificates/{css => sass}/main-rtl.css | 2 - lms/static/certificates/sass/main-rtl.scss | 1 - 6 files changed, 2 insertions(+), 1767 deletions(-) delete mode 100644 lms/static/certificates/css/main.css rename lms/static/certificates/{css => sass}/main-ltr.css (99%) rename lms/static/certificates/{css => sass}/main-rtl.css (99%) diff --git a/lms/djangoapps/certificates/migrations/0020_certificatehtmlviewconfiguration_data.py b/lms/djangoapps/certificates/migrations/0020_certificatehtmlviewconfiguration_data.py index 579ef323ec..94b86a367e 100644 --- a/lms/djangoapps/certificates/migrations/0020_certificatehtmlviewconfiguration_data.py +++ b/lms/djangoapps/certificates/migrations/0020_certificatehtmlviewconfiguration_data.py @@ -19,7 +19,7 @@ class Migration(DataMigration): "company_privacy_url": "http://www.edx.org/edx-privacy-policy", "company_tos_url": "http://www.edx.org/edx-terms-service", "company_verified_certificate_url": "http://www.edx.org/verified-certificate", - "document_stylesheet_url_application": "/static/certificates/css/main-ltr.css", + "document_stylesheet_url_application": "/static/certificates/sass/main-ltr.css", "logo_src": "/static/certificates/images/logo-edx.svg", "logo_url": "http://www.edx.org" }, diff --git a/lms/djangoapps/certificates/tests/factories.py b/lms/djangoapps/certificates/tests/factories.py index 0f2ddb1546..917be240ee 100644 --- a/lms/djangoapps/certificates/tests/factories.py +++ b/lms/djangoapps/certificates/tests/factories.py @@ -27,7 +27,7 @@ class CertificateHtmlViewConfigurationFactory(DjangoModelFactory): "company_privacy_url": "http://www.edx.org/edx-privacy-policy", "company_tos_url": "http://www.edx.org/edx-terms-service", "company_verified_certificate_url": "http://www.edx.org/verified-certificate", - "document_stylesheet_url_application": "/static/certificates/css/main-ltr.css", + "document_stylesheet_url_application": "/static/certificates/sass/main-ltr.css", "logo_src": "/static/certificates/images/logo-edx.svg", "logo_url": "http://www.edx.org" }, diff --git a/lms/static/certificates/css/main.css b/lms/static/certificates/css/main.css deleted file mode 100644 index c4ea7dcf89..0000000000 --- a/lms/static/certificates/css/main.css +++ /dev/null @@ -1,1760 +0,0 @@ -html { - box-sizing: border-box; } - -*, *:before, *:after { - box-sizing: inherit; } - -/*! normalize.css v3.0.2 | MIT License | git.io/normalize */ -/** - * 1. Set default font family to sans-serif. - * 2. Prevent iOS text size adjust after orientation change, without disabling - * user zoom. - */ -html { - font-family: sans-serif; - /* 1 */ - -ms-text-size-adjust: 100%; - /* 2 */ - -webkit-text-size-adjust: 100%; - /* 2 */ } - -/** - * Remove default margin. - */ -body { - margin: 0; } - -/* HTML5 display definitions - ========================================================================== */ -/** - * Correct `block` display not defined for any HTML5 element in IE 8/9. - * Correct `block` display not defined for `details` or `summary` in IE 10/11 - * and Firefox. - * Correct `block` display not defined for `main` in IE 11. - */ -article, -aside, -details, -figcaption, -figure, -footer, -header, -hgroup, -main, -menu, -nav, -section, -summary { - display: block; } - -/** - * 1. Correct `inline-block` display not defined in IE 8/9. - * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. - */ -audio, -canvas, -progress, -video { - display: inline-block; - /* 1 */ - vertical-align: baseline; - /* 2 */ } - -/** - * Prevent modern browsers from displaying `audio` without controls. - * Remove excess height in iOS 5 devices. - */ -audio:not([controls]) { - display: none; - height: 0; } - -/** - * Address `[hidden]` styling not present in IE 8/9/10. - * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. - */ -[hidden], -template { - display: none; } - -/* Links - ========================================================================== */ -/** - * Remove the gray background color from active links in IE 10. - */ -a { - background-color: transparent; } - -/** - * Improve readability when focused and also mouse hovered in all browsers. - */ -a:active, -a:hover { - outline: 0; } - -/* Text-level semantics - ========================================================================== */ -/** - * Address styling not present in IE 8/9/10/11, Safari, and Chrome. - */ -abbr[title] { - border-bottom: 1px dotted; } - -/** - * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. - */ -b, -strong { - font-weight: bold; } - -/** - * Address styling not present in Safari and Chrome. - */ -dfn { - font-style: italic; } - -/** - * Address variable `h1` font-size and margin within `section` and `article` - * contexts in Firefox 4+, Safari, and Chrome. - */ -h1 { - font-size: 2em; - margin: 0.67em 0; } - -/** - * Address styling not present in IE 8/9. - */ -mark { - background: #ff0; - color: #000; } - -/** - * Address inconsistent and variable font size in all browsers. - */ -small { - font-size: 80%; } - -/** - * Prevent `sub` and `sup` affecting `line-height` in all browsers. - */ -sub, -sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; } - -sup { - top: -0.5em; } - -sub { - bottom: -0.25em; } - -/* Embedded content - ========================================================================== */ -/** - * Remove border when inside `a` element in IE 8/9/10. - */ -img { - border: 0; } - -/** - * Correct overflow not hidden in IE 9/10/11. - */ -svg:not(:root) { - overflow: hidden; } - -/* Grouping content - ========================================================================== */ -/** - * Address margin not present in IE 8/9 and Safari. - */ -figure { - margin: 1em 40px; } - -/** - * Address differences between Firefox and other browsers. - */ -hr { - -moz-box-sizing: content-box; - box-sizing: content-box; - height: 0; } - -/** - * Contain overflow in all browsers. - */ -pre { - overflow: auto; } - -/** - * Address odd `em`-unit font size rendering in all browsers. - */ -code, -kbd, -pre, -samp { - font-family: monospace, monospace; - font-size: 1em; } - -/* Forms - ========================================================================== */ -/** - * Known limitation: by default, Chrome and Safari on OS X allow very limited - * styling of `select`, unless a `border` property is set. - */ -/** - * 1. Correct color not being inherited. - * Known issue: affects color of disabled elements. - * 2. Correct font properties not being inherited. - * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. - */ -button, -input, -optgroup, -select, -textarea { - color: inherit; - /* 1 */ - font: inherit; - /* 2 */ - margin: 0; - /* 3 */ } - -/** - * Address `overflow` set to `hidden` in IE 8/9/10/11. - */ -button { - overflow: visible; } - -/** - * Address inconsistent `text-transform` inheritance for `button` and `select`. - * All other form control elements do not inherit `text-transform` values. - * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. - * Correct `select` style inheritance in Firefox. - */ -button, -select { - text-transform: none; } - -/** - * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` - * and `video` controls. - * 2. Correct inability to style clickable `input` types in iOS. - * 3. Improve usability and consistency of cursor style between image-type - * `input` and others. - */ -button, -html input[type="button"], -input[type="reset"], -input[type="submit"] { - -webkit-appearance: button; - /* 2 */ - cursor: pointer; - /* 3 */ } - -/** - * Re-set default cursor for disabled elements. - */ -button[disabled], -html input[disabled] { - cursor: default; } - -/** - * Remove inner padding and border in Firefox 4+. - */ -button::-moz-focus-inner, -input::-moz-focus-inner { - border: 0; - padding: 0; } - -/** - * Address Firefox 4+ setting `line-height` on `input` using `!important` in - * the UA stylesheet. - */ -input { - line-height: normal; } - -/** - * It's recommended that you don't attempt to style these elements. - * Firefox's implementation doesn't respect box-sizing, padding, or width. - * - * 1. Address box sizing set to `content-box` in IE 8/9/10. - * 2. Remove excess padding in IE 8/9/10. - */ -input[type="checkbox"], -input[type="radio"] { - box-sizing: border-box; - /* 1 */ - padding: 0; - /* 2 */ } - -/** - * Fix the cursor style for Chrome's increment/decrement buttons. For certain - * `font-size` values of the `input`, it causes the cursor style of the - * decrement button to change from `default` to `text`. - */ -input[type="number"]::-webkit-inner-spin-button, -input[type="number"]::-webkit-outer-spin-button { - height: auto; } - -/** - * 1. Address `appearance` set to `searchfield` in Safari and Chrome. - * 2. Address `box-sizing` set to `border-box` in Safari and Chrome - * (include `-moz` to future-proof). - */ -input[type="search"] { - -webkit-appearance: textfield; - /* 1 */ - -moz-box-sizing: content-box; - -webkit-box-sizing: content-box; - /* 2 */ - box-sizing: content-box; } - -/** - * Remove inner padding and search cancel button in Safari and Chrome on OS X. - * Safari (but not Chrome) clips the cancel button when the search input has - * padding (and `textfield` appearance). - */ -input[type="search"]::-webkit-search-cancel-button, -input[type="search"]::-webkit-search-decoration { - -webkit-appearance: none; } - -/** - * Define consistent border, margin, and padding. - */ -fieldset { - border: 1px solid #c0c0c0; - margin: 0 2px; - padding: 0.35em 0.625em 0.75em; } - -/** - * 1. Correct `color` not being inherited in IE 8/9/10/11. - * 2. Remove padding so people aren't caught out if they zero out fieldsets. - */ -legend { - border: 0; - /* 1 */ - padding: 0; - /* 2 */ } - -/** - * Remove default vertical scrollbar in IE 8/9/10/11. - */ -textarea { - overflow: auto; } - -/** - * Don't inherit the `font-weight` (applied by a rule above). - * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. - */ -optgroup { - font-weight: bold; } - -/* Tables - ========================================================================== */ -/** - * Remove most spacing between table cells. - */ -table { - border-collapse: collapse; - border-spacing: 0; } - -td, -th { - padding: 0; } - -.view-valid-certificate .accomplishment-details .list-metadata .item:last-child, .view-validate-certificate .list-instructions .item:last-child, .view-validate-certificate .list-instructions .item .instruction-details:last-child { - margin-bottom: 0; - margin-right: 0; - border: none; - padding-bottom: 0; - padding-right: 0; } - -.list-actions, -.list-docs, -.list-steps, -.list-controls, -.list-fields, -.list-help, -.nav-wizard, -.list-tips, -.field-group, .view-valid-certificate .accomplishment-details .list-metadata, .view-validate-certificate .list-requirements, .view-validate-certificate .list-instructions { - list-style: none; - margin: 0; - padding: 0; - text-indent: 0; } - .list-actions li, - .list-docs li, - .list-steps li, - .list-controls li, - .list-fields li, - .list-help li, - .nav-wizard li, - .list-tips li, - .field-group li, .view-valid-certificate .accomplishment-details .list-metadata li, .view-validate-certificate .list-requirements li, .view-validate-certificate .list-instructions li, .list-actions dt, - .list-docs dt, - .list-steps dt, - .list-controls dt, - .list-fields dt, - .list-help dt, - .nav-wizard dt, - .list-tips dt, - .field-group dt, .view-valid-certificate .accomplishment-details .list-metadata dt, .view-validate-certificate .list-requirements dt, .view-validate-certificate .list-instructions dt, .list-actions dd, - .list-docs dd, - .list-steps dd, - .list-controls dd, - .list-fields dd, - .list-help dd, - .nav-wizard dd, - .list-tips dd, - .field-group dd, .view-valid-certificate .accomplishment-details .list-metadata dd, .view-validate-certificate .list-requirements dd, .view-validate-certificate .list-instructions dd { - margin: 0; - padding: 0; } - -.sr, hr.divider, .title-logo .title-sub { - border: 0; - clip: rect(0 0 0 0); - height: 1px; - margin: -1px; - overflow: hidden; - padding: 0; - position: absolute; - width: 1px; } - -.view-certificate .content-supplemental-how, .view-certificate .content-supplemental-certificates, .view-certificate .content-supplemental-about, .view-valid-certificate .accomplishment, .view-valid-certificate .accomplishment-statement, .view-valid-certificate .accomplishment-details, .view-invalid-certificate .feedback { - -webkit-transition: width 0.25s ease-in-out, height 0.25s ease-in-out; - -moz-transition: width 0.25s ease-in-out, height 0.25s ease-in-out; - transition: width 0.25s ease-in-out, height 0.25s ease-in-out; } - -.wrapper-header, .view-valid-certificate .accomplishment, .view-invalid-certificate .feedback, .view-validate-certificate .instructions { - box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1); } - -@font-face { - font-family: "Open Sans"; - font-style: normal; - font-weight: 300; - src: url("../../fonts/OpenSans/OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"), url("../../fonts/OpenSans/OpenSans-Light-webfont.woff") format("woff"), url("../../fonts/OpenSans/OpenSans-Light-webfont.ttf") format("truetype"), url("../../fonts/OpenSans/OpenSans-Light-webfont.svg#Open Sans") format("svg"); } -@font-face { - font-family: "Open Sans"; - font-style: italic; - font-weight: 300; - src: url("../../fonts/OpenSans/OpenSans-LightItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../../fonts/OpenSans/OpenSans-LightItalic-webfont.woff") format("woff"), url("../../fonts/OpenSans/OpenSans-LightItalic-webfont.ttf") format("truetype"), url("../../fonts/OpenSans/OpenSans-LightItalic-webfont.svg#Open Sans") format("svg"); } -@font-face { - font-family: "Open Sans"; - font-style: normal; - font-weight: 400; - src: url("../../fonts/OpenSans/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../../fonts/OpenSans/OpenSans-Regular-webfont.woff") format("woff"), url("../../fonts/OpenSans/OpenSans-Regular-webfont.ttf") format("truetype"), url("../../fonts/OpenSans/OpenSans-Regular-webfont.svg#Open Sans") format("svg"); } -@font-face { - font-family: "Open Sans"; - font-style: italic; - font-weight: 400; - src: url("../../fonts/OpenSans/OpenSans-Italic-webfont.eot?#iefix") format("embedded-opentype"), url("../../fonts/OpenSans/OpenSans-Italic-webfont.woff") format("woff"), url("../../fonts/OpenSans/OpenSans-Italic-webfont.ttf") format("truetype"), url("../../fonts/OpenSans/OpenSans-Italic-webfont.svg#Open Sans") format("svg"); } -@font-face { - font-family: "Open Sans"; - font-style: normal; - font-weight: 600; - src: url("../../fonts/OpenSans/OpenSans-Semibold-webfont.eot?#iefix") format("embedded-opentype"), url("../../fonts/OpenSans/OpenSans-Semibold-webfont.woff") format("woff"), url("../../fonts/OpenSans/OpenSans-Semibold-webfont.ttf") format("truetype"), url("../../fonts/OpenSans/OpenSans-Semibold-webfont.svg#Open Sans") format("svg"); } -@font-face { - font-family: "Open Sans"; - font-style: italic; - font-weight: 600; - src: url("../../fonts/OpenSans/OpenSans-SemiboldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../../fonts/OpenSans/OpenSans-SemiboldItalic-webfont.woff") format("woff"), url("../../fonts/OpenSans/OpenSans-SemiboldItalic-webfont.ttf") format("truetype"), url("../../fonts/OpenSans/OpenSans-SemiboldItalic-webfont.svg#Open Sans") format("svg"); } -@font-face { - font-family: "Open Sans"; - font-style: normal; - font-weight: 700; - src: url("../../fonts/OpenSans/OpenSans-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../../fonts/OpenSans/OpenSans-Bold-webfont.woff") format("woff"), url("../../fonts/OpenSans/OpenSans-Bold-webfont.ttf") format("truetype"), url("../../fonts/OpenSans/OpenSans-Bold-webfont.svg#Open Sans") format("svg"); } -@font-face { - font-family: "Open Sans"; - font-style: italic; - font-weight: 700; - src: url("../../fonts/OpenSans/OpenSans-BoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../../fonts/OpenSans/OpenSans-BoldItalic-webfont.woff") format("woff"), url("../../fonts/OpenSans/OpenSans-BoldItalic-webfont.ttf") format("truetype"), url("../../fonts/OpenSans/OpenSans-BoldItalic-webfont.svg#Open Sans") format("svg"); } -@-webkit-keyframes fadeIn { - 0% { - opacity: 0.0; } - 50% { - opacity: 0.5; } - 100% { - opacity: 1.0; } } -@-moz-keyframes fadeIn { - 0% { - opacity: 0.0; } - 50% { - opacity: 0.5; } - 100% { - opacity: 1.0; } } -@keyframes fadeIn { - 0% { - opacity: 0.0; } - 50% { - opacity: 0.5; } - 100% { - opacity: 1.0; } } -@-webkit-keyframes fadeInUp { - 0% { - opacity: 0; - transform: translateY(20px); } - 100% { - opacity: 1; - transform: translateY(0); } } -@-moz-keyframes fadeInUp { - 0% { - opacity: 0; - transform: translateY(20px); } - 100% { - opacity: 1; - transform: translateY(0); } } -@keyframes fadeInUp { - 0% { - opacity: 0; - transform: translateY(20px); } - 100% { - opacity: 1; - transform: translateY(0); } } -@-webkit-keyframes fadeInDown { - 0% { - opacity: 0; - transform: translateY(-20px); } - 100% { - opacity: 1; - transform: translateY(0); } } -@-moz-keyframes fadeInDown { - 0% { - opacity: 0; - transform: translateY(-20px); } - 100% { - opacity: 1; - transform: translateY(0); } } -@keyframes fadeInDown { - 0% { - opacity: 0; - transform: translateY(-20px); } - 100% { - opacity: 1; - transform: translateY(0); } } -@-webkit-keyframes fadeOut { - 0% { - opacity: 1.0; } - 50% { - opacity: 0.5; } - 100% { - opacity: 0.0; } } -@-moz-keyframes fadeOut { - 0% { - opacity: 1.0; } - 50% { - opacity: 0.5; } - 100% { - opacity: 0.0; } } -@keyframes fadeOut { - 0% { - opacity: 1.0; } - 50% { - opacity: 0.5; } - 100% { - opacity: 0.0; } } -@-webkit-keyframes rotateUp { - 0% { - -webkit-transform: rotate(0deg); } - 50% { - -webkit-transform: rotate(-90deg); } - 100% { - -webkit-transform: rotate(-180deg); } } -@-moz-keyframes rotateUp { - 0% { - -moz-transform: rotate(0deg); } - 50% { - -moz-transform: rotate(-90deg); } - 100% { - -moz-transform: rotate(-180deg); } } -@keyframes rotateUp { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -ms-transform: rotate(0deg); - -o-transform: rotate(0deg); - transform: rotate(0deg); } - 50% { - -webkit-transform: rotate(-90deg); - -moz-transform: rotate(-90deg); - -ms-transform: rotate(-90deg); - -o-transform: rotate(-90deg); - transform: rotate(-90deg); } - 100% { - -webkit-transform: rotate(-180deg); - -moz-transform: rotate(-180deg); - -ms-transform: rotate(-180deg); - -o-transform: rotate(-180deg); - transform: rotate(-180deg); } } -@-webkit-keyframes rotateDown { - 0% { - -webkit-transform: rotate(0deg); } - 50% { - -webkit-transform: rotate(90deg); } - 100% { - -webkit-transform: rotate(180deg); } } -@-moz-keyframes rotateDown { - 0% { - -moz-transform: rotate(0deg); } - 50% { - -moz-transform: rotate(90deg); } - 100% { - -moz-transform: rotate(180deg); } } -@keyframes rotateDown { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -ms-transform: rotate(0deg); - -o-transform: rotate(0deg); - transform: rotate(0deg); } - 50% { - -webkit-transform: rotate(90deg); - -moz-transform: rotate(90deg); - -ms-transform: rotate(90deg); - -o-transform: rotate(90deg); - transform: rotate(90deg); } - 100% { - -webkit-transform: rotate(180deg); - -moz-transform: rotate(180deg); - -ms-transform: rotate(180deg); - -o-transform: rotate(180deg); - transform: rotate(180deg); } } -@-webkit-keyframes rotateCW { - 0% { - -webkit-transform: rotate(0deg); } - 50% { - -webkit-transform: rotate(180deg); } - 100% { - -webkit-transform: rotate(360deg); } } -@-moz-keyframes rotateCW { - 0% { - -moz-transform: rotate(0deg); } - 50% { - -moz-transform: rotate(180deg); } - 100% { - -moz-transform: rotate(360deg); } } -@keyframes rotateCW { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -ms-transform: rotate(0deg); - -o-transform: rotate(0deg); - transform: rotate(0deg); } - 50% { - -webkit-transform: rotate(180deg); - -moz-transform: rotate(180deg); - -ms-transform: rotate(180deg); - -o-transform: rotate(180deg); - transform: rotate(180deg); } - 100% { - -webkit-transform: rotate(360deg); - -moz-transform: rotate(360deg); - -ms-transform: rotate(360deg); - -o-transform: rotate(360deg); - transform: rotate(360deg); } } -@-webkit-keyframes rotateCCW { - 0% { - -webkit-transform: rotate(0deg); } - 50% { - -webkit-transform: rotate(-180deg); } - 100% { - -webkit-transform: rotate(-360deg); } } -@-moz-keyframes rotateCCW { - 0% { - -moz-transform: rotate(0deg); } - 50% { - -moz-transform: rotate(-180deg); } - 100% { - -moz-transform: rotate(-360deg); } } -@keyframes rotateCCW { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -ms-transform: rotate(0deg); - -o-transform: rotate(0deg); - transform: rotate(0deg); } - 50% { - -webkit-transform: rotate(-180deg); - -moz-transform: rotate(-180deg); - -ms-transform: rotate(-180deg); - -o-transform: rotate(-180deg); - transform: rotate(-180deg); } - 100% { - -webkit-transform: rotate(-360deg); - -moz-transform: rotate(-360deg); - -ms-transform: rotate(-360deg); - -o-transform: rotate(-360deg); - transform: rotate(-360deg); } } -@-webkit-keyframes bounceIn { - 0% { - opacity: 0.0; - -webkit-transform: scale(0.3); } - 50% { - opacity: 1.0; - -webkit-transform: scale(1.05); } - 100% { - -webkit-transform: scale(1); } } -@-moz-keyframes bounceIn { - 0% { - opacity: 0.0; - -moz-transform: scale(0.3); } - 50% { - opacity: 1.0; - -moz-transform: scale(1.05); } - 100% { - -moz-transform: scale(1); } } -@keyframes bounceIn { - 0% { - opacity: 0.0; - -webkit-transform: scale(0.3); - -moz-transform: scale(0.3); - -ms-transform: scale(0.3); - -o-transform: scale(0.3); - transform: scale(0.3); } - 50% { - opacity: 1.0; - -webkit-transform: scale(1.05); - -moz-transform: scale(1.05); - -ms-transform: scale(1.05); - -o-transform: scale(1.05); - transform: scale(1.05); } - 100% { - -webkit-transform: scale(1); - -moz-transform: scale(1); - -ms-transform: scale(1); - -o-transform: scale(1); - transform: scale(1); } } -@-webkit-keyframes bounceOut { - 0% { - -webkit-transform: scale(1); } - 50% { - opacity: 1.0; - -webkit-transform: scale(1.05); } - 100% { - opacity: 0.0; - -webkit-transform: scale(0.3); } } -@-moz-keyframes bounceOut { - 0% { - -moz-transform: scale(1); } - 50% { - opacity: 1.0; - -moz-transform: scale(1.05); } - 100% { - opacity: 0.0; - -moz-transform: scale(0.3); } } -@keyframes bounceOut { - 0% { - -webkit-transform: scale(1); - -moz-transform: scale(1); - -ms-transform: scale(1); - -o-transform: scale(1); - transform: scale(1); } - 50% { - opacity: 1.0; - -webkit-transform: scale(1.05); - -moz-transform: scale(1.05); - -ms-transform: scale(1.05); - -o-transform: scale(1.05); - transform: scale(1.05); } - 100% { - opacity: 0.0; - -webkit-transform: scale(0.3); - -moz-transform: scale(0.3); - -ms-transform: scale(0.3); - -o-transform: scale(0.3); - transform: scale(0.3); } } -@-webkit-keyframes flash { - 0%, 50%, 100% { - opacity: 1.0; } - 25%, 75% { - opacity: 0; } } -@-moz-keyframes flash { - 0%, 50%, 100% { - opacity: 1.0; } - 25%, 75% { - opacity: 0; } } -@keyframes flash { - 0%, 50%, 100% { - opacity: 1.0; } - 25%, 75% { - opacity: 0; } } -@-webkit-keyframes shake { - 0%, 100% { - transform: translateX(0); } - 10%, 30%, 50%, 70%, 90% { - transform: translateX(-10px); } - 20%, 40%, 60%, 80% { - transform: translateX(10px); } } -@-moz-keyframes shake { - 0%, 100% { - transform: translateX(0); } - 10%, 30%, 50%, 70%, 90% { - transform: translateX(-10px); } - 20%, 40%, 60%, 80% { - transform: translateX(10px); } } -@keyframes shake { - 0%, 100% { - transform: translateX(0); } - 10%, 30%, 50%, 70%, 90% { - transform: translateX(-10px); } - 20%, 40%, 60%, 80% { - transform: translateX(10px); } } -@-webkit-keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - transform: translateY(0); } - 40% { - transform: translateY(30px); } - 60% { - transform: translateY(15px); } } -@-moz-keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - transform: translateY(0); } - 40% { - transform: translateY(30px); } - 60% { - transform: translateY(15px); } } -@keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - transform: translateY(0); } - 40% { - transform: translateY(30px); } - 60% { - transform: translateY(15px); } } -@-webkit-keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - transform: translateY(0); } - 40% { - transform: translateY(30px); } - 60% { - transform: translateY(15px); } } -@-moz-keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - transform: translateY(0); } - 40% { - transform: translateY(30px); } - 60% { - transform: translateY(15px); } } -@keyframes bounce { - 0%, 20%, 50%, 80%, 100% { - transform: translateY(0); } - 40% { - transform: translateY(30px); } - 60% { - transform: translateY(15px); } } -html, body, div, span, applet, object, iframe, -h1, h2, h3, h4, h5, h6, p, blockquote, pre, -a, abbr, acronym, address, big, cite, code, -del, dfn, em, img, ins, kbd, q, s, samp, -small, strike, strong, sub, sup, tt, var, -b, u, i, center, -dl, dt, dd, ol, ul, li, -fieldset, form, label, legend, -table, caption, tbody, tfoot, thead, tr, th, td, -article, aside, canvas, details, figcaption, figure, -footer, header, hgroup, menu, nav, section, summary, -time, mark, audio, video { - font-weight: 400; } - -.view-valid-certificate .accomplishment-statement .copy-course-org, .view-valid-certificate .accomplishment-details .value { - font-weight: 500; } - -strong, .view-certificate .content-supplemental .list-actions .action, .view-validate-certificate .support .list-actions .action, .view-certificate .content-supplemental .title, .view-valid-certificate .accomplishment-statement .copy-name, .view-valid-certificate .accomplishment-statement .copy-course-name, .view-valid-certificate .accomplishment-details .label, .view-invalid-certificate .feedback-lead .title, .view-invalid-certificate .feedback-support .title, .view-invalid-certificate .feedback-warning .title, .view-validate-certificate .content .title-lvl1, .view-validate-certificate .content .title-lvl2, .view-validate-certificate .content .title-lvl3, .view-validate-certificate .list-requirements .item:before, .view-validate-certificate .list-requirements .item .requirement-label, .view-validate-certificate .instructions .title { - font-weight: 600; } - -.view-validate-certificate .list-instructions .item:before { - font-weight: 700; } - -.view-valid-certificate .accomplishment-statement .copy-name, .view-valid-certificate .accomplishment-statement .copy-course-name, .view-valid-certificate .accomplishment-statement .copy-recogniton, .view-validate-certificate .instructions .title, .view-invalid-certificate .feedback-lead .title, .view-validate-certificate .content .title-lvl1, .title-logo .title-sub, .view-valid-certificate .accomplishment-statement .copy-course-org, .view-validate-certificate .content .title-lvl2, .title-logo .title-sub, .view-valid-certificate .accomplishment-statement .copy-course-org, .view-validate-certificate .content .title-lvl2, .view-certificate .status .title, .view-valid-certificate .accomplishment-details .value, .view-invalid-certificate .feedback-support .title, .view-invalid-certificate .feedback-warning .title, .view-validate-certificate .content .title-lvl3, .view-validate-certificate .list-requirements .item:before, .view-validate-certificate .list-requirements .item .requirement-label, .view-validate-certificate .list-instructions .item:before, .view-certificate .content-supplemental .title { - font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; } - -.view-valid-certificate .accomplishment-statement .copy-name, .view-valid-certificate .accomplishment-statement .copy-course-name, .view-valid-certificate .accomplishment-statement .copy-recogniton, .view-validate-certificate .instructions .title { - font-size: 48px; - font-size: 4.8rem; - line-height: 74.4px; - line-height: 7.44rem; } - -.view-invalid-certificate .feedback-lead .title, .view-validate-certificate .content .title-lvl1 { - font-size: 36px; - font-size: 3.6rem; - line-height: 55.8px; - line-height: 5.58rem; } - -.title-logo .title-sub, .view-valid-certificate .accomplishment-statement .copy-course-org, .view-validate-certificate .content .title-lvl2 { - font-size: 20px; - font-size: 2rem; - line-height: 31px; - line-height: 3.1rem; } - -.view-certificate .status .title, .view-valid-certificate .accomplishment-details .value, .view-invalid-certificate .feedback-support .title, .view-invalid-certificate .feedback-warning .title, .view-validate-certificate .content .title-lvl3, .view-validate-certificate .list-requirements .item:before, .view-validate-certificate .list-requirements .item .requirement-label, .view-validate-certificate .list-instructions .item:before { - font-size: 18px; - font-size: 1.8rem; - line-height: 27.9px; - line-height: 2.79rem; } - -.view-certificate .content-supplemental .title { - font-size: 16px; - font-size: 1.6rem; - line-height: 24.8px; - line-height: 2.48rem; } - -body, .view-validate-certificate .list-requirements .item, .view-validate-certificate .list-instructions .item, .view-valid-certificate .accomplishment-statement .copy-context, .view-invalid-certificate .feedback-lead .copy, .footer-app-copyright, .view-certificate .content-supplemental .copy, .view-certificate .content-supplemental .list-actions .action, .view-valid-certificate .accomplishment-details .explanation, .view-validate-certificate .support .list-actions .action, .view-valid-certificate .accomplishment-details .label { - font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; } - -body, .view-validate-certificate .list-requirements .item, .view-validate-certificate .list-instructions .item { - font-size: 16px; - font-size: 1.6rem; - line-height: 24.8px; - line-height: 2.48rem; } - -.view-valid-certificate .accomplishment-statement .copy-context, .view-invalid-certificate .feedback-lead .copy { - font-size: 20px; - font-size: 2rem; - line-height: 31px; - line-height: 3.1rem; } - -.footer-app-copyright, .view-certificate .content-supplemental .copy, .view-certificate .content-supplemental .list-actions .action, .view-valid-certificate .accomplishment-details .explanation, .view-validate-certificate .support .list-actions .action { - font-size: 14px; - font-size: 1.4rem; - line-height: 21.7px; - line-height: 2.17rem; } - -.view-valid-certificate .accomplishment-details .label { - font-size: 12px; - font-size: 1.2rem; - line-height: 18.6px; - line-height: 1.86rem; } - -.footer-app-nav .nav-item { - font-size: 12px; - font-size: 1.2rem; - line-height: 18.6px; - line-height: 1.86rem; } - -html, body { - height: 100%; } - -html { - font-size: 62.5%; - overflow-y: scroll; } - -[class^="wrapper-"] { - padding: 0; } - -.wrapper-view { - background: #f4f5f5; } - -html, body, div, span, applet, object, iframe, -h1, h2, h3, h4, h5, h6, p, blockquote, pre, -a, abbr, acronym, address, big, cite, code, -del, dfn, em, img, ins, kbd, q, s, samp, -small, strike, strong, sub, sup, tt, var, -b, u, i, center, -dl, dt, dd, ol, ul, li, -fieldset, form, label, legend, -table, caption, tbody, tfoot, thead, tr, th, td, -article, aside, canvas, details, figcaption, figure, -footer, header, hgroup, menu, nav, section, summary, -time, mark, audio, video { - margin: 0; - padding: 0; - border: 0; - outline: 0; - vertical-align: baseline; } - -abbr[title] { - border-bottom: none; - text-decoration: none; - cursor: help; } - -.view-certificate .content-supplemental .list-actions .action, .view-validate-certificate .support .list-actions .action { - -webkit-transition: color 0.25s ease-in-out, background 0.25s ease-in-out, box-shadow 0.25s ease-in-out; - -moz-transition: color 0.25s ease-in-out, background 0.25s ease-in-out, box-shadow 0.25s ease-in-out; - transition: color 0.25s ease-in-out, background 0.25s ease-in-out, box-shadow 0.25s ease-in-out; - box-sizing: border-box; - display: inline-block; - cursor: pointer; - text-decoration: none; } - .view-certificate .content-supplemental .list-actions .action:hover, .view-validate-certificate .support .list-actions .action:hover, .view-certificate .content-supplemental .list-actions .action:active, .view-validate-certificate .support .list-actions .action:active, .view-certificate .content-supplemental .list-actions .action:focus, .view-validate-certificate .support .list-actions .action:focus { - text-decoration: none; } - .view-certificate .content-supplemental .list-actions .disabled.action, .view-validate-certificate .support .list-actions .disabled.action, .view-certificate .content-supplemental .list-actions [disabled].action, .view-validate-certificate .support .list-actions [disabled].action { - cursor: default; - pointer-events: none; } - -.view-certificate .content-supplemental .list-actions .action, .view-validate-certificate .support .list-actions .action { - border-radius: 2px; } - -.view-certificate .content-supplemental .list-actions .action, .view-validate-certificate .support .list-actions .action { - padding: 10px 20px; - background: #2e81b3; - border-color: #1d85c4; - color: #eaf2f7; } - .view-certificate .content-supplemental .list-actions .action:hover, .view-validate-certificate .support .list-actions .action:hover, .view-certificate .content-supplemental .list-actions .action:active, .view-validate-certificate .support .list-actions .action:active, .view-certificate .content-supplemental .list-actions .action:focus, .view-validate-certificate .support .list-actions .action:focus { - background: #078bda; - border-color: #078bda; - color: #f4f8fb; } - .view-certificate .content-supplemental .list-actions .disabled.action, .view-validate-certificate .support .list-actions .disabled.action, .view-certificate .content-supplemental .list-actions .is-disabled.action, .view-validate-certificate .support .list-actions .is-disabled.action, .view-certificate .content-supplemental .list-actions [disabled].action, .view-validate-certificate .support .list-actions [disabled].action { - opacity: 0.5; } - -[class^="content-"] a, .footer-app a, .view-certificate .content a { - -webkit-transition: color 0.5s ease-in-out, border 0.5s ease-in-out; - -moz-transition: color 0.5s ease-in-out, border 0.5s ease-in-out; - transition: color 0.5s ease-in-out, border 0.5s ease-in-out; - border-bottom: 1px solid transparent; - color: #2e81b3; - text-decoration: none; } - [class^="content-"] a:hover, .footer-app a:hover, .view-certificate .content a:hover, [class^="content-"] a:focus, .footer-app a:focus, .view-certificate .content a:focus, [class^="content-"] a:active, .footer-app a:active, .view-certificate .content a:active { - color: #3aa2e0; - border-color: #3aa2e0; } - -.wrapper-header { - margin-bottom: 40px; - padding: 20px 40px; - background: white; - color: #0a0a0a; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .wrapper-header { - padding: 20px 20px; } } - @media screen and (max-width: 499px) { - .wrapper-header { - padding: 20px 20px; } } - -.header-app { - max-width: 1280px; - margin-left: auto; - margin-right: auto; } - .header-app::after { - clear: both; - content: ""; - display: table; } - -.title-logo { - text-align: center; } - .title-logo .logo { - display: inline-block; - vertical-align: middle; - margin-right: 20px; } - .title-logo .title-sub { - display: inline-block; - vertical-align: middle; - text-transform: uppercase; - letter-spacing: 0.1rem; } - -.wrapper-footer { - padding: 0 40px; - background: transparent; - color: #353a3d; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .wrapper-footer { - padding: 0 20px; } } - @media screen and (max-width: 499px) { - .wrapper-footer { - padding: 0 20px; } } - -.footer-app { - max-width: 1280px; - margin-left: auto; - margin-right: auto; - border-top: 2px solid #eaebeb; - margin-top: 20px; - padding-top: 20px; } - .footer-app::after { - clear: both; - content: ""; - display: table; } - -.footer-app-copyright { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 31.7615656014%; } - .footer-app-copyright:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .footer-app-copyright { - width: 100%; - margin-bottom: 20px; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .footer-app-copyright { - width: 100%; - margin-bottom: 20px; } } - @media screen and (max-width: 499px) { - .footer-app-copyright { - width: 100%; - margin-bottom: 20px; } } - -.footer-app-nav { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 65.8807828007%; - margin-right: 0; - text-align: right; } - .footer-app-nav:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .footer-app-nav { - width: 100%; - text-align: left; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .footer-app-nav { - width: 100%; - text-align: left; } } - @media screen and (max-width: 499px) { - .footer-app-nav { - width: 100%; - text-align: left; } } - .footer-app-nav .list { - display: inline-block; - vertical-align: middle; - margin-right: 40px; } - .footer-app-nav .list:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .footer-app-nav .list { - width: 100%; - margin: 0 0 20px 0; - text-align: left; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .footer-app-nav .list { - width: 100%; - margin: 0 0 20px 0; - text-align: left; } } - @media screen and (max-width: 499px) { - .footer-app-nav .list { - width: 100%; - margin: 0 0 20px 0; - text-align: left; } } - .footer-app-nav .nav-item { - display: inline-block; - margin-right: 10px; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .footer-app-nav .nav-item { - font-size: 14px; - font-size: 1.4rem; - line-height: 21.7px; - line-height: 2.17rem; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .footer-app-nav .nav-item { - font-size: 14px; - font-size: 1.4rem; - line-height: 21.7px; - line-height: 2.17rem; - display: block; - margin: 0 0 5px 0; } } - @media screen and (max-width: 499px) { - .footer-app-nav .nav-item { - font-size: 14px; - font-size: 1.4rem; - line-height: 21.7px; - line-height: 2.17rem; - display: block; - margin: 0 0 5px 0; } } - -.view-certificate { - background: #f4f5f5; } - .view-certificate .wrapper-view { - background: transparent url("../images/bg-paperfibers.png") 0 0 repeat-both; - padding-bottom: 60px; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate .wrapper-view { - padding-bottom: 20px; } } - @media screen and (max-width: 499px) { - .view-certificate .wrapper-view { - padding-bottom: 20px; } } - .view-certificate .wrapper-content { - padding: 20px 40px; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate .wrapper-content { - padding: 20px 20px; } } - @media screen and (max-width: 499px) { - .view-certificate .wrapper-content { - padding: 20px 20px; } } - .view-certificate .content { - max-width: 1280px; - margin-left: auto; - margin-right: auto; } - .view-certificate .content::after { - clear: both; - content: ""; - display: table; } - .view-certificate .status { - display: block; - padding: 20px 40px; - border-top-radius: 2px; - box-shadow: inset 0 -2px 2px 0 rgba(0, 0, 0, 0.05); - background: #d6d7d8; - color: white; - text-transform: uppercase; - letter-spacing: 0.1rem; } - .view-certificate .status::after { - clear: both; - content: ""; - display: table; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate .status { - padding: 20px 20px; } } - @media screen and (max-width: 499px) { - .view-certificate .status { - padding: 20px 20px; } } - @media screen and (min-width: 900px) { - .view-certificate .status .title { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 74.4105871005%; } - .view-certificate .status .title:last-child { - margin-right: 0; } } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-certificate .status .title { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 74.4105871005%; } - .view-certificate .status .title:last-child { - margin-right: 0; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate .status .title { - font-size: 14px; - font-size: 1.4rem; - line-height: 21.7px; - line-height: 2.17rem; } } - @media screen and (max-width: 499px) { - .view-certificate .status .title { - font-size: 14px; - font-size: 1.4rem; - line-height: 21.7px; - line-height: 2.17rem; } } - .view-certificate .content-supplemental .title { - margin-bottom: 10px; } - .view-certificate .content-supplemental .copy { - color: #85888a; } - .view-certificate .content-supplemental .list-actions { - margin-top: 20px; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate .content-supplemental .list-actions .action { - display: block; - text-align: center; } } - @media screen and (max-width: 499px) { - .view-certificate .content-supplemental .list-actions .action { - display: block; - text-align: center; } } - .view-certificate .content-supplemental-how { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 23.2317613015%; } - .view-certificate .content-supplemental-how:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-certificate .content-supplemental-how { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 48.821174201%; } - .view-certificate .content-supplemental-how:last-child { - margin-right: 0; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate .content-supplemental-how { - width: 100%; - margin-bottom: 40px; } } - @media screen and (max-width: 499px) { - .view-certificate .content-supplemental-how { - width: 100%; - margin-bottom: 40px; } } - .view-certificate .content-supplemental-certificates { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 23.2317613015%; - margin-right: 0; } - .view-certificate .content-supplemental-certificates:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-certificate .content-supplemental-certificates { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 48.821174201%; } - .view-certificate .content-supplemental-certificates:last-child { - margin-right: 0; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate .content-supplemental-certificates { - width: 100%; } } - @media screen and (max-width: 499px) { - .view-certificate .content-supplemental-certificates { - width: 100%; } } - .view-certificate .content-supplemental-about { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 48.821174201%; } - .view-certificate .content-supplemental-about:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-certificate .content-supplemental-about { - width: 100%; - margin-bottom: 40px; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate .content-supplemental-about { - width: 100%; - margin-bottom: 40px; } } - @media screen and (max-width: 499px) { - .view-certificate .content-supplemental-about { - width: 100%; - margin-bottom: 40px; } } - .view-certificate.is-honorcode .status { - background: #88c7ec; } - .view-certificate.is-honorcode .certificate-type { - color: #88c7ec; } - .view-certificate.is-idverified .status { - background: #3aa2e0; } - .view-certificate.is-idverified .accomplishment { - background: white url("../images/logo-idverified-cropped.png") bottom left no-repeat; - background-size: 75%; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate.is-idverified .accomplishment { - background-size: 75%; } } - @media screen and (max-width: 499px) { - .view-certificate.is-idverified .accomplishment { - background-size: 100%; } } - .view-certificate.is-idverified .certificate-type { - color: #3aa2e0; } - .view-certificate.is-idverified .certificate-type .wrapper-img { - width: 200px; - border-radius: 200px; - padding: 10px 10px; - background: white; - margin: -80px auto 0 auto; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-certificate.is-idverified .certificate-type .wrapper-img { - float: right; - margin: 0 0 20px 20px; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-certificate.is-idverified .certificate-type .wrapper-img { - width: 150px; - float: right; - margin: 0 0 20px 20px; } } - @media screen and (max-width: 499px) { - .view-certificate.is-idverified .certificate-type .wrapper-img { - width: 100px; - float: right; - margin: 0; } } - .view-certificate.is-idverified .certificate-type .wrapper-img img { - width: 100%; } - -.view-valid-certificate .accomplishment { - padding: 40px 40px 60px 40px; - margin-bottom: 40px; - border-radius: 2px; - border: 1px solid #eaebeb; - background: white; } - .view-valid-certificate .accomplishment::after { - clear: both; - content: ""; - display: table; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-valid-certificate .accomplishment { - padding: 20px 20px; } } - @media screen and (max-width: 499px) { - .view-valid-certificate .accomplishment { - padding: 20px 20px; } } -.view-valid-certificate .accomplishment-statement { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 65.8807828007%; - padding: 0 20px 0 0; - border-right: 1px solid #eaebeb; } - .view-valid-certificate .accomplishment-statement:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-valid-certificate .accomplishment-statement { - width: 100%; - padding: 0; - border-right: none; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-valid-certificate .accomplishment-statement { - width: 100%; - padding: 0; - border-right: none; } } - @media screen and (max-width: 499px) { - .view-valid-certificate .accomplishment-statement { - width: 100%; - padding: 0; - border-right: none; } } - .view-valid-certificate .accomplishment-statement [class^="copy-"] { - display: block; - margin-bottom: 20px; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-valid-certificate .accomplishment-statement .copy-name { - font-size: 36px; - font-size: 3.6rem; - line-height: 55.8px; - line-height: 5.58rem; - margin: 10px 0 5px 0; } } - @media screen and (max-width: 499px) { - .view-valid-certificate .accomplishment-statement .copy-name { - font-size: 24px; - font-size: 2.4rem; - line-height: 37.2px; - line-height: 3.72rem; - margin: 10px 0 5px 0; } } - .view-valid-certificate .accomplishment-statement .copy-course-org { - margin-bottom: 0; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-valid-certificate .accomplishment-statement .copy-course-org { - margin: 10px 0 0 0; } } - @media screen and (max-width: 499px) { - .view-valid-certificate .accomplishment-statement .copy-course-org { - margin: 10px 0 0 0; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-valid-certificate .accomplishment-statement .copy-course { - margin-bottom: 5px; } } - @media screen and (max-width: 499px) { - .view-valid-certificate .accomplishment-statement .copy-course { - margin-bottom: 5px; } } - .view-valid-certificate .accomplishment-statement .copy-course-name { - line-height: 55.8px; - line-height: 5.58rem; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-valid-certificate .accomplishment-statement .copy-course-name { - font-size: 36px; - font-size: 3.6rem; - line-height: 55.8px; - line-height: 5.58rem; - margin: 0; } } - @media screen and (max-width: 499px) { - .view-valid-certificate .accomplishment-statement .copy-course-name { - font-size: 24px; - font-size: 2.4rem; - line-height: 37.2px; - line-height: 3.72rem; - margin: 0; } } - .view-valid-certificate .accomplishment-statement .copy-context { - color: #85888a; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-valid-certificate .accomplishment-statement .copy-context { - font-size: 16px; - font-size: 1.6rem; - line-height: 24.8px; - line-height: 2.48rem; } } - @media screen and (max-width: 499px) { - .view-valid-certificate .accomplishment-statement .copy-context { - font-size: 16px; - font-size: 1.6rem; - line-height: 24.8px; - line-height: 2.48rem; } } -.view-valid-certificate .accomplishment-details { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 31.7615656014%; } - .view-valid-certificate .accomplishment-details:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-valid-certificate .accomplishment-details { - width: 100%; - margin-top: 20px; - padding-top: 40px; - border-top: 1px solid #eaebeb; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-valid-certificate .accomplishment-details { - width: 100%; } } - @media screen and (max-width: 499px) { - .view-valid-certificate .accomplishment-details { - width: 100%; } } - .view-valid-certificate .accomplishment-details .list-metadata .item { - margin-bottom: 20px; - padding-bottom: 20px; - border-bottom: 1px solid #eaebeb; } - .view-valid-certificate .accomplishment-details .label { - display: block; - margin-bottom: 5px; - text-transform: uppercase; - color: #aeb0b1; - letter-spacing: 0.1rem; } - .view-valid-certificate .accomplishment-details .value { - display: block; } - .view-valid-certificate .accomplishment-details .explanation { - display: block; - margin-top: 10px; - color: #aeb0b1; } - .view-valid-certificate .accomplishment-details .certificate-type { - text-transform: uppercase; - letter-spacing: 0.1rem; } - .view-valid-certificate .accomplishment-details .certificate-type .explanation { - text-transform: none; - letter-spacing: 0; } - .view-valid-certificate .accomplishment-details .certificate-id .value { - word-wrap: break-word; } - -.view-invalid-certificate .feedback { - display: block; - padding: 40px 40px 60px 40px; - margin-bottom: 40px; - border-radius: 2px; - border: 1px solid #eaebeb; - background: white; } - .view-invalid-certificate .feedback::after { - clear: both; - content: ""; - display: table; } - .view-invalid-certificate .feedback::after { - clear: both; - content: ""; - display: table; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-invalid-certificate .feedback { - padding: 20px 20px; } } - @media screen and (max-width: 499px) { - .view-invalid-certificate .feedback { - padding: 20px 20px; } } -.view-invalid-certificate .feedback-lead { - margin-bottom: 20px; - padding-bottom: 20px; - border-bottom: 1px solid #eaebeb; } - .view-invalid-certificate .feedback-lead .title { - margin-bottom: 10px; } - .view-invalid-certificate .feedback-lead .copy { - color: #b62568; } -.view-invalid-certificate .feedback-support { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 48.821174201%; - margin-bottom: 20px; } - .view-invalid-certificate .feedback-support:last-child { - margin-right: 0; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-invalid-certificate .feedback-support { - width: 100%; } } - @media screen and (max-width: 499px) { - .view-invalid-certificate .feedback-support { - width: 100%; } } - .view-invalid-certificate .feedback-support .title { - margin-bottom: 10px; } - .view-invalid-certificate .feedback-support .copy { - color: #85888a; } -.view-invalid-certificate .feedback-warning { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 48.821174201%; - margin-right: 0; } - .view-invalid-certificate .feedback-warning:last-child { - margin-right: 0; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-invalid-certificate .feedback-warning { - width: 100%; } } - @media screen and (max-width: 499px) { - .view-invalid-certificate .feedback-warning { - width: 100%; } } - .view-invalid-certificate .feedback-warning .title { - margin-bottom: 10px; } - .view-invalid-certificate .feedback-warning .copy { - color: #85888a; } - -.view-validate-certificate .content .title-lvl1 { - margin-bottom: 20px; } -.view-validate-certificate .content .title-lvl2 { - margin-bottom: 10px; } -.view-validate-certificate .content .title-lvl3 { - margin-bottom: 10px; } -.view-validate-certificate .introduction { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 65.8807828007%; - margin-left: 17.0596085997%; - margin-bottom: 40px; } - .view-validate-certificate .introduction:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-validate-certificate .introduction { - width: 100%; - margin-left: 0%; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-validate-certificate .introduction { - width: 100%; - margin-left: 0%; } } - @media screen and (max-width: 499px) { - .view-validate-certificate .introduction { - width: 100%; - margin-left: 0%; } } -.view-validate-certificate .requirements { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 65.8807828007%; - margin-left: 17.0596085997%; - margin-bottom: 40px; } - .view-validate-certificate .requirements:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-validate-certificate .requirements { - width: 100%; - margin-left: 0%; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-validate-certificate .requirements { - width: 100%; - margin-left: 0%; } } - @media screen and (max-width: 499px) { - .view-validate-certificate .requirements { - width: 100%; - margin-left: 0%; } } -.view-validate-certificate .list-requirements { - width: 100%; - counter-reset: instructions-counter; - margin: 20px 0; } - .view-validate-certificate .list-requirements .item { - float: left; - display: block; - margin-right: 3.5786636068%; - width: 48.2106681966%; - min-height: 160px; - margin-bottom: 20px; - border-radius: 2px; - border-top: 4px solid #29a6f1; - padding: 20px 20px; - color: #5d6163; - background: #eaebeb; } - .view-validate-certificate .list-requirements .item:last-child { - margin-right: 0; } - .view-validate-certificate .list-requirements .item:nth-child(2n) { - margin-right: 0; } - .view-validate-certificate .list-requirements .item:nth-child(2n+1) { - clear: left; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-validate-certificate .list-requirements .item { - width: 100%; - min-height: 0; } } - @media screen and (max-width: 499px) { - .view-validate-certificate .list-requirements .item { - width: 100%; - min-height: 0; } } - .view-validate-certificate .list-requirements .item:before { - content: counter(instructions-counter); - counter-increment: instructions-counter; - display: inline-block; - vertical-align: top; - max-width: 10%; - margin-right: 10px; - color: #aeb0b1; } - .view-validate-certificate .list-requirements .item .requirement-label { - display: inline-block; - vertical-align: top; - margin-bottom: 5px; - max-width: 85%; - color: #0a0b0c; } - .view-validate-certificate .list-requirements .item .requirement-details { - display: block; } - @media screen and (max-width: 499px) { - .view-validate-certificate .list-requirements .item .requirement-details { - font-size: 14px; - font-size: 1.4rem; - line-height: 21.7px; - line-height: 2.17rem; } } - .view-validate-certificate .list-requirements .requirement-allitems { - border-top-color: #b62568; } -.view-validate-certificate .instructions { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 65.8807828007%; - margin-left: 17.0596085997%; - padding: 20px 20px; - margin-bottom: 40px; - border-radius: 2px; - border: 1px solid #eaebeb; - background: white; } - .view-validate-certificate .instructions:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-validate-certificate .instructions { - width: 100%; - margin-left: 0%; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-validate-certificate .instructions { - width: 100%; - margin-left: 0%; } } - @media screen and (max-width: 499px) { - .view-validate-certificate .instructions { - width: 100%; - margin-left: 0%; } } - .view-validate-certificate .instructions .title { - margin-bottom: 20px; - padding-bottom: 10px; - border-bottom: 3px solid #eaebeb; } -.view-validate-certificate .list-instructions { - counter-reset: instructions-counter; } - .view-validate-certificate .list-instructions .item { - display: block; - margin-bottom: 20px; - padding-bottom: 20px; - border-bottom: 1px solid #eaebeb; - color: #5d6163; } - @media screen and (max-width: 499px) { - .view-validate-certificate .list-instructions .item { - font-size: 16px; - font-size: 1.6rem; - line-height: 24.8px; - line-height: 2.48rem; } } - .view-validate-certificate .list-instructions .item:before { - content: counter(instructions-counter); - counter-increment: instructions-counter; - display: inline-block; - vertical-align: top; - max-width: 10%; - margin-right: 10px; - color: #d6d7d8; } - .view-validate-certificate .list-instructions .item .instruction-details { - display: inline-block; - vertical-align: top; - margin-bottom: 20px; - max-width: 85%; } - .view-validate-certificate .list-instructions .item .instruction-image { - width: 100%; - border-radius: 2px; - border: 1px solid #eaebeb; - padding: 10px 10px; - background: #f4f5f5; } - .view-validate-certificate .list-instructions .item .instruction-image img { - width: 100%; - display: block; } -.view-validate-certificate .support { - float: left; - display: block; - margin-right: 2.3576515979%; - width: 65.8807828007%; - margin-left: 17.0596085997%; } - .view-validate-certificate .support:last-child { - margin-right: 0; } - @media screen and (min-width: 760px) and (max-width: 899px) { - .view-validate-certificate .support { - width: 100%; - margin-left: 0%; } } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-validate-certificate .support { - width: 100%; - margin-left: 0%; } } - @media screen and (max-width: 499px) { - .view-validate-certificate .support { - width: 100%; - margin-left: 0%; } } - @media screen and (max-width: 499px) { - .view-validate-certificate .support .copy { - font-size: 14px; - font-size: 1.4rem; - line-height: 21.7px; - line-height: 2.17rem; } } - .view-validate-certificate .support .list-actions { - margin-top: 20px; } - @media screen and (min-width: 500px) and (max-width: 759px) { - .view-validate-certificate .support .list-actions .action { - display: block; - text-align: center; } } - @media screen and (max-width: 499px) { - .view-validate-certificate .support .list-actions .action { - display: block; - text-align: center; } } - -/*# sourceMappingURL=main.css.map */ diff --git a/lms/static/certificates/css/main-ltr.css b/lms/static/certificates/sass/main-ltr.css similarity index 99% rename from lms/static/certificates/css/main-ltr.css rename to lms/static/certificates/sass/main-ltr.css index 2e20a6fd60..4263a4e04c 100644 --- a/lms/static/certificates/css/main-ltr.css +++ b/lms/static/certificates/sass/main-ltr.css @@ -1674,5 +1674,3 @@ abbr[title] { .view-validate-certificate .support .list-actions .action { display: block; text-align: center; } } - -/*# sourceMappingURL=main-ltr.css.map */ diff --git a/lms/static/certificates/css/main-rtl.css b/lms/static/certificates/sass/main-rtl.css similarity index 99% rename from lms/static/certificates/css/main-rtl.css rename to lms/static/certificates/sass/main-rtl.css index a57b1f86ac..f22f013f9c 100644 --- a/lms/static/certificates/css/main-rtl.css +++ b/lms/static/certificates/sass/main-rtl.css @@ -1674,5 +1674,3 @@ abbr[title] { .view-validate-certificate .support .list-actions .action { display: block; text-align: center; } } - -/*# sourceMappingURL=main-rtl.css.map */ diff --git a/lms/static/certificates/sass/main-rtl.scss b/lms/static/certificates/sass/main-rtl.scss index 62f2e8fe11..6ad33ba4c5 100644 --- a/lms/static/certificates/sass/main-rtl.scss +++ b/lms/static/certificates/sass/main-rtl.scss @@ -17,4 +17,3 @@ @import 'utilities/variables-rtl'; @import 'build'; -