From 90e9938e66d8dd75f545352878c419aff8374fdf Mon Sep 17 00:00:00 2001 From: Giulio Gratta Date: Fri, 31 Jan 2014 10:54:10 -0800 Subject: [PATCH] Make notification checkbox more obvious - Clarify checkbox description wording - Wrap checkbox and envelope icon in div to make it stand out - Added styling for wrapper div - Wrap label element around div to allow clicking the envelope to activate the checkbox - Indented HTML and fixed if wrapping issue --- lms/static/sass/_discussion.scss | 36 +++--- .../discussion/_underscore_templates.html | 106 +++++++++--------- 2 files changed, 77 insertions(+), 65 deletions(-) diff --git a/lms/static/sass/_discussion.scss b/lms/static/sass/_discussion.scss index 542ed38732..d5c97f90de 100644 --- a/lms/static/sass/_discussion.scss +++ b/lms/static/sass/_discussion.scss @@ -1296,22 +1296,30 @@ body.discussion { } .row-item-full { - - .email-setting { + + .notification-checkbox { display: inline-block; - text-align: center; - vertical-align: middle; - margin-left: $baseline/2; + padding: $baseline/4 0 $baseline/2 0; + margin-right: $baseline/2; + border-radius: 5px; + border: 1px solid gray; + + .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; + } } - - .icon { - display: inline-block; - } - - .email-setting:checked ~ .icon { - color: $green; - } - + .row-description { display: inline-block; width:80%; diff --git a/lms/templates/discussion/_underscore_templates.html b/lms/templates/discussion/_underscore_templates.html index 910f087080..6294c21661 100644 --- a/lms/templates/discussion/_underscore_templates.html +++ b/lms/templates/discussion/_underscore_templates.html @@ -233,57 +233,61 @@