tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-10-22 14:05:37 +02:00
Code Issues Projects Releases Wiki Activity

Fix: Incorrect calculation of UploadField height (fixes #2862)

Browse Source
This commit is contained in:
Loz Calver 2014-02-18 22:20:18 +00:00
parent 15c03bcb46
commit 58f8c2944a
3 changed files with 22 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
css/AssetUploadField.css
View File

@ -19,10 +19,12 @@ Used in side panels and action tabs
#Form_EditorToolbarMediaForm .ui-tabs-panel { padding-left: 0px; }
body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fieldset { padding: 16px; overflow: auto; background: #E2E2E2; }
body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fieldset { overflow: auto; background: #E2E2E2; }
body.cms.ss-uploadfield-edit-iframe span.readonly, .composite.ss-assetuploadfield .details fieldset span.readonly { font-style: italic; color: #777777; text-shadow: 0px 1px 0px #fff; }
body.cms.ss-uploadfield-edit-iframe .fieldholder-small label, .composite.ss-assetuploadfield .details fieldset .fieldholder-small label { margin-left: 0; }
.composite.ss-assetuploadfield .details fieldset { padding: 16px; }
.ss-assetuploadfield h3 { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); margin: 0 0 8px; padding: 0 0 7px; clear: both; position: relative; }
.ss-assetuploadfield .field { border-bottom: 0; box-shadow: none; }
.ss-assetuploadfield .fileOverview { clear: both; margin-top: 10px; position: relative; }
@ -69,7 +71,7 @@ body.cms.ss-uploadfield-edit-iframe .fieldholder-small label, .composite.ss-asse
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-editform { /* don't use display none, for it will break jQuery('iframe').contents().height() */ height: 0; overflow: hidden; clear: both; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-editform.loading { width: 100%; height: 22px; padding: 15px 0; background: url(../admin/images/spinner.gif) no-repeat 50% 50%; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-editform.loading iframe { /* Old IE needs this or it'll give the iframe a white background, covering the spinner */ padding-top: 0; margin-top: 37px; border: none; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-editform iframe { width: 100%; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-editform iframe { width: 100%; padding: 16px; background: #E2E2E2; }
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-info { float: left; margin: 25px 0 0; }
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-info { margin: 10px 0px 0 20px; }
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-info label { font-size: 18px; line-height: 30px; padding: 0px 16px; margin-right: 0px; }

28
javascript/UploadField.js
View File

@ -489,27 +489,19 @@
$('div.ss-upload .ss-uploadfield-item-editform').entwine({
fitHeight: function() {
var iframe = this.find('iframe'), padding = 32, parentPadding = 2;
var h = iframe.contents().find('form').height() + padding;
var iframe = this.find('iframe'),
contents = iframe.contents().find('body'),
bodyH = contents.find('form').outerHeight(true), // We set the height to match the form's outer height
iframeH = bodyH + (iframe.outerHeight(true) - iframe.height()), // content's height + padding on iframe elem
containerH = iframeH + (this.outerHeight(true) - this.height()); // iframe height + padding on container elem
if(this.hasClass('includeParent')){
padding=0;
parentPadding=12;
/* Set height of body except in IE8. Setting this in IE8 breaks the dropdown */
if( ! $.browser.msie && $.browser.version.slice(0,3) != "8.0"){
contents.find('body').css({'height': bodyH});
}
/* Set height of body except in IE8. Setting this in IE8 breaks the
dropdown */
if(!$.browser.msie && $.browser.version.slice(0,3) != "8.0"){
iframe.contents().find('body').css({'height':(h-padding)});
}
// Set iframe to match its contents height
iframe.height(h);
// set container to match the same height
iframe.parent().animate({height: h+parentPadding}, 500);
iframe.contents().find('body form').css({'width':'98%'});
iframe.height(iframeH);
this.animate({height: containerH}, 500);
},
toggleEditForm: function() {
var itemInfo = this.prev('.ss-uploadfield-item-info'), status = itemInfo.find('.ss-uploadfield-item-status');

10
scss/AssetUploadField.scss
View File

@ -33,8 +33,7 @@
}
}
body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fieldset {
padding: $grid-x*2;
body.cms.ss-uploadfield-edit-iframe {
overflow: auto;
background: #E2E2E2;
@ -51,6 +50,11 @@ body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fie
}
}
.composite.ss-assetuploadfield .details fieldset {
@extend body.cms.ss-uploadfield-edit-iframe;
padding: $grid-x*2;
}
.ss-assetuploadfield {
h3 {
border-bottom: 1px solid $color-shadow-light;
@ -278,6 +282,8 @@ body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fie
iframe {
width: 100%;
padding: $grid-x*2;
background: #E2E2E2;
}
}
}