-
Edit
-
Delete
+
+
+
+ <%=
+ updateModel.get('date') %>
+
+
<%= updateModel.get('content') %>
\ No newline at end of file
diff --git a/cms/static/img/delete-icon.png b/cms/static/img/delete-icon.png
index 1855a2943d..9c7f65daef 100644
Binary files a/cms/static/img/delete-icon.png and b/cms/static/img/delete-icon.png differ
diff --git a/cms/static/img/edit-icon.png b/cms/static/img/edit-icon.png
index 2da9551010..748d3d2115 100644
Binary files a/cms/static/img/edit-icon.png and b/cms/static/img/edit-icon.png differ
diff --git a/cms/static/js/template_loader.js b/cms/static/js/template_loader.js
index b266575b7a..bd8d249e6b 100644
--- a/cms/static/js/template_loader.js
+++ b/cms/static/js/template_loader.js
@@ -5,7 +5,7 @@
if (typeof window.templateLoader == 'function') return;
var templateLoader = {
- templateVersion: "0.0.3",
+ templateVersion: "0.0.4",
templates: {},
loadRemoteTemplate: function(templateName, filename, callback) {
if (!this.templates[templateName]) {
diff --git a/cms/static/js/views/course_info_edit.js b/cms/static/js/views/course_info_edit.js
index 4f504d72e8..ff266ad4f5 100644
--- a/cms/static/js/views/course_info_edit.js
+++ b/cms/static/js/views/course_info_edit.js
@@ -35,7 +35,8 @@ CMS.Views.ClassInfoUpdateView = Backbone.View.extend({
window.templateLoader.loadRemoteTemplate("course_info_update",
// TODO Where should the template reside? how to use the static.url to create the path?
"/static/coffee/src/client_templates/course_info_update.html",
- function (raw_template) {
+ function (raw_template) {
+ console.log(raw_template);
self.template = _.template(raw_template);
self.render();
}
@@ -63,16 +64,16 @@ CMS.Views.ClassInfoUpdateView = Backbone.View.extend({
var newForm = this.template({ updateModel : newModel });
var updateEle = this.$el.find("#course-update-list");
- $(updateEle).append(newForm);
- $(newForm).find(".new-update-form").show();
+ $(updateEle).prepend(newForm);
+ $(newForm).find(".new-update-form").slideDown(150);
},
onSave: function(event) {
var targetModel = this.eventModel(event);
targetModel.set({ date : this.dateEntry(event).val(), content : this.contentEntry(event).val() });
// push change to display, hide the editor, submit the change
- $(this.dateDisplay(event)).val(targetModel.get('date'));
- $(this.contentDisplay(event)).val(targetModel.get('content'));
+ $(this.dateDisplay(event)).html(targetModel.get('date'));
+ $(this.contentDisplay(event)).html(targetModel.get('content'));
$(this.editor(event)).hide();
targetModel.save();
@@ -82,12 +83,12 @@ CMS.Views.ClassInfoUpdateView = Backbone.View.extend({
// change editor contents back to model values and hide the editor
$(this.editor(event)).hide();
var targetModel = this.eventModel(event);
- $(this.dateEntry(event)).val(targetModel.get('date'));
- $(this.contentEntry(event)).val(targetModel.get('content'));
+ $(this.dateEntry(event)).html(targetModel.get('date'));
+ $(this.contentEntry(event)).html(targetModel.get('content'));
},
onEdit: function(event) {
- $(this.editor(event)).show();
+ $(this.editor(event)).slideDown(150);
},
onDelete: function(event) {
diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index 80a82fb7f3..3a8f24b5a9 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -48,18 +48,18 @@
}
@mixin white-button {
- @include button;
- border: 1px solid $darkGrey;
- border-radius: 3px;
- @include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0));
- background-color: #dfe5eb;
- @include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset);
- color: #778192;
+ @include button;
+ border: 1px solid $darkGrey;
+ border-radius: 3px;
+ @include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0));
+ background-color: #dfe5eb;
+ @include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset);
+ color: #778192;
- &:hover {
- background-color: #f2f6f9;
- color: #778192;
- }
+ &:hover {
+ background-color: #f2f6f9;
+ color: #778192;
+ }
}
@mixin orange-button {
diff --git a/cms/static/sass/_course-info.scss b/cms/static/sass/_course-info.scss
index 6eb08943b1..f89e991823 100644
--- a/cms/static/sass/_course-info.scss
+++ b/cms/static/sass/_course-info.scss
@@ -1,31 +1,28 @@
-body.updates {
- h2 {
- margin-bottom: 24px;
- font-size: 22px;
- font-weight: 300;
- }
-}
-
.course-updates {
padding: 30px 40px;
li {
- padding: 24px 0 32px;
+ padding: 34px 0 42px;
border-top: 1px solid #cbd1db;
}
- h3 {
+ h2 {
margin-bottom: 18px;
font-size: 14px;
font-weight: 700;
+ line-height: 30px;
color: #646464;
letter-spacing: 1px;
text-transform: uppercase;
}
- .update-contents {
- padding-left: 30px;
+ h3 {
+ margin: 34px 0 11px;
+ font-size: 16px;
+ font-weight: 700;
+ }
+ .update-contents {
p {
font-size: 14px;
line-height: 18px;
@@ -37,7 +34,7 @@ body.updates {
}
.new-update-button {
- @include grey-button;
+ @include blue-button;
display: block;
text-align: center;
padding: 12px 0;
@@ -52,6 +49,25 @@ body.updates {
height: 180px;
}
}
+
+ .post-actions {
+ float: right;
+
+ .edit-button,
+ .delete-button{
+ float: left;
+ @include white-button;
+ padding: 3px 10px 4px;
+ margin-left: 7px;
+ font-size: 12px;
+ font-weight: 400;
+
+ .edit-icon,
+ .delete-icon {
+ margin-right: 4px;
+ }
+ }
+ }
}
.course-handouts {
diff --git a/cms/templates/course_info.html b/cms/templates/course_info.html
index bd216715c9..ae0dac197e 100644
--- a/cms/templates/course_info.html
+++ b/cms/templates/course_info.html
@@ -3,6 +3,7 @@
<%block name="title">Course Info
+<%block name="bodyclass">course-info
<%block name="jsextra">
@@ -33,7 +34,7 @@