Replace input checkbox CSS selector with .electCheckBox

1 files changed, 11 insertions, 15 deletions

diff --git a/apps/files/css/files.css b/apps/files/css/files.css
index 20f402e90b6..d8336847e00 100644
--- a/apps/files/css/files.css
+++ b/apps/files/css/files.css
@@ -357,7 +357,7 @@ table td.filename .uploadtext {
 }
 
 /* File checkboxes */
-#fileList tr td.filename>input[type="checkbox"]:first-child {
+#fileList tr td.filename>.selectCheckBox {
 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 	filter: alpha(opacity=0);
 	opacity: 0;
@@ -366,38 +366,34 @@ table td.filename .uploadtext {
 	margin: 32px 0 4px 32px; /* bigger clickable area doesn’t work in FF width:2.8em; height:2.4em;*/
 }
 /* Show checkbox when hovering, checked, or selected */
-#fileList tr:hover td.filename>input[type="checkbox"]:first-child,
-#fileList tr:focus td.filename>input[type="checkbox"]:first-child,
-#fileList tr td.filename>input[type="checkbox"]:checked:first-child,
-#fileList tr.selected td.filename>input[type="checkbox"]:first-child {
+#fileList tr:hover td.filename>.selectCheckBox,
+#fileList tr:focus td.filename>.selectCheckBox,
+#fileList tr td.filename>.selectCheckBox:checked,
+#fileList tr.selected td.filename>.selectCheckBox {
 	opacity: 1;
 }
-.lte9 #fileList tr:hover td.filename>input[type="checkbox"]:first-child,
-.lte9 #fileList tr:focus td.filename>input[type="checkbox"]:first-child,
-.lte9 #fileList tr td.filename>input[type="checkbox"][checked=checked]:first-child,
-.lte9 #fileList tr.selected td.filename>input[type="checkbox"]:first-child {
+.lte9 #fileList tr:hover td.filename>.selectCheckBox,
+.lte9 #fileList tr:focus td.filename>.selectCheckBox,
+.lte9 #fileList tr td.filename>.selectCheckBox[checked=checked],
+.lte9 #fileList tr.selected td.filename>.selectCheckBox {
 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 	filter: alpha(opacity=100);
 }
 
 /* Use label to have bigger clickable size for checkbox */
-#fileList tr td.filename>input[type="checkbox"] + label,
+#fileList tr td.filename>.selectCheckBox + label,
 .select-all + label {
 	height: 50px;
 	position: absolute;
 	width: 50px;
 	z-index: 5;
 }
-#fileList tr td.filename>input[type="checkbox"]{
+#fileList tr td.filename>.selectCheckBox {
 	/* sometimes checkbox height is bigger (KDE/Qt), so setting to absolute
 	 * to prevent it to increase the height */
 	position: absolute;
 	z-index: 10;
 }
-#fileList tr td.filename>input[type="checkbox"] + label {
-	left: 0;
-	top: 0;
-}
 .select-all + label {
 	top: 0;
 }