Skip to content

Remove external link icons #43937

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
mrdarrengriffin wants to merge 4 commits into from
Closed

Remove external link icons #43937

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
eb6705e
Remove external link icons
mrdarrengriffin Mar 5, 2026
a998bcd
Merge branch 'current' into remove-iconify-icon
mrdarrengriffin Mar 5, 2026
8980953
Remove more instances of external icons
mrdarrengriffin Mar 5, 2026
260d04b
Merge branch 'remove-iconify-icon' of github.com:home-assistant/home-…
mrdarrengriffin Mar 5, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 1 addition & 8 deletions plugins/output_modder.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,8 @@ def output_modder(content)
# All external links start with 'http', skip when this one does not
next unless link.get_attribute('href') =~ /\Ahttp/i

# Append an external link icon, if there isn't an icon already
# Skip our own links
next if link.get_attribute('href') =~ /\Ahttps?:\/\/\w*.?home-assistant.io/i
Copy link

Copilot AI Mar 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The regex on line 25 is overly permissive: .? uses an unescaped . (matches any character), and home-assistant.io is not escaped (the . matches any character). This can cause unintended matches/skips. Use a stricter pattern (escape dots, and use an explicit optional subdomain group), or reuse the safer domain allowlist regex already present below.

Suggested change
next if link.get_attribute('href') =~ /\Ahttps?:\/\/\w*.?home-assistant.io/i
next if link.get_attribute('href') =~ /\Ahttps?:\/\/(?:\w+\.)?home-assistant\.io/i

Copilot uses AI. Check for mistakes.
Copy link
Copy Markdown
Contributor Author

@mrdarrengriffin mrdarrengriffin Mar 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot can you give me some examples where this might be falsely matched?

next if link.css('iconify-icon').any?

icon = Nokogiri::XML::Node.new('iconify-icon', dom)
icon['inline'] = true
icon['icon'] = 'tabler:external-link'
icon['class'] = 'external-link'
link.add_child(icon)

# Play nice with our own links
next if link.get_attribute('href') =~ /\Ahttps?:\/\/(?:\w+\.)?(?:home-assistant\.io|esphome\.io|nabucasa\.com|openhomefoundation\.org)/i
Comment thread
mrdarrengriffin marked this conversation as resolved.
Expand Down
13 changes: 0 additions & 13 deletions sass/homeassistant/_overrides.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1363,19 +1363,6 @@ article.listing {
text-decoration: underline;
overflow-wrap: break-word;

&[rel*="external"] {
position: relative;

&:after {
content: "\00a0\00a0\00a0\00a0\00a0";
display: inline-block;
}

iconify-icon {
align-self: center;
position: absolute;
}
}

&.btn {
font-size: 1.1em;
Expand Down
8 changes: 4 additions & 4 deletions source/_includes/asides/about.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@ <h1 class="title epsilon">{% icon "mdi:about-circle-outline" %} About Home Assis
{{ site.description }}
</li>
<li><a href='/getting-started/'>Get started with Home Assistant</a></li>
<li><a class="external-link" href='https://demo.home-assistant.io'>Try the online demo {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href='https://newsletter.openhomefoundation.org/#/portal'>Sign up for our newsletter {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href="https://twitter.com/Home_Assistant">Follow Home Assistant on X {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href='https://demo.home-assistant.io'>Try the online demo</a></li>
<li><a class="external-link" href='https://newsletter.openhomefoundation.org/#/portal'>Sign up for our newsletter</a></li>
<li><a class="external-link" href="https://twitter.com/Home_Assistant">Follow Home Assistant on X</a></li>
{% comment %}
<li>
Subscribe to the Home Assistant Newsletter
Expand All @@ -19,6 +19,6 @@ <h1 class="title epsilon">{% icon "mdi:about-circle-outline" %} About Home Assis
{% endcomment %}
</ul>
<p>
Home Assistant is part of the <a class="external-link" href="https://www.openhomefoundation.org/">Open Home Foundation {% icon "tabler:external-link" %}</a>.
Home Assistant is part of the <a class="external-link" href="https://www.openhomefoundation.org/">Open Home Foundation</a>.
</p>
</section>
3 changes: 1 addition & 2 deletions source/_includes/asides/dashboards_navigation.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,10 +42,9 @@ <h1 class="title epsilon">{% icon "mdi:cog" %} Advanced</h1>
<li>{% active_link /dashboards/actions/ Actions %}</li>
<li>{% active_link /dashboards/naming/ Naming %}</li>
<li><a
class="external-link"
class="external-link"
href="https://developers.home-assistant.io/docs/frontend/custom-ui/custom-card/"
>Developing custom cards
{% icon "tabler:external-link" %}
</a></li>
</ul>
</div>
Expand Down
17 changes: 8 additions & 9 deletions source/_includes/asides/docs_sitemap.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,8 +99,7 @@
class="external-link"
href="https://developers.home-assistant.io/docs/frontend/custom-ui/custom-card/"
>Developing custom cards
{% icon "tabler:external-link" %}
</a></li>
</a></li>
</ul>
</li>

Expand Down Expand Up @@ -255,7 +254,7 @@
</li>

<li>
{% icon "mdi:cellphone" %} <a href="https://companion.home-assistant.io/docs">iOS and Android apps {% icon "tabler:external-link" %}</a>
{% icon "mdi:cellphone" %} <a href="https://companion.home-assistant.io/docs">iOS and Android apps</a>
</li>

<li>
Expand All @@ -276,11 +275,11 @@
<li>
{% icon "bitcoin-icons:node-hardware-filled" %} Official hardware
<ul>
<li><a href="https://support.nabucasa.com/hc/categories/24638797677853">Home Assistant Green {% icon "tabler:external-link" %}</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24734620813469">Home Assistant Connect ZBT-1 {% icon "tabler:external-link" %}</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/29400540866973">Home Assistant Connect ZBT-2 {% icon "tabler:external-link" %}</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/28669861145885">Home Assistant Connect ZWA-2 {% icon "tabler:external-link" %}</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24734575925149">Home Assistant Yellow {% icon "tabler:external-link" %}</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24451727188125">Home Assistant Voice Preview Edition {% icon "tabler:external-link" %}</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24638797677853">Home Assistant Green</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24734620813469">Home Assistant Connect ZBT-1</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/29400540866973">Home Assistant Connect ZBT-2</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/28669861145885">Home Assistant Connect ZWA-2</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24734575925149">Home Assistant Yellow</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24451727188125">Home Assistant Voice Preview Edition</a></li>
</ul>
</li>
4 changes: 2 additions & 2 deletions source/_includes/asides/getting_started_navigation.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ <h1 class="title epsilon">{% icon "mdi:rocket-launch-outline" %} Getting started
<li>{% active_link /installation/ Installation %}
{% if root == 'installation' %}
<ul>
<li><a href="https://support.nabucasa.com/hc/categories/24638797677853">Home Assistant Green {% icon "tabler:external-link" %}</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24734575925149">Home Assistant Yellow {% icon "tabler:external-link" %}</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24638797677853">Home Assistant Green</a></li>
<li><a href="https://support.nabucasa.com/hc/categories/24734575925149">Home Assistant Yellow</a></li>
<li>{% active_link /installation/raspberrypi/ Raspberry Pi %}</li>
<li>{% active_link /installation/odroid/ ODROID %}</li>
<li>{% active_link /installation/generic-x86-64/ Generic x86-64 %}</li>
Expand Down
1 change: 0 additions & 1 deletion source/_includes/asides/help_navigation.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ <h1 class="title epsilon">Topics</h1>
<li>
<a class="external-link" href="https://developers.home-assistant.io"
>Developer documentation
{% icon "tabler:external-link" %}
</a>
</li>
<li>
Expand Down
20 changes: 10 additions & 10 deletions source/_includes/site/footer.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,24 +24,24 @@
<div class="grid__item one-quarter lap-one-half palm-one-whole">
<h3>Join us and contribute!</h3>
<ul>
<li><a class="external-link" href="https://github.com/home-assistant/">GitHub repo {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href="https://developers.home-assistant.io">Developers Portal {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href="https://design.home-assistant.io">Design Portal {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href="https://data.home-assistant.io">Data Science Portal {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href="https://community.home-assistant.io">Community Forum {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href="https://creators.home-assistant.io/">Creator Network {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href="https://works-with.home-assistant.io/">Works With Home Assistant {% icon "tabler:external-link" %}</a></li>
<li><a class="external-link" href="https://github.com/home-assistant/">GitHub repo</a></li>
<li><a class="external-link" href="https://developers.home-assistant.io">Developers Portal</a></li>
<li><a class="external-link" href="https://design.home-assistant.io">Design Portal</a></li>
<li><a class="external-link" href="https://data.home-assistant.io">Data Science Portal</a></li>
<li><a class="external-link" href="https://community.home-assistant.io">Community Forum</a></li>
<li><a class="external-link" href="https://creators.home-assistant.io/">Creator Network</a></li>
<li><a class="external-link" href="https://works-with.home-assistant.io/">Works With Home Assistant</a></li>
<li><a href="/community">Our community</a></li>
<li><a href="/help/reporting_issues/">Reporting issues</a></li>
</ul>
<h3>System status</h3>
<ul>
<li>
<a class="external-link" href="https://alerts.home-assistant.io">Integration Alerts {% icon "tabler:external-link" %}</a>
<a class="external-link" href="https://alerts.home-assistant.io">Integration Alerts</a>
</li>
<li><a href="/security/">Security Alerts</a></li>
<li>
<a class="external-link" href="https://status.home-assistant.io">System Status {% icon "tabler:external-link" %}</a>
<a class="external-link" href="https://status.home-assistant.io">System Status</a>
</li>
</ul>
</div>
Expand Down Expand Up @@ -74,7 +74,7 @@ <h3>Governance</h3>
<div class="socials grid__item one-quarter lap-one-half palm-one-whole">

<h3>Follow us</h3>
<p><a class="external-link" href='https://newsletter.openhomefoundation.org/#/portal'>Sign up for our newsletter {% icon "tabler:external-link" %}</a></p>
<p><a class="external-link" href='https://newsletter.openhomefoundation.org/#/portal'>Sign up for our newsletter</a></p>
<div class="icons">
<a
rel="me"
Expand Down