Add support for Angular v18 #198
Comments
|
Installed Example template: <div class="max-screen-width mx-auto py-f-m">
<xng-breadcrumb class="my-xng-breadcrumb" [separator]="iconTemplate">
<ng-container *xngBreadcrumbItem="let breadcrumb; let first = first">
<ng-container>
@if (first) {
<span class="iconify material-symbols--home"></span>
<span class="sr-only">{{ breadcrumb }}</span>
} @else {
{{ breadcrumb }}
}
</ng-container>
</ng-container>
</xng-breadcrumb>
<ng-template #iconTemplate>
<span class="iconify material-symbols--chevron-right" aria-hidden="true"></span>
</ng-template>
</div>(app.component.css) /* BUG: xng-class selectors below do not work with or without ::ng-deep.
See https://udayvunnam.github.io/xng-breadcrumb/#/custom-styles
For now, overriding styles directly on index.html */
::ng-deep {
/** Even increased specificity here is not working */
.my-xng-breadcrumb {
.xng-breadcrumb-separator:first-child {
display: none;
}
.xng-breadcrumb-separator {
margin: 0;
background-color: red;
}
}
}Nothing is selected successfully. I don't know if there must be something done here to make it work on Angular 18 or I'm missing something in the docs so I'm reporting it here. Adding For now, I wrote my styles directly into <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>MyApp</title>
<base href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<!-- HACK: ::ng-deep + xng-breadcrumb class selectors doesn't work on Component level css. -->
<style>
.xng-breadcrumb-separator:first-child {
display: none;
}
.xng-breadcrumb-separator {
margin: 0 !important;
}
</style>
</head>
<body>
<app-root></app-root>
</body>
</html> |
Hi Alexandros, are you sure this is related to the version update? Can you please provide a minimum reproduction repo? |
No description provided.
The text was updated successfully, but these errors were encountered: