[ticket/12535] Make <a> adjust to the image width

PHPBB3-12535

phpBB/docs/events.md

@@ -879,6 +879,20 @@ ucp_agreement_terms_before
 * Since: 3.1.0-b3
 * Purpose: Add content before the terms of agreement text at user registration
 
+ucp_pm_viewmessage_avatar_after
+===
+* Locations:
+    + styles/prosilver/template/ucp_pm_viewmessage.html
+* Since: 3.1.0-RC2
+* Purpose: Add content right after the avatar when viewing a private message
+
+ucp_pm_viewmessage_avatar_before
+===
+* Locations:
+    + styles/prosilver/template/ucp_pm_viewmessage.html
+* Since: 3.1.0-RC2
+* Purpose: Add content right before the avatar when viewing a private message
+
 ucp_pm_viewmessage_contact_fields_after
 ===
 * Locations:
@@ -1085,6 +1099,22 @@ viewtopic_print_head_append
 * Since: 3.1.0-a1
 * Purpose: Add asset calls directly before the `</head>` tag of the Print Topic screen
 
+viewtopic_body_avatar_after
+===
+* Locations:
+    + styles/prosilver/template/viewtopic_body.html
+    + styles/subsilver2/template/viewtopic_body.html
+* Since: 3.1.0-RC2
+* Purpose: Add content right after the avatar when viewing topics
+
+viewtopic_body_avatar_before
+===
+* Locations:
+    + styles/prosilver/template/viewtopic_body.html
+    + styles/subsilver2/template/viewtopic_body.html
+* Since: 3.1.0-RC2
+* Purpose: Add content right before the avatar when viewing topics
+
 viewtopic_body_contact_fields_after
 ===
 * Locations:

phpBB/styles/prosilver/template/ucp_pm_viewmessage.html

@@ -18,7 +18,14 @@
 <div class="inner">
 
 	<dl class="postprofile" id="profile{MESSAGE_ID}">
-		<dt class="<!-- IF RANK_TITLE or RANK_IMG -->has-profile-rank<!-- ELSE -->no-profile-rank<!-- ENDIF -->"><!-- IF AUTHOR_AVATAR --><a href="{U_MESSAGE_AUTHOR}" class="avatar">{AUTHOR_AVATAR}</a><!-- ENDIF -->{MESSAGE_AUTHOR_FULL}</dt>
+		<dt class="<!-- IF RANK_TITLE or RANK_IMG -->has-profile-rank<!-- ELSE -->no-profile-rank<!-- ENDIF --> <!-- IF AUTHOR_AVATAR -->has-avatar<!-- ELSE -->no-avatar<!-- ENDIF -->">
+			<div class="avatar-container">
+				<!-- EVENT ucp_pm_viewmessage_avatar_before -->
+				<!-- IF AUTHOR_AVATAR --><a href="{U_MESSAGE_AUTHOR}" class="avatar">{AUTHOR_AVATAR}</a><!-- ENDIF -->
+				<!-- EVENT ucp_pm_viewmessage_avatar_after -->
+			</div>
+			{MESSAGE_AUTHOR_FULL}
+		</dt>
 
 		<!-- IF RANK_TITLE or RANK_IMG --><dd class="profile-rank">{RANK_TITLE}<!-- IF RANK_TITLE and RANK_IMG --><br /><!-- ENDIF -->{RANK_IMG}</dd><!-- ENDIF -->
 

phpBB/styles/prosilver/template/viewtopic_body.html

@@ -124,10 +124,14 @@
 		<div class="inner">
 
 		<dl class="postprofile" id="profile{postrow.POST_ID}"<!-- IF postrow.S_POST_HIDDEN --> style="display: none;"<!-- ENDIF -->>
-			<dt class="<!-- IF postrow.RANK_TITLE or postrow.RANK_IMG -->has-profile-rank<!-- ELSE -->no-profile-rank<!-- ENDIF -->">
-				<!-- IF postrow.POSTER_AVATAR -->
-					<!-- IF postrow.U_POST_AUTHOR --><a href="{postrow.U_POST_AUTHOR}" class="avatar">{postrow.POSTER_AVATAR}</a><!-- ELSE --><span class="avatar">{postrow.POSTER_AVATAR}</span><!-- ENDIF -->
-				<!-- ENDIF -->
+			<dt class="<!-- IF postrow.RANK_TITLE or postrow.RANK_IMG -->has-profile-rank<!-- ELSE -->no-profile-rank<!-- ENDIF --> <!-- IF postrow.POSTER_AVATAR -->has-avatar<!-- ELSE -->no-avatar<!-- ENDIF -->">
+				<div class="avatar-container">
+					<!-- EVENT viewtopic_body_avatar_before -->
+					<!-- IF postrow.POSTER_AVATAR -->
+						<!-- IF postrow.U_POST_AUTHOR --><a href="{postrow.U_POST_AUTHOR}" class="avatar">{postrow.POSTER_AVATAR}</a><!-- ELSE --><span class="avatar">{postrow.POSTER_AVATAR}</span><!-- ENDIF -->
+					<!-- ENDIF -->
+					<!-- EVENT viewtopic_body_avatar_after -->
+				</div>
 				<!-- IF not postrow.U_POST_AUTHOR --><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ELSE -->{postrow.POST_AUTHOR_FULL}<!-- ENDIF -->
 			</dt>
 

phpBB/styles/prosilver/theme/bidi.css

@@ -586,6 +586,10 @@ li.breadcrumbs span:first-child > a {
 	margin-right: 8px;
 }
 
+.rtl .postprofile .avatar {
+	float: right;
+}
+
 .rtl .online {
 	background-position: 0 0;
 }
@@ -1078,8 +1082,11 @@ li.breadcrumbs span:first-child > a {
 		border-width: 0 0 1px 0;
 	}
 
+	.rtl .postprofile dt, .rtl .postprofile dd.profile-rank, .rtl .search .postprofile dd {
+		margin: 0;
+	}
+
 	.rtl .postprofile .avatar {
-		float: right;
 		margin-left: 5px;
 		margin-right: 0;
 	}

phpBB/styles/prosilver/theme/content.css

@@ -710,15 +710,28 @@ fieldset.polls dd div {
 	margin-bottom: 10px;
 }
 
+/* Post-profile avatars */
+.postprofile .has-avatar .avatar-container {
+	margin-bottom: 3px;
+	overflow: hidden;
+}
+
+.postprofile .avatar-container:after {
+	clear: both;
+	content: '';
+	display: block;
+}
+
 .postprofile .avatar {
 	display: block;
-	border: none;
-	margin-bottom: 3px;
+	float: left;
+	max-width: 100%;
 }
 
 .postprofile .avatar img {
-	max-width: 90%;
+	display: block;
 	height: auto !important;
+	max-width: 100%;
 }
 
 dd.profile-warnings {

phpBB/styles/prosilver/theme/responsive.css

@@ -424,16 +424,22 @@ fieldset.polls dd.resultbar, fieldset.polls dd.poll_option_percent {
 	margin: 0;
 }
 
+.postprofile .has-avatar .avatar-container {
+	margin: 0;
+	overflow: inherit;
+}
+
+.postprofile .avatar-container:after {
+	clear: none;
+}
+
 .postprofile .avatar {
-	display: block;
-	float: left;
 	margin-right: 5px;
 }
 
 .postprofile .avatar img {
 	width: auto !important;
 	height: auto !important;
-	display: block;
 	max-height: 32px;
 }
 

phpBB/styles/prosilver/theme/tweaks.css

@@ -71,3 +71,8 @@ dd.option {
 .header-avatar img {
 	height: 20px;
 }
+
+/* IE8 often can't handle max-width in %, so we use px instead */
+.postprofile .avatar img {
+	max-width: 150px; 
+}