Commit 94fccb00 by Kyle Fiedler

Added fixes for the sidebar, made better base style for inputs and brightened colors a bit

parent 985a5323
class @CMS class @CMS
@setHeight = => @setHeight = =>
windowHeight = $(this).height() windowHeight = $(window).height()
@contentHeight = windowHeight - 29 headerHeight = $('body > header').outerHeight()
contentHeight = $('.main-content').height()
@sidebarHeight = if windowHeight > contentHeight then windowHeight - headerHeight else contentHeight - headerHeight
@minContentHeight = windowHeight - headerHeight
$('.cal').css('height', @sidebarHeight)
$('.main-content').css('min-height', @minContentHeight)
@bind = => @bind = =>
$('a.module-edit').click -> $('a.module-edit').click ->
...@@ -13,8 +19,9 @@ class @CMS ...@@ -13,8 +19,9 @@ class @CMS
$.get('/edit_item', {id: id}, (data) => $.get('/edit_item', {id: id}, (data) =>
$('#module-html').empty().append(data) $('#module-html').empty().append(data)
CMS.bind() CMS.bind()
$('body.content .cal').css('height', @contentHeight) CMS.setHeight()
$('body').addClass('content') $('body').addClass('content')
$('body.content .cal ol > li').css('height','auto')
$('section.edit-pane').show() $('section.edit-pane').show()
new Unit('unit-wrapper', id) new Unit('unit-wrapper', id)
) )
...@@ -31,6 +38,7 @@ $ -> ...@@ -31,6 +38,7 @@ $ ->
heighest = if $(this).height() > heighest then $(this).height() else heighest heighest = if $(this).height() > heighest then $(this).height() else heighest
$('.cal ol > li').css('height',heighest + 'px') $('.cal ol > li').css('height',heighest + 'px')
$('body.content .cal ol > li').css('height','auto')
$('.add-new-section').click -> return false $('.add-new-section').click -> return false
...@@ -43,40 +51,6 @@ $ -> ...@@ -43,40 +51,6 @@ $ ->
$(this).parent().parent().hide() $(this).parent().parent().hide()
return false return false
# $('html').keypress ->
# $('.wip').css('visibility', 'visible')
setHeight = ->
windowHeight = $(this).height()
contentHeight = windowHeight - 29
$('section.main-content > section').css('min-height', contentHeight)
$('body.content .cal').css('height', contentHeight)
$('.edit-week').click ->
$('body').addClass('content')
$('body.content .cal').css('height', contentHeight)
$('section.edit-pane').show()
return false
$('a.week-edit').click ->
$('body').addClass('content')
$('body.content .cal').css('height', contentHeight)
$('section.edit-pane').show()
return false
$('a.sequence-edit').click ->
$('body').addClass('content')
$('body.content .cal').css('height', contentHeight)
$('section.edit-pane').show()
return false
$('a.module-edit').click ->
$('body.content .cal').css('height', contentHeight)
$(document).ready(setHeight)
$(window).bind('resize', setHeight)
$('.video-new a').click -> $('.video-new a').click ->
$('section.edit-pane').show() $('section.edit-pane').show()
return false return false
......
...@@ -32,11 +32,11 @@ input { ...@@ -32,11 +32,11 @@ input {
button, input[type="submit"], .button { button, input[type="submit"], .button {
background-color: $orange; background-color: $orange;
color: #fff;
-webkit-font-smoothing: antialiased;
padding: 8px 10px;
border: 0; border: 0;
color: #fff;
font-weight: bold; font-weight: bold;
padding: 8px 10px;
-webkit-font-smoothing: antialiased;
&:hover { &:hover {
background-color: shade($orange, 10%); background-color: shade($orange, 10%);
...@@ -45,9 +45,22 @@ button, input[type="submit"], .button { ...@@ -45,9 +45,22 @@ button, input[type="submit"], .button {
#{$all-text-inputs}, textarea { #{$all-text-inputs}, textarea {
border: 1px solid $dark-blue; border: 1px solid $dark-blue;
@include box-shadow(inset 0 3px 6px $light-blue);
color: lighten($dark-blue, 30%);
font: $body-font-size $body-font-family; font: $body-font-size $body-font-family;
outline: none;
padding: 4px 6px; padding: 4px 6px;
@include box-shadow(inset 0 3px 6px $light-blue);
&:hover {
background: lighten($yellow, 13%);
color: $dark-blue;
}
&:focus {
@include box-shadow(inset 0 3px 6px $light-blue, 0 0 3px lighten($bright-blue, 10%));
color: $dark-blue;
background: lighten($yellow, 13%);
}
} }
textarea { textarea {
...@@ -56,7 +69,6 @@ textarea { ...@@ -56,7 +69,6 @@ textarea {
line-height: lh(); line-height: lh();
padding: 15px; padding: 15px;
width: 100%; width: 100%;
} }
// Extends // Extends
...@@ -99,6 +111,7 @@ textarea { ...@@ -99,6 +111,7 @@ textarea {
&:hover { &:hover {
background: lighten($yellow, 10%); background: lighten($yellow, 10%);
} }
button { button {
padding: 4px 10px; padding: 4px 10px;
} }
......
section.cal { section.cal {
@include box-sizing(border-box); @include box-sizing(border-box);
padding: 25px;
@include clearfix; @include clearfix;
padding: 25px;
> header { > header {
@include clearfix; @include clearfix;
...@@ -62,8 +62,8 @@ section.cal { ...@@ -62,8 +62,8 @@ section.cal {
@include box-sizing(border-box); @include box-sizing(border-box);
float: left; float: left;
width: flex-grid(3) + ((flex-gutter() * 3) / 4); width: flex-grid(3) + ((flex-gutter() * 3) / 4);
background-color: lighten($light-blue, 2%); background-color: $light-blue;
overflow-y: hidden;
header { header {
border-bottom: 1px solid lighten($dark-blue, 40%); border-bottom: 1px solid lighten($dark-blue, 40%);
...@@ -90,10 +90,6 @@ section.cal { ...@@ -90,10 +90,6 @@ section.cal {
color: #888; color: #888;
border-bottom: 0; border-bottom: 0;
font-size: 12px; font-size: 12px;
&:hover {
background: #fff;
}
} }
} }
} }
......
...@@ -85,6 +85,8 @@ section#unit-wrapper { ...@@ -85,6 +85,8 @@ section#unit-wrapper {
} }
&:hover { &:hover {
background-color: lighten($yellow, 10%);
a.draggable { a.draggable {
opacity: 1; opacity: 1;
} }
...@@ -136,12 +138,16 @@ section#unit-wrapper { ...@@ -136,12 +138,16 @@ section#unit-wrapper {
li { li {
border-bottom: 1px solid darken($light-blue, 8%); border-bottom: 1px solid darken($light-blue, 8%);
background: lighten($light-blue, 2%); background: $light-blue;
&:last-child { &:last-child {
border-bottom: 0; border-bottom: 0;
} }
a {
color: $dark-blue;
}
ul { ul {
list-style: none; list-style: none;
...@@ -153,6 +159,8 @@ section#unit-wrapper { ...@@ -153,6 +159,8 @@ section#unit-wrapper {
} }
&:hover { &:hover {
background-color: lighten($yellow, 10%);
a.draggable { a.draggable {
opacity: 1; opacity: 1;
} }
...@@ -172,14 +180,9 @@ section#unit-wrapper { ...@@ -172,14 +180,9 @@ section#unit-wrapper {
float: right; float: right;
opacity: .3; opacity: .3;
} }
a {
color: #000;
} }
} }
} }
}
} }
} }
} }
......
...@@ -41,7 +41,7 @@ section#unit-wrapper { ...@@ -41,7 +41,7 @@ section#unit-wrapper {
&.save-update { &.save-update {
@extend .button; @extend .button;
margin: -6px -25px -6px 0; margin: -6px -21px -6px 0;
} }
} }
} }
......
...@@ -3,16 +3,16 @@ ...@@ -3,16 +3,16 @@
<h2><a href="/">6.002x circuits and electronics</a></h2> <h2><a href="/">6.002x circuits and electronics</a></h2>
<ul> <ul>
<li> <li>
<a href="#" class="new-module">New Section</a> <a href="#" class="new-module wip">New Module</a>
</li> </li>
<li> <li>
<a href="#" class="new-module">New Unit</a> <a href="#" class="new-module wip">New Unit</a>
</li> </li>
</ul> </ul>
<ul class="user-nav"> <ul class="user-nav">
<li><a href="#">Tasks</a></li> <li><a href="#" class="wip">Tasks</a></li>
<li><a href="#">Settings</a></li> <li><a href="#" class="wip">Settings</a></li>
</ul> </ul>
</nav> </nav>
</header> </header>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment