diff --git a/cms/static/js/base.js b/cms/static/js/base.js index 7466233331..657eb5c8d4 100644 --- a/cms/static/js/base.js +++ b/cms/static/js/base.js @@ -83,6 +83,8 @@ $(document).ready(function () { // general link management - smooth scrolling page links $('a[rel*="view"][href^="#"]').bind('click', smoothScrollLink); + // tender feedback window scrolling + $('a.show-tender').bind('click', smoothScrollTop); // toggling overview section details $(function () { @@ -160,6 +162,18 @@ function smoothScrollLink(e) { }); } +function smoothScrollTop(e) { + (e).preventDefault(); + + $.smoothScroll({ + offset: -200, + easing: 'swing', + speed: 1000, + scrollElement: null, + scrollTarget: $('#view-top') + }); +} + function linkNewWindow(e) { window.open($(e.target).attr('href')); e.preventDefault(); diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss index cadb442b7c..5a9ac2f280 100644 --- a/cms/static/sass/_base.scss +++ b/cms/static/sass/_base.scss @@ -644,7 +644,7 @@ hr.divide { position: absolute; top: 0; left: 0; - z-index: 99999; + z-index: 10000; padding: 0 10px; border-radius: 3px; background: rgba(0, 0, 0, 0.85); diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss index 29ebf69271..3bac14fdf4 100644 --- a/cms/static/sass/_variables.scss +++ b/cms/static/sass/_variables.scss @@ -22,6 +22,7 @@ $black-t0: rgba(0,0,0,0.125); $black-t1: rgba(0,0,0,0.25); $black-t2: rgba(0,0,0,0.50); $black-t3: rgba(0,0,0,0.75); + $white: rgb(255,255,255); $white-t0: rgba(255,255,255,0.125); $white-t1: rgba(255,255,255,0.25); diff --git a/cms/static/sass/base-style.scss b/cms/static/sass/base-style.scss index 6a1f1bb252..5c67789f72 100644 --- a/cms/static/sass/base-style.scss +++ b/cms/static/sass/base-style.scss @@ -28,6 +28,7 @@ @import 'elements/modal'; @import 'elements/alerts'; @import 'elements/jquery-ui-calendar'; +@import 'elements/tender-widget'; // specific views @import 'views/account'; diff --git a/cms/static/sass/elements/_jquery-ui-calendar.scss b/cms/static/sass/elements/_jquery-ui-calendar.scss index 3d20bde642..d7d7f093e5 100644 --- a/cms/static/sass/elements/_jquery-ui-calendar.scss +++ b/cms/static/sass/elements/_jquery-ui-calendar.scss @@ -8,6 +8,7 @@ font-family: $sans-serif; font-size: 12px; @include box-shadow(0 5px 10px rgba(0, 0, 0, 0.1)); + z-index: 100000 !important; .ui-widget-header { background: $darkGrey; diff --git a/cms/static/sass/elements/_tender-widget.scss b/cms/static/sass/elements/_tender-widget.scss new file mode 100644 index 0000000000..b4113732f0 --- /dev/null +++ b/cms/static/sass/elements/_tender-widget.scss @@ -0,0 +1,267 @@ +// tender help/support widget +// ==================== + +#tender_frame, #tender_window { + background-image: none !important; + background: none; +} + +#tender_window { + @include border-radius(3px); + @include box-shadow(0 2px 3px $shadow); + height: ($baseline*35) !important; + background: $white !important; + border: 1px solid $gray; +} + +#tender_window { + padding: 0 !important; +} + +#tender_frame { + background: $white; +} + +#tender_closer { + color: $blue-l2 !important; + text-transform: uppercase; + + &:hover { + color: $blue-l4 !important; + } +} + +// ==================== + +// tender style overrides - not rendered through here, but an archive is needed +#tender_frame iframe html { + font-size: 62.5%; +} + +.widget-layout { + font-family: 'Open Sans', sans-serif; +} + +.widget-layout .search, +.widget-layout .tabs, +.widget-layout .footer, +.widget-layout .header h1 a { + display: none; +} + +.widget-layout .header { + background: rgb(85, 151, 221); + padding: 10px 20px; +} + +.widget-layout h1, .widget-layout h2, .widget-layout h3, .widget-layout h4, .widget-layout h5, .widget-layout h6, .widget-layout label { + font-weight: 600; +} + +.widget-layout .header h1 { + font-size: 22px; +} + +.widget-layout .content { + overflow: auto; + height: auto !important; + padding: 20px; +} + +.widget-layout .flash { + margin: -10px 0 15px 0; + padding: 10px 20px !important; + background-image: none !important; +} + +.widget-layout .flash-error { + background: rgb(178, 6, 16) !important; + color: rgb(255,255,255) !important; +} + +.widget-layout label { + font-size: 14px; + margin-bottom: 5px; + color: #4c4c4c; + font-weight: 500; +} + +.widget-layout input[type="text"], .widget-layout textarea { + padding: 10px; + font-size: 16px; + color: rgb(0,0,0) !important; + border: 1px solid #b0b6c2; + border-radius: 2px; + background-color: #edf1f5; + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #edf1f5),color-stop(100%, #fdfdfe)); + background-image: -webkit-linear-gradient(top, #edf1f5,#fdfdfe); + background-image: -moz-linear-gradient(top, #edf1f5,#fdfdfe); + background-image: -ms-linear-gradient(top, #edf1f5,#fdfdfe); + background-image: -o-linear-gradient(top, #edf1f5,#fdfdfe); + background-image: linear-gradient(top, #edf1f5,#fdfdfe); + background-color: #edf1f5; + -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset; + -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset; + box-shadow: 0 1px 2px rgba(0,0,0,0.1) inset; +} + +.widget-layout input[type="text"]:focus, .widget-layout textarea:focus { + background-color: #fffcf1; + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fffcf1),color-stop(100%, #fffefd)); + background-image: -webkit-linear-gradient(top, #fffcf1,#fffefd); + background-image: -moz-linear-gradient(top, #fffcf1,#fffefd); + background-image: -ms-linear-gradient(top, #fffcf1,#fffefd); + background-image: -o-linear-gradient(top, #fffcf1,#fffefd); + background-image: linear-gradient(top, #fffcf1,#fffefd); + outline: 0; +} + +.widget-layout textarea { + width: 97%; +} + +.widget-layout p.note { + text-align: right !important; + display: inline-block !important; + position: absolute !important; + right: -130px !important; + top: -5px !important; + font-size: 13px !important; + opacity: 0.80; +} + +.widget-layout .form-actions { + margin: 15px 0; + border: none; + padding: 0; +} + +.widget-layout dl.form { + float: none; + width: 100%; + border-bottom: 1px solid #f2f2f2; + margin-bottom: 10px; + padding-bottom: 10px; +} + +.widget-layout dl.form:last-child { + border: none; + padding-bottom: 0; + margin-bottom: 20px; +} + +.widget-layout dl.form dt, .widget-layout dl.form dd { + display: inline-block; + vertical-align: middle; +} + +.widget-layout dl.form dt { + margin-right: 15px; + width: 70px; +} + +.widget-layout dl.form dd { + width: 65%; + position: relative; +} + +// specific elements +.widget-layout #discussion_body { + +} + +.widget-layout #discussion_body:before { + content: "What Question or Feedback Would You Like to Share?"; + display: block; + font-size: 14px; + margin-bottom: 5px; + color: #4c4c4c; + font-weight: 500; +} + + +.widget-layout dl#brain_buster_captcha { + float: none; + width: 100%; + border-top: 1px solid #f2f2f2; + margin-top: 10px; + padding-top: 10px; +} + +.widget-layout dl#brain_buster_captcha dd { + display: block !important; +} + +.widget-layout dl#brain_buster_captcha #captcha_answer { + border-color: #333; +} + +.widget-layout dl#brain_buster_captcha dd label { + display: block; + font-weight: 700; + margin: 0 15px 5px 0 !important; +} + +.widget-layout dl#brain_buster_captcha dd #captcha_answer { + display: block; + width: 97%%; +} + +.widget-layout .form-actions .btn-post_topic { + display: block; + width: 100%; + height: auto !important; + font-size: 16px; + font-weight: 700; + -webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset,0 0 0 rgba(0,0,0,0); + -moz-box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset,0 0 0 rgba(0,0,0,0); + box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset,0 0 0 rgba(0,0,0,0); + -webkit-transition-property: background-color,0.15s; + -moz-transition-property: background-color,0.15s; + -ms-transition-property: background-color,0.15s; + -o-transition-property: background-color,0.15s; + transition-property: background-color,0.15s; + -webkit-transition-duration: box-shadow,0.15s; + -moz-transition-duration: box-shadow,0.15s; + -ms-transition-duration: box-shadow,0.15s; + -o-transition-duration: box-shadow,0.15s; + transition-duration: box-shadow,0.15s; + -webkit-transition-timing-function: ease-out; + -moz-transition-timing-function: ease-out; + -ms-transition-timing-function: ease-out; + -o-transition-timing-function: ease-out; + transition-timing-function: ease-out; + -webkit-transition-delay: 0; + -moz-transition-delay: 0; + -ms-transition-delay: 0; + -o-transition-delay: 0; + transition-delay: 0; + border: 1px solid #34854c; + border-radius: 3px; + background-color: rgba(255,255,255,0.3); + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255,255,255,0.3)),color-stop(100%, rgba(255,255,255,0))); + background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3),rgba(255,255,255,0)); + background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3),rgba(255,255,255,0)); + background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3),rgba(255,255,255,0)); + background-image: -o-linear-gradient(top, rgba(255,255,255,0.3),rgba(255,255,255,0)); + background-image: linear-gradient(top, rgba(255,255,255,0.3),rgba(255,255,255,0)); + background-color: #25b85a; + -webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset; + -moz-box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset; + box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset; + color: #fff; + text-align: center; + margin-top: 20px; + padding: 10px 20px; +} + +.widget-layout .form-actions #private-discussion-opt { + float: none; + text-align: left; + margin: 0 0 15px 0; +} + +.widget-layout .form-actions .btn-post_topic:hover, .widget-layout .form-actions .btn-post_topic:active { + background-color: #16ca57; + color: #fff; +} \ No newline at end of file diff --git a/cms/templates/base.html b/cms/templates/base.html index e852b5d7fe..fd2b96f03a 100644 --- a/cms/templates/base.html +++ b/cms/templates/base.html @@ -55,7 +55,7 @@ <%block name="content"> <%include file="widgets/footer.html" /> - + <%include file="widgets/tender.html" /> <%block name="jsextra"> diff --git a/cms/templates/widgets/footer.html b/cms/templates/widgets/footer.html index 0f265dfc2c..c5fc81957f 100644 --- a/cms/templates/widgets/footer.html +++ b/cms/templates/widgets/footer.html @@ -14,15 +14,14 @@
  • Privacy Policy
    • --> +
  • edX Studio Help
    • -
  • - Contact edX -
    • - % if user.is_authenticated(): - +
  • + Contact Us +
    • % endif diff --git a/cms/templates/widgets/header.html b/cms/templates/widgets/header.html index d601b940f5..167d5417d7 100644 --- a/cms/templates/widgets/header.html +++ b/cms/templates/widgets/header.html @@ -1,6 +1,6 @@ <%! from django.core.urlresolvers import reverse %> -
    +