diff --git a/Gruntfile.js b/Gruntfile.js index f419a734b..94f3b7144 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -62,7 +62,7 @@ module.exports = function (grunt) { general : { expand :true, src : [ - 'UI/Content/base.less', + 'UI/Content/theme.less', 'UI/Content/overrides.less', 'UI/Series/series.less', 'UI/AddSeries/addSeries.less', diff --git a/UI/Calendar/calendar.less b/UI/Calendar/calendar.less index 70c87108d..02d309d6a 100644 --- a/UI/Calendar/calendar.less +++ b/UI/Calendar/calendar.less @@ -28,11 +28,11 @@ } .fc-state-highlight { - background: #f1f1f1; + background : #f1f1f1; } .past { - opacity: 0.8; + opacity : 0.8; } } @@ -44,14 +44,14 @@ padding-top : 10px; h4 { - font-weight : 500; - color : #008dcd; - margin : 5px 0px; + font-weight : 500; + color : #008dcd; + margin : 5px 0px; } p { - color : #999999; - margin: 0px; + color : #999999; + margin : 0px; } .date { @@ -63,10 +63,10 @@ margin-right : 20px; h4 { - line-height : 1em; - color : #555555; - font-weight : 300; - text-transform: uppercase; + line-height : 1em; + color : #555555; + font-weight : 300; + text-transform : uppercase; } h1 { @@ -76,42 +76,45 @@ } .primary { - border-color : @btnPrimaryBackground; + border-color : @btnPrimaryBackground; } .info { - border-color : @btnInfoBackground; + border-color : @btnInfoBackground; } .inverse { - border-color : @btnInverseBackground; + border-color : @btnInverseBackground; } .warning { - border-color : @btnWarningBackground; + border-color : @btnWarningBackground; } .danger { - border-color : @btnDangerBackground; + border-color : @btnDangerBackground; } .success { - border-color : @btnSuccessBackground;; + border-color : @btnSuccessBackground;; } .purple { - border-color : #7932ea; + border-color : #7932ea; } .episode-title { .btn-link; - color: @linkColor; - margin-top: 1px; + color : @linkColor; + margin-top : 1px; .text-overflow; } } -.calendar, { +.calendar { + + background-position : -160px -128px; + .primary { border-color : @btnPrimaryBackground; background-color : @btnPrimaryBackground; @@ -146,4 +149,4 @@ border-color : #7932ea; background-color : #7932ea; } -} \ No newline at end of file +} diff --git a/UI/Content/Overrides/bootstrap.less b/UI/Content/Overrides/bootstrap.less index 707cbf5e4..9a2477e8f 100644 --- a/UI/Content/Overrides/bootstrap.less +++ b/UI/Content/Overrides/bootstrap.less @@ -31,3 +31,13 @@ .slide-button { min-width : 0px; } + +.popover-title { + text-transform : none; +} + +.line &>[class^="icon-"], .line &>[class*=" icon-"] { + margin-top : 1em; + height : 1em; + line-height : 1em; +} diff --git a/UI/Content/Overrides/browser.less b/UI/Content/Overrides/browser.less index 9ce4896b2..236f2f8d8 100644 --- a/UI/Content/Overrides/browser.less +++ b/UI/Content/Overrides/browser.less @@ -10,3 +10,8 @@ button::-moz-focus-inner, a::-moz-focus-inner { a:focus { outline : none; } + +body h1, body h2, body h3, body h4, body h5, body h6 { + text-transform : capitalize; + font-weight : 300; +} diff --git a/UI/Content/base.less b/UI/Content/base.less deleted file mode 100644 index 17a209006..000000000 --- a/UI/Content/base.less +++ /dev/null @@ -1,127 +0,0 @@ -@import "Bootstrap/variables"; -@import "Bootstrap/mixins"; -@import "Bootstrap/type"; -@import "font"; -@import "form"; -@import "theme"; -@import "menu"; -@import "Backgrid/backgrid"; -@import "../Shared/Styles/clickable"; -@import "prefixer"; -@import "icons"; -@import "spinner"; -@import "legend"; - -.progress { - width : 125px; - position : relative; - margin-bottom : 2px; - - .progressbar-back-text, .progressbar-front-text { - font-size : 11.844px; - font-weight: bold; - text-align : center; - } - - .progressbar-back-text { - position : absolute; - width : 100%; - height : 100%; - } - - .progressbar-front-text { - display : block; - width : 125px; - } - .bar { - position : absolute; - overflow : hidden; - } -} - -.backdrop .page { - background-color : transparent; - box-shadow : none; -} - -.line &>[class^="icon-"], .line &>[class*=" icon-"] { - margin-top : 1em; - height : 1em; - line-height : 1em; -} - -#localSeriesLookup { - width : 220px; - border : 0px; - background : rgb(75, 75, 75); - color : rgb(169, 169, 169); - padding : 4px; - font-size : 13px; -} - -.nz-loading { - .text-center; - font-size : 40px; - font-weight : 300; - padding : 30px; -} - -.page-toolbar { - margin-top : 10px; - margin-bottom : 30px; -} - -.page-container { - min-height : 600px; -} - -#scroll-up { - .clickable; - - &:hover { - text-decoration : none; - .opacity (0.4); - } - - .opacity (0.2); - position : fixed; - bottom : 50px; - right : 50px; - display : none; - font-size : 56px; - color : white; -} - -.label-large { - padding : 4px 6px; - font-size : 16px; -} - -th { - &.sortable { - &:hover { - background : @tableBackgroundHover; - } - .clickable(); - - } -} - -#footer-region { - .text-center(); - position : relative; - width : 256px; - margin : 50px auto 0px auto; - display : block; -} - -a, .btn { - i { - cursor: pointer; - } -} - -.label-white { - color: black; - background-color: white; -} \ No newline at end of file diff --git a/UI/Content/menu.less b/UI/Content/menu.less index 36dc4bdee..91f2d9a3b 100644 --- a/UI/Content/menu.less +++ b/UI/Content/menu.less @@ -10,29 +10,6 @@ } } -#nav-region li a { - color : #b9b9b9; -} - -#nav-region li a:focus { - text-decoration : none; -} - -#nav-region { - margin-bottom : 80px; - - .span12 { - margin-left : 0px; - } - - .logo { - margin-top : 25px; - vertical-align : middle; - height : 70px; - width : 70px; - } -} - .backdrop #nav-region { background-color : #000000; .opacity(0.85); @@ -44,6 +21,22 @@ } #nav-region { + + margin-bottom : 80px; + height : 120px; + + .span12 { + margin-left : 0px; + } + + + .logo { + margin-top : 25px; + vertical-align : middle; + height : 70px; + width : 70px; + } + ul { text-align : center; margin-bottom : 10px; @@ -52,13 +45,18 @@ list-style-type : none; display : inline-block; a { + + &:focus { + text-decoration : none; + } + display : block; border-radius : 6px; padding : 15px 10px 5px; min-height : 56px; min-width : 64px; margin : 20px 10px 10px; - color : #ffffff; + color : #b9b9b9; font-weight : 100; } span.label.pull-right { diff --git a/UI/Content/theme.less b/UI/Content/theme.less index d7ac48c8d..327035d3d 100644 --- a/UI/Content/theme.less +++ b/UI/Content/theme.less @@ -1,4 +1,99 @@ -@import "../Shared/Styles/card"; +@import "Bootstrap/variables"; +@import "Bootstrap/mixins"; +@import "Bootstrap/type"; +@import "font"; +@import "form"; +@import "menu"; +@import "Backgrid/backgrid"; +@import "prefixer"; +@import "icons"; +@import "spinner"; +@import "legend"; +@import "../Shared/Styles/clickable"; +@import "../Shared/Styles/card"; + +.progress { + width : 125px; + position : relative; + margin-bottom : 2px; + + .progressbar-back-text, .progressbar-front-text { + font-size : 11.844px; + font-weight : bold; + text-align : center; + } + + .progressbar-back-text { + position : absolute; + width : 100%; + height : 100%; + } + + .progressbar-front-text { + display : block; + width : 125px; + } + .bar { + position : absolute; + overflow : hidden; + } +} + +.backdrop #page { + background-color : transparent; + box-shadow : none; +} + +.page-toolbar { + margin-top : 10px; + margin-bottom : 30px; +} + +#scroll-up { + .clickable; + + &:hover { + text-decoration : none; + .opacity (0.4); + } + + .opacity (0.2); + position : fixed; + bottom : 50px; + right : 50px; + display : none; + font-size : 56px; + color : white; +} + +.label-large { + padding : 4px 6px; + font-size : 16px; +} + +th { + &.sortable { + &:hover { + background : @tableBackgroundHover; + } + .clickable(); + + } +} + + + +a, .btn { + i { + cursor : pointer; + } +} + +.label-white { + color : black; + background-color : white; +} + body { background-color : #1c1c1c; @@ -9,27 +104,6 @@ body { } } - -.calendar { - background-position : -160px -128px; -} - -.panel .primary, .panel .primary h6 { - background-color : #007ccd; -} - -.panel .info, .panel .info h6 { - background-color : #14b8d4; -} - -.message-sidebar a.message-preview p, .message-sidebar a.message-preview h5 { - color : #999999; -} - -ul.stat-list li label, ul.stat-list li h4, ul.stat-list li small, ul.stat-list li p { - display : inline-block; -} - footer { font-size : 13px; font-weight : lighter; @@ -47,30 +121,23 @@ footer { p { margin-bottom : 0px; } + + #footer-region { + .text-center(); + position : relative; + width : 256px; + margin : 50px auto 0px auto; + display : block; + } } -.popover-title { - text-transform : none; -} - -.message-sidebar a.active p, .message-sidebar a.active h5 { - color : rgba(255, 255, 255, 0.8); -} - - - -body h1, body h2, body h3, body h4, body h5, body h6 { - text-transform : capitalize; - font-weight : 300; -} - -.page { - .card(#AAAAAA); - width : 1210px; - min-width : 1210px; - margin : auto; - margin-top : -70px; - padding : 20px 0px; +.started #page { + .card(#aaaaaa); + width : 1210px; + min-width : 1210px; + margin : auto; + margin-top : -70px; + padding : 20px 0px; .header { padding-bottom : 10px; margin-bottom : 20px; diff --git a/UI/Router.js b/UI/Router.js index 7052b939c..76513c471 100644 --- a/UI/Router.js +++ b/UI/Router.js @@ -6,8 +6,9 @@ require( 'Controller', 'Series/SeriesCollection', 'Navbar/NavbarView', - 'jQuery/RouteBinder' - ], function (App, Marionette, Controller, SeriesCollection,NavbarView, RouterBinder) { + 'jQuery/RouteBinder', + 'jquery' + ], function (App, Marionette, Controller, SeriesCollection, NavbarView, RouterBinder, $) { var Router = Marionette.AppRouter.extend({ @@ -36,11 +37,11 @@ require( App.Router = new Router(); - SeriesCollection.fetch() - .done(function(){ + SeriesCollection.fetch().done(function () { Backbone.history.start({ pushState: true }); RouterBinder.bind(App.Router); App.navbarRegion.show(new NavbarView()); + $('body').addClass('started'); }) }); diff --git a/UI/index.html b/UI/index.html index bb088a77f..5a4659fa5 100644 --- a/UI/index.html +++ b/UI/index.html @@ -8,7 +8,7 @@ - + @@ -24,7 +24,7 @@ -
+