Refactor newsletter HTML generation for improved styling and consistency
- Update the "Top Highlights" section to use new color variables and enhanced padding for better visual appeal. - Change the eyebrow text for article cards to uppercase for consistency with design standards. - Adjust padding and margin styles in article cards to improve layout and readability in Outlook-compatible HTML.
This commit is contained in:
@@ -746,17 +746,20 @@ def _outlook_highlights(items: list[dict[str, Any]]) -> str:
|
|||||||
for idx, item in enumerate(items[:3], start=1):
|
for idx, item in enumerate(items[:3], start=1):
|
||||||
url = _article_url(item.get("title", ""))
|
url = _article_url(item.get("title", ""))
|
||||||
rows += (
|
rows += (
|
||||||
f'<tr><td {_outlook_td_attrs(bg=OUTLOOK_WHITE, extra_style="padding:2px 0;")}>'
|
f'<tr><td {_outlook_td_attrs(bg=COLOR_TK_ORANGE_LIGHT, extra_style="padding:3px 0;")}>'
|
||||||
f'{_outlook_font(f"{idx}. ", color=OUTLOOK_ORANGE, bold=True)}'
|
f'{_outlook_font(f"{idx}. ", color=OUTLOOK_ORANGE, bold=True)}'
|
||||||
f'{_outlook_link(item.get("title", "Ohne Titel"), url, color=OUTLOOK_TEXT, bold=False)}'
|
f'{_outlook_link(item.get("title", "Ohne Titel"), url, color=OUTLOOK_TEXT, bold=False)}'
|
||||||
f'</td></tr>'
|
f'</td></tr>'
|
||||||
)
|
)
|
||||||
return (
|
return (
|
||||||
f'<table width="100%" cellpadding="0" cellspacing="0" border="0" '
|
f'<table width="100%" cellpadding="0" cellspacing="0" border="0" '
|
||||||
f'bgcolor="{OUTLOOK_WHITE}" style="background-color:{OUTLOOK_WHITE} !important;margin:0 0 8px;" data-ogsb="{OUTLOOK_WHITE}">'
|
f'bgcolor="{COLOR_TK_ORANGE_LIGHT}" style="background-color:{COLOR_TK_ORANGE_LIGHT} !important;'
|
||||||
f'<tr><td {_outlook_td_attrs(extra_style="padding:0 0 6px;")}>'
|
f'border:1px solid {COLOR_TK_ORANGE_BORDER};margin:0 0 12px;" data-ogsb="{COLOR_TK_ORANGE_LIGHT}">'
|
||||||
f'{_outlook_font("Top Highlights", color=OUTLOOK_ORANGE, size="2", bold=True)}</td></tr>'
|
f'<tr><td {_outlook_td_attrs(bg=COLOR_TK_ORANGE_LIGHT, extra_style="padding:12px 14px 6px;")}>'
|
||||||
f'{rows}</table>'
|
f'{_outlook_font("TOP HIGHLIGHTS", color=COLOR_TK_ORANGE_DARK, size="1", bold=True)}</td></tr>'
|
||||||
|
f'<tr><td {_outlook_td_attrs(bg=COLOR_TK_ORANGE_LIGHT, extra_style="padding:0 14px 12px;")}>'
|
||||||
|
f'<table width="100%" cellpadding="0" cellspacing="0" border="0">{rows}</table></td></tr>'
|
||||||
|
f'</table>'
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
||||||
@@ -809,7 +812,7 @@ def _outlook_section(
|
|||||||
|
|
||||||
def _outlook_article_card(idx: int, item: dict[str, Any], display: DisplayOptions, kind: str) -> str:
|
def _outlook_article_card(idx: int, item: dict[str, Any], display: DisplayOptions, kind: str) -> str:
|
||||||
accent = OUTLOOK_ORANGE if kind == "new" else OUTLOOK_GRAY_DARK
|
accent = OUTLOOK_ORANGE if kind == "new" else OUTLOOK_GRAY_DARK
|
||||||
eyebrow = "Neuer Beitrag" if kind == "new" else "Aktualisierter Beitrag"
|
eyebrow = "NEUER BEITRAG" if kind == "new" else "AKTUALISIERTER BEITRAG"
|
||||||
title = item.get("title", "Ohne Titel")
|
title = item.get("title", "Ohne Titel")
|
||||||
url = _article_url(item.get("title", ""))
|
url = _article_url(item.get("title", ""))
|
||||||
meta = _outlook_meta_line(item, display)
|
meta = _outlook_meta_line(item, display)
|
||||||
@@ -819,10 +822,10 @@ def _outlook_article_card(idx: int, item: dict[str, Any], display: DisplayOption
|
|||||||
<table width="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="{OUTLOOK_WHITE}" style="background-color:{OUTLOOK_WHITE} !important;border:1px solid {OUTLOOK_BORDER};" data-ogsb="{OUTLOOK_WHITE}">
|
<table width="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="{OUTLOOK_WHITE}" style="background-color:{OUTLOOK_WHITE} !important;border:1px solid {OUTLOOK_BORDER};" data-ogsb="{OUTLOOK_WHITE}">
|
||||||
<tr>
|
<tr>
|
||||||
<td {_outlook_td_attrs(bg=accent, width="6", extra_style="font-size:0;line-height:0;width:6px;")}> </td>
|
<td {_outlook_td_attrs(bg=accent, width="6", extra_style="font-size:0;line-height:0;width:6px;")}> </td>
|
||||||
<td {_outlook_td_attrs(extra_style="padding:12px 16px;")}>
|
<td {_outlook_td_attrs(extra_style="padding:16px 20px;")}>
|
||||||
{_outlook_font(f"{idx}. {eyebrow}", color=accent, size="1", bold=True)}<br>
|
{_outlook_font(f"{idx}. {eyebrow}", color=accent, size="1", bold=True)}<br>
|
||||||
{_outlook_link(title, url, size="3")}{meta_html}<br>
|
<span style="display:inline-block;margin:6px 0 2px;">{_outlook_link(title, url, color=OUTLOOK_TEXT, size="4")}</span>{meta_html}<br>
|
||||||
<span style="display:inline-block;margin-top:8px;">{_outlook_cta(url, "Zum Beitrag →")}</span>
|
<span style="display:inline-block;margin-top:12px;">{_outlook_cta(url, "Zum Beitrag →")}</span>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
|
|||||||
Reference in New Issue
Block a user