From efe158378f7696eb852af11dbc31a3136bc9d9be Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Fri, 15 Jun 2012 13:27:24 -0400 Subject: [PATCH] Added more styles and markup for sequence --- cms/static/css/base-style.css | 112 +++++++++---- cms/static/sass/_calendar.scss | 2 +- cms/static/sass/_week.scss | 68 +++++--- cms/templates/widgets/sequnce-edit.html | 204 ++++++++++++++++++------ cms/templates/widgets/week-edit.html | 129 +++++++++++++-- cms/templates/widgets/week-new.html | 10 +- 6 files changed, 407 insertions(+), 118 deletions(-) diff --git a/cms/static/css/base-style.css b/cms/static/css/base-style.css index abed82cc05..9ebc6bd839 100644 --- a/cms/static/css/base-style.css +++ b/cms/static/css/base-style.css @@ -460,7 +460,7 @@ section.cal { section.cal section.new-section section { display: none; position: absolute; - top: 32px; + top: 30px; background: rgba(0, 0, 0, 0.8); min-width: 300px; padding: 10px; @@ -575,46 +575,96 @@ section.sequence-edit > header { section.week-new > header:after, section.sequence-edit > header:after { clear: both; } - section.week-edit > header h1, - section.week-new > header h1, - section.sequence-edit > header h1 { - font-size: 18px; - margin: 8px 6px; - text-transform: uppercase; - letter-spacing: 1px; } + section.week-edit > header div, + section.week-new > header div, + section.sequence-edit > header div { + zoom: 1; + padding: 6px 20px; } + section.week-edit > header div:before, section.week-edit > header div:after, + section.week-new > header div:before, + section.week-new > header div:after, + section.sequence-edit > header div:before, + section.sequence-edit > header div:after { + content: ""; + display: table; } + section.week-edit > header div:after, + section.week-new > header div:after, + section.sequence-edit > header div:after { + clear: both; } + section.week-edit > header div h1, + section.week-new > header div h1, + section.sequence-edit > header div h1 { + font-size: 18px; + text-transform: uppercase; + letter-spacing: 1px; + float: left; } + section.week-edit > header div p, + section.week-new > header div p, + section.sequence-edit > header div p { + float: right; } + section.week-edit > header div.week, + section.week-new > header div.week, + section.sequence-edit > header div.week { + background: #eee; + font-size: 12px; + border-bottom: 1px solid #ccc; } + section.week-edit > header div.week h2, + section.week-new > header div.week h2, + section.sequence-edit > header div.week h2 { + font-size: 12px; + display: -moz-inline-box; + -moz-box-orient: vertical; + display: inline-block; + vertical-align: baseline; + zoom: 1; + *display: inline; + *vertical-align: auto; + margin-right: 20px; } + section.week-edit > header div.week ul, + section.week-new > header div.week ul, + section.sequence-edit > header div.week ul { + list-style: none; + display: -moz-inline-box; + -moz-box-orient: vertical; + display: inline-block; + vertical-align: baseline; + zoom: 1; + *display: inline; + *vertical-align: auto; } + section.week-edit > header div.week ul li, + section.week-new > header div.week ul li, + section.sequence-edit > header div.week ul li { + display: -moz-inline-box; + -moz-box-orient: vertical; + display: inline-block; + vertical-align: baseline; + zoom: 1; + *display: inline; + *vertical-align: auto; + margin-right: 10px; } + section.week-edit > header div.week ul li p, + section.week-new > header div.week ul li p, + section.sequence-edit > header div.week ul li p { + float: none; } section.week-edit > header section.goals, section.week-new > header section.goals, section.sequence-edit > header section.goals { background: #eee; - padding: 6px; + padding: 6px 20px; border-top: 1px solid #ccc; } - section.week-edit > header section.goals header h2, - section.week-new > header section.goals header h2, - section.sequence-edit > header section.goals header h2 { - font-size: 14px; - display: -moz-inline-box; - -moz-box-orient: vertical; - display: inline-block; - vertical-align: baseline; - zoom: 1; - *display: inline; - *vertical-align: auto; } - section.week-edit > header section.goals header p, - section.week-new > header section.goals header p, - section.sequence-edit > header section.goals header p { - display: -moz-inline-box; - -moz-box-orient: vertical; - display: inline-block; - vertical-align: baseline; - zoom: 1; - *display: inline; - *vertical-align: auto; } section.week-edit > header section.goals ul, section.week-new > header section.goals ul, section.sequence-edit > header section.goals ul { list-style: none; - margin-top: 6px; color: #999; } + section.week-edit > header section.goals ul li, + section.week-new > header section.goals ul li, + section.sequence-edit > header section.goals ul li { + margin-bottom: 6px; } + section.week-edit > header section.goals ul li:last-child, + section.week-new > header section.goals ul li:last-child, + section.sequence-edit > header section.goals ul li:last-child { + margin-bottom: 0; } section.week-edit > section.content, section.week-new > section.content, section.sequence-edit > section.content { diff --git a/cms/static/sass/_calendar.scss b/cms/static/sass/_calendar.scss index ca91337366..fa10c65950 100644 --- a/cms/static/sass/_calendar.scss +++ b/cms/static/sass/_calendar.scss @@ -176,7 +176,7 @@ section.cal { section { display: none; - @include position(absolute, 32px 0 0 0); + @include position(absolute, 30px 0 0 0); background: rgba(#000, .8); min-width: 300px; padding: 10px; diff --git a/cms/static/sass/_week.scss b/cms/static/sass/_week.scss index e5283cbc55..b638a36f5c 100644 --- a/cms/static/sass/_week.scss +++ b/cms/static/sass/_week.scss @@ -6,34 +6,64 @@ section.sequence-edit { border-bottom: 2px solid #333; @include clearfix(); - h1 { - font-size: 18px; - margin: 8px 6px; - text-transform: uppercase; - letter-spacing: 1px; + div { + @include clearfix(); + padding: 6px 20px; + + h1 { + font-size: 18px; + text-transform: uppercase; + letter-spacing: 1px; + float: left; + } + + p { + float: right; + } + + &.week { + background: #eee; + font-size: 12px; + border-bottom: 1px solid #ccc; + + h2 { + font-size: 12px; + @include inline-block(); + margin-right: 20px; + } + + ul { + list-style: none; + @include inline-block(); + + li { + @include inline-block(); + margin-right: 10px; + + p { + float: none; + } + } + } + } } section.goals { background: #eee; - padding: 6px; + padding: 6px 20px; border-top: 1px solid #ccc; - header { - h2 { - font-size: 14px; - @include inline-block(); - } - - p { - @include inline-block(); - } - - } - ul { list-style: none; - margin-top: 6px; color: #999; + + li { + margin-bottom: 6px; + + &:last-child { + margin-bottom: 0; + } + } } } } diff --git a/cms/templates/widgets/sequnce-edit.html b/cms/templates/widgets/sequnce-edit.html index 75d4504b68..b69b523bc4 100644 --- a/cms/templates/widgets/sequnce-edit.html +++ b/cms/templates/widgets/sequnce-edit.html @@ -1,47 +1,20 @@ -<%block name="content">
- Done -

Lecture Sequence name

- Settings +
+

Week 1

+
    +
  • +

    Goal title: This is the goal body and is where the goal will be further explained

    +
    • +
+
+
+

Lecture sequence

+

Group type: Ordered Sequence

+
-
-
-
-

Content

-
- -
- -
-
-

Scratchpad

-
- - - -
-
- -
-
-

Sequence Content

-
- -
-
- +
-
- -
+
+
+
    +
  1. +
      +
    1. + Problem title 11 + handle +
      2. +
    2. + Problem Group + handle +
      3. +
    3. + Problem title 14 + handle +
      4. +
    4. + Video 3 + handle +
      5. +
    5. +
      +

      + Problem group + handle +

      +
      +
        +
      1. + Problem title 11 + handle +
        2. +
      2. + Problem title 11 + handle +
        3. +
      3. + Problem title 11 + handle +
        4. +
      +
      6. +
    6. + Problem title 13 + handle +
      7. +
    7. + Problem title 14 + handle +
      8. +
    8. + Video 3 + handle +
      9. +
    9. + Problem title 11 + handle +
      10. +
    10. + Problem Group + handle +
      11. +
    11. + Problem title 14 + handle +
      12. +
    12. + Video 3 + handle +
      13. +
    +
    2. + + + + +
+
+ +
+
    +
  1. +
    +

    Section Scratch

    +
    + +
    2. +
  2. +
    +

    Course Scratch

    +
    + + +
    3. + + + + +
+
+
- diff --git a/cms/templates/widgets/week-edit.html b/cms/templates/widgets/week-edit.html index 2e37520fde..95ca631be0 100644 --- a/cms/templates/widgets/week-edit.html +++ b/cms/templates/widgets/week-edit.html @@ -1,16 +1,14 @@
-

Week 3

+
+

Week 3

+

+ new goal

+
-
-

Weeks goals:

-

+ new goal

-
-
  • -

    Goal title: This is the goal body and is where the goal will be further explained

    +

    Goal title: This is the goal body and is where the goal will be further explained

@@ -62,7 +60,40 @@ Problem title 11 handle -
  • +
  • +
    +

    + Problem group + handle +

    +
    +
      +
    1. + Problem title 11 + handle +
      2. +
    2. + Problem title 11 + handle +
      3. +
    3. + Problem title 11 + handle +
      4. +
    4. + Problem title 13 + handle +
      5. +
    5. + Problem title 14 + handle +
      6. +
    6. + Video 3 + handle +
      7. +
    +
  • Problem Group handle
    • @@ -70,11 +101,77 @@ Problem title 14 handle -
  • +
  • +
    +

    + Problem group + handle +

    +
    +
      +
    1. + Problem title 11 + handle +
      2. +
    2. + Problem title 11 + handle +
      3. +
    3. + Problem title 11 + handle +
      4. +
    4. + Problem title 13 + handle +
      5. +
    5. + Problem title 14 + handle +
      6. +
    6. + Video 3 + handle +
      7. +
    +
  • Video 3 handle
    • - +
  • +
    +

    + Problem group + handle +

    +
    +
      +
    1. + Problem title 11 + handle +
      2. +
    2. + Problem title 11 + handle +
      3. +
    3. + Problem title 11 + handle +
      4. +
    4. + Problem title 13 + handle +
      5. +
    5. + Problem title 14 + handle +
      6. +
    6. + Video 3 + handle +
      7. +
    +
  • @@ -103,6 +200,18 @@ Problem title 11 handle
    • +
  • + Problem title 13 + handle +
    • +
  • + Problem title 14 + handle +
    • +
  • + Video 3 + handle +
  • diff --git a/cms/templates/widgets/week-new.html b/cms/templates/widgets/week-new.html index be08587755..c62730c1bc 100644 --- a/cms/templates/widgets/week-new.html +++ b/cms/templates/widgets/week-new.html @@ -1,13 +1,11 @@
    -

    Week 3

    +
    +

    Week 3

    +

    + new goal

    +
    -
    -

    Weeks goals:

    -

    + new goal

    -
    -

    • Please add a goal for this section