Style Breadcrumbs as Angular's translucent pill (dark-blue-opacity bg, 3/10 padding)

This commit is contained in:
2026-04-20 06:40:33 +03:00
parent da3f2713ac
commit 3577745477
+10 -1
View File
@@ -2,8 +2,17 @@
@use "../../styles/fonts" as fonts;
@use "../../styles/variables" as vars;
// Matches Angular's `flights-page-breadcrumbs .p-breadcrumb`:
// dark-blue-opacity chip with 3px/10px/4px/10px padding and
// `$space-s` bottom margin. Renders as a translucent pill over
// the hero background rather than plain inline text.
.breadcrumbs {
margin-bottom: vars.$space-m;
display: inline-flex;
align-items: center;
padding: 3px 10px 4px 10px;
margin-bottom: vars.$space-s;
background-color: colors.$dark-blue-opacity;
border-radius: vars.$border-radius;
&__list {
display: flex;