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

Merge pull request #379 from adrexia/sapphire

Browse Source 
---

* Added a height to the iframe body for all browsers except IE8, to fix the issue of the iframe not being high enough.
* Changed the place where the background colour of the files iframe was set, as IE browsers wont inherit this from the parent li.
* Replaced the height declaration of the drop-down field with a max-height declaration.
* Set the height of the dropdown field, and its parent to be 150px in IE7, because IE7 has trouble recalculating the height of the parent when the dropdown is initiated. 150px allows for easy navigation of the dropdown list and doesnt break the design (the 200px used in other browsers results in a design that looks broken when the parent is also set to this height)
This commit is contained in:
Ingo Schommer 2012-04-30 09:33:56 +02:00
commit 136b61eaba
5 changed files with 20 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
admin/scss/ie7.scss
View File

@ -27,6 +27,7 @@ html {
}
}
.ss-uploadfield-edit-iframe{
.field {
&.treedropdown{

4
css/AssetUploadField.css
View File

@ -9,10 +9,12 @@
body.cms.ss-uploadfield-edit-iframe { padding: 16px; overflow: auto; }
body.cms.ss-uploadfield-edit-iframe span.readonly { font-style: italic; color: #6a6a6a; }
.ss-uploadfield-edit-iframe { background: #E2E2E2; }
.ss-assetuploadfield h3 { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -o-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; }
.ss-assetuploadfield .field { border-bottom: 0; box-shadow: none; }
.ss-assetuploadfield .ss-uploadfield-files { margin: 0; padding: 0; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item { border: 1px solid #b3b3b3; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; -moz-background-clip: padding; -webkit-background-clip: padding; -o-background-clip: padding-box; -ms-background-clip: padding-box; -khtml-background-clip: padding-box; background-clip: padding-box; background: #E2E2E2; margin: 0 0 5px; padding: 0; overflow: hidden; position: relative; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item { border: 1px solid #b3b3b3; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; -moz-background-clip: padding; -webkit-background-clip: padding; -o-background-clip: padding-box; -ms-background-clip: padding-box; -khtml-background-clip: padding-box; background-clip: padding-box; margin: 0 0 5px; padding: 0; overflow: hidden; position: relative; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-preview { position: absolute; height: 30px; width: 40px; overflow: hidden; z-index: 1; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-info { position: relative; height: 30px; overflow: hidden; background-color: #5db4df; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5db4df), color-stop(8%, #5db1dd), color-stop(50%, #439bcb), color-stop(54%, #3f99cd), color-stop(96%, #207db6), color-stop(100%, #1e7cba)); background-image: -webkit-linear-gradient(top, #5db4df 0%, #5db1dd 8%, #439bcb 50%, #3f99cd 54%, #207db6 96%, #1e7cba 100%); background-image: -moz-linear-gradient(top, #5db4df 0%, #5db1dd 8%, #439bcb 50%, #3f99cd 54%, #207db6 96%, #1e7cba 100%); background-image: -o-linear-gradient(top, #5db4df 0%, #5db1dd 8%, #439bcb 50%, #3f99cd 54%, #207db6 96%, #1e7cba 100%); background-image: -ms-linear-gradient(top, #5db4df 0%, #5db1dd 8%, #439bcb 50%, #3f99cd 54%, #207db6 96%, #1e7cba 100%); background-image: linear-gradient(top, #5db4df 0%, #5db1dd 8%, #439bcb 50%, #3f99cd 54%, #207db6 96%, #1e7cba 100%); }
.ss-assetuploadfield .ss-uploadfield-files .ui-state-error .ss-uploadfield-item-info { background-color: #c11f1d; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #c11f1d), color-stop(4%, #bf1d1b), color-stop(8%, #b71b1c), color-stop(15%, #b61e1d), color-stop(27%, #b11d1d), color-stop(31%, #ab1d1c), color-stop(42%, #a51b1b), color-stop(46%, #9f1b19), color-stop(50%, #9f1b19), color-stop(54%, #991c1a), color-stop(58%, #971a18), color-stop(62%, #911b1b), color-stop(65%, #911b1b), color-stop(88%, #7e1816), color-stop(92%, #771919), color-stop(100%, #731817)); background-image: -webkit-linear-gradient(top, #c11f1d 0%, #bf1d1b 4%, #b71b1c 8%, #b61e1d 15%, #b11d1d 27%, #ab1d1c 31%, #a51b1b 42%, #9f1b19 46%, #9f1b19 50%, #991c1a 54%, #971a18 58%, #911b1b 62%, #911b1b 65%, #7e1816 88%, #771919 92%, #731817 100%); background-image: -moz-linear-gradient(top, #c11f1d 0%, #bf1d1b 4%, #b71b1c 8%, #b61e1d 15%, #b11d1d 27%, #ab1d1c 31%, #a51b1b 42%, #9f1b19 46%, #9f1b19 50%, #991c1a 54%, #971a18 58%, #911b1b 62%, #911b1b 65%, #7e1816 88%, #771919 92%, #731817 100%); background-image: -o-linear-gradient(top, #c11f1d 0%, #bf1d1b 4%, #b71b1c 8%, #b61e1d 15%, #b11d1d 27%, #ab1d1c 31%, #a51b1b 42%, #9f1b19 46%, #9f1b19 50%, #991c1a 54%, #971a18 58%, #911b1b 62%, #911b1b 65%, #7e1816 88%, #771919 92%, #731817 100%); background-image: -ms-linear-gradient(top, #c11f1d 0%, #bf1d1b 4%, #b71b1c 8%, #b61e1d 15%, #b11d1d 27%, #ab1d1c 31%, #a51b1b 42%, #9f1b19 46%, #9f1b19 50%, #991c1a 54%, #971a18 58%, #911b1b 62%, #911b1b 65%, #7e1816 88%, #771919 92%, #731817 100%); background-image: linear-gradient(top, #c11f1d 0%, #bf1d1b 4%, #b71b1c 8%, #b61e1d 15%, #b11d1d 27%, #ab1d1c 31%, #a51b1b 42%, #9f1b19 46%, #9f1b19 50%, #991c1a 54%, #971a18 58%, #911b1b 62%, #911b1b 65%, #7e1816 88%, #771919 92%, #731817 100%); }

23
javascript/UploadField.js
View File

@ -239,23 +239,22 @@
var iframe = this.find('iframe'), padding = 32;
var h = iframe.contents().find('form').height() + padding;
/*Set options for open edit view based on browsers*/
if($.browser.msie && $.browser.version.slice(0,3) == "8.0"){
//set content background, and overflow to auto for IE8
iframe.contents().find('body').css({'overflow':'auto','background-color':'#E2E2E2'});
}else if($.browser.msie && $.browser.version.slice(0,3) == "7.0"){
//set content height and background color
iframe.contents().find('body').css({'height':(h-padding),'background-color':'#E2E2E2'});
}else{
//set content height for real browsers
iframe.contents().find('body').css({'height':h-padding});
/* 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
// set container to match the same height
iframe.contents().find('body form').css({'width':'98%'});
iframe.parent().height(h+2);
iframe.contents().find('body form').css({'width':'98%'});
},
toggleEditForm: function() {
if(this.height() === 0) {

7
scss/AssetUploadField.scss
View File

@ -19,6 +19,10 @@ body.cms.ss-uploadfield-edit-iframe {
}
}
.ss-uploadfield-edit-iframe {
background: #E2E2E2;
}
.ss-assetuploadfield {
h3 {
border-bottom: 1px solid $color-shadow-light;
@ -40,8 +44,7 @@ body.cms.ss-uploadfield-edit-iframe {
.ss-uploadfield-item {
border: 1px solid lighten($color-medium-separator, 20%);
@include border-radius(5px);
@include background-clip(padding-box);
background: #E2E2E2;
@include background-clip(padding-box);
margin: 0 0 5px;
padding: 0;
overflow: hidden;

1
scss/TreeDropdownField.scss
View File

@ -30,7 +30,6 @@ div.TreeDropdownField {
border: 1px solid #aaa;
border-top: none;
margin: 1px 0 0 -1px; /* account for border on container div */
//height: 200px;
max-height:200px;
background-color: #fff;
z-index: 50;