openproject/app/views/mailer/_notification_mailer_header...

<table <%= placeholder_table_styles(width:'100%',style: "width:100%;min-width:100%") %>>
  <tr>
    <td>
      <table <%= placeholder_table_styles %>>
        <tr>
          <%= placeholder_cell('12px', true) %>
          <td>
            <table <%= placeholder_table_styles(width:'100%',style: "width:100%") %>>
              <tr>
                <td>
                  <span style="font-size: 24px; color: #333333;">
                    <%= I18n.t(:'mail.salutation', user: @user.firstname) %>
                  </span>
                </td>
              </tr>
              <tr>
                <%= placeholder_cell('8px') %>
              </tr>
              <tr>
                <td>
                  <span style="font-size:16px; color: #1A67A3; font-weight: bold;">
                     <%= summary %>
                  </span>
                </td>
              </tr>
              <tr>
                <%= placeholder_cell('24px') %>
              </tr>
              <tr>
                <td>
                  <a href="<%= notifications_center_url %>"
                     target="_blank"
                     style="background: #D1E5F5; padding: 8px 12px; color: #1A67A3; border: 1px solid #1A67A3; border-radius: 16px; text-decoration: none;font-size: 14px;">
                    <%= I18n.t(:'mail.notification.center') %>
                  </a>
                </td>
              </tr>
              <tr>
                <%= placeholder_cell('40px') %>
              </tr>
            </table>
          </td>
          <%= placeholder_cell('16px', true) %>
          <td style="vertical-align: top;">
            <table <%= placeholder_table_styles %>>
              <tr>
                <td style="width: 96px; height: 96px;">
                  <%= logo_tag({ alt: "#{Setting.app_title} #{I18n.t(:'mail.logo_alt_text')}", style: "height: 96px;max-width: 240px;"}) %>
                </td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>
Attempt to fix the width problem in iOS and outlook by providing inline styles next to direct attributes. Further the content is centred in its own table 3 years ago			`<table <%= placeholder_table_styles(width:'100%',style: "width:100%;min-width:100%") %>>`
Extract shared email parts into partials to make it easier to reuse them later 3 years ago			`<tr>`
Apply hard table layout for notification mail header to be more stable when it comes to different clients 3 years ago			`<td>`
			`<table <%= placeholder_table_styles %>>`
Extract shared email parts into partials to make it easier to reuse them later 3 years ago			`<tr>`
Apply hard table layout on notification row to be deal better with different clients 3 years ago			`<%= placeholder_cell('12px', true) %>`
Apply hard table layout for notification mail header to be more stable when it comes to different clients 3 years ago			`<td>`
Attempt to fix the width problem in iOS and outlook by providing inline styles next to direct attributes. Further the content is centred in its own table 3 years ago			`<table <%= placeholder_table_styles(width:'100%',style: "width:100%") %>>`
Apply hard table layout for notification mail header to be more stable when it comes to different clients 3 years ago			`<tr>`
			`<td>`
			`<span style="font-size: 24px; color: #333333;">`
			`<%= I18n.t(:'mail.salutation', user: @user.firstname) %>`
			`</span>`
			`</td>`
			`</tr>`
			`<tr>`
			`<%= placeholder_cell('8px') %>`
			`</tr>`
			`<tr>`
			`<td>`
			`<span style="font-size:16px; color: #1A67A3; font-weight: bold;">`
			`<%= summary %>`
			`</span>`
			`</td>`
			`</tr>`
			`<tr>`
			`<%= placeholder_cell('24px') %>`
			`</tr>`
			`<tr>`
			`<td>`
			`<a href="<%= notifications_center_url %>"`
			`target="_blank"`
Apply strict table layout on daily notification mail footer element to be more bullet proof for various clients 3 years ago			`style="background: #D1E5F5; padding: 8px 12px; color: #1A67A3; border: 1px solid #1A67A3; border-radius: 16px; text-decoration: none;font-size: 14px;">`
Apply hard table layout for notification mail header to be more stable when it comes to different clients 3 years ago			`<%= I18n.t(:'mail.notification.center') %>`
			`</a>`
			`</td>`
			`</tr>`
			`<tr>`
			`<%= placeholder_cell('40px') %>`
			`</tr>`
			`</table>`
Extract shared email parts into partials to make it easier to reuse them later 3 years ago			`</td>`
Apply hard table layout on notification row to be deal better with different clients 3 years ago			`<%= placeholder_cell('16px', true) %>`
* Reduce width of the footer element b letting the text wrap. Thus iOS doesn't zoom out of the content in order to make everything visible at once * Some smaller design changes 3 years ago			`<td style="vertical-align: top;">`
Apply hard table layout for notification mail header to be more stable when it comes to different clients 3 years ago			`<table <%= placeholder_table_styles %>>`
			`<tr>`
* Reduce width of the footer element b letting the text wrap. Thus iOS doesn't zoom out of the content in order to make everything visible at once * Some smaller design changes 3 years ago			`<td style="width: 96px; height: 96px;">`
Attempt to fix the width problem in iOS and outlook by providing inline styles next to direct attributes. Further the content is centred in its own table 3 years ago			`<%= logo_tag({ alt: "#{Setting.app_title} #{I18n.t(:'mail.logo_alt_text')}", style: "height: 96px;max-width: 240px;"}) %>`
Apply hard table layout for notification mail header to be more stable when it comes to different clients 3 years ago			`</td>`
			`</tr>`
			`</table>`
Extract shared email parts into partials to make it easier to reuse them later 3 years ago			`</td>`
			`</tr>`
			`</table>`
			`</td>`
			`</tr>`
Apply hard table layout for notification mail header to be more stable when it comes to different clients 3 years ago			`</table>`