mbk-lab
/
nextcloud
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

dont resize content div with javascript but use css box-sizing to do it

This commit is contained in:
Bernhard Posselt 2013-01-16 19:38:19 +01:00
parent 1d57a2e2a9
commit b7f507b925
3 changed files with 8 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
core/css/styles.css
View File

@ -94,7 +94,8 @@ input[type="submit"].enabled { background:#66f866; border:1px solid #5e5; -moz-b
/* CONTENT ------------------------------------------------------------------ */ /* CONTENT ------------------------------------------------------------------ */
#controls { padding:0 0.5em; width:100%; top:3.5em; height:2.8em; margin:0; background:#f7f7f7; border-bottom:1px solid #eee; position:fixed; z-index:50; -moz-box-shadow:0 -3px 7px #000; -webkit-box-shadow:0 -3px 7px #000; box-shadow:0 -3px 7px #000; } #controls { padding:0 0.5em; width:100%; top:3.5em; height:2.8em; margin:0; background:#f7f7f7; border-bottom:1px solid #eee; position:fixed; z-index:50; -moz-box-shadow:0 -3px 7px #000; -webkit-box-shadow:0 -3px 7px #000; box-shadow:0 -3px 7px #000; }
#controls .button { display:inline-block; } #controls .button { display:inline-block; }
#content { top:3.5em; left:12.5em; position:absolute; } #content { height: 100%; width: 100%; position: absolute; }
#content-wrapper { height: 100%; width: 100%; padding-top: 3.5em; padding-left: 12.5em; box-sizing: border-box; -moz-box-sizing: border-box; position: absolute;}
#leftcontent, .leftcontent { position:fixed; overflow:auto; top:6.4em; width:20em; background:#f8f8f8; border-right:1px solid #ddd; } #leftcontent, .leftcontent { position:fixed; overflow:auto; top:6.4em; width:20em; background:#f8f8f8; border-right:1px solid #ddd; }
#leftcontent li, .leftcontent li { background:#f8f8f8; padding:.5em .8em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -webkit-transition:background-color 200ms; -moz-transition:background-color 200ms; -o-transition:background-color 200ms; transition:background-color 200ms; } #leftcontent li, .leftcontent li { background:#f8f8f8; padding:.5em .8em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -webkit-transition:background-color 200ms; -moz-transition:background-color 200ms; -o-transition:background-color 200ms; transition:background-color 200ms; }
#leftcontent li:hover, #leftcontent li:active, #leftcontent li.active, .leftcontent li:hover, .leftcontent li:active, .leftcontent li.active { background:#eee; } #leftcontent li:hover, #leftcontent li:active, #leftcontent li.active, .leftcontent li:hover, .leftcontent li:active, .leftcontent li.active { background:#eee; }

9
core/js/js.js
View File

@ -504,6 +504,7 @@ function fillHeight(selector) {
if(selector.outerHeight() > selector.height()){ if(selector.outerHeight() > selector.height()){
selector.css('height', height-(selector.outerHeight()-selector.height()) + 'px'); selector.css('height', height-(selector.outerHeight()-selector.height()) + 'px');
} }
console.warn("This function is deprecated! Use CSS instead");
} }
/** /**
@ -519,17 +520,11 @@ function fillWindow(selector) {
if(selector.outerWidth() > selector.width()){ if(selector.outerWidth() > selector.width()){
selector.css('width', width-(selector.outerWidth()-selector.width()) + 'px'); selector.css('width', width-(selector.outerWidth()-selector.width()) + 'px');
} }
console.warn("This function is deprecated! Use CSS instead");
} }
$(document).ready(function(){ $(document).ready(function(){
$(window).resize(function () {
fillHeight($('#leftcontent'));
fillWindow($('#content'));
fillWindow($('#rightcontent'));
});
$(window).trigger('resize');
if(!SVGSupport()){ //replace all svg images with png images for browser that dont support svg if(!SVGSupport()){ //replace all svg images with png images for browser that dont support svg
replaceSVG(); replaceSVG();
}else{ }else{

2
core/templates/layout.user.php
View File

@ -67,8 +67,10 @@
</ul> </ul>
</div></nav> </div></nav>
<div id="content-wrapper">
<div id="content"> <div id="content">
<?php echo $_['content']; ?> <?php echo $_['content']; ?>
</div> </div>
</div>
</body> </body>
</html> </html>