mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-10-22 14:05:37 +02:00
BUG: Display of AssetUpload upload fields
* Replaced file upload icon * Fixed padding * Replaced width of droparea with min-width
This commit is contained in:
parent
9273df15ff
commit
8235afc3b7
@ -68,17 +68,17 @@ body.cms.ss-uploadfield-edit-iframe .fieldholder-small label, .composite.ss-asse
|
|||||||
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-progress .ss-uploadfield-item-progressbarvalue { width: 0; background: #60b3dd url(../images/progressbar_blue.gif) repeat left center; }
|
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-progress .ss-uploadfield-item-progressbarvalue { width: 0; background: #60b3dd url(../images/progressbar_blue.gif) repeat left center; }
|
||||||
.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 { /* 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 iframe { width: 100%; }
|
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-editform iframe { width: 100%; }
|
||||||
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-info { float: left; margin: 10px 0 0; }
|
.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-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: 8px 16px; margin-right: 0px; }
|
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-info label { font-size: 18px; line-height: 30px; padding: 0px 16px; margin-right: 0px; }
|
||||||
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-fromcomputer { /*position: relative; */ overflow: hidden; display: block; }
|
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-fromcomputer { /*position: relative; */ overflow: hidden; display: block; }
|
||||||
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-fromcomputer .btn-icon-drive-upload-large { background: url(../images/drive-upload-large.png) no-repeat 0px -4px; width: 32px; height: 32px; margin-top: -12px; }
|
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-fromcomputer .btn-icon-drive-upload-large { background: url(../images/drive-upload-white.png) no-repeat 0px 0px; width: 32px; height: 32px; margin-top: -12px; }
|
||||||
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-uploador { float: left; font-weight: bold; font-size: 22px; padding: 0 20px; line-height: 70px; margin-top: 4px; display: none; }
|
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-uploador { float: left; font-weight: bold; font-size: 22px; padding: 0 20px; line-height: 70px; margin-top: 10px; display: none; }
|
||||||
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-uploador { font-size: 18px; margin-top: 0; }
|
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-uploador { font-size: 18px; margin-top: -5px; }
|
||||||
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone { margin-top: 9px; -webkit-border-radius: 13px; -moz-border-radius: 13px; -ms-border-radius: 13px; -o-border-radius: 13px; border-radius: 13px; -webkit-box-shadow: rgba(128, 128, 128, 0.4) 0 0 4px 0 inset, 0 1px 0 #fafafa; -moz-box-shadow: rgba(128, 128, 128, 0.4) 0 0 4px 0 inset, 0 1px 0 #fafafa; box-shadow: rgba(128, 128, 128, 0.4) 0 0 4px 0 inset, 0 1px 0 #fafafa; border: 2px dashed gray; background: #d4dbe0; display: none; height: 54px; width: 360px; float: left; text-align: center; }
|
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone { margin-top: 9px; padding: 8px 0; -webkit-border-radius: 13px; -moz-border-radius: 13px; -ms-border-radius: 13px; -o-border-radius: 13px; border-radius: 13px; -webkit-box-shadow: rgba(128, 128, 128, 0.4) 0 0 4px 0 inset, 0 1px 0 #fafafa; -moz-box-shadow: rgba(128, 128, 128, 0.4) 0 0 4px 0 inset, 0 1px 0 #fafafa; box-shadow: rgba(128, 128, 128, 0.4) 0 0 4px 0 inset, 0 1px 0 #fafafa; border: 2px dashed gray; background: #d4dbe0; display: none; height: 54px; min-width: 280px; float: left; text-align: center; }
|
||||||
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone.active.hover { -webkit-box-shadow: rgba(255, 255, 255, 0.6) 0 0 3px 2px inset; -moz-box-shadow: rgba(255, 255, 255, 0.6) 0 0 3px 2px inset; box-shadow: rgba(255, 255, 255, 0.6) 0 0 3px 2px inset; }
|
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone.active.hover { -webkit-box-shadow: rgba(255, 255, 255, 0.6) 0 0 3px 2px inset; -moz-box-shadow: rgba(255, 255, 255, 0.6) 0 0 3px 2px inset; box-shadow: rgba(255, 255, 255, 0.6) 0 0 3px 2px inset; }
|
||||||
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone div { color: #5e5e5e; text-shadow: 0px 1px 0px #fff; background: url("../images/upload.png") 0 10px no-repeat; z-index: 1; padding: 6px 48px 0; line-height: 25px; font-size: 20px; font-weight: bold; display: inline-block; }
|
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone div { color: #5e5e5e; text-shadow: 0px 1px 0px #fff; background: url("../images/upload.png") 0 10px no-repeat; z-index: 1; padding: 6px 48px 0; line-height: 25px; font-size: 20px; font-weight: bold; display: inline-block; }
|
||||||
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone div span { display: block; font-size: 12px; z-index: -1; margin-top: -3px; }
|
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone div span { display: block; font-size: 12px; z-index: -1; margin-top: -3px; }
|
||||||
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone { height: 54px; width: 277px; overflow: hidden; }
|
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone { height: 54px; min-width: 250px; overflow: hidden; padding: 0; margin-top: 2px; }
|
||||||
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone div { background-position: 0 11px; padding-top: 21px; margin-left: 33px; }
|
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone div { background-position: 0 11px; padding-top: 21px; margin-left: 33px; }
|
||||||
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone div span { height: 38px; font-size: 18px; line-height: 18px; }
|
.ss-insert-media .ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-dropzone div span { height: 38px; font-size: 18px; line-height: 18px; }
|
||||||
|
BIN
images/drive-upload-white.png
Executable file
BIN
images/drive-upload-white.png
Executable file
Binary file not shown.
After Width: | Height: | Size: 279 B |
@ -274,14 +274,14 @@ body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fie
|
|||||||
|
|
||||||
.ss-uploadfield-item-info {
|
.ss-uploadfield-item-info {
|
||||||
float: left;
|
float: left;
|
||||||
margin: 10px 0 0;
|
margin: 25px 0 0;
|
||||||
.ss-insert-media &{
|
.ss-insert-media &{
|
||||||
margin: 10px 0px 0 20px;
|
margin: 10px 0px 0 20px;
|
||||||
}
|
}
|
||||||
label{
|
label{
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
line-height: 30px;
|
line-height: 30px;
|
||||||
padding: 8px 16px;
|
padding: 0px 16px;
|
||||||
margin-right:0px;
|
margin-right:0px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -290,7 +290,7 @@ body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fie
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
display: block;
|
display: block;
|
||||||
.btn-icon-drive-upload-large {
|
.btn-icon-drive-upload-large {
|
||||||
background: url(../images/drive-upload-large.png) no-repeat 0px -4px;
|
background: url(../images/drive-upload-white.png) no-repeat 0px 0px;
|
||||||
width:32px;
|
width:32px;
|
||||||
height:32px;
|
height:32px;
|
||||||
margin-top:-12px;
|
margin-top:-12px;
|
||||||
@ -302,22 +302,23 @@ body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fie
|
|||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
padding: 0 20px;
|
padding: 0 20px;
|
||||||
line-height: 70px;
|
line-height: 70px;
|
||||||
margin-top:4px;
|
margin-top:10px;
|
||||||
display: none;
|
display: none;
|
||||||
.ss-insert-media &{
|
.ss-insert-media &{
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
margin-top: 0;
|
margin-top: -5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.ss-uploadfield-dropzone {
|
.ss-uploadfield-dropzone {
|
||||||
margin-top:9px;
|
margin-top:9px;
|
||||||
|
padding: 8px 0;
|
||||||
@include border-radius(13px);
|
@include border-radius(13px);
|
||||||
@include box-shadow(rgba($color-medium-separator, 0.4) 0 0 4px 0 inset, 0 1px 0 #FAFAFA);
|
@include box-shadow(rgba($color-medium-separator, 0.4) 0 0 4px 0 inset, 0 1px 0 #FAFAFA);
|
||||||
border: 2px dashed $color-medium-separator;
|
border: 2px dashed $color-medium-separator;
|
||||||
background: lighten($color-base,12%);
|
background: lighten($color-base,12%);
|
||||||
display: none;
|
display: none;
|
||||||
height: 54px;
|
height: 54px;
|
||||||
width: 360px;
|
min-width: 280px;
|
||||||
float: left;
|
float: left;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
@ -345,9 +346,10 @@ body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fie
|
|||||||
}
|
}
|
||||||
.ss-insert-media &{
|
.ss-insert-media &{
|
||||||
height: 54px;
|
height: 54px;
|
||||||
width: 277px; //Design has these smaller than main upload area
|
min-width: 250px; //Design has these smaller than main upload area
|
||||||
overflow:hidden;
|
overflow:hidden;
|
||||||
|
padding:0;
|
||||||
|
margin-top:2px;
|
||||||
div{
|
div{
|
||||||
background-position:0 11px;
|
background-position:0 11px;
|
||||||
padding-top:21px;
|
padding-top:21px;
|
||||||
|
Loading…
Reference in New Issue
Block a user