Show More
@@ -10,14 +10,20 b' define([' | |||||
10 |
|
10 | |||
11 | var Page = function () { |
|
11 | var Page = function () { | |
12 | this.bind_events(); |
|
12 | this.bind_events(); | |
13 |
|
||||
14 | // When the page is ready, resize the header. |
|
|||
15 | var that = this; |
|
|||
16 | $(function() { that._resize_header(); }); |
|
|||
17 | }; |
|
13 | }; | |
18 |
|
14 | |||
19 | Page.prototype.bind_events = function () { |
|
15 | Page.prototype.bind_events = function () { | |
20 | events.on('resize-header.Page', $.proxy(this._resize_header, this)); |
|
16 | // resize site on: | |
|
17 | // - window resize | |||
|
18 | // - header change | |||
|
19 | // - page load | |||
|
20 | var _handle_resize = $.proxy(this._resize_site, this); | |||
|
21 | ||||
|
22 | $(window).resize(_handle_resize); | |||
|
23 | ||||
|
24 | // On document ready, resize codemirror. | |||
|
25 | $(document).ready(_handle_resize); | |||
|
26 | events.on('resize-header.Page', _handle_resize); | |||
21 | }; |
|
27 | }; | |
22 |
|
28 | |||
23 | Page.prototype.show = function () { |
|
29 | Page.prototype.show = function () { | |
@@ -44,12 +50,13 b' define([' | |||||
44 | * Main scripts should call this method after styling everything. |
|
50 | * Main scripts should call this method after styling everything. | |
45 | * TODO: selector are hardcoded, pass as constructor argument |
|
51 | * TODO: selector are hardcoded, pass as constructor argument | |
46 | */ |
|
52 | */ | |
47 | $('div#site').css('display','block'); |
|
53 | $('div#site').css('display', 'block'); | |
|
54 | this._resize_site(); | |||
48 | }; |
|
55 | }; | |
49 |
|
56 | |||
50 |
Page.prototype._resize_ |
|
57 | Page.prototype._resize_site = function() { | |
51 |
// Update the |
|
58 | // Update the site's size. | |
52 |
$(' |
|
59 | $('div#site').height(window.innerHeight - $('#header').height()); | |
53 | }; |
|
60 | }; | |
54 |
|
61 | |||
55 | // Register self in the global namespace for convenience. |
|
62 | // Register self in the global namespace for convenience. |
@@ -14,9 +14,6 b' body {' | |||||
14 | right: 0px; |
|
14 | right: 0px; | |
15 | top: 0px; |
|
15 | top: 0px; | |
16 | bottom: 0px; |
|
16 | bottom: 0px; | |
17 | @media not print { |
|
|||
18 | .vbox(); |
|
|||
19 | } |
|
|||
20 | overflow: visible; |
|
17 | overflow: visible; | |
21 | } |
|
18 | } | |
22 |
|
19 | |||
@@ -81,14 +78,16 b' body {' | |||||
81 | } |
|
78 | } | |
82 |
|
79 | |||
83 | #site { |
|
80 | #site { | |
|
81 | // avoid repaints on size with translateZ(0) | |||
|
82 | -webkit-transform: translateZ(0); | |||
|
83 | -moz-transform: translateZ(0); | |||
|
84 | -ms-transform: translateZ(0); | |||
|
85 | -o-transform: translateZ(0); | |||
|
86 | transform: translateZ(0); | |||
84 | width: 100%; |
|
87 | width: 100%; | |
85 | display: none; |
|
88 | display: none; | |
86 | .border-box-sizing(); |
|
89 | .border-box-sizing(); | |
87 | overflow: auto; |
|
90 | overflow: auto; | |
88 | @media not print { |
|
|||
89 | flex: 1; |
|
|||
90 | height: 0px; // triggers overflow, but overridded by flex |
|
|||
91 | } |
|
|||
92 | } |
|
91 | } | |
93 |
|
92 | |||
94 | /* Smaller buttons */ |
|
93 | /* Smaller buttons */ |
@@ -90,7 +90,7 b' require([' | |||||
90 | // height twice. Once for top padding and once for bottom padding. |
|
90 | // height twice. Once for top padding and once for bottom padding. | |
91 | $('div.CodeMirror').height(window.innerHeight - header.height() - 2*header_margin_bottom); |
|
91 | $('div.CodeMirror').height(window.innerHeight - header.height() - 2*header_margin_bottom); | |
92 | }; |
|
92 | }; | |
93 |
window. |
|
93 | $(window).resize(_handle_resize); | |
94 |
|
94 | |||
95 | // On document ready, resize codemirror. |
|
95 | // On document ready, resize codemirror. | |
96 | $(document).ready(_handle_resize); |
|
96 | $(document).ready(_handle_resize); |
@@ -8,7 +8,7 b" define(['jquery'], function($){" | |||||
8 | * Public constructor. |
|
8 | * Public constructor. | |
9 | */ |
|
9 | */ | |
10 | this.notebook = notebook; |
|
10 | this.notebook = notebook; | |
11 |
this.element = $(' |
|
11 | this.element = $('#site'); | |
12 | options = options || {}; |
|
12 | options = options || {}; | |
13 | this.animation_speed = options.animation_speed || 250; //ms |
|
13 | this.animation_speed = options.animation_speed || 250; //ms | |
14 | }; |
|
14 | }; |
@@ -5,7 +5,7 b'' | |||||
5 | .navbar { |
|
5 | .navbar { | |
6 | border-top: 1px; |
|
6 | border-top: 1px; | |
7 | border-radius: 0px 0px @border-radius-base @border-radius-base; |
|
7 | border-radius: 0px 0px @border-radius-base @border-radius-base; | |
8 |
margin-bottom: |
|
8 | margin-bottom: 0px; | |
9 | } |
|
9 | } | |
10 |
|
10 | |||
11 | .navbar-toggle { |
|
11 | .navbar-toggle { |
@@ -8267,24 +8267,6 b' body {' | |||||
8267 | bottom: 0px; |
|
8267 | bottom: 0px; | |
8268 | overflow: visible; |
|
8268 | overflow: visible; | |
8269 | } |
|
8269 | } | |
8270 | @media not print { |
|
|||
8271 | body { |
|
|||
8272 | /* Old browsers */ |
|
|||
8273 | display: -webkit-box; |
|
|||
8274 | -webkit-box-orient: vertical; |
|
|||
8275 | -webkit-box-align: stretch; |
|
|||
8276 | display: -moz-box; |
|
|||
8277 | -moz-box-orient: vertical; |
|
|||
8278 | -moz-box-align: stretch; |
|
|||
8279 | display: box; |
|
|||
8280 | box-orient: vertical; |
|
|||
8281 | box-align: stretch; |
|
|||
8282 | /* Modern browsers */ |
|
|||
8283 | display: flex; |
|
|||
8284 | flex-direction: column; |
|
|||
8285 | align-items: stretch; |
|
|||
8286 | } |
|
|||
8287 | } |
|
|||
8288 | #header { |
|
8270 | #header { | |
8289 | /* Initially hidden to prevent FLOUC */ |
|
8271 | /* Initially hidden to prevent FLOUC */ | |
8290 | display: none; |
|
8272 | display: none; | |
@@ -8342,6 +8324,11 b' body {' | |||||
8342 | height: 28px; |
|
8324 | height: 28px; | |
8343 | } |
|
8325 | } | |
8344 | #site { |
|
8326 | #site { | |
|
8327 | -webkit-transform: translateZ(0); | |||
|
8328 | -moz-transform: translateZ(0); | |||
|
8329 | -ms-transform: translateZ(0); | |||
|
8330 | -o-transform: translateZ(0); | |||
|
8331 | transform: translateZ(0); | |||
8345 | width: 100%; |
|
8332 | width: 100%; | |
8346 | display: none; |
|
8333 | display: none; | |
8347 | box-sizing: border-box; |
|
8334 | box-sizing: border-box; | |
@@ -8349,12 +8336,6 b' body {' | |||||
8349 | -webkit-box-sizing: border-box; |
|
8336 | -webkit-box-sizing: border-box; | |
8350 | overflow: auto; |
|
8337 | overflow: auto; | |
8351 | } |
|
8338 | } | |
8352 | @media not print { |
|
|||
8353 | #site { |
|
|||
8354 | flex: 1; |
|
|||
8355 | height: 0px; |
|
|||
8356 | } |
|
|||
8357 | } |
|
|||
8358 | /* Smaller buttons */ |
|
8339 | /* Smaller buttons */ | |
8359 | .ui-button .ui-button-text { |
|
8340 | .ui-button .ui-button-text { | |
8360 | padding: 0.2em 0.8em; |
|
8341 | padding: 0.2em 0.8em; | |
@@ -10340,7 +10321,7 b' select[multiple].celltoolbar select {' | |||||
10340 | #menubar .navbar { |
|
10321 | #menubar .navbar { | |
10341 | border-top: 1px; |
|
10322 | border-top: 1px; | |
10342 | border-radius: 0px 0px 2px 2px; |
|
10323 | border-radius: 0px 0px 2px 2px; | |
10343 |
margin-bottom: |
|
10324 | margin-bottom: 0px; | |
10344 | } |
|
10325 | } | |
10345 | #menubar .navbar-toggle { |
|
10326 | #menubar .navbar-toggle { | |
10346 | float: left; |
|
10327 | float: left; |
General Comments 0
You need to be logged in to leave comments.
Login now