TPS
/
ORIENT
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixes styling of upload button in Firefox - Refs #1202

This commit is contained in:
Samuel Georges 2015-06-27 11:35:55 +10:00
parent ba9843bea7
commit 3681459935
9 changed files with 76 additions and 118 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

71
modules/backend/formwidgets/fileupload/assets/css/fileupload.css
View File

@ -225,34 +225,28 @@
width: 76px;
height: 76px;
}
.field-fileupload.style-image-multi .upload-button table {
.field-fileupload.style-image-multi .upload-button .upload-button-icon {
position: absolute;
height: 100%;
width: 100%;
width: 22px;
height: 22px;
top: 50%;
left: 50%;
margin-top: -11px;
margin-left: -11px;
}
.field-fileupload.style-image-multi .upload-button table td {
line-height: 16px;
font-size: 11px;
vertical-align: middle;
height: 100%;
}
.field-fileupload.style-image-multi .upload-button table td:before {
.field-fileupload.style-image-multi .upload-button .upload-button-icon:before {
text-align: center;
width: 100%;
display: block;
font-size: 22px;
height: 22px;
width: 22px;
line-height: 22px;
color: rgba(0, 0, 0, 0.1);
vertical-align: middle;
}
.field-fileupload.style-image-multi .upload-button table td span {
display: block;
padding: 10px;
text-align: center;
}
.field-fileupload.style-image-multi .upload-button:hover {
border: 2px dotted rgba(0, 0, 0, 0.2);
}
.field-fileupload.style-image-multi .upload-button:hover table td:before {
.field-fileupload.style-image-multi .upload-button:hover .upload-button-icon:before {
color: #5cb85c;
color: rgba(0, 0, 0, 0.2);
}
@ -260,7 +254,7 @@
border: 2px solid rgba(0, 0, 0, 0.3);
background: transparent;
}
.field-fileupload.style-image-multi .upload-button:focus table td:before {
.field-fileupload.style-image-multi .upload-button:focus .upload-button-icon:before {
color: #5cb85c;
color: rgba(0, 0, 0, 0.2);
}
@ -382,35 +376,31 @@
border: 2px dotted rgba(0, 0, 0, 0.1);
position: relative;
outline: none;
min-height: 100px;
min-width: 100px;
}
.field-fileupload.style-image-single .upload-button table {
.field-fileupload.style-image-single .upload-button .upload-button-icon {
position: absolute;
height: 100%;
width: 100%;
width: 22px;
height: 22px;
top: 50%;
left: 50%;
margin-top: -11px;
margin-left: -11px;
}
.field-fileupload.style-image-single .upload-button table td {
line-height: 16px;
font-size: 11px;
vertical-align: middle;
height: 100%;
}
.field-fileupload.style-image-single .upload-button table td:before {
.field-fileupload.style-image-single .upload-button .upload-button-icon:before {
text-align: center;
width: 100%;
display: block;
font-size: 22px;
height: 22px;
width: 22px;
line-height: 22px;
color: rgba(0, 0, 0, 0.1);
vertical-align: middle;
}
.field-fileupload.style-image-single .upload-button table td span {
display: block;
padding: 10px;
text-align: center;
}
.field-fileupload.style-image-single .upload-button:hover {
border: 2px dotted rgba(0, 0, 0, 0.2);
}
.field-fileupload.style-image-single .upload-button:hover table td:before {
.field-fileupload.style-image-single .upload-button:hover .upload-button-icon:before {
color: #5cb85c;
color: rgba(0, 0, 0, 0.2);
}
@ -418,15 +408,10 @@
border: 2px solid rgba(0, 0, 0, 0.3);
background: transparent;
}
.field-fileupload.style-image-single .upload-button:focus table td:before {
.field-fileupload.style-image-single .upload-button:focus .upload-button-icon:before {
color: #5cb85c;
color: rgba(0, 0, 0, 0.2);
}
.field-fileupload.style-image-single .upload-button,
.field-fileupload.style-image-single .upload-button > table {
min-height: 100px;
min-width: 100px;
}
.field-fileupload.style-image-single .upload-object {
padding-bottom: 66px;
}

33
modules/backend/formwidgets/fileupload/assets/less/fileupload.base.less
View File

@ -41,38 +41,31 @@
border: 2px dotted rgba(0,0,0,.1);
position: relative;
outline: none;
table {
position: absolute;
height: 100%;
width: 100%;
}
table td {
line-height: 16px;
font-size: 11px;
vertical-align: middle;
height: 100%;
.upload-button-icon {
position: absolute;
width: 22px;
height: 22px;
top: 50%;
left: 50%;
margin-top: -11px;
margin-left: -11px;
&:before {
text-align: center;
width: 100%;
display: block;
font-size: 22px;
height: 22px;
width: 22px;
line-height: 22px;
color: rgba(0,0,0,.1);
vertical-align: middle;
}
span {
display: block;
padding: 10px;
text-align: center;
}
}
&:hover {
border: 2px dotted rgba(0,0,0,.2);
table td:before {
.upload-button-icon:before {
color: @brand-success;
color: rgba(0,0,0,.2);
}
@ -82,7 +75,7 @@
border: 2px solid rgba(0,0,0,.3);
background: transparent;
table td:before {
.upload-button-icon:before {
color: @brand-success;
color: rgba(0,0,0,.2);
}

6
modules/backend/formwidgets/fileupload/assets/less/fileupload.imagesingle.less
View File

@ -11,10 +11,8 @@
.upload-button {
.uploader-block-button();
&, > table {
min-height: 100px;
min-width: 100px;
}
min-height: 100px;
min-width: 100px;
}
.upload-object {

2
modules/backend/formwidgets/fileupload/partials/_image_multi.htm
View File

@ -12,7 +12,7 @@
<!-- Upload Button -->
<a href="javascript:;" class="upload-button">
<table><tr><td class="oc-<?= $emptyIcon ?>"></td></tr></table>
<span class="upload-button-icon oc-<?= $emptyIcon ?>"></span>
</a>
<!-- Existing files -->

2
modules/backend/formwidgets/fileupload/partials/_image_single.htm
View File

@ -14,7 +14,7 @@
href="javascript:;"
style="<?= $cssDimensions ?>"
class="upload-button">
<table><tr><td class="oc-<?= $emptyIcon ?>"></td></tr></table>
<span class="upload-button-icon oc-<?= $emptyIcon ?>"></span>
</a>
<!-- Existing file -->

39
modules/cms/formwidgets/mediafinder/assets/css/mediafinder.css
View File

@ -59,35 +59,31 @@
border: 2px dotted rgba(0, 0, 0, 0.1);
position: relative;
outline: none;
min-height: 100px;
min-width: 100px;
}
.field-mediafinder.style-image-single .find-button table {
.field-mediafinder.style-image-single .find-button .find-button-icon {
position: absolute;
height: 100%;
width: 100%;
width: 22px;
height: 22px;
top: 50%;
left: 50%;
margin-top: -11px;
margin-left: -11px;
}
.field-mediafinder.style-image-single .find-button table td {
line-height: 16px;
font-size: 11px;
vertical-align: middle;
height: 100%;
}
.field-mediafinder.style-image-single .find-button table td:before {
.field-mediafinder.style-image-single .find-button .find-button-icon:before {
text-align: center;
width: 100%;
display: block;
font-size: 22px;
height: 22px;
width: 22px;
line-height: 22px;
color: rgba(0, 0, 0, 0.1);
vertical-align: middle;
}
.field-mediafinder.style-image-single .find-button table td span {
display: block;
padding: 10px;
text-align: center;
}
.field-mediafinder.style-image-single .find-button:hover {
border: 2px dotted rgba(0, 0, 0, 0.2);
}
.field-mediafinder.style-image-single .find-button:hover table td:before {
.field-mediafinder.style-image-single .find-button:hover .find-button-icon:before {
color: #5cb85c;
color: rgba(0, 0, 0, 0.2);
}
@ -95,15 +91,10 @@
border: 2px solid rgba(0, 0, 0, 0.3);
background: transparent;
}
.field-mediafinder.style-image-single .find-button:focus table td:before {
.field-mediafinder.style-image-single .find-button:focus .find-button-icon:before {
color: #5cb85c;
color: rgba(0, 0, 0, 0.2);
}
.field-mediafinder.style-image-single .find-button,
.field-mediafinder.style-image-single .find-button > table {
min-height: 100px;
min-width: 100px;
}
.field-mediafinder.style-image-single .find-object {
display: none;
padding-bottom: 39px;

33
modules/cms/formwidgets/mediafinder/assets/less/mediafinder.base.less
View File

@ -4,38 +4,31 @@
border: 2px dotted rgba(0,0,0,.1);
position: relative;
outline: none;
table {
position: absolute;
height: 100%;
width: 100%;
}
table td {
line-height: 16px;
font-size: 11px;
vertical-align: middle;
height: 100%;
.find-button-icon {
position: absolute;
width: 22px;
height: 22px;
top: 50%;
left: 50%;
margin-top: -11px;
margin-left: -11px;
&:before {
text-align: center;
width: 100%;
display: block;
font-size: 22px;
height: 22px;
width: 22px;
line-height: 22px;
color: rgba(0,0,0,.1);
vertical-align: middle;
}
span {
display: block;
padding: 10px;
text-align: center;
}
}
&:hover {
border: 2px dotted rgba(0,0,0,.2);
table td:before {
.find-button-icon:before {
color: @brand-success;
color: rgba(0,0,0,.2);
}
@ -45,7 +38,7 @@
border: 2px solid rgba(0,0,0,.3);
background: transparent;
table td:before {
.find-button-icon:before {
color: @brand-success;
color: rgba(0,0,0,.2);
}

6
modules/cms/formwidgets/mediafinder/assets/less/mediafinder.imagesingle.less
View File

@ -3,10 +3,8 @@
.find-button {
.finder-block-button();
&, > table {
min-height: 100px;
min-width: 100px;
}
min-height: 100px;
min-width: 100px;
}
.find-object {

2
modules/cms/formwidgets/mediafinder/partials/_image_single.htm
View File

@ -6,7 +6,7 @@
<!-- Find Button -->
<a href="javascript:;" class="find-button">
<table><tr><td class="oc-icon-image"></td></tr></table>
<span class="find-button-icon oc-icon-image"></span>
</a>
<!-- Existing value -->