Elgato_dark/angular
1
0
Fork 0
mirror of https://github.com/angular/angular synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(docs-infra): add open_in_new icon to external nav-item links (#46384)

Browse source 
add a mat open_in_new icon to the blog external link present in the
left sidenav on smaller screens so that it can be distinguished from
the other (/internal) links

this is a continuation of #45876

PR Close #46384
This commit is contained in:
dario-piotrowicz 2022-06-16 08:16:52 +01:00 committed by Andrew Kushnir
parent f94c6f433d
commit 88f53dcdbc
2 changed files with 17 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
aio/src/app/layout/nav-item/nav-item.component.html
View file

@ -1,7 +1,7 @@
<div *ngIf="!node.children">
<a href="{{node.url}}" [ngClass]="classes" title="{{node.tooltip}}"
class="vertical-menu-item">
<span>{{node.title}}</span>
<span class="vertical-menu-item-text">{{node.title}}</span>
</a>
</div>

16
aio/src/styles/1-layouts/sidenav/_sidenav.scss
View file

@ -91,6 +91,22 @@ aio-nav-menu {
}
}
a.vertical-menu-item {
&[href^="http:"],
&[href^="https:"] {
.vertical-menu-item-text {
display: inline-flex;
align-items: center;
&::after {
content: "\e89e"; // codepoint for "open_in_new"
margin-left: 0.3rem;
line-height: normal;
font-family: "Material Icons";
}
}
}
}
button.vertical-menu-item {
border: none;
background-color: transparent;