Fixed the background for spectate view

app/styles/base.sass

@@ -97,13 +97,15 @@ a[data-toggle="modal"]
 
 .modal-dialog
   padding: 5px
-
+  margin-top: 0px !important
+  margin-bottom: 0px !important
+  padding-top: 30px
   .background-wrapper
     background: url("/images/pages/base/modal_background.png")
     background-size: 100% 100%
     border: 0
     @include box-shadow(0 0 0 #000)
-    position: absolute
+    //position: absolute
     width: 99%
 
   .modal-content

app/styles/play/level.sass

@@ -1,10 +1,6 @@
 @import "app/styles/bootstrap/mixins"
 @import "app/styles/mixins"
 
-#level-loading-view
-  overflow-x: hidden
-
-
 #level-view
   margin: 0 auto
   @include user-select(none)

app/styles/play/spectate.sass

@@ -23,7 +23,7 @@
       line-height: 15px
       left: 0
 
-  //max-width: 1920px
+  max-width: 1920px
   margin: 0 auto
   @include user-select(none)
   
@@ -31,7 +31,7 @@
     max-height: 1284px
 
   .level-content
-    max-width: 1920px
+    //max-width: 1920px
     position: relative
     margin: 0px auto
 

app/views/kinds/CocoView.coffee

@@ -114,9 +114,9 @@ module.exports = class CocoView extends Backbone.View
     $('#modal-wrapper .modal').modal(modalOptions).on 'hidden.bs.modal', @modalClosed
     window.currentModal = modalView
     @getRootView().stopListeningToShortcuts(true)
-    setTimeout -> 
-      $('.modal').nanoScroller({contentClass:'modal-dialog'})
-    , 1000
+    # setTimeout -> 
+    #   $('.modal').nanoScroller({contentClass:'modal-dialog'})
+    # , 1000
 
   modalClosed: =>
     visibleModal.willDisappear() if visibleModal

vendor/styles/nanoscroller.scss

@@ -205,68 +205,68 @@ body {
     }
 }
 
-.modal{
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    overflow: hidden;
+// .modal-content{
+//     width: 100%;
+//     height: 100%;
+//     position: absolute;
+//     overflow: hidden;
 
-    .modal-dialog {
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-        overflow: scroll;
-        overflow-x: hidden;
+//     .modal-body {
+//         // position: absolute;
+//         top: 0;
+//         right: 0;
+//         bottom: 0;
+//         left: 0;
+//         overflow: scroll;
+//         overflow-x: hidden;
 
-        &:focus {
-            outline: thin dotted;
-        }
+//         &:focus {
+//             outline: thin dotted;
+//         }
 
-        &::-webkit-scrollbar {
-            visibility: hidden;
-        }
-    }
+//         &::-webkit-scrollbar {
+//             visibility: hidden;
+//         }
+//     }
 
-    > .#{$paneClass} {
-        width: 10px;
-        background: rgba(255,255,255,.6);
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        -webkit-transition: .2s;
-           -moz-transition: .2s;
-             -o-transition: .2s;
-                transition: .2s;
-        -webkit-border-radius: 5px;
-           -moz-border-radius: 5px;
-                border-radius: 5px;
-        visibility: hidden\9; // Target only IE7 and IE8 with this hack
-        opacity: .01;
+//     > .#{$paneClass} {
+//         width: 10px;
+//         background: rgba(255,255,255,.6);
+//         position: absolute;
+//         top: 0;
+//         right: 0;
+//         bottom: 0;
+//         -webkit-transition: .2s;
+//            -moz-transition: .2s;
+//              -o-transition: .2s;
+//                 transition: .2s;
+//         -webkit-border-radius: 5px;
+//            -moz-border-radius: 5px;
+//                 border-radius: 5px;
+//         visibility: hidden\9; // Target only IE7 and IE8 with this hack
+//         opacity: .01;
 
-        > .#{$sliderClass} {
-            background: #444;
-            background: rgba(0,0,0,.5);
-            position: relative;
-            margin: 0 1px;
-            -webkit-border-radius: 3px;
-               -moz-border-radius: 3px;
-                    border-radius: 3px;
-        }
-    }
-}
+//         > .#{$sliderClass} {
+//             background: #444;
+//             background: rgba(0,0,0,.5);
+//             position: relative;
+//             margin: 0 1px;
+//             -webkit-border-radius: 3px;
+//                -moz-border-radius: 3px;
+//                     border-radius: 3px;
+//         }
+//     }
+// }
 
-.has-scrollbar > .modal-dialog::-webkit-scrollbar {
-    visibility: visible;
-}
+// .has-scrollbar > .modal-body::-webkit-scrollbar {
+//     visibility: visible;
+// }
 
-.#{$paneClass} {
-    .modal:hover > &,
-    &.active,
-    &.flashed {
-        visibility: visible\9; // Target only IE7 and IE8 with this hack
-        opacity: 0.99;
-    }
-}
+// .#{$paneClass} {
+//     .modal-content:hover > &,
+//     &.active,
+//     &.flashed {
+//         visibility: visible\9; // Target only IE7 and IE8 with this hack
+//         opacity: 0.99;
+//     }
+// }