[ticket/10270] Changing close button for ajax popups

Changed close button for popups to match prosilver style and from img to css, moved color values to colours.css

PHPBB3-10270

phpBB/adm/style/admin.css

@@ -1089,11 +1089,21 @@ input.disabled {
 	padding: 0 25px 20px 25px;
 }
 
-.phpbb_alert img.alert_close {
+.phpbb_alert .alert_close {
+	display: block;
 	float: right;
+	width: 16px;
+	height: 16px;
+	overflow: hidden;
+	text-decoration: none !important;
+	background: transparent url("../images/alert_close.png") 0 0 no-repeat;
 	margin-top: -7px;
-	margin-right: -30px;
+	margin-right: -31px;
 }
+.phpbb_alert .alert_close:hover {
+	background-position: 0 -16px;
+}
+
 
 .phpbb_alert p {
 	margin: 8px 0;

phpBB/adm/style/overall_footer.html

@@ -24,11 +24,11 @@
 		</div>
 
 		<div id="phpbb_alert" class="phpbb_alert" data-l-err="{L_ERROR}" data-l-timeout-processing-req="{L_TIMEOUT_PROCESSING_REQ}">
-			<a href="#"><img src="images/alert_close.png" class="alert_close" /></a>
+			<a href="#" class="alert_close"></a>
 			<h3 class="alert_title"></h3><p class="alert_text"></p>
 		</div>
 		<div id="phpbb_confirm" class="phpbb_alert">
-			<a href="#"><img src="images/alert_close.png" class="alert_close" /></a>
+			<a href="#" class="alert_close"></a>
 			<p class="alert_text"></p>
 			<input type="button" class="button1" value="{L_YES}" />&nbsp;
 			<input type="button" class="button2" value="{L_NO}" />

phpBB/styles/prosilver/template/overall_footer.html

@@ -31,11 +31,11 @@
 	</div>
 
 	<div id="phpbb_alert" class="phpbb_alert" data-l-err="{L_ERROR}" data-l-timeout-processing-req="{L_TIMEOUT_PROCESSING_REQ}">
-		<a href="#"><img src="{T_THEME_PATH}/images/alert_close.png" class="alert_close" /></a>
+		<a href="#" class="alert_close"></a>
 		<h3 class="alert_title"></h3><p class="alert_text"></p>
 	</div>
 	<div id="phpbb_confirm" class="phpbb_alert">
-		<a href="#"><img src="{T_THEME_PATH}/images/alert_close.png" class="alert_close" /></a>
+		<a href="#" class="alert_close"></a>
 		<p class="alert_text"></p>
 		<input type="button" class="button1" value="{L_YES}" />&nbsp;
 		<input type="button" class="button2" value="{L_NO}" />

phpBB/styles/prosilver/theme/colours.css

@@ -1074,3 +1074,17 @@ input.search {
 input.disabled {
 	color: #666666;
 }
+
+/* jQuery popups
+---------------------------------------- */
+.phpbb_alert {
+	background-color: #FFFFFF;
+	border-color: #999999;
+}
+.phpbb_alert .alert_close {
+	background-image: url("./images/alert_close.png");
+}
+#darken {
+	background-color: #000000;
+}
+

phpBB/styles/prosilver/theme/common.css

@@ -591,8 +591,7 @@ li.pagination {
 /* jQuery popups
 ---------------------------------------- */
 .phpbb_alert {
-	background-color: #FFFFFF;
-	border: 1px solid #999999;
+	border: 1px solid transparent;
 	position: fixed;
 	display: none;
 	top: 100px;
@@ -603,10 +602,19 @@ li.pagination {
 	padding: 0 25px 20px 25px;
 }
 
-.phpbb_alert img.alert_close {
+.phpbb_alert .alert_close {
+	display: block;
 	float: right;
+	width: 16px;
+	height: 16px;
+	overflow: hidden;
+	text-decoration: none !important;
+	background: transparent none 0 0 no-repeat;
 	margin-top: -7px;
-	margin-right: -30px;
+	margin-right: -31px;
+}
+.phpbb_alert .alert_close:hover {
+	background-position: 0 -16px;
 }
 
 .phpbb_alert p {
@@ -624,7 +632,6 @@ li.pagination {
 	top: 0;
 	width: 100%;
 	height: 100%;
-	background-color: #000000;
 	opacity: 0.5;
 }