Fixed: mobile viewport was too large when presenting ads, making for a sloppy mobile experience. Restricted length of "Advertisement" label to fix it.

assets/javascripts/discourse/components/amazon-product-links.js.es6

@@ -101,6 +101,10 @@ export default Ember.Component.extend({
     return `width: ${this.get('mobile_amazon_width')}px; height: ${this.get('mobile_amazon_height')}px;`.htmlSafe();
   }.property('mobile_amazon_width', 'mobile_amazon_height'),
 
+  adTitleStyleMobile: function() {
+    return `width: ${this.get('mobile_amazon_width')}px;`.htmlSafe();
+  }.property('mobile_amazon_width'),
+
   userInput: function() {
     return `${this.get('user_input')}`.htmlSafe();
   }.property('user_input'),

assets/javascripts/discourse/components/google-adsense.js.es6

@@ -120,6 +120,10 @@ export default Ember.Component.extend({
     return `width: ${this.get('ad_mobile_width')}px; height: ${this.get('ad_mobile_height')}px; margin:0 auto;`.htmlSafe();
   }.property('ad_mobile_width', 'ad_mobile_height'),
 
+  adTitleStyleMobile: function() {
+    return `width: ${this.get('ad_mobile_width')}px;`.htmlSafe();
+  }.property('ad_mobile_width'),
+
   adInsStyleMobile: function() {
     return `display: inline-block; ${this.get('adWrapperStyleMobile')}`.htmlSafe();
   }.property('adWrapperStyleMobile'),

assets/javascripts/discourse/components/google-dfp-ad.js.es6

@@ -187,6 +187,10 @@ export default Ember.Component.extend({
     return `width: ${this.get('const_mobile_width')}px; height: ${this.get('const_mobile_height')}px;`.htmlSafe();
   }.property('const_mobile_width', 'const_mobile_height'),
 
+  adTitleStyleMobile: function() {
+    return `width: ${this.get('const_mobile_width')}px;`.htmlSafe();
+  }.property('const_mobile_width'),
+
   checkTrustLevels: function() {
     return !((currentUser) && (currentUser.get('trust_level') > Discourse.SiteSettings.dfp_through_trust_level));
   }.property('trust_level'),

assets/javascripts/discourse/templates/components/amazon-product-links.hbs

@@ -1,9 +1,10 @@
 {{#if checkTrustLevels}}
-	<div class="amazon-product-links-label"><h2>ADVERTISEMENT</h2></div>
 	{{#if site.mobileView}}
+    <div class="amazon-product-links-label" style={{adTitleStyleMobile}}><h2>ADVERTISEMENT</h2></div>
 		<iframe style={{adWrapperStyleMobile}} marginwidth="0" marginheight="0" scrolling="no" frameborder="0" src={{userInput}}>
 		</iframe>
 	{{else}}
+    <div class="amazon-product-links-label"><h2>ADVERTISEMENT</h2></div>
 		<div class="container" align="center">
 			<iframe style={{adWrapperStyle}} marginwidth="0" marginheight="0" scrolling="no" frameborder="0" src={{userInput}}>
 			</iframe>

assets/javascripts/discourse/templates/components/google-adsense.hbs

@@ -1,7 +1,7 @@
 {{#if checkTrustLevels}}
-  <div class="google-adsense-label"><h2>ADVERTISEMENT</h2></div>
   {{#if site.mobileView}} 
     <div style={{adWrapperStyleMobile}}>
+      <div class="google-adsense-label" style={{adTitleStyleMobile}}><h2>ADVERTISEMENT</h2></div>
       <ins class="adsbygoogle"
         style={{adInsStyleMobile}}
         data-ad-client="ca-pub-{{publisher_id}}"
@@ -13,6 +13,7 @@
       </script>
     </div>
   {{else}}
+    <div class="google-adsense-label"><h2>ADVERTISEMENT</h2></div>
     <div style={{adWrapperStyle}}>
       <ins class="adsbygoogle"
         style={{adInsStyle}}

assets/javascripts/discourse/templates/components/google-dfp-ad.hbs

@@ -1,9 +1,10 @@
 {{#if checkTrustLevels}}
-  <div class="google-dfp-ad-label"><h2>ADVERTISEMENT</h2></div>
 
   {{#if site.mobileView}}
+    <div class="google-dfp-ad-label" style={{adTitleStyleMobile}}><h2>ADVERTISEMENT</h2></div>
     <div id={{divId}} style={{adWrapperStyleMobile}} class="dfp-ad-unit" align=center></div>
   {{else}}
+    <div class="google-dfp-ad-label"><h2>ADVERTISEMENT</h2></div>
     <div id={{divId}} style={{adWrapperStyle}} class="dfp-ad-unit" align=center></div>
   {{/if}}
 {{/if}}