Skip to content
This repository
Browse code

CSS fixes for Batchactions.

On some browsers Batchactions block looked OK, but on others (e.t. Opera on Linux) every element in Batchactions block had different height.
The height of these elements was related to font size which is a little bit different on every OS'es and browsers.

See #1132
  • Loading branch information...
commit ebe41cdadf772da04533e8a4a42067880dbee0e6 1 parent b76f18e
Elvinas L. authored chillu committed
9  admin/css/screen.css
@@ -514,16 +514,19 @@ body.cms { overflow: hidden; }
514 514
 
515 515
 /**  CMS Batch actions */
516 516
 .cms-content-batchactions { float: left; position: relative; display: block; }
517  
-.cms-content-batchactions .view-mode-batchactions-wrapper { float: left; padding: 4px 6px; border: 1px solid #aaa; margin-bottom: 8px; background-color: #D9D9D9; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #d9d9d9)); background-image: -webkit-linear-gradient(top, #ffffff, #d9d9d9); background-image: -moz-linear-gradient(top, #ffffff, #d9d9d9); background-image: -o-linear-gradient(top, #ffffff, #d9d9d9); background-image: linear-gradient(top, #ffffff, #d9d9d9); border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
518  
-.cms-content-batchactions .view-mode-batchactions-wrapper label { display: none; }
  517
+.cms-content-batchactions .view-mode-batchactions-wrapper { height: 18px; float: left; padding: 4px 6px; border: 1px solid #aaa; margin-bottom: 8px; background-color: #D9D9D9; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #d9d9d9)); background-image: -webkit-linear-gradient(top, #ffffff, #d9d9d9); background-image: -moz-linear-gradient(top, #ffffff, #d9d9d9); background-image: -o-linear-gradient(top, #ffffff, #d9d9d9); background-image: linear-gradient(top, #ffffff, #d9d9d9); border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
  518
+.cms-content-batchactions .view-mode-batchactions-wrapper input { vertical-align: middle; }
  519
+.cms-content-batchactions .view-mode-batchactions-wrapper label { vertical-align: middle; display: none; }
519 520
 .cms-content-batchactions .view-mode-batchactions-wrapper fieldset, .cms-content-batchactions .view-mode-batchactions-wrapper .Actions { display: inline-block; }
520 521
 .cms-content-batchactions.inactive .view-mode-batchactions-wrapper { border-radius: 4px; }
521 522
 .cms-content-batchactions.inactive .view-mode-batchactions-wrapper label { display: inline; }
522 523
 .cms-content-batchactions form > * { display: block; float: left; }
523 524
 .cms-content-batchactions form.cms-batch-actions { float: left; }
524 525
 .cms-content-batchactions.inactive form { display: none; }
  526
+.cms-content-batchactions .chzn-container-single { display: block; }
525 527
 .cms-content-batchactions .chzn-container-single .chzn-single { margin-left: -1px; border-radius: 0; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #d9d9d9)); background-image: -webkit-linear-gradient(top, #ffffff, #d9d9d9); background-image: -moz-linear-gradient(top, #ffffff, #d9d9d9); background-image: -o-linear-gradient(top, #ffffff, #d9d9d9); background-image: linear-gradient(top, #ffffff, #d9d9d9); }
526  
-.cms-content-batchactions .cms-batch-actions .Actions .ss-ui-button { margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }
  528
+.cms-content-batchactions .chzn-container-single .chzn-single span { padding-top: 0; }
  529
+.cms-content-batchactions .cms-batch-actions .Actions .ss-ui-button { padding-top: 4px; padding-bottom: 4px; height: 28px; margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }
527 530
 .cms-content-batchactions .cms-batch-actions .Actions .ss-ui-button.ui-state-disabled { opacity: 1; color: #ccc; }
528 531
 
529 532
 #Form_BatchActionsForm select { width: 200px; }
33  admin/scss/_style.scss
@@ -823,6 +823,7 @@ body.cms {
823 823
 	display: block;
824 824
 
825 825
 	.view-mode-batchactions-wrapper {
  826
+		height: 18px;
826 827
 		float: left;
827 828
 		padding: 4px 6px;
828 829
 		border: 1px solid #aaa;
@@ -830,9 +831,14 @@ body.cms {
830 831
 		background-color: #D9D9D9;
831 832
 		@include background-image(linear-gradient(top, #fff, #D9D9D9));
832 833
 		border-top-left-radius: 4px;
833  
-		border-bottom-left-radius: 4px;	
  834
+		border-bottom-left-radius: 4px;
  835
+
  836
+		input {
  837
+			vertical-align: middle;
  838
+		}
834 839
 
835 840
 		label {
  841
+			vertical-align: middle;
836 842
 			display: none;
837 843
 		}
838 844
 
@@ -842,18 +848,18 @@ body.cms {
842 848
 	}
843 849
 
844 850
 		&.inactive .view-mode-batchactions-wrapper {
845  
-			border-radius: 4px;		
  851
+			border-radius: 4px;
846 852
 
847 853
 			label {
848 854
 				display: inline;
849 855
 			}
850 856
 		}
851  
-	
  857
+
852 858
 	form > * {
853 859
 		display: block;
854 860
 		float: left;
855 861
 	}
856  
-	
  862
+
857 863
 	form.cms-batch-actions {
858 864
 		float:  left;
859 865
 	}
@@ -862,13 +868,24 @@ body.cms {
862 868
 		display: none;
863 869
 	}
864 870
 
865  
-	.chzn-container-single .chzn-single {
866  
-		margin-left: -1px;
867  
-		border-radius: 0;
868  
-		@include background-image(linear-gradient(top, #fff, #D9D9D9));
  871
+	.chzn-container-single {
  872
+		display: block;
  873
+
  874
+		.chzn-single {
  875
+			margin-left: -1px;
  876
+			border-radius: 0;
  877
+			@include background-image(linear-gradient(top, #fff, #D9D9D9));
  878
+
  879
+			span {
  880
+				padding-top: 0;
  881
+			}
  882
+		}
869 883
 	}
870 884
 
871 885
 	.cms-batch-actions .Actions .ss-ui-button {
  886
+		padding-top: 4px;
  887
+		padding-bottom: 4px;
  888
+		height: 28px;
872 889
 		margin-left: -1px;
873 890
 		border-top-left-radius: 0;
874 891
 		border-bottom-left-radius: 0;

0 notes on commit ebe41cd

Please sign in to comment.
Something went wrong with that request. Please try again.