diff --git a/common/static/coffee/src/discussion/discussion_router.coffee b/common/static/coffee/src/discussion/discussion_router.coffee index 50c14b20de..283632a542 100644 --- a/common/static/coffee/src/discussion/discussion_router.coffee +++ b/common/static/coffee/src/discussion/discussion_router.coffee @@ -20,10 +20,13 @@ if Backbone? allThreads: -> @nav.updateSidebar() + @nav.goHome() setActiveThread: => if @thread @nav.setActiveThread(@thread.get("id")) + else + @nav.goHome showThread: (forum_name, thread_id) -> @thread = @discussion.get(thread_id) diff --git a/common/static/coffee/src/discussion/utils.coffee b/common/static/coffee/src/discussion/utils.coffee index b7b7cb2550..e2ca220a8d 100644 --- a/common/static/coffee/src/discussion/utils.coffee +++ b/common/static/coffee/src/discussion/utils.coffee @@ -82,6 +82,9 @@ class @DiscussionUtil user_profile : "/courses/#{$$course_id}/discussion/forum/users/#{param}" followed_threads : "/courses/#{$$course_id}/discussion/forum/users/#{param}/followed" threads : "/courses/#{$$course_id}/discussion/forum" + "enable_notifications" : "/notification_prefs/enable/" + "disable_notifications" : "/notification_prefs/disable/" + "notifications_status" : "/notification_prefs/status" }[name] @safeAjax: (params) -> diff --git a/common/static/coffee/src/discussion/views/discussion_thread_list_view.coffee b/common/static/coffee/src/discussion/views/discussion_thread_list_view.coffee index 9aa4ba869d..f9710c7077 100644 --- a/common/static/coffee/src/discussion/views/discussion_thread_list_view.coffee +++ b/common/static/coffee/src/discussion/views/discussion_thread_list_view.coffee @@ -2,6 +2,7 @@ if Backbone? class @DiscussionThreadListView extends Backbone.View events: "click .search": "showSearch" + "click .home": "goHome" "click .browse": "toggleTopicDrop" "keydown .post-search-field": "performSearch" "click .sort-bar a": "sortThreads" @@ -43,6 +44,7 @@ if Backbone? if active @setActiveThread(thread_id) + #TODO fix this entire chain of events addAndSelectThread: (thread) => commentable_id = thread.get("commentable_id") @@ -191,6 +193,25 @@ if Backbone? @$(".browse").removeClass('is-open') setTimeout (-> @$(".post-search-field").focus()), 200 + goHome: -> + @template = _.template($("#discussion-home").html()) + $(".discussion-column").html(@template) + $(".post-list a").removeClass("active") + $("input.email-setting").bind "click", @updateEmailNotifications + url = DiscussionUtil.urlFor("notifications_status",window.user.get("id")) + DiscussionUtil.safeAjax + url: url + type: "GET" + success: (response, textStatus) => + if response.status + $('input.email-setting').attr('checked','checked') + else + $('input.email-setting').removeAttr('checked') + thread_id = null + @trigger("thread:removed") + #select all threads + + toggleTopicDrop: (event) => event.preventDefault() event.stopPropagation() @@ -312,6 +333,7 @@ if Backbone? if callback? callback() + retrieveDiscussions: (discussion_ids) -> @discussionIds = discussion_ids.join(',') @mode = 'commentables' @@ -418,3 +440,19 @@ if Backbone? retrieveFollowed: (event)=> @mode = 'followed' @retrieveFirstPage(event) + + updateEmailNotifications: () => + if $('input.email-setting').attr('checked') + DiscussionUtil.safeAjax + url: DiscussionUtil.urlFor("enable_notifications") + type: "POST" + error: () => + $('input.email-setting').removeAttr('checked') + else + DiscussionUtil.safeAjax + url: DiscussionUtil.urlFor("disable_notifications") + type: "POST" + error: () => + $('input.email-setting').attr('checked','checked') + + diff --git a/lms/djangoapps/django_comment_client/base/urls.py b/lms/djangoapps/django_comment_client/base/urls.py index 41bf568012..5b653e1c68 100644 --- a/lms/djangoapps/django_comment_client/base/urls.py +++ b/lms/djangoapps/django_comment_client/base/urls.py @@ -17,7 +17,6 @@ urlpatterns = patterns('django_comment_client.base.views', # nopep8 url(r'threads/(?P[\w\-]+)/follow$', 'follow_thread', name='follow_thread'), url(r'threads/(?P[\w\-]+)/unfollow$', 'unfollow_thread', name='unfollow_thread'), url(r'threads/(?P[\w\-]+)/close$', 'openclose_thread', name='openclose_thread'), - url(r'comments/(?P[\w\-]+)/update$', 'update_comment', name='update_comment'), url(r'comments/(?P[\w\-]+)/endorse$', 'endorse_comment', name='endorse_comment'), url(r'comments/(?P[\w\-]+)/reply$', 'create_sub_comment', name='create_sub_comment'), diff --git a/lms/djangoapps/django_comment_client/utils.py b/lms/djangoapps/django_comment_client/utils.py index 6668826b67..c3e2708f67 100644 --- a/lms/djangoapps/django_comment_client/utils.py +++ b/lms/djangoapps/django_comment_client/utils.py @@ -387,7 +387,8 @@ def safe_content(content): 'updated_at', 'depth', 'type', 'commentable_id', 'comments_count', 'at_position_list', 'children', 'highlighted_title', 'highlighted_body', 'courseware_title', 'courseware_url', 'tags', 'unread_comments_count', - 'read', 'group_id', 'group_name', 'group_string', 'pinned', 'abuse_flaggers' + 'read', 'group_id', 'group_name', 'group_string', 'pinned', 'abuse_flaggers', + 'stats' ] diff --git a/lms/djangoapps/notification_prefs/tests.py b/lms/djangoapps/notification_prefs/tests.py index c70b19e92b..06a7521016 100644 --- a/lms/djangoapps/notification_prefs/tests.py +++ b/lms/djangoapps/notification_prefs/tests.py @@ -1,3 +1,5 @@ +import json + from django.contrib.auth.models import AnonymousUser from django.core.exceptions import PermissionDenied from django.http import Http404 @@ -7,7 +9,7 @@ from django.test.utils import override_settings from mock import Mock, patch from notification_prefs import NOTIFICATION_PREF_KEY -from notification_prefs.views import ajax_enable, ajax_disable, unsubscribe +from notification_prefs.views import ajax_enable, ajax_disable, ajax_status, unsubscribe from student.tests.factories import UserFactory from user_api.models import UserPreference @@ -57,6 +59,34 @@ class NotificationPrefViewTest(TestCase): UserPreference.objects.filter(user=user, key=NOTIFICATION_PREF_KEY).exists() ) + # AJAX status view + + def test_ajax_status_get_0(self): + request = self.request_factory.get("dummy") + request.user = self.user + response = ajax_status(request) + self.assertEqual(response.status_code, 200) + self.assertEqual(json.loads(response.content), {"status":0}) + + def test_ajax_status_get_1(self): + self.create_prefs() + request = self.request_factory.get("dummy") + request.user = self.user + response = ajax_status(request) + self.assertEqual(response.status_code, 200) + self.assertEqual(json.loads(response.content), {"status":1}) + + def test_ajax_status_post(self): + request = self.request_factory.post("dummy") + request.user = self.user + response = ajax_status(request) + self.assertEqual(response.status_code, 405) + + def test_ajax_status_anon_user(self): + request = self.request_factory.get("dummy") + request.user = AnonymousUser() + self.assertRaises(PermissionDenied, ajax_status, request) + # AJAX enable view def test_ajax_enable_get(self): diff --git a/lms/djangoapps/notification_prefs/views.py b/lms/djangoapps/notification_prefs/views.py index 893fc14a59..6be5b8f766 100644 --- a/lms/djangoapps/notification_prefs/views.py +++ b/lms/djangoapps/notification_prefs/views.py @@ -1,5 +1,6 @@ from base64 import urlsafe_b64encode, urlsafe_b64decode from hashlib import sha256 +import json from Crypto.Cipher import AES from Crypto import Random @@ -131,6 +132,25 @@ def ajax_disable(request): return HttpResponse(status=204) +@require_GET +def ajax_status(request): + """ + A view that retrieves notifications status for the authenticated user. + + This view should be invoked by an AJAX GET call. It returns status 200, + with a JSON-formatted payload, or an error. + """ + if not request.user.is_authenticated(): + raise PermissionDenied + + + qs = UserPreference.objects.filter( + user=request.user, + key=NOTIFICATION_PREF_KEY + ) + + return HttpResponse(json.dumps({"status":len(qs)}), content_type="application/json") + @require_GET def unsubscribe(request, token): diff --git a/lms/envs/aws.py b/lms/envs/aws.py index e039219be8..fa490a244f 100644 --- a/lms/envs/aws.py +++ b/lms/envs/aws.py @@ -182,6 +182,9 @@ COURSES_WITH_UNSAFE_CODE = ENV_TOKENS.get("COURSES_WITH_UNSAFE_CODE", []) MITX_FEATURES['AUTOMATIC_AUTH_FOR_LOAD_TESTING'] = ENV_TOKENS.get('AUTOMATIC_AUTH_FOR_LOAD_TESTING') MITX_FEATURES['MAX_AUTO_AUTH_USERS'] = ENV_TOKENS.get('MAX_AUTO_AUTH_USERS') +# discussion home panel must be explicitly enabled +MITX_FEATURES['ENABLE_DISCUSSION_HOME_PANEL'] = ENV_TOKENS.get('ENABLE_DISCUSSION_HOME_PANEL', False) + ############################## SECURE AUTH ITEMS ############### # Secret things: passwords, access keys, etc. diff --git a/lms/envs/common.py b/lms/envs/common.py index 5a87ee9323..aa17d3f783 100644 --- a/lms/envs/common.py +++ b/lms/envs/common.py @@ -71,6 +71,9 @@ MITX_FEATURES = { 'ENABLE_TEXTBOOK': True, 'ENABLE_DISCUSSION_SERVICE': True, + # discussion home panel, which includes a subscription on/off setting for discussion digest emails. + # this should remain off in production until digest notifications are online. + 'ENABLE_DISCUSSION_HOME_PANEL': True, 'ENABLE_PSYCHOMETRICS': False, # real-time psychometrics (eg item response theory analysis in instructor dashboard) diff --git a/lms/lib/comment_client/user.py b/lms/lib/comment_client/user.py index 2370052d90..1af64cc18c 100644 --- a/lms/lib/comment_client/user.py +++ b/lms/lib/comment_client/user.py @@ -102,3 +102,8 @@ def _url_for_user_active_threads(user_id): def _url_for_user_subscribed_threads(user_id): return "{prefix}/users/{user_id}/subscribed_threads".format(prefix=settings.PREFIX, user_id=user_id) + +def _url_for_user_stats(user_id,course_id): + return "{prefix}/users/{user_id}/stats?course_id={course_id}".format(prefix=settings.PREFIX, user_id=user_id,course_id=course_id) + + diff --git a/lms/static/fonts/vendor/FontAwesome.otf b/lms/static/fonts/vendor/FontAwesome.otf new file mode 100644 index 0000000000..32dd8b1cd5 Binary files /dev/null and b/lms/static/fonts/vendor/FontAwesome.otf differ diff --git a/lms/static/fonts/vendor/fontawesome-webfont.eot b/lms/static/fonts/vendor/fontawesome-webfont.eot new file mode 100755 index 0000000000..c080283bdd Binary files /dev/null and b/lms/static/fonts/vendor/fontawesome-webfont.eot differ diff --git a/lms/static/fonts/vendor/fontawesome-webfont.svg b/lms/static/fonts/vendor/fontawesome-webfont.svg new file mode 100755 index 0000000000..10a1e1bbf7 --- /dev/null +++ b/lms/static/fonts/vendor/fontawesome-webfont.svg @@ -0,0 +1,339 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/lms/static/fonts/vendor/fontawesome-webfont.ttf b/lms/static/fonts/vendor/fontawesome-webfont.ttf new file mode 100755 index 0000000000..908f69ec9a Binary files /dev/null and b/lms/static/fonts/vendor/fontawesome-webfont.ttf differ diff --git a/lms/static/fonts/vendor/fontawesome-webfont.woff b/lms/static/fonts/vendor/fontawesome-webfont.woff new file mode 100755 index 0000000000..a33af950ae Binary files /dev/null and b/lms/static/fonts/vendor/fontawesome-webfont.woff differ diff --git a/lms/static/images/flagged.png b/lms/static/images/flagged.png deleted file mode 100644 index ad2b0dac55..0000000000 Binary files a/lms/static/images/flagged.png and /dev/null differ diff --git a/lms/static/images/new-post-icon.png b/lms/static/images/new-post-icon.png deleted file mode 100644 index bf16b9da89..0000000000 Binary files a/lms/static/images/new-post-icon.png and /dev/null differ diff --git a/lms/static/images/notflagged.png b/lms/static/images/notflagged.png deleted file mode 100644 index fda47d5ab5..0000000000 Binary files a/lms/static/images/notflagged.png and /dev/null differ diff --git a/lms/static/images/pinned.png b/lms/static/images/pinned.png deleted file mode 100644 index e70df7f9db..0000000000 Binary files a/lms/static/images/pinned.png and /dev/null differ diff --git a/lms/static/images/unpinned.png b/lms/static/images/unpinned.png deleted file mode 100644 index a5f5f02894..0000000000 Binary files a/lms/static/images/unpinned.png and /dev/null differ diff --git a/lms/static/sass/_discussion-old.scss b/lms/static/sass/_discussion-old.scss index 01380faa77..8d1152cbcc 100644 --- a/lms/static/sass/_discussion-old.scss +++ b/lms/static/sass/_discussion-old.scss @@ -68,7 +68,10 @@ width: 16px; height: 17px; margin: 7px 7px 0 0; - background: url(../images/new-post-icon.png) no-repeat; + font-size: 16px; + padding-right: $baseline/2; + vertical-align: middle; + color: $white; } .post-search { diff --git a/lms/static/sass/_discussion.scss b/lms/static/sass/_discussion.scss index 80f469113d..9cb6708b8f 100644 --- a/lms/static/sass/_discussion.scss +++ b/lms/static/sass/_discussion.scss @@ -8,7 +8,7 @@ font-size: 13px; font-weight: 700; line-height: 32px; - color: #fff; + color: $white; text-shadow: 0 1px 0 rgba(0, 0, 0, .3); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15); @@ -33,7 +33,7 @@ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15); &:hover { - @include linear-gradient(top, #fff, #ddd); + @include linear-gradient(top, $white, #ddd); } } @@ -90,10 +90,6 @@ } - - - - body.discussion { .new-post-form-errors { @@ -102,13 +98,13 @@ body.discussion { padding: 0; border: 1px solid #333; list-style: none; - color: #fff; + color: $white; line-height: 1.6; border-radius: 3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, .2); li { - padding: 10px 20px 12px 45px; + padding: $baseline/2 $baseline 12px 45px; border-bottom: 1px solid #dc4949; background: url(../images/white-error-icon.png) no-repeat 15px 14px; @@ -133,13 +129,15 @@ body.discussion { width: 16px; height: 17px; margin: 8px 7px 0 0; - background: url(../images/new-post-icon.png) no-repeat; + font-size: 16px; + vertical-align: middle; + color: $white; } } .new-post-article { display: none; - margin-top: 20px; + margin-top: $baseline; .inner-wrapper { max-width: 1180px; @@ -150,13 +148,13 @@ body.discussion { .left-column { float: left; width: 32%; - padding: 40px; + padding: $baseline*2; @include box-sizing(border-box); label { font-size: 22px; font-weight: 700; - color: #fff; + color: $white; text-shadow: none; } @@ -172,8 +170,8 @@ body.discussion { .form-group-label { display: block; - padding-top: 5px; - color:#fff; + padding-top: $baseline/4; + color: $white; } .topic_dropdown_button { @@ -195,12 +193,12 @@ body.discussion { .topic_menu_wrapper { display: none; position: absolute; - top: 40px; + top: $baseline*2; left: 0; z-index: 9999; width: 100%; @include box-sizing(border-box); - background: #737373; + background: #797979; border: 1px solid #333; box-shadow: 0 2px 50px rgba(0, 0, 0, .4); } @@ -211,7 +209,7 @@ body.discussion { a { display: block; - padding: 10px 15px; + padding: $baseline/2 15px; border-top: 1px solid #5f5f5f; font-size: 14px; font-weight: 700; @@ -241,7 +239,7 @@ body.discussion { } .topic_menu_search { - padding: 10px; + padding: $baseline/2; border-bottom: 1px solid black; } @@ -253,7 +251,7 @@ body.discussion { border-radius: 30px; border: 1px solid #333; box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset; - background: -webkit-linear-gradient(top, #eee, #fff); + background: -webkit-linear-gradient(top, #eee, $white); font-size: 11px; line-height: 16px; color: #333; @@ -263,7 +261,7 @@ body.discussion { .right-column { float: left; width: 68%; - padding: 40px; + padding: $baseline*2; @include box-sizing(border-box); } @@ -277,9 +275,9 @@ body.discussion { } .edit-post-form { - width: 100%; - margin-bottom: 40px; @include clearfix; + margin-bottom: $baseline*2; + width: 100%; @include box-sizing(border-box); h1 { @@ -287,21 +285,21 @@ body.discussion { } .form-row { - margin-top: 20px; + margin-top: $baseline; } .post-cancel { @include white-button; float: left; - margin: 10px 0 0 15px; + margin: $baseline/2 0 0 15px; } .post-update { @include blue-button; float: left; - height: 37px; - margin-top: 10px; + margin-top: $baseline/2; padding-bottom: 2px; + height: 37px; &:hover { border-color: #222; @@ -348,7 +346,7 @@ body.discussion { @include clearfix; .form-row { - margin-bottom: 20px; + margin-bottom: $baseline; } .new-post-body .wmd-input { @@ -403,9 +401,9 @@ body.discussion { position: absolute; top: 4px; left: 4px; - font-size: 11px; color: #aaa; text-transform: uppercase; + font-size: 11px; } .new-post-title, @@ -429,9 +427,9 @@ body.discussion { .submit { @include blue-button; float: left; - height: 37px; - margin-top: 10px; + margin-top: $baseline/2; padding-bottom: 2px; + height: 37px; border-color: #333; &:hover { @@ -441,20 +439,20 @@ body.discussion { .new-post-cancel { @include white-button; - border-color: #444; float: left; - margin: 10px 0 0 15px; + margin: $baseline/2 0 0 15px; + border-color: #444; } .options { - margin-top: 40px; + margin-top: $baseline*2; label { display: inline; margin-left: 8px; - font-size: 15px; - color: #fff; + color: $white; text-shadow: none; + font-size: 15px; } } } @@ -462,25 +460,25 @@ body.discussion { .thread-tags { - margin-top: 20px; + margin-top: $baseline; } .thread-tag { margin-right: 5px; - padding: 3px 10px 6px; - border-radius: 3px; - color: #333; - background: #c5eeff; + padding: 3px $baseline/2 6px; border: 1px solid #90c4d7; + border-radius: 3px; + background: #c5eeff; + color: #333; font-size: 13px; } .thread-title { display: block; - margin-bottom: 20px; - font-size: 21px; + margin-bottom: $baseline; color: #333; font-weight: 700; + font-size: 21px; } @@ -500,14 +498,14 @@ body.discussion { } .sidebar-username { - font-size: 18px; font-weight: 700; + font-size: 18px; } .sidebar-user-roles { margin-top: 6px; - font-size: 13px; font-style: italic; + font-size: 13px; } .sidebar-threads-count { @@ -521,8 +519,8 @@ body.discussion { .sidebar-toggle-moderator-button { @include blue-button; + margin-top: $baseline; text-align: center; - margin-top: 20px; } } @@ -530,8 +528,8 @@ body.discussion { .wmd-panel { - width: 100%; min-width: 500px; + width: 100%; } .wmd-button-bar { @@ -540,15 +538,15 @@ body.discussion { } .wmd-input { - height: 150px; width: 100%; - background-color: #e9e9e9; + height: 150px; border: 1px solid #c8c8c8; - font-family: Monaco, 'Lucida Console', monospace; + border-radius: 3px 3px 0 0; + background-color: #e9e9e9; font-style: normal; font-size: 0.8em; + font-family: Monaco, 'Lucida Console', monospace; line-height: 1.6em; - border-radius: 3px 3px 0 0; &::-webkit-input-placeholder { color: #888; @@ -556,16 +554,16 @@ body.discussion { } .wmd-preview { - position: relative; - font-family: $sans-serif; - padding: 25px 20px 10px 20px; - margin-bottom: 5px; @include box-sizing(border-box); + @include transition(all .2s ease-out 0s); + position: relative; + overflow: hidden; + margin-bottom: 5px; + padding: 25px $baseline $baseline/2 $baseline; border: 1px solid #c8c8c8; border-top-width: 0; border-radius: 0 0 3px 3px; - overflow: hidden; - @include transition(all .2s ease-out 0s); + font-family: $sans-serif; &:before { content: 'PREVIEW'; @@ -583,46 +581,46 @@ body.discussion { } .wmd-button-row { + @include transition(all .2s ease-out 0s); position: relative; - margin-left: 5px; + overflow: hidden; + margin-top: $baseline/2; margin-right: 5px; margin-bottom: 5px; - margin-top: 10px; + margin-left: 5px; padding: 0px; height: 20px; - overflow: hidden; - @include transition(all .2s ease-out 0s); } .wmd-spacer { - width: 1px; - height: 20px; - margin-left: 14px; position: absolute; - background-color: Silver; display: inline-block; + margin-left: 14px; + width: 1px; + height: 20px; + background-color: Silver; list-style: none; } .wmd-button { - width: 20px; - height: 20px; - padding-left: 2px; - padding-right: 3px; position: absolute; display: inline-block; + padding-right: 3px; + padding-left: 2px; + width: 20px; + height: 20px; list-style: none; cursor: pointer; } .wmd-button > span { display: inline-block; - background-image: url('/static/images/wmd-buttons.png'); - background-repeat: no-repeat; - background-position: 0px 0px; width: 20px; height: 20px; + background-image: url('/static/images/wmd-buttons.png'); + background-position: 0px 0px; + background-repeat: no-repeat; } .wmd-spacer1 { @@ -642,11 +640,11 @@ body.discussion { .wmd-prompt-dialog { @extend .modal; - background: #fff; + background: $white; } .wmd-prompt-dialog { - padding: 20px; + padding: $baseline; > div { font-size: 0.8em; @@ -664,8 +662,8 @@ body.discussion { > form > input[type="button"] { border: 1px solid #888; - font-family: $sans-serif; font-size: 14px; + font-family: $sans-serif; } > form > input[type="file"] { @@ -683,15 +681,15 @@ body.discussion { @include clearfix; .sidebar { - float: left; @include box-sizing(border-box); + float: left; width: 31%; height: 550px; border: 1px solid #aaa; - box-shadow: 0 1px 2px rgba(0, 0, 0, .05); - background: #f6f6f6; - border-radius: 3px; border-right: 1px solid #bcbcbc; + border-radius: 3px; + background: #f6f6f6; + box-shadow: 0 1px 2px rgba(0, 0, 0, .05); &.fixed { @include box-sizing(border-box); @@ -703,30 +701,50 @@ body.discussion { } .browse-search { - display: block; position: relative; + display: block; height: 60px; border-bottom: 1px solid #a3a3a3; border-radius: 3px 0 0 0; - .browse, + .home, .browse, .search { + @include linear-gradient(top, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0)); + @include transition(all .2s ease-out); position: relative; float: left; width: 20%; height: 100%; - @include linear-gradient(top, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0)); - background-color: #dcdcdc; - @include transition(all .2s ease-out 0s); + background-color: #dedede; &:hover { - background-color: #e9e9e9; + background-color: $white; } + } - &.is-open { - width: 80%; - } + .icon { + @include transition(all .2s ease-out); + z-index: 100; + display: inline-block; + width: 100%; + color: #aeaeae; + text-align: center; + font-size: 28px; + line-height: 60px; + opacity: 1; + } + + .home { + border-radius: 3px 0 0 0; + box-shadow: -1px 0 0 #aaa inset; + cursor: pointer; + } + + .home-icon { + width: 100%; + height: 100%; + display: block; } .browse { @@ -734,6 +752,7 @@ body.discussion { box-shadow: -1px 0 0 #aaa inset; &.is-open { + width:60%; .browse-topic-drop-btn span { opacity: 1.0; } @@ -746,7 +765,7 @@ body.discussion { .browse-topic-drop-btn { span { - color: #fff; + color: $white; text-shadow: none; } @@ -774,9 +793,14 @@ body.discussion { &.is-open { cursor: auto; + width: 60%; + + .home { + width:0%; + } .post-search { - padding: 0 10px; + padding: 0 $baseline/2; max-width: 1000px; } @@ -794,21 +818,21 @@ body.discussion { } .browse-topic-drop-btn { - display: block; + @include transition(none); position: absolute; top: -1px; left: -1px; z-index: 50; + display: block; + overflow: hidden; width: 100%; height: 100%; - border-radius: 3px 0 0 0; border: 1px solid transparent; text-align: center; - overflow: hidden; - @include transition(none); .current-board { - white-space: nowrap; + white-space: normal; + } span { @@ -820,20 +844,22 @@ body.discussion { opacity: 0.0; @include transition(opacity .2s linear 0s); } + .drop-arrow { + font-size: 16px; + } + .drop-arrow { + font-size: 16px; + } + .drop-arrow { + font-size: 16px; + } } .browse-topic-drop-icon { display: block; - position: absolute; - top: 21px; - left: 50%; z-index: 100; - width: 29px; - height: 16px; - margin-left: -12px; - background: url(../images/browse-icon.png) no-repeat; opacity: 1.0; - @include transition(none); + @include transition(none); } .browse-topic-drop-menu-wrapper { @@ -843,7 +869,7 @@ body.discussion { left: -1px; z-index: 9999; width: 100%; - background: #737373; + background: #797979; border: 1px solid #4b4b4b; border-left: none; border-radius: 0 0 3px 3px; @@ -854,6 +880,7 @@ body.discussion { overflow-y: scroll; } + ul { position: inline; } @@ -864,12 +891,12 @@ body.discussion { a { display: block; - padding: 0 20px; + padding: 0 $baseline; border-top: 1px solid #5f5f5f; - font-size: 14px; + font-size: 12px; font-weight: 700; line-height: 22px; - color: #fff; + color: $white; @include clearfix; @include transition(none); @@ -886,7 +913,7 @@ body.discussion { float: left; width: 80%; margin: 13px 0; - color: #fff; + color: $white; } .unread { @@ -916,7 +943,7 @@ body.discussion { } .browse-topic-drop-search { - padding: 10px; + padding: $baseline/2; } .browse-topic-drop-search-input { @@ -927,7 +954,7 @@ body.discussion { border-radius: 30px; border: 1px solid #333; box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset; - background: -webkit-linear-gradient(top, #eee, #fff); + background: -webkit-linear-gradient(top, #eee, $white); font-size: 11px; line-height: 16px; color: #333; @@ -995,7 +1022,7 @@ body.discussion { .sort-label { display: block; float: left; - margin: 0 10px; + margin: 0 $baseline/2; } li { @@ -1019,7 +1046,7 @@ body.discussion { &.active { @include linear-gradient(top, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0)); background-color: #999; - color: #fff; + color: $white; text-shadow: 0 -1px 0 rgba(0, 0, 0, .3); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 1px rgba(0, 0, 0, .2) inset; } @@ -1027,7 +1054,7 @@ body.discussion { } .group-filter-label { width: 40px; - margin-left:10px; + margin-left: $baseline/2; } .group-filter-select { @@ -1042,7 +1069,7 @@ body.discussion { .post-list-wrapper { overflow-y: scroll; overflow-x: hidden; - border-right: 1px solid transparent; + //border-right: 1px solid transparent; } .post-list { @@ -1075,11 +1102,11 @@ body.discussion { float: left; clear: both; width: 100%; - padding: 0 10px 0 18px; + padding: 0 $baseline/2 0 18px; margin-bottom: 1px; margin-right: -1px; @include linear-gradient(top, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0)); - background-color: #fff; + background-color: $white; @include clearfix; &:hover { @@ -1120,7 +1147,7 @@ body.discussion { display: block; float: left; width: 70%; - margin: 8px 0 10px; + margin: 8px 0 $baseline/2; font-size: 13px; font-weight: 700; line-height: 1.4; @@ -1176,7 +1203,7 @@ body.discussion { .votes-count, .comments-count { @include linear-gradient(top, #3994c7, #4da7d3); - color: #fff; + color: $white; &:after { background-position: 0 0; @@ -1238,9 +1265,6 @@ body.discussion { } } - - - .bottom-post-status { padding: 30px; font-size: 20px; @@ -1249,9 +1273,6 @@ body.discussion { text-align: center; } - - - .discussion-column { float: right; @include box-sizing(border-box); @@ -1260,7 +1281,7 @@ body.discussion { min-height: 500px; border: 1px solid #aaa; border-radius: 3px; - background: #fff; + background: $white; box-shadow: 0 1px 2px rgba(0, 0, 0, .05); &.sidebar-fixed { @@ -1268,24 +1289,167 @@ body.discussion { } } - .blank-slate h1 { - margin-top: 195px; - text-align: center; - color: #ccc; + .blank-slate { + + section { + border-bottom: 1px solid #ccc; + } + + .label { + display: block; + font-size: 12px; + } + + .label-settings { + padding-top: $baseline; + padding-bottom: $baseline/2; + } + + .home-header { + margin: 0; + } + + .home-title { + font-size: 18px; + color: $black; + margin-bottom: 5px; + } + .home-description { + font-size: 12px; + line-height: 1; + margin-bottom: $baseline/2; + } + .home-stats { + padding: $baseline 0; + + .label-area { + display: inline-block; + min-width: $baseline*5; + width: 25%; + vertical-align: middle; + + .profile-link { + font-weight: 700; + } + } + + .stats-grouping { + display: inline-block; + width: 70%; + padding-left: $baseline; + + .profile-stat { + display: inline-block; + width: 32.5%; + vertical-align: middle; + font-size: 12px; + + .count { + display: inline-block; + font-size: 28px; + padding: 0 $baseline/2; + vertical-align: middle; + } + + .profile-stat-label{ + vertical-align: middle; + } + } + } + } + + .home-helpgrid { + border-bottom: none; + border-radius: 3px; + border: 1px solid #b2b2b2; + box-shadow: 0 1px 3px rgba(0, 0, 0, .15); + } + } + + .helpgrid-row { + border-bottom: 1px solid #b2b2b2; + + .row-title { + padding: 30px $baseline; + background-color: #dedede; + font-size: 12px; + } + + .row-item-full, .row-item { + font-size: 12px; + padding: 0px $baseline/2; + width: 26%; + vertical-align: middle; + + .icon { + padding: 0 $baseline/2; + font-size: 24px; + vertical-align: middle; + display: table-cell; + } + + .icon-stack i { + padding: 0 $baseline/2; + } + + .row-description { + vertical-align: middle; + display: table-cell; + } + } + + .row-item-full { + + .email-setting { + display: inline-block; + text-align: center; + vertical-align: middle; + margin-left: $baseline/2; + } + + .icon { + display: inline-block; + } + + .email-setting:checked ~ .icon { + color: $green; + } + + .row-description { + display: inline-block; + width:80%; + } + } + } + + .helpgrid-row-navigation { + .icon-reorder {color: $light-gray;} + .icon-search {color: $light-gray;} + .icon-sort {color: $light-gray;} + } + + .helpgrid-row-participation { + .icon-plus {color: $green;} + .icon-flag {color: $pink;} + .icon-star {color: $blue;} + } + + .helpgrid-row-notification { + .icon-sign-blank {color: $green;} + .icon-envelope {color: $light-gray;} } - .blank-slate, .discussion-article { position: relative; - padding: 40px; - min-height: 468px; + padding: $baseline*2; + min-height: 468px; a { word-wrap: break-word; } h1 { - margin-bottom: 10px; + margin-bottom: $baseline/2; font-size: 28px; font-weight: 700; letter-spacing: 0; @@ -1309,13 +1473,13 @@ body.discussion { } .post-context{ - margin-top: 20px; + margin-top: $baseline; font-size: 12px; color: #888; } p + p { - margin-top: 20px; + margin-top: $baseline; } .dogear { @@ -1338,13 +1502,13 @@ body.discussion { } .discussion-post { - padding: 10px 20px; + padding: $baseline/2 $baseline; > header .vote-btn { position: relative; z-index: 100; margin-top: 5px; - margin-left: 40px; + margin-left: $baseline*2; } @@ -1376,20 +1540,20 @@ body.discussion { .discussion-post header, .responses li header { - margin-bottom: 20px; + margin-bottom: $baseline; } .responses { list-style: none; - margin-top: 40px; + margin-top: $baseline; padding: 0; > li { position: relative; margin: 0 -10px 30px; - padding: 26px 30px 20px; + padding: 26px 30px $baseline; border-radius: 3px; border: 1px solid #b2b2b2; box-shadow: 0 1px 3px rgba(0, 0, 0, .15); @@ -1417,7 +1581,7 @@ body.discussion { background: #009fe2; font-size: 9px; font-weight: 700; - color: #fff; + color: $white; text-transform: uppercase; } @@ -1433,7 +1597,7 @@ body.discussion { background: #449944; font-size: 9px; font-weight: 700; - color: #fff; + color: $white; text-transform: uppercase; } @@ -1461,7 +1625,7 @@ body.discussion { padding: 0 8px; border-radius: 5px; border: 1px solid #b2b2b2; - @include linear-gradient(top, #fff 35%, #ebebeb); + @include linear-gradient(top, $white 35%, #ebebeb); box-shadow: 0 1px 1px rgba(0, 0, 0, .15); font-size: 12px; font-weight: 700; @@ -1483,7 +1647,7 @@ body.discussion { &.is-cast { border-color: #379a42; @include linear-gradient(top, #50cc5e, #3db84b); - color: #fff; + color: $white; text-shadow: 0 1px 0 rgba(0, 0, 0, .3); box-shadow: 0 1px 0 rgba(255, 255, 255, .4) inset, 0 1px 2px rgba(0, 0, 0, .2); @@ -1500,10 +1664,10 @@ body.discussion { float: right; width: 27px; height: 27px; - margin-right: 10px; + margin-right: $baseline/2; border-radius: 27px; border: 1px solid #a0a0a0; - @include linear-gradient(top, #fff 35%, #ebebeb); + @include linear-gradient(top, $white 35%, #ebebeb); box-shadow: 0 1px 1px rgba(0, 0, 0, .1); .check-icon { @@ -1528,13 +1692,13 @@ body.discussion { blockquote { background: #f6f6f6; border-radius: 3px; - padding: 5px 10px; + padding: 5px $baseline/2; font-size: 14px; } .comments { list-style: none; - margin-top: 20px; + margin-top: $baseline; padding: 0; border-top: 1px solid #ddd; @@ -1546,7 +1710,7 @@ body.discussion { blockquote { background: #e6e6e6; border-radius: 3px; - padding: 5px 10px; + padding: 5px $baseline/2; font-size: 14px; } @@ -1555,8 +1719,8 @@ body.discussion { @include clearfix; .comment-form-input { - padding: 5px 10px; - background-color: #fff; + padding: 5px $baseline/2; + background-color: $white; font-size: 14px; } @@ -1577,7 +1741,7 @@ body.discussion { .response-body { font-size: 13px; - padding: 10px 20px; + padding: $baseline/2 $baseline; p + p { margin-top: 12px; @@ -1585,7 +1749,7 @@ body.discussion { } .posted-details { - margin: 0 20px 10px; + margin: 0 $baseline $baseline/2; font-size: 11px; } @@ -1615,7 +1779,7 @@ body.discussion { } .comment-form { - padding: 8px 20px; + padding: 8px $baseline; .wmd-input { @include transition(all .2s linear 0s); @@ -1633,7 +1797,7 @@ body.discussion { .comment-form-input { width: 100%; height: 31px; - padding: 0 10px; + padding: 0 $baseline/2; @include box-sizing(border-box); border: 1px solid #b2b2b2; border-radius: 3px; @@ -1647,7 +1811,7 @@ body.discussion { .moderator-actions { margin: 0; - margin-top: 20px; + margin-top: $baseline; padding: 0; @include clearfix; @@ -1663,7 +1827,7 @@ body.discussion { padding: 0 12px; border-radius: 3px; border: 1px solid #b2b2b2; - @include linear-gradient(top, #fff 35%, #ebebeb); + @include linear-gradient(top, $white 35%, #ebebeb); font-size: 13px; line-height: 24px; color: #737373; @@ -1698,20 +1862,20 @@ body.discussion { } .new-post-form { - margin-top: 20px; + margin-top: $baseline; @include clearfix; } .new-post-form .submit { @include blue-button; float: left; - margin-top: 10px; + margin-top: $baseline/2; padding-bottom: 2px; } .new-post-form .options { float: right; - margin-top: 20px; + margin-top: $baseline; font-size: 14px; label { @@ -1724,7 +1888,7 @@ body.discussion { .discussion-reply-new { - padding: 20px; + padding: $baseline; @include clearfix; @include transition(opacity .2s linear 0s); @@ -1747,7 +1911,7 @@ body.discussion { } .reply-post-control { - margin-top: 20px; + margin-top: $baseline; } .discussion-submit-post { @@ -1774,8 +1938,8 @@ body.discussion { .discussion-module { @extend .discussion-body; position: relative; - margin: 20px 0; - padding: 20px; + margin: $baseline 0; + padding: $baseline; background: #f6f6f6 !important; border-radius: 3px; @@ -1786,11 +1950,11 @@ body.discussion { } .responses { - margin-top: 40px; + margin-top: $baseline*2; > li { - margin: 0 20px 20px !important; - padding: 26px 30px 20px !important; + margin: 0 $baseline $baseline !important; + padding: 26px 30px $baseline !important; } } @@ -1831,7 +1995,7 @@ body.discussion { margin-top: 30px; .threads { - margin-top: 20px; + margin-top: $baseline; } /* Course content p has a default margin-bottom of 1.416em, this is just to reset that */ @@ -1844,7 +2008,7 @@ body.discussion { } &.expanded { - padding: 20px 0; + padding: $baseline 0; .dogear{ display: block; @@ -1864,14 +2028,14 @@ body.discussion { .discussion-article { border: 1px solid #ddd; border-bottom-width: 0; - background: #fff; + background: $white; min-height: 0; - padding: 10px 10px 15px 10px; + padding: $baseline/2 $baseline/2 15px $baseline/2; box-shadow: 0 1px 0 #ddd; @include transition(all .2s linear 0s); .discussion-post { - padding: 12px 20px 0 20px; + padding: 12px $baseline 0 $baseline; @include clearfix; .inline-comment-count { @@ -1922,7 +2086,7 @@ body.discussion { } .post-tools { - margin-left: 20px; + margin-left: $baseline; margin-top: 5px; a { @@ -1945,7 +2109,7 @@ body.discussion { } .responses { - margin-top: 10px; + margin-top: $baseline/2; header { padding-bottom: 0; @@ -1982,7 +2146,7 @@ body.discussion { .new-post-article { display: none; - margin-top: 20px; + margin-top: $baseline; .inner-wrapper { max-width: 1180px; @@ -1992,17 +2156,17 @@ body.discussion { .new-post-form { width: 100%; - margin-bottom: 20px; + margin-bottom: $baseline; padding: 30px; border-radius: 3px; background: rgba(0, 0, 0, .55); - color: #fff; + color: $white; box-shadow: none; @include clearfix; @include box-sizing(border-box); .form-row { - margin-bottom: 20px; + margin-bottom: $baseline; } .new-post-body .wmd-input { @@ -2011,11 +2175,11 @@ body.discussion { width: 100%; height: 200px; z-index: 1; - padding: 10px; + padding: $baseline/2; @include box-sizing(border-box); border: 1px solid #333; border-radius: 3px 3px 0 0; - background: #fff; + background: $white; font-family: 'Monaco', monospace; font-size: 13px; line-height: 1.6; @@ -2028,7 +2192,7 @@ body.discussion { width: 100%; //height: 50px; margin-top: -1px; - padding: 25px 20px 10px 20px; + padding: 25px $baseline $baseline/2 $baseline; @include box-sizing(border-box); border: 1px solid #333; border-radius: 0 0 3px 3px; @@ -2050,7 +2214,7 @@ body.discussion { .new-post-tags { width: 100%; height: 40px; - padding: 0 10px; + padding: 0 $baseline/2; @include box-sizing(border-box); border-radius: 3px; border: 1px solid #333; @@ -2065,11 +2229,11 @@ body.discussion { } .tagsinput { - padding: 10px; + padding: $baseline/2; @include box-sizing(border-box); border: 1px solid #333; border-radius: 3px; - background: #fff; + background: $white; font-family: 'Monaco', monospace; font-size: 13px; line-height: 1.6; @@ -2084,7 +2248,7 @@ body.discussion { @include blue-button; float: left; height: 37px; - margin-top: 10px; + margin-top: $baseline/2; padding-bottom: 2px; border-color: #333; @@ -2096,7 +2260,7 @@ body.discussion { .new-post-cancel { @include white-button; float: left; - margin: 10px 0 0 15px; + margin: $baseline/2 0 0 15px; border-color: #444; } @@ -2107,18 +2271,18 @@ body.discussion { display: inline; margin-left: 8px; font-size: 15px; - color: #fff; + color: $white; text-shadow: none; } } } .thread-tags { - margin: 20px 0; + margin: $baseline 0; } .thread-tag { - padding: 3px 10px 6px; + padding: 3px $baseline/2 6px; margin-right: 5px; border-radius: 3px; color: #333; @@ -2129,7 +2293,7 @@ body.discussion { .thread-title { display: block; - margin-bottom: 20px; + margin-bottom: $baseline; font-size: 21px; color: #333; font-weight: 700; @@ -2149,7 +2313,10 @@ body.discussion { width: 16px; height: 17px; margin: 8px 7px 0 0; - background: url(../images/new-post-icon.png) no-repeat; + font-size: 16px; + padding-right: $baseline/2; + vertical-align: middle; + color: $white; } .moderator-actions { @@ -2216,7 +2383,7 @@ body.discussion { .wmd-preview { position: relative; font-family: $sans-serif; - padding: 25px 20px 10px 20px; + padding: 25px $baseline $baseline/2 $baseline; margin-bottom: 5px; @include box-sizing(border-box); border: 1px solid #c8c8c8; @@ -2245,7 +2412,7 @@ body.discussion { margin-left: 5px; margin-right: 5px; margin-bottom: 5px; - margin-top: 10px; + margin-top: $baseline/2; padding: 0px; height: 20px; overflow: hidden; @@ -2301,11 +2468,11 @@ body.discussion { .wmd-prompt-dialog { @extend .modal; - background: #fff; + background: $white; } .wmd-prompt-dialog { - padding: 20px; + padding: $baseline; > div { font-size: 0.8em; @@ -2361,25 +2528,25 @@ body.discussion { } .edit-post-form { width: 100%; - margin-bottom: 20px; + margin-bottom: $baseline; @include clearfix; @include box-sizing(border-box); .form-row { - margin-top: 20px; + margin-top: $baseline; } .post-cancel { @include white-button; float: left; - margin: 10px 0 0 15px; + margin: $baseline/2 0 0 15px; } .post-update { @include blue-button; float: left; height: 37px; - margin-top: 10px; + margin-top: $baseline/2; padding-bottom: 2px; &:hover { @@ -2390,7 +2557,7 @@ body.discussion { .edit-post-title, .edit-post-tags { width: 100%; height: 40px; - padding: 0 10px; + padding: 0 $baseline/2; @include box-sizing(border-box); border-radius: 3px; border: 1px solid #aaa; @@ -2401,11 +2568,11 @@ body.discussion { } .tagsinput { - padding: 10px; + padding: $baseline/2; @include box-sizing(border-box); border: 1px solid #aaa; border-radius: 3px; - background: #fff; + background: $white; font-family: 'Monaco', monospace; font-size: 13px; line-height: 1.6; @@ -2418,11 +2585,11 @@ body.discussion { } .thread-tags { - margin: 20px 0; + margin: $baseline 0; } .thread-tag { - padding: 3px 10px 6px; + padding: 3px $baseline/2 6px; margin-right: 5px; border-radius: 3px; color: #333; @@ -2440,7 +2607,7 @@ body.discussion { font-size: 12px; color:#000; font-style: italic; - background-color:#fff; + background-color: $white; } .discussion-pin { @@ -2448,8 +2615,8 @@ body.discussion { float:right; padding-right: 5px; font-style: italic; - cursor:pointer; - margin-right: 10px; + cursor: pointer; + margin-right: $baseline/2; opacity: 0.8; span { @@ -2481,7 +2648,7 @@ body.discussion { width: 10px; height: 14px; padding-right: 3px; - background: transparent url('../images/unpinned.png') no-repeat 0 0; + color: #aeaeae; } .pinned .icon { @@ -2491,7 +2658,7 @@ body.discussion { width: 10px; height: 14px; padding-right: 3px; - background: transparent url('../images/pinned.png') no-repeat 0 0; + color: $pink; } .pinned span { @@ -2504,8 +2671,6 @@ body.discussion { .notpinned span { color: #888; font-style: italic; - //cursor change is here since pins are read-only for inline discussions. - cursor: default; } .pinned-false @@ -2514,40 +2679,39 @@ display:none; } .discussion-flag-abuse { - font-size: 12px; - float:right; - padding-right: 5px; - font-style: italic; - cursor:pointer; - opacity: 0.8; + font-size: 12px; + float:right; + padding-right: 5px; + font-style: italic; + cursor:pointer; + opacity: 0.8; - &:hover { - @include transition(opacity .2s linear 0s); - opacity: 1.0; - } - - } - -.notflagged .icon -{ + &:hover { + @include transition(opacity .2s linear 0s); + opacity: 1.0; + } +} + +.notflagged .icon { display: block; + color: #aeaeae; float: left; margin: 3px; width: 10px; height: 14px; padding-right: 3px; - background: transparent url('../images/notflagged.png') no-repeat 0 0; } .flagged .icon { display: block; + color: #aeaeae; float: left; margin: 3px; width: 10px; height: 14px; padding-right: 3px; - background: transparent url('../images/flagged.png') no-repeat 0 0; + color: $pink; } .flagged span { diff --git a/lms/static/sass/application.scss.mako b/lms/static/sass/application.scss.mako index d30c0c16a1..fb7b4b1db2 100644 --- a/lms/static/sass/application.scss.mako +++ b/lms/static/sass/application.scss.mako @@ -1,7 +1,20 @@ -@import 'bourbon/bourbon'; +// lms - css application architecture +// ==================== + +// libs and resets *do not edit* +@import 'bourbon/bourbon'; // lib - bourbon + +// VENDOR + REBASE *referenced/used vendor presentation and reset* +// ==================== @import 'base/reset'; -@import 'base/font_face'; +@import 'vendor/font-awesome'; + + +// BASE *default edX offerings* +// ==================== +// base - utilities + @import 'base/mixins'; @import 'base/variables'; @@ -19,10 +32,16 @@ % endif @import 'base/base'; -@import 'base/extends'; -@import 'base/animations'; -// Multicourse styles +// base - assets +@import 'base/font_face'; +@import 'base/extends'; +@import 'base/animations'; + +// base - starter +@import 'base/base'; + +// shared - course @import 'shared/forms'; @import 'shared/footer'; @import 'shared/header'; @@ -32,6 +51,7 @@ @import 'shared/activation_messages'; @import 'shared/unsubscribe'; +// shared - platform @import 'multicourse/home'; @import 'multicourse/dashboard'; @import 'multicourse/account'; @@ -47,7 +67,8 @@ @import 'multicourse/help'; @import 'multicourse/edge'; +// applications @import 'discussion'; @import 'news'; -@import 'shame'; +@import 'shame'; // shame file - used for any bad-form/orphaned scss that knowingly violate edX FED architecture/standards (see - http://csswizardry.com/2013/04/shame-css/) diff --git a/lms/static/sass/base/_variables.scss b/lms/static/sass/base/_variables.scss index 48c62bbb4c..997d0e7f76 100644 --- a/lms/static/sass/base/_variables.scss +++ b/lms/static/sass/base/_variables.scss @@ -34,6 +34,7 @@ $dark-gray: rgb(51, 51, 51); $border-color: rgb(200, 200, 200); $sidebar-color: rgb(246, 246, 246); $outer-border-color: rgb(170, 170, 170); +$green: rgb(37, 184, 90); // old variables $light-gray: #ddd; @@ -195,4 +196,4 @@ $homepage-bg-image: '../images/homepage-bg.jpg'; $login-banner-image: url(../images/bg-banner-login.png); $register-banner-image: url(../images/bg-banner-register.png); -$video-thumb-url: '../images/courses/video-thumb.jpg'; +$video-thumb-url: '../images/courses/video-thumb.jpg'; \ No newline at end of file diff --git a/lms/static/sass/course/_discussions-inline.scss b/lms/static/sass/course/_discussions-inline.scss new file mode 100644 index 0000000000..bd4142c2d2 --- /dev/null +++ b/lms/static/sass/course/_discussions-inline.scss @@ -0,0 +1,537 @@ +.discussion-module { + @extend .discussion-body; + margin: 20px 0; + padding: 20px 20px 28px 20px; + background: #f6f6f6 !important; + border-radius: 3px; + + .responses { + margin-top: 40px; + + > li { + margin: 0 20px 30px; + } + } + + .discussion-show { + display: block; + width: 200px; + margin: auto; + font-size: 14px; + text-align: center; + + &.shown { + .show-hide-discussion-icon { + background-position: 0 0; + } + } + + .show-hide-discussion-icon { + display: inline-block; + position: relative; + top: 5px; + margin-right: 6px; + width: 21px; + height: 19px; + background: url(../images/show-hide-discussion-icon.png) no-repeat; + background-position: -21px 0; + } + } + + .new-post-btn { + display: inline-block; + } + + section.discussion { + margin-top: 20px; + + .threads { + margin-top: 20px; + } + + /* Course content p has a default margin-bottom of 1.416em, this is just to reset that */ + .discussion-thread { + padding: 0; + @include transition(all .25s); + + .dogear, + .vote-btn { + display: none; + } + + &.expanded { + padding: 20px 0; + + .dogear, + .vote-btn { + display: block; + } + + .discussion-article { + border: 1px solid #b2b2b2; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15); + border-radius: 3px; + } + } + + p { + margin-bottom: 0em; + } + + .discussion-article { + border: 1px solid #ddd; + border-bottom-width: 0; + background: #fff; + min-height: 0; + padding: 10px 10px 15px 10px; + box-shadow: 0 1px 0 #ddd; + @include transition(all .2s); + + .discussion-post { + padding: 12px 20px 0 20px; + @include clearfix; + + header { + padding-bottom: 0; + margin-bottom: 15px; + + h3 { + font-size: 19px; + font-weight: 700; + margin-bottom: 0px; + } + + h4 { + font-size: 16px; + } + } + + .post-body { + font-size: 14px; + clear: both; + } + } + + .post-tools { + margin-left: 20px; + + a { + display: block; + font-size: 12px; + line-height: 30px; + + &.expand-post:before { + content: '▾ '; + } + + &.collapse-post:before { + content: '▴ '; + } + + &.collapse-post { + display: none; + } + } + } + + .responses { + margin-top: 10px; + + header { + padding-bottom: 0em; + margin-bottom: 5px; + + .posted-by { + font-size: 0.8em; + } + } + .response-body { + margin-bottom: 0.2em; + font-size: 14px; + } + } + + .discussion-reply-new { + .wmd-input { + height: 120px; + } + } + + // Content that is hidden by default in the inline view + .post-extended-content{ + display: none; + } + + + } + } + } + + .new-post-article { + display: none; + margin-top: 20px; + + .inner-wrapper { + max-width: 1180px; + min-width: 760px; + margin: auto; + } + + .new-post-form { + width: 100%; + margin-bottom: 20px; + padding: 30px; + border-radius: 3px; + background: rgba(0, 0, 0, .55); + color: #fff; + box-shadow: none; + @include clearfix; + @include box-sizing(border-box); + + .form-row { + margin-bottom: 20px; + } + + .new-post-body .wmd-input { + @include discussion-wmd-input; + position: relative; + width: 100%; + height: 200px; + z-index: 1; + padding: 10px; + box-sizing: border-box; + border: 1px solid #333; + border-radius: 3px 3px 0 0; + background: #fff; + font-family: 'Monaco', monospace; + font-size: 13px; + line-height: 1.6; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset; + } + + .new-post-body .wmd-preview { + @include discussion-wmd-preview; + position: relative; + width: 100%; + //height: 50px; + margin-top: -1px; + padding: 25px 20px 10px 20px; + box-sizing: border-box; + border: 1px solid #333; + border-radius: 0 0 3px 3px; + background: #e6e6e6; + color: #333; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset; + } + + .new-post-preview-label { + position: absolute; + top: 4px; + left: 4px; + font-size: 11px; + color: #aaa; + text-transform: uppercase; + } + + .new-post-title, + .new-post-tags { + width: 100%; + height: 40px; + padding: 0 10px; + box-sizing: border-box; + border-radius: 3px; + border: 1px solid #333; + font-size: 16px; + font-family: 'Open Sans', sans-serif; + color: #333; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset; + } + + .new-post-title { + font-weight: 700; + } + + .tagsinput { + padding: 10px; + box-sizing: border-box; + border: 1px solid #333; + border-radius: 3px; + background: #fff; + font-family: 'Monaco', monospace; + font-size: 13px; + line-height: 1.6; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset; + + span.tag { + margin-bottom: 0; + } + } + + .submit { + @include blue-button; + float: left; + height: 37px; + margin-top: 10px; + padding-bottom: 2px; + border-color: #333; + + &:hover { + border-color: #222; + } + } + + .new-post-cancel { + @include white-button; + float: left; + margin: 10px 0 0 15px; + border-color: #444; + } + + .options { + margin-top: 5px; + + label { + display: inline; + margin-left: 8px; + font-size: 15px; + color: #fff; + text-shadow: none; + } + } + } + + .thread-tags { + margin-top: 20px; + } + + .thread-tag { + padding: 3px 10px 6px; + border-radius: 3px; + color: #333; + background: #c5eeff; + border: 1px solid #90c4d7; + font-size: 13px; + } + + .thread-title { + display: block; + margin-bottom: 20px; + font-size: 21px; + color: #333; + font-weight: 700; + } + } + + .new-post-btn { + @include blue-button; + display: inline-block; + font-size: 13px; + margin-right: 4px; + } + + .new-post-icon { + display: block; + float: left; + width: 16px; + height: 17px; + margin: 8px 7px 0 0; + font-size: 16px; + vertical-align: middle; + color: $white; + } + + .moderator-actions { + padding-left: 0 !important; + } + + section.pagination { + margin-top: 30px; + + nav.discussion-paginator { + float: right; + + ol { + li { + list-style: none; + display: inline-block; + padding-right: 0.5em; + a { + @include white-button; + } + } + + li.current-page{ + height: 35px; + padding: 0 15px; + border: 1px solid #ccc; + border-radius: 3px; + font-size: 13px; + font-weight: 700; + line-height: 32px; + color: #333; + text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); + } + } + } + } + + .new-post-body { + .wmd-panel { + width: 100%; + min-width: 500px; + } + + .wmd-button-bar { + width: 100%; + } + + .wmd-input { + height: 150px; + width: 100%; + background-color: #e9e9e9; + border: 1px solid #c8c8c8; + font-family: Monaco, 'Lucida Console', monospace; + font-style: normal; + font-size: 0.8em; + line-height: 1.6em; + @include border-radius(3px 3px 0 0); + + &::-webkit-input-placeholder { + color: #888; + } + } + + .wmd-preview { + position: relative; + font-family: $sans-serif; + padding: 25px 20px 10px 20px; + margin-bottom: 5px; + box-sizing: border-box; + border: 1px solid #c8c8c8; + border-top-width: 0; + @include border-radius(0 0 3px 3px); + overflow: hidden; + @include transition(all, .2s, easeOut); + + &:before { + content: 'PREVIEW'; + position: absolute; + top: 3px; + left: 5px; + font-size: 11px; + color: #bbb; + } + + p { + font-family: $sans-serif; + } + background-color: #fafafa; + } + + .wmd-button-row { + position: relative; + margin-left: 5px; + margin-right: 5px; + margin-bottom: 5px; + margin-top: 10px; + padding: 0px; + height: 20px; + overflow: hidden; + @include transition(all, .2s, easeOut); + } + + .wmd-spacer { + width: 1px; + height: 20px; + margin-left: 14px; + + position: absolute; + background-color: Silver; + display: inline-block; + list-style: none; + } + + .wmd-button { + width: 20px; + height: 20px; + padding-left: 2px; + padding-right: 3px; + position: absolute; + display: inline-block; + list-style: none; + cursor: pointer; + background: none; + } + + .wmd-button > span { + display: inline-block; + background-image: url(../images/new-post-icons-full.png); + background-repeat: no-repeat; + background-position: 0px 0px; + width: 20px; + height: 20px; + } + + .wmd-spacer1 { + left: 50px; + } + .wmd-spacer2 { + left: 175px; + } + + .wmd-spacer3 { + left: 300px; + } + + .wmd-prompt-background { + background-color: Black; + } + + .wmd-prompt-dialog { + @extend .modal; + background: #fff; + } + + .wmd-prompt-dialog { + padding: 20px; + + > div { + font-size: 0.8em; + font-family: arial, helvetica, sans-serif; + } + + b { + font-size: 16px; + } + + > form > input[type="text"] { + border-radius: 3px; + color: #333; + } + + > form > input[type="button"] { + border: 1px solid #888; + font-family: $sans-serif; + font-size: 14px; + } + + > form > input[type="file"] { + margin-bottom: 18px; + } + } + } + + .wmd-button-row { + // this is being hidden now because the inline styles to position the icons are not being written + display: none; + position: relative; + height: 12px; + } + + .wmd-button { + span { + background-image: url("/static/images/wmd-buttons.png"); + display: inline-block; + } + } +} \ No newline at end of file diff --git a/lms/static/sass/vendor/_font-awesome.scss b/lms/static/sass/vendor/_font-awesome.scss new file mode 100644 index 0000000000..035ca8c750 --- /dev/null +++ b/lms/static/sass/vendor/_font-awesome.scss @@ -0,0 +1,1268 @@ +/*! + * Font Awesome 3.1.0 + * the iconic font designed for Bootstrap + * ------------------------------------------------------- + * The full suite of pictographic icons, examples, and documentation + * can be found at: http://fontawesome.io + * + * License + * ------------------------------------------------------- + * - The Font Awesome font is licensed under the SIL Open Font License v1.1 - + * http://scripts.sil.org/OFL + * - Font Awesome CSS, LESS, and SASS files are licensed under the MIT License - + * http://opensource.org/licenses/mit-license.html + * - Font Awesome documentation licensed under CC BY 3.0 License - + * http://creativecommons.org/licenses/by/3.0/ + * - Attribution is no longer required in Font Awesome 3.0, but much appreciated: + * "Font Awesome by Dave Gandy - http://fontawesome.io" + + * Contact + * ------------------------------------------------------- + * Email: dave@fontawesome.io + * Twitter: http://twitter.com/fortaweso_me + * Work: Lead Product Designer @ http://kyruus.com + */ +/* FONT PATH + * -------------------------- */ +@font-face { + font-family: 'FontAwesome'; + src: url('../fonts/vendor/fontawesome-webfont.eot?v=3.1.0'); + src: url('../fonts/vendor/fontawesome-webfont.eot?#iefix&v=3.1.0') format('embedded-opentype'), url('../fonts/vendor/fontawesome-webfont.woff?v=3.1.0') format('woff'), url('../fonts/vendor/fontawesome-webfont.ttf?v=3.1.0') format('truetype'), url('../fonts/vendor/fontawesome-webfont.svg#fontawesomeregular?v=3.1.0') format('svg'); + font-weight: normal; + font-style: normal; +} +/* FONT AWESOME CORE + * -------------------------- */ +[class^="icon-"], +[class*=" icon-"] { + font-family: FontAwesome; + font-weight: normal; + font-style: normal; + text-decoration: inherit; + -webkit-font-smoothing: antialiased; + *margin-right: .3em; +} +[class^="icon-"]:before, +[class*=" icon-"]:before { + text-decoration: inherit; + display: inline-block; + speak: none; +} +/* makes the font 33% larger relative to the icon container */ +.icon-large:before { + vertical-align: -10%; + font-size: 1.3333333333333333em; +} +/* makes sure icons active on rollover in links */ +a [class^="icon-"], +a [class*=" icon-"], +a [class^="icon-"]:before, +a [class*=" icon-"]:before { + display: inline; +} +/* increased font size for icon-large */ +[class^="icon-"].icon-fixed-width, +[class*=" icon-"].icon-fixed-width { + display: inline-block; + width: 1.2857142857142858em; + text-align: center; +} +[class^="icon-"].icon-fixed-width.icon-large, +[class*=" icon-"].icon-fixed-width.icon-large { + width: 1.5714285714285714em; +} +ul.icons-ul { + list-style-type: none; + text-indent: -0.7142857142857143em; + margin-left: 2.142857142857143em; +} +ul.icons-ul > li .icon-li { + width: 0.7142857142857143em; + display: inline-block; + text-align: center; +} +[class^="icon-"].hide, +[class*=" icon-"].hide { + display: none; +} +.icon-muted { + color: #eeeeee; +} +.icon-light { + color: #ffffff; +} +.icon-dark { + color: #333333; +} +.icon-border { + border: solid 1px #eeeeee; + padding: .2em .25em .15em; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; +} +.icon-2x { + font-size: 2em; +} +.icon-2x.icon-border { + border-width: 2px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; +} +.icon-3x { + font-size: 3em; +} +.icon-3x.icon-border { + border-width: 3px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} +.icon-4x { + font-size: 4em; +} +.icon-4x.icon-border { + border-width: 4px; + -webkit-border-radius: 6px; + -moz-border-radius: 6px; + border-radius: 6px; +} +.icon-5x { + font-size: 5em; +} +.icon-5x.icon-border { + border-width: 5px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.pull-right { + float: right; +} +.pull-left { + float: left; +} +[class^="icon-"].pull-left, +[class*=" icon-"].pull-left { + margin-right: .3em; +} +[class^="icon-"].pull-right, +[class*=" icon-"].pull-right { + margin-left: .3em; +} +/* BOOTSTRAP SPECIFIC CLASSES + * -------------------------- */ +/* Bootstrap 2.0 sprites.less reset */ +[class^="icon-"], +[class*=" icon-"] { + display: inline; + width: auto; + height: auto; + line-height: normal; + vertical-align: baseline; + background-image: none; + background-position: 0% 0%; + background-repeat: repeat; + margin-top: 0; +} +/* more sprites.less reset */ +.icon-white, +.nav-pills > .active > a > [class^="icon-"], +.nav-pills > .active > a > [class*=" icon-"], +.nav-list > .active > a > [class^="icon-"], +.nav-list > .active > a > [class*=" icon-"], +.navbar-inverse .nav > .active > a > [class^="icon-"], +.navbar-inverse .nav > .active > a > [class*=" icon-"], +.dropdown-menu > li > a:hover > [class^="icon-"], +.dropdown-menu > li > a:hover > [class*=" icon-"], +.dropdown-menu > .active > a > [class^="icon-"], +.dropdown-menu > .active > a > [class*=" icon-"], +.dropdown-submenu:hover > a > [class^="icon-"], +.dropdown-submenu:hover > a > [class*=" icon-"] { + background-image: none; +} +/* keeps Bootstrap styles with and without icons the same */ +.btn [class^="icon-"].icon-large, +.nav [class^="icon-"].icon-large, +.btn [class*=" icon-"].icon-large, +.nav [class*=" icon-"].icon-large { + line-height: .9em; +} +.btn [class^="icon-"].icon-spin, +.nav [class^="icon-"].icon-spin, +.btn [class*=" icon-"].icon-spin, +.nav [class*=" icon-"].icon-spin { + display: inline-block; +} +.nav-tabs [class^="icon-"], +.nav-pills [class^="icon-"], +.nav-tabs [class*=" icon-"], +.nav-pills [class*=" icon-"], +.nav-tabs [class^="icon-"].icon-large, +.nav-pills [class^="icon-"].icon-large, +.nav-tabs [class*=" icon-"].icon-large, +.nav-pills [class*=" icon-"].icon-large { + line-height: .9em; +} +.btn [class^="icon-"].pull-left.icon-2x, +.btn [class*=" icon-"].pull-left.icon-2x, +.btn [class^="icon-"].pull-right.icon-2x, +.btn [class*=" icon-"].pull-right.icon-2x { + margin-top: .18em; +} +.btn [class^="icon-"].icon-spin.icon-large, +.btn [class*=" icon-"].icon-spin.icon-large { + line-height: .8em; +} +.btn.btn-small [class^="icon-"].pull-left.icon-2x, +.btn.btn-small [class*=" icon-"].pull-left.icon-2x, +.btn.btn-small [class^="icon-"].pull-right.icon-2x, +.btn.btn-small [class*=" icon-"].pull-right.icon-2x { + margin-top: .25em; +} +.btn.btn-large [class^="icon-"], +.btn.btn-large [class*=" icon-"] { + margin-top: 0; +} +.btn.btn-large [class^="icon-"].pull-left.icon-2x, +.btn.btn-large [class*=" icon-"].pull-left.icon-2x, +.btn.btn-large [class^="icon-"].pull-right.icon-2x, +.btn.btn-large [class*=" icon-"].pull-right.icon-2x { + margin-top: .05em; +} +.btn.btn-large [class^="icon-"].pull-left.icon-2x, +.btn.btn-large [class*=" icon-"].pull-left.icon-2x { + margin-right: .2em; +} +.btn.btn-large [class^="icon-"].pull-right.icon-2x, +.btn.btn-large [class*=" icon-"].pull-right.icon-2x { + margin-left: .2em; +} +/* EXTRAS + * -------------------------- */ +/* Stacked and layered icon */ +.icon-stack { + position: relative; + display: inline-block; + width: 2em; + height: 2em; + line-height: 2em; + vertical-align: -35%; +} +.icon-stack [class^="icon-"], +.icon-stack [class*=" icon-"] { + display: block; + text-align: center; + position: absolute; + width: 100%; + height: 100%; + font-size: 1em; + line-height: inherit; + *line-height: 2em; +} +.icon-stack .icon-stack-base { + font-size: 2em; + *line-height: 1em; +} +/* Animated rotating icon */ +.icon-spin { + display: inline-block; + -moz-animation: spin 2s infinite linear; + -o-animation: spin 2s infinite linear; + -webkit-animation: spin 2s infinite linear; + animation: spin 2s infinite linear; +} +@-moz-keyframes spin { + 0% { + -moz-transform: rotate(0deg); + } + 100% { + -moz-transform: rotate(359deg); + } +} +@-webkit-keyframes spin { + 0% { + -webkit-transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(359deg); + } +} +@-o-keyframes spin { + 0% { + -o-transform: rotate(0deg); + } + 100% { + -o-transform: rotate(359deg); + } +} +@-ms-keyframes spin { + 0% { + -ms-transform: rotate(0deg); + } + 100% { + -ms-transform: rotate(359deg); + } +} +@keyframes spin { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(359deg); + } +} +/* Icon rotations and mirroring */ +.icon-rotate-90:before { + -webkit-transform: rotate(90deg); + -moz-transform: rotate(90deg); + -ms-transform: rotate(90deg); + -o-transform: rotate(90deg); + transform: rotate(90deg); + filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); +} +.icon-rotate-180:before { + -webkit-transform: rotate(180deg); + -moz-transform: rotate(180deg); + -ms-transform: rotate(180deg); + -o-transform: rotate(180deg); + transform: rotate(180deg); + filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); +} +.icon-rotate-270:before { + -webkit-transform: rotate(270deg); + -moz-transform: rotate(270deg); + -ms-transform: rotate(270deg); + -o-transform: rotate(270deg); + transform: rotate(270deg); + filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); +} +.icon-flip-horizontal:before { + -webkit-transform: scale(-1, 1); + -moz-transform: scale(-1, 1); + -ms-transform: scale(-1, 1); + -o-transform: scale(-1, 1); + transform: scale(-1, 1); +} +.icon-flip-vertical:before { + -webkit-transform: scale(1, -1); + -moz-transform: scale(1, -1); + -ms-transform: scale(1, -1); + -o-transform: scale(1, -1); + transform: scale(1, -1); +} +/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen + readers do not read off random characters that represent icons */ +.icon-glass:before { + content: "\f000"; +} +.icon-music:before { + content: "\f001"; +} +.icon-search:before { + content: "\f002"; +} +.icon-envelope:before { + content: "\f003"; +} +.icon-heart:before { + content: "\f004"; +} +.icon-star:before { + content: "\f005"; +} +.icon-star-empty:before { + content: "\f006"; +} +.icon-user:before { + content: "\f007"; +} +.icon-film:before { + content: "\f008"; +} +.icon-th-large:before { + content: "\f009"; +} +.icon-th:before { + content: "\f00a"; +} +.icon-th-list:before { + content: "\f00b"; +} +.icon-ok:before { + content: "\f00c"; +} +.icon-remove:before { + content: "\f00d"; +} +.icon-zoom-in:before { + content: "\f00e"; +} +.icon-zoom-out:before { + content: "\f010"; +} +.icon-off:before { + content: "\f011"; +} +.icon-signal:before { + content: "\f012"; +} +.icon-cog:before { + content: "\f013"; +} +.icon-trash:before { + content: "\f014"; +} +.icon-home:before { + content: "\f015"; +} +.icon-file:before { + content: "\f016"; +} +.icon-time:before { + content: "\f017"; +} +.icon-road:before { + content: "\f018"; +} +.icon-download-alt:before { + content: "\f019"; +} +.icon-download:before { + content: "\f01a"; +} +.icon-upload:before { + content: "\f01b"; +} +.icon-inbox:before { + content: "\f01c"; +} +.icon-play-circle:before { + content: "\f01d"; +} +.icon-repeat:before, +.icon-rotate-right:before { + content: "\f01e"; +} +/* F020 doesn't work in Safari. all shifted one down */ +.icon-refresh:before { + content: "\f021"; +} +.icon-list-alt:before { + content: "\f022"; +} +.icon-lock:before { + content: "\f023"; +} +.icon-flag:before { + content: "\f024"; +} +.icon-headphones:before { + content: "\f025"; +} +.icon-volume-off:before { + content: "\f026"; +} +.icon-volume-down:before { + content: "\f027"; +} +.icon-volume-up:before { + content: "\f028"; +} +.icon-qrcode:before { + content: "\f029"; +} +.icon-barcode:before { + content: "\f02a"; +} +.icon-tag:before { + content: "\f02b"; +} +.icon-tags:before { + content: "\f02c"; +} +.icon-book:before { + content: "\f02d"; +} +.icon-bookmark:before { + content: "\f02e"; +} +.icon-print:before { + content: "\f02f"; +} +.icon-camera:before { + content: "\f030"; +} +.icon-font:before { + content: "\f031"; +} +.icon-bold:before { + content: "\f032"; +} +.icon-italic:before { + content: "\f033"; +} +.icon-text-height:before { + content: "\f034"; +} +.icon-text-width:before { + content: "\f035"; +} +.icon-align-left:before { + content: "\f036"; +} +.icon-align-center:before { + content: "\f037"; +} +.icon-align-right:before { + content: "\f038"; +} +.icon-align-justify:before { + content: "\f039"; +} +.icon-list:before { + content: "\f03a"; +} +.icon-indent-left:before { + content: "\f03b"; +} +.icon-indent-right:before { + content: "\f03c"; +} +.icon-facetime-video:before { + content: "\f03d"; +} +.icon-picture:before { + content: "\f03e"; +} +.icon-pencil:before { + content: "\f040"; +} +.icon-map-marker:before { + content: "\f041"; +} +.icon-adjust:before { + content: "\f042"; +} +.icon-tint:before { + content: "\f043"; +} +.icon-edit:before { + content: "\f044"; +} +.icon-share:before { + content: "\f045"; +} +.icon-check:before { + content: "\f046"; +} +.icon-move:before { + content: "\f047"; +} +.icon-step-backward:before { + content: "\f048"; +} +.icon-fast-backward:before { + content: "\f049"; +} +.icon-backward:before { + content: "\f04a"; +} +.icon-play:before { + content: "\f04b"; +} +.icon-pause:before { + content: "\f04c"; +} +.icon-stop:before { + content: "\f04d"; +} +.icon-forward:before { + content: "\f04e"; +} +.icon-fast-forward:before { + content: "\f050"; +} +.icon-step-forward:before { + content: "\f051"; +} +.icon-eject:before { + content: "\f052"; +} +.icon-chevron-left:before { + content: "\f053"; +} +.icon-chevron-right:before { + content: "\f054"; +} +.icon-plus-sign:before { + content: "\f055"; +} +.icon-minus-sign:before { + content: "\f056"; +} +.icon-remove-sign:before { + content: "\f057"; +} +.icon-ok-sign:before { + content: "\f058"; +} +.icon-question-sign:before { + content: "\f059"; +} +.icon-info-sign:before { + content: "\f05a"; +} +.icon-screenshot:before { + content: "\f05b"; +} +.icon-remove-circle:before { + content: "\f05c"; +} +.icon-ok-circle:before { + content: "\f05d"; +} +.icon-ban-circle:before { + content: "\f05e"; +} +.icon-arrow-left:before { + content: "\f060"; +} +.icon-arrow-right:before { + content: "\f061"; +} +.icon-arrow-up:before { + content: "\f062"; +} +.icon-arrow-down:before { + content: "\f063"; +} +.icon-share-alt:before, +.icon-mail-forward:before { + content: "\f064"; +} +.icon-resize-full:before { + content: "\f065"; +} +.icon-resize-small:before { + content: "\f066"; +} +.icon-plus:before { + content: "\f067"; +} +.icon-minus:before { + content: "\f068"; +} +.icon-asterisk:before { + content: "\f069"; +} +.icon-exclamation-sign:before { + content: "\f06a"; +} +.icon-gift:before { + content: "\f06b"; +} +.icon-leaf:before { + content: "\f06c"; +} +.icon-fire:before { + content: "\f06d"; +} +.icon-eye-open:before { + content: "\f06e"; +} +.icon-eye-close:before { + content: "\f070"; +} +.icon-warning-sign:before { + content: "\f071"; +} +.icon-plane:before { + content: "\f072"; +} +.icon-calendar:before { + content: "\f073"; +} +.icon-random:before { + content: "\f074"; +} +.icon-comment:before { + content: "\f075"; +} +.icon-magnet:before { + content: "\f076"; +} +.icon-chevron-up:before { + content: "\f077"; +} +.icon-chevron-down:before { + content: "\f078"; +} +.icon-retweet:before { + content: "\f079"; +} +.icon-shopping-cart:before { + content: "\f07a"; +} +.icon-folder-close:before { + content: "\f07b"; +} +.icon-folder-open:before { + content: "\f07c"; +} +.icon-resize-vertical:before { + content: "\f07d"; +} +.icon-resize-horizontal:before { + content: "\f07e"; +} +.icon-bar-chart:before { + content: "\f080"; +} +.icon-twitter-sign:before { + content: "\f081"; +} +.icon-facebook-sign:before { + content: "\f082"; +} +.icon-camera-retro:before { + content: "\f083"; +} +.icon-key:before { + content: "\f084"; +} +.icon-cogs:before { + content: "\f085"; +} +.icon-comments:before { + content: "\f086"; +} +.icon-thumbs-up:before { + content: "\f087"; +} +.icon-thumbs-down:before { + content: "\f088"; +} +.icon-star-half:before { + content: "\f089"; +} +.icon-heart-empty:before { + content: "\f08a"; +} +.icon-signout:before { + content: "\f08b"; +} +.icon-linkedin-sign:before { + content: "\f08c"; +} +.icon-pushpin:before { + content: "\f08d"; +} +.icon-external-link:before { + content: "\f08e"; +} +.icon-signin:before { + content: "\f090"; +} +.icon-trophy:before { + content: "\f091"; +} +.icon-github-sign:before { + content: "\f092"; +} +.icon-upload-alt:before { + content: "\f093"; +} +.icon-lemon:before { + content: "\f094"; +} +.icon-phone:before { + content: "\f095"; +} +.icon-check-empty:before { + content: "\f096"; +} +.icon-bookmark-empty:before { + content: "\f097"; +} +.icon-phone-sign:before { + content: "\f098"; +} +.icon-twitter:before { + content: "\f099"; +} +.icon-facebook:before { + content: "\f09a"; +} +.icon-github:before { + content: "\f09b"; +} +.icon-unlock:before { + content: "\f09c"; +} +.icon-credit-card:before { + content: "\f09d"; +} +.icon-rss:before { + content: "\f09e"; +} +.icon-hdd:before { + content: "\f0a0"; +} +.icon-bullhorn:before { + content: "\f0a1"; +} +.icon-bell:before { + content: "\f0a2"; +} +.icon-certificate:before { + content: "\f0a3"; +} +.icon-hand-right:before { + content: "\f0a4"; +} +.icon-hand-left:before { + content: "\f0a5"; +} +.icon-hand-up:before { + content: "\f0a6"; +} +.icon-hand-down:before { + content: "\f0a7"; +} +.icon-circle-arrow-left:before { + content: "\f0a8"; +} +.icon-circle-arrow-right:before { + content: "\f0a9"; +} +.icon-circle-arrow-up:before { + content: "\f0aa"; +} +.icon-circle-arrow-down:before { + content: "\f0ab"; +} +.icon-globe:before { + content: "\f0ac"; +} +.icon-wrench:before { + content: "\f0ad"; +} +.icon-tasks:before { + content: "\f0ae"; +} +.icon-filter:before { + content: "\f0b0"; +} +.icon-briefcase:before { + content: "\f0b1"; +} +.icon-fullscreen:before { + content: "\f0b2"; +} +.icon-group:before { + content: "\f0c0"; +} +.icon-link:before { + content: "\f0c1"; +} +.icon-cloud:before { + content: "\f0c2"; +} +.icon-beaker:before { + content: "\f0c3"; +} +.icon-cut:before { + content: "\f0c4"; +} +.icon-copy:before { + content: "\f0c5"; +} +.icon-paper-clip:before { + content: "\f0c6"; +} +.icon-save:before { + content: "\f0c7"; +} +.icon-sign-blank:before { + content: "\f0c8"; +} +.icon-reorder:before { + content: "\f0c9"; +} +.icon-list-ul:before { + content: "\f0ca"; +} +.icon-list-ol:before { + content: "\f0cb"; +} +.icon-strikethrough:before { + content: "\f0cc"; +} +.icon-underline:before { + content: "\f0cd"; +} +.icon-table:before { + content: "\f0ce"; +} +.icon-magic:before { + content: "\f0d0"; +} +.icon-truck:before { + content: "\f0d1"; +} +.icon-pinterest:before { + content: "\f0d2"; +} +.icon-pinterest-sign:before { + content: "\f0d3"; +} +.icon-google-plus-sign:before { + content: "\f0d4"; +} +.icon-google-plus:before { + content: "\f0d5"; +} +.icon-money:before { + content: "\f0d6"; +} +.icon-caret-down:before { + content: "\f0d7"; +} +.icon-caret-up:before { + content: "\f0d8"; +} +.icon-caret-left:before { + content: "\f0d9"; +} +.icon-caret-right:before { + content: "\f0da"; +} +.icon-columns:before { + content: "\f0db"; +} +.icon-sort:before { + content: "\f0dc"; +} +.icon-sort-down:before { + content: "\f0dd"; +} +.icon-sort-up:before { + content: "\f0de"; +} +.icon-envelope-alt:before { + content: "\f0e0"; +} +.icon-linkedin:before { + content: "\f0e1"; +} +.icon-undo:before, +.icon-rotate-left:before { + content: "\f0e2"; +} +.icon-legal:before { + content: "\f0e3"; +} +.icon-dashboard:before { + content: "\f0e4"; +} +.icon-comment-alt:before { + content: "\f0e5"; +} +.icon-comments-alt:before { + content: "\f0e6"; +} +.icon-bolt:before { + content: "\f0e7"; +} +.icon-sitemap:before { + content: "\f0e8"; +} +.icon-umbrella:before { + content: "\f0e9"; +} +.icon-paste:before { + content: "\f0ea"; +} +.icon-lightbulb:before { + content: "\f0eb"; +} +.icon-exchange:before { + content: "\f0ec"; +} +.icon-cloud-download:before { + content: "\f0ed"; +} +.icon-cloud-upload:before { + content: "\f0ee"; +} +.icon-user-md:before { + content: "\f0f0"; +} +.icon-stethoscope:before { + content: "\f0f1"; +} +.icon-suitcase:before { + content: "\f0f2"; +} +.icon-bell-alt:before { + content: "\f0f3"; +} +.icon-coffee:before { + content: "\f0f4"; +} +.icon-food:before { + content: "\f0f5"; +} +.icon-file-alt:before { + content: "\f0f6"; +} +.icon-building:before { + content: "\f0f7"; +} +.icon-hospital:before { + content: "\f0f8"; +} +.icon-ambulance:before { + content: "\f0f9"; +} +.icon-medkit:before { + content: "\f0fa"; +} +.icon-fighter-jet:before { + content: "\f0fb"; +} +.icon-beer:before { + content: "\f0fc"; +} +.icon-h-sign:before { + content: "\f0fd"; +} +.icon-plus-sign-alt:before { + content: "\f0fe"; +} +.icon-double-angle-left:before { + content: "\f100"; +} +.icon-double-angle-right:before { + content: "\f101"; +} +.icon-double-angle-up:before { + content: "\f102"; +} +.icon-double-angle-down:before { + content: "\f103"; +} +.icon-angle-left:before { + content: "\f104"; +} +.icon-angle-right:before { + content: "\f105"; +} +.icon-angle-up:before { + content: "\f106"; +} +.icon-angle-down:before { + content: "\f107"; +} +.icon-desktop:before { + content: "\f108"; +} +.icon-laptop:before { + content: "\f109"; +} +.icon-tablet:before { + content: "\f10a"; +} +.icon-mobile-phone:before { + content: "\f10b"; +} +.icon-circle-blank:before { + content: "\f10c"; +} +.icon-quote-left:before { + content: "\f10d"; +} +.icon-quote-right:before { + content: "\f10e"; +} +.icon-spinner:before { + content: "\f110"; +} +.icon-circle:before { + content: "\f111"; +} +.icon-reply:before, +.icon-mail-reply:before { + content: "\f112"; +} +.icon-folder-close-alt:before { + content: "\f114"; +} +.icon-folder-open-alt:before { + content: "\f115"; +} +.icon-expand-alt:before { + content: "\f116"; +} +.icon-collapse-alt:before { + content: "\f117"; +} +.icon-smile:before { + content: "\f118"; +} +.icon-frown:before { + content: "\f119"; +} +.icon-meh:before { + content: "\f11a"; +} +.icon-gamepad:before { + content: "\f11b"; +} +.icon-keyboard:before { + content: "\f11c"; +} +.icon-flag-alt:before { + content: "\f11d"; +} +.icon-flag-checkered:before { + content: "\f11e"; +} +.icon-terminal:before { + content: "\f120"; +} +.icon-code:before { + content: "\f121"; +} +.icon-reply-all:before { + content: "\f122"; +} +.icon-mail-reply-all:before { + content: "\f122"; +} +.icon-star-half-full:before, +.icon-star-half-empty:before { + content: "\f123"; +} +.icon-location-arrow:before { + content: "\f124"; +} +.icon-crop:before { + content: "\f125"; +} +.icon-code-fork:before { + content: "\f126"; +} +.icon-unlink:before { + content: "\f127"; +} +.icon-question:before { + content: "\f128"; +} +.icon-info:before { + content: "\f129"; +} +.icon-exclamation:before { + content: "\f12a"; +} +.icon-superscript:before { + content: "\f12b"; +} +.icon-subscript:before { + content: "\f12c"; +} +.icon-eraser:before { + content: "\f12d"; +} +.icon-puzzle-piece:before { + content: "\f12e"; +} +.icon-microphone:before { + content: "\f130"; +} +.icon-microphone-off:before { + content: "\f131"; +} +.icon-shield:before { + content: "\f132"; +} +.icon-calendar-empty:before { + content: "\f133"; +} +.icon-fire-extinguisher:before { + content: "\f134"; +} +.icon-rocket:before { + content: "\f135"; +} +.icon-maxcdn:before { + content: "\f136"; +} +.icon-chevron-sign-left:before { + content: "\f137"; +} +.icon-chevron-sign-right:before { + content: "\f138"; +} +.icon-chevron-sign-up:before { + content: "\f139"; +} +.icon-chevron-sign-down:before { + content: "\f13a"; +} +.icon-html5:before { + content: "\f13b"; +} +.icon-css3:before { + content: "\f13c"; +} +.icon-anchor:before { + content: "\f13d"; +} +.icon-unlock-alt:before { + content: "\f13e"; +} +.icon-bullseye:before { + content: "\f140"; +} +.icon-ellipsis-horizontal:before { + content: "\f141"; +} +.icon-ellipsis-vertical:before { + content: "\f142"; +} +.icon-rss-sign:before { + content: "\f143"; +} +.icon-play-sign:before { + content: "\f144"; +} +.icon-ticket:before { + content: "\f145"; +} +.icon-minus-sign-alt:before { + content: "\f146"; +} +.icon-check-minus:before { + content: "\f147"; +} +.icon-level-up:before { + content: "\f148"; +} +.icon-level-down:before { + content: "\f149"; +} +.icon-check-sign:before { + content: "\f14a"; +} +.icon-edit-sign:before { + content: "\f14b"; +} +.icon-external-link-sign:before { + content: "\f14c"; +} +.icon-share-sign:before { + content: "\f14d"; +} diff --git a/lms/templates/discussion/_discussion_course_navigation.html b/lms/templates/discussion/_discussion_course_navigation.html index d770cacc96..355e4af4d7 100644 --- a/lms/templates/discussion/_discussion_course_navigation.html +++ b/lms/templates/discussion/_discussion_course_navigation.html @@ -3,6 +3,6 @@ <%block name="extratabs"> % if has_permission(user, 'create_thread', course.id): -
  • New Post
  • +
  • New Post
  • % endif \ No newline at end of file diff --git a/lms/templates/discussion/_discussion_module.html b/lms/templates/discussion/_discussion_module.html index 8fced92f7f..ef836e0b77 100644 --- a/lms/templates/discussion/_discussion_module.html +++ b/lms/templates/discussion/_discussion_module.html @@ -2,7 +2,7 @@ diff --git a/lms/templates/discussion/_filter_dropdown.html b/lms/templates/discussion/_filter_dropdown.html index dd5b94f910..9096d7a77e 100644 --- a/lms/templates/discussion/_filter_dropdown.html +++ b/lms/templates/discussion/_filter_dropdown.html @@ -11,12 +11,12 @@ <%def name="render_entry(entries, entry)"> -
  • ${entry}
  • +
  • ${entry}
  • <%def name="render_category(categories, category)">
  • - ${category} + ${category}
      ${render_dropdown(categories[category])}
    @@ -29,21 +29,21 @@
    • - + Show All Discussions
    • %if flag_moderator:
    • - Show Flagged Discussions + Show Flagged Discussions
    • %endif
    • - - Following + + Posts I'm Following
    • ${render_dropdown(category_map)} diff --git a/lms/templates/discussion/_thread_list_template.html b/lms/templates/discussion/_thread_list_template.html index 34038d9909..c029b673db 100644 --- a/lms/templates/discussion/_thread_list_template.html +++ b/lms/templates/discussion/_thread_list_template.html @@ -1,7 +1,14 @@ + diff --git a/lms/templates/discussion/index.html b/lms/templates/discussion/index.html index cacc290d4a..f0cb18d617 100644 --- a/lms/templates/discussion/index.html +++ b/lms/templates/discussion/index.html @@ -9,7 +9,7 @@ <%block name="headextra"> <%static:css group='course'/> -<%include file="_js_head_dependencies.html" /> +<%include file="_js_head_dependencies.html" /> <%block name="js_extra"> @@ -25,13 +25,9 @@
      -
      -

      ${course.display_name_with_default} Discussion

      - -
      - + <%include file="_underscore_templates.html" /> <%include file="_thread_list_template.html" /> diff --git a/lms/templates/discussion/mustache/_inline_thread_show.mustache b/lms/templates/discussion/mustache/_inline_thread_show.mustache index c704316afe..dda4a7bb6d 100644 --- a/lms/templates/discussion/mustache/_inline_thread_show.mustache +++ b/lms/templates/discussion/mustache/_inline_thread_show.mustache @@ -4,10 +4,10 @@ + {{votes.up_count}}

      {{title}}

      - Flagged
      + Flagged
      - Pinned
      + Pinned

      {{#user}} diff --git a/lms/urls.py b/lms/urls.py index 84cf149983..5dbeafe633 100644 --- a/lms/urls.py +++ b/lms/urls.py @@ -336,6 +336,7 @@ if settings.COURSEWARE_ENABLED: include('django_comment_client.urls')), url(r'^notification_prefs/enable/', 'notification_prefs.views.ajax_enable'), url(r'^notification_prefs/disable/', 'notification_prefs.views.ajax_disable'), + url(r'^notification_prefs/status/', 'notification_prefs.views.ajax_status'), url(r'^notification_prefs/unsubscribe/(?P[a-zA-Z0-9-_=]+)/', 'notification_prefs.views.unsubscribe'), ) urlpatterns += (