From ab87ff6b209973904bc4fa2d25af35a5a4e96c76 Mon Sep 17 00:00:00 2001 From: Brian Talbot Date: Mon, 19 Nov 2012 14:55:32 -0500 Subject: [PATCH] settings - field alignment, radio/checkbox formatting --- cms/static/sass/_settings.scss | 74 ++++++++-- cms/static/sass/_variables.scss | 3 +- cms/templates/settings.html | 240 +++++++++++++------------------- 3 files changed, 160 insertions(+), 157 deletions(-) diff --git a/cms/static/sass/_settings.scss b/cms/static/sass/_settings.scss index 6c3413472c..48b8b6b050 100644 --- a/cms/static/sass/_settings.scss +++ b/cms/static/sass/_settings.scss @@ -122,6 +122,7 @@ &.long { width: 100%; + min-width: 400px; } &.tall { @@ -144,8 +145,9 @@ } &:disabled { - color: $darkGrey; - background: $lightGrey; + border-color: $mediumGrey; + color: $mediumGrey; + background: #fff; } } @@ -170,7 +172,7 @@ margin-bottom: 15px; } - .ui-status-input-checkbox, .ui-status-input-radio { + .ui-status-input-checkbox input, .ui-status-input-radio input { position: absolute; top: -9999px; left: -9999px; @@ -180,7 +182,7 @@ cursor: pointer; } - .ui-status-input-checkbox ~ label, .ui-status-input-radio ~ label { + .ui-status-input-checkbox input ~ label, .ui-status-input-radio input ~ label { position: relative; left: -30px; display: inline-block; @@ -209,21 +211,25 @@ } .ui-status-indic { - position: relative; - top: 2px; z-index: 10; display: inline-block; height: 15px; width: 15px; border: 2px; - background: $offBlack; opacity: 0.50; - @include border-radius(50px); @include box-sizing(border-box); @include transition(opacity 0.25s ease-in-out); } - .ui-status-input-checkbox:checked ~ label, .ui-status-input-radio:checked ~ label { + .ss-check { + color: $green; + } + + .ss-delete { + color: $red; + } + + .ui-status-input-checkbox input:checked ~ label, .ui-status-input-radio input:checked ~ label { opacity: 0.99; &:after { @@ -237,9 +243,19 @@ } } - .ui-status-input-checkbox:checked ~ .ui-status-indic, .ui-status-input-radio:checked ~ .ui-status-indic { + .ui-status-input-checkbox input:checked ~ .ui-status-indic, .ui-status-input-radio input:checked ~ .ui-status-indic { + background: transparent url('/static/img/.png') 0 0 no-repeat; opacity: 0.99; } + + // disabled + .ui-status-input-checkbox input:disabled, .ui-status-input-radio input:disabled { + color: $mediumGrey; + } + + .ui-status-input-checkbox input:disabled ~ .ui-status-indic, .ui-status-input-radio input:disabled ~ .ui-status-indic { + color: $mediumGrey; + } } .tip { @@ -309,6 +325,7 @@ .group { margin-bottom: 10px; + max-width: 175px; &:last-child { margin-bottom: 0; @@ -317,6 +334,10 @@ input, .input, textarea { } + + .tip-stacked { + margin-top: 0; + } } } @@ -325,7 +346,8 @@ .group { input, .input, textarea { - width: 100%; + min-width: 370px; + width: 370px; } } } @@ -408,6 +430,7 @@ .remove-item { clear: both; display: block; + margin-top: 10px; opacity: 0.75; font-size: 13px; text-align: right; @@ -430,7 +453,21 @@ padding: 10px; @include box-sizing(border-box); @include border-radius(5px); + font-size: 14px; background: tint($lightGrey, 50%); + @include clearfix(); + + .doc-filename { + display: inline-block; + width: 220px; + overflow: hidden; + text-overflow: ellipsis; + } + + .remove-doc-data { + display: inline-block; + width: 150px; + } } } @@ -479,14 +516,15 @@ } .current-faculty-photo { - height: 115px; - width: 115px; overflow: hidden; + padding: 0; img { display: block; - min-height: 100%; - max-width: 100%; + @include box-shadow(0 1px 3px rgba(0,0,0,0.1)); + padding: 10px; + border: 2px solid $mediumGrey; + background: #fff; } } } @@ -579,6 +617,12 @@ .divide { display: none; } + + i.ss-icon { + position: relative; + top: 1px; + margin-right: 5px; + } } diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss index 8ab5e0d703..8666dc192c 100644 --- a/cms/static/sass/_variables.scss +++ b/cms/static/sass/_variables.scss @@ -16,7 +16,8 @@ $error-red: rgb(253, 87, 87); $offBlack: #3c3c3c; $blue: #5597dd; $orange: #edbd3c; -$red: #e23c3e; +$red: #b20610; +$green: #108614; $lightGrey: #edf1f5; $mediumGrey: #ced2db; $darkGrey: #8891a1; diff --git a/cms/templates/settings.html b/cms/templates/settings.html index 1cc0ae8ea0..8d618fcfc1 100644 --- a/cms/templates/settings.html +++ b/cms/templates/settings.html @@ -98,6 +98,7 @@ $(this).text(min + '-' + max); }); } + @@ -133,7 +134,8 @@
- + + This is used in your course URL, and cannot be changed
@@ -142,7 +144,8 @@
- + + This is used in your course URL, and cannot be changed
@@ -151,8 +154,9 @@
- + e.g. 101x + This is used in your course URL, and cannot be changed
@@ -167,43 +171,41 @@
- +

Course Dates:

+
-
- - First day the course begins +
+
+ + + First day the course begins +
+ +
+ + + Last day the course is active +
- +

Enrollment Dates:

+
-
- - First day the course begins - The start date of the course cannot be after the end date of the course -
-
-
+
+
+ + + First day students can enroll +
-
- -
-
- - Last day the course begins -
-
-
- -
- -
-
- - Last day the course begins - The end date of the course cannot be before the start date of the course +
+ + + Last day students can enroll +
@@ -227,36 +229,6 @@ Delete Milestone -
  • -
    - - - A milestone date cannot be after the end of a course -
    - -
    - - -
    - - Delete Milestone -
  • - -
  • -
    - - - A milestone date cannot be before the start of a course -
    - -
    - - -
    - - Delete Milestone -
  • -
  • @@ -281,10 +253,10 @@
    @@ -330,10 +302,10 @@
    @@ -515,37 +487,36 @@
    • -
      +
      -
      +
      -
      +
      -
      +
      - + A brief description of your education, experience, and expertise
      @@ -554,21 +525,21 @@
    • -
      +
      -
      +
      -
      +
      @@ -580,11 +551,11 @@
      -
      +
      - + A brief description of your education, experience, and expertise
      @@ -825,22 +796,22 @@

      Problem Randomization:

      -
      - +
      +
      randomize all problems
      -
      - +
      +
      do not randomize problems
      -
      - +
      +
      randomize problems per student @@ -852,15 +823,15 @@

      Show Answers:

      -
      - +
      +
      Answers will be shown after the number of attempts has been met
      -
      - +
      +
      Answers will never be shown, regardless of attempts @@ -890,22 +861,22 @@

      Problem Randomization:

      -
      - +
      +
      randomize all problems
      -
      - +
      +
      do not randomize problems
      -
      - +
      +
      randomize problems per student @@ -917,15 +888,15 @@

      Show Answers:

      -
      - +
      +
      Answers will be shown after the number of attempts has been met
      -
      - +
      +
      Answers will never be shown, regardless of attempts @@ -955,22 +926,22 @@

      Problem Randomization:

      -
      - +
      +
      randomize all problems
      -
      - +
      +
      do not randomize problems
      -
      - +
      +
      randomize problems per student @@ -982,15 +953,15 @@

      Show Answers:

      -
      - +
      +
      Answers will be shown after the number of attempts has been met
      -
      - +
      +
      Answers will never be shown, regardless of attempts @@ -1020,22 +991,22 @@

      Problem Randomization:

      -
      - +
      +
      randomize all problems
      -
      - +
      +
      do not randomize problems
      -
      - +
      +
      randomize problems per student @@ -1047,15 +1018,15 @@

      Show Answers:

      -
      - +
      +
      Answers will be shown after the number of attempts has been met
      -
      - +
      +
      Answers will never be shown, regardless of attempts @@ -1089,21 +1060,20 @@

      Anonymous Discussions:

      -
      - -
      +
      + +
      Students and faculty will be able to post anonymously
      -
      - -
      +
      + +
      Posting anonymously is not allowed. Any previous anonymous posts will be reverted to non-anonymous
      -
      @@ -1166,18 +1136,6 @@
      - -
      -

      Create Discussion
      Categories for Each
      Course Unit

      - -
      -
      - -
      - - This option is automatically set currently -
      -