Skip to content

Commit 8a170c7

Browse files
alizedebrayalizedebray
committed
chore: update all implementations of the post-header
1 parent e3f4ebd commit 8a170c7

File tree

8 files changed

+70
-68
lines changed

8 files changed

+70
-68
lines changed

‎packages/components-angular/projects/consumer-app/src/app/app.component.html‎

Lines changed: 53 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<post-logo slot="post-logo" url="/">Homepage</post-logo>
44

55
<!-- Target Group -->
6-
<ul slot="target-group" class="target-group">
6+
<ul slot="target-group">
77
<li>
88
<a href="#" class="active">Private customers</a>
99
</li>
@@ -13,7 +13,7 @@
1313
</ul>
1414

1515
<!-- Global controls (Search) -->
16-
<ul class="list-inline" slot="global-controls">
16+
<ul slot="global-controls">
1717
<li>
1818
<a href="">
1919
<span>Search</span>
@@ -23,7 +23,7 @@
2323
</ul>
2424

2525
<!-- Meta navigation -->
26-
<ul class="list-inline" slot="meta-navigation">
26+
<ul slot="meta-navigation">
2727
<li>
2828
<a href="">
2929
Jobs
@@ -80,32 +80,37 @@ <h2>Main Navigation</h2>
8080

8181
<!-- Level 1 with megadropdown -->
8282
@for (dropdown of megadropdowns; track dropdown.id) {
83-
<post-list-item slot="post-list-item">
84-
<post-megadropdown-trigger [for]="dropdown.id">{{ dropdown.trigger }}</post-megadropdown-trigger>
85-
<post-megadropdown [id]="dropdown.id">
86-
<button slot="back-button" class="btn btn-tertiary px-0 btn-sm">
87-
<post-icon name="arrowleft"></post-icon>
88-
Back
89-
</button>
90-
<post-closebutton slot="close-button">Close</post-closebutton>
91-
<h2 slot="megadropdown-title">{{ dropdown.title }}</h2>
92-
<a slot="megadropdown-overview-link" [href]="dropdown.overviewLink">Overview {{ dropdown.trigger }}</a>
93-
@for (section of dropdown.sections; track section.title) {
94-
<post-list>
95-
@if (section.titleLink) {
96-
<h3><a [href]="section.titleLink">{{ section.title }}</a></h3>
97-
} @else {
98-
<h3>{{ section.title }}</h3>
99-
}
100-
@for (link of section.links; track link.text) {
101-
<post-list-item slot="post-list-item">
102-
<a [href]="link.url">{{ link.text }}</a>
103-
</post-list-item>
104-
}
105-
</post-list>
83+
<post-list-item slot="post-list-item">
84+
<post-megadropdown-trigger [for]="dropdown.id">{{
85+
dropdown.trigger
86+
}}</post-megadropdown-trigger>
87+
<post-megadropdown [id]="dropdown.id">
88+
<button slot="back-button" class="btn btn-tertiary px-0 btn-sm">
89+
<post-icon name="arrowleft"></post-icon>
90+
Back
91+
</button>
92+
<post-closebutton slot="close-button">Close</post-closebutton>
93+
<h2 slot="megadropdown-title">{{ dropdown.title }}</h2>
94+
<a slot="megadropdown-overview-link" [href]="dropdown.overviewLink"
95+
>Overview {{ dropdown.trigger }}</a
96+
>
97+
@for (section of dropdown.sections; track section.title) {
98+
<post-list>
99+
@if (section.titleLink) {
100+
<h3>
101+
<a [href]="section.titleLink">{{ section.title }}</a>
102+
</h3>
103+
} @else {
104+
<h3>{{ section.title }}</h3>
105+
} @for (link of section.links; track link.text) {
106+
<post-list-item slot="post-list-item">
107+
<a [href]="link.url">{{ link.text }}</a>
108+
</post-list-item>
106109
}
107-
</post-megadropdown>
108-
</post-list-item>
110+
</post-list>
111+
}
112+
</post-megadropdown>
113+
</post-list-item>
109114
}
110115
</post-list>
111116
</post-mainnavigation>
@@ -144,26 +149,26 @@ <h1>Hurray, it works!</h1>
144149

145150
<post-footer label="Footer label">
146151
@for (grid of footerGrids; track grid.slot) {
147-
<span [attr.slot]="grid.slot + '-title'">{{ grid.title }}</span>
148-
<post-list [attr.slot]="grid.slot" [attr.id]="grid.slot">
149-
<h3>{{ grid.title }}</h3>
150-
@for (link of footerLinks.slice(0, grid.linkCount); track link.text) {
151-
<post-list-item>
152-
<a [href]="link.url">{{ link.text }}</a>
153-
</post-list-item>
154-
}
155-
</post-list>
152+
<span [attr.slot]="grid.slot + '-title'">{{ grid.title }}</span>
153+
<post-list [attr.slot]="grid.slot" [attr.id]="grid.slot">
154+
<h3>{{ grid.title }}</h3>
155+
@for (link of footerLinks.slice(0, grid.linkCount); track link.text) {
156+
<post-list-item>
157+
<a [href]="link.url">{{ link.text }}</a>
158+
</post-list-item>
159+
}
160+
</post-list>
156161
}
157162

158163
<post-list slot="socialmedia">
159164
<h3>Follow us</h3>
160165
@for (social of socialMediaLinks; track social.name) {
161-
<post-list-item>
162-
<a [href]="social.url" class="btn btn-primary btn-icon">
163-
<post-icon aria-hidden="true" [name]="social.icon"></post-icon>
164-
<span class="visually-hidden">{{ social.name }}</span>
165-
</a>
166-
</post-list-item>
166+
<post-list-item>
167+
<a [href]="social.url" class="btn btn-primary btn-icon">
168+
<post-icon aria-hidden="true" [name]="social.icon"></post-icon>
169+
<span class="visually-hidden">{{ social.name }}</span>
170+
</a>
171+
</post-list-item>
167172
}
168173
</post-list>
169174

@@ -184,10 +189,7 @@ <h3>Download app</h3>
184189
</a>
185190
</post-list-item>
186191
<post-list-item>
187-
<a
188-
class="app-store-badge"
189-
href="https://apps.apple.com/ch/app/die-post/id378676700"
190-
>
192+
<a class="app-store-badge" href="https://apps.apple.com/ch/app/die-post/id378676700">
191193
<img
192194
width="120"
193195
height="40"
@@ -212,9 +214,9 @@ <h3>Die schweizerische Post AG</h3>
212214
<post-list slot="meta" title-hidden="">
213215
<h3>Meta</h3>
214216
@for (meta of metaLinks; track meta.text) {
215-
<post-list-item>
216-
<a [href]="meta.url">{{ meta.text }}</a>
217-
</post-list-item>
217+
<post-list-item>
218+
<a [href]="meta.url">{{ meta.text }}</a>
219+
</post-list-item>
218220
}
219221
<post-list-item>
220222
<button
@@ -230,4 +232,4 @@ <h3>Meta</h3>
230232

231233
<span slot="copyright">© Copyright 2024 by Swiss Post Ltd.</span>
232234
<span slot="copyright">All rights reserved.</span>
233-
</post-footer>
235+
</post-footer>

‎packages/components/cypress/fixtures/post-mainnavigation-overflow.test.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
<post-logo slot="post-logo">Homepage</post-logo>
1818

1919
<!-- Meta navigation -->
20-
<ul class="list-inline" slot="meta-navigation">
20+
<ul slot="meta-navigation">
2121
<li><a href="">Jobs</a></li>
2222
<li><a href="">Über uns</a></li>
2323
</ul>
@@ -46,7 +46,7 @@
4646
<h1 slot="title">Application title</h1>
4747

4848
<!-- Custom content (optional) -->
49-
<ul slot="local-controls" class="list-inline">
49+
<ul slot="local-controls">
5050
<li>
5151
<a href="#">
5252
<span>Search</span>

‎packages/components/cypress/fixtures/post-mainnavigation.test.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
<post-logo slot="post-logo">Homepage</post-logo>
1818

1919
<!-- Meta navigation -->
20-
<ul class="list-inline" slot="meta-navigation">
20+
<ul slot="meta-navigation">
2121
<li><a href="">Jobs</a></li>
2222
<li><a href="">Über uns</a></li>
2323
</ul>
@@ -46,7 +46,7 @@
4646
<h1 slot="title">Application title</h1>
4747

4848
<!-- Custom content (optional) -->
49-
<ul slot="local-controls" class="list-inline">
49+
<ul slot="local-controls">
5050
<li>
5151
<a href="#">
5252
<span>Search</span>

‎packages/components/src/index.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
<post-logo slot="post-logo">Homepage</post-logo>
2323

2424
<!-- Meta navigation -->
25-
<ul class="list-inline" slot="meta-navigation">
25+
<ul slot="meta-navigation">
2626
<li><a href="">Jobs</a></li>
2727
<li><a href="">Über uns</a></li>
2828
</ul>
@@ -52,7 +52,7 @@
5252
<h1 slot="title">Application title</h1>
5353

5454
<!-- Target group -->
55-
<ul slot="target-group" class="target-group">
55+
<ul slot="target-group">
5656
<li>
5757
<a href="#" aria-current="location">Private customers</a>
5858
</li>
@@ -62,7 +62,7 @@ <h1 slot="title">Application title</h1>
6262
</ul>
6363

6464
<!-- Local controls (optional) -->
65-
<ul slot="local-controls" class="list-inline">
65+
<ul slot="local-controls">
6666
<li>
6767
<a href="#">
6868
<span>Search</span>

‎packages/documentation/src/stories/components/back-to-top/back-to-top.stories.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ const meta: MetaComponent = {
2222
<post-logo slot="post-logo" url="/">Homepage</post-logo>
2323
2424
<!-- Meta navigation -->
25-
<ul class="list-inline" slot="meta-navigation">
25+
<ul slot="meta-navigation">
2626
<li><a href="">Jobs</a></li>
2727
<li><a href="">Über uns</a></li>
2828
</ul>
@@ -52,7 +52,7 @@ const meta: MetaComponent = {
5252
<h1 slot="title">Application title</h1>
5353
5454
<!-- Local controls (optional) -->
55-
<ul slot="local-controls" class="list-inline">
55+
<ul slot="local-controls">
5656
<li>
5757
<a href="#">
5858
<span>Search</span>

‎packages/documentation/src/stories/guidelines/header with custom logo link/framework-selector.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ const code = `
88
{{logoLink}}
99
1010
<!-- Meta navigation -->
11-
<ul class="list-inline" slot="meta-navigation">
11+
<ul slot="meta-navigation">
1212
<li><a href="#">Jobs</a></li>
1313
<li><a href="#">Über uns</a></li>
1414
</ul>
@@ -37,7 +37,7 @@ const code = `
3737
<h1 slot="title">Application title</h1>
3838
3939
<!-- Custom content (optional) -->
40-
<ul slot="local-controls" class="list-inline">
40+
<ul slot="local-controls">
4141
<li>
4242
<a href="#">
4343
<span>Search</span>

‎packages/documentation/src/stories/raw-components/megadropdown/megadropdown.stories.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export function megadropdownDecorator(story: StoryFn, context: StoryContext) {
2929
<post-logo slot="post-logo" url="/">Homepage</post-logo>
3030
3131
<!-- Meta navigation -->
32-
<ul class="list-inline" slot="meta-navigation">
32+
<ul slot="meta-navigation">
3333
<li><a href="">Jobs</a></li>
3434
<li><a href="">About us</a></li>
3535
</ul>
@@ -59,7 +59,7 @@ export function megadropdownDecorator(story: StoryFn, context: StoryContext) {
5959
<h1 slot="title">Application title</h1>
6060
6161
<!-- Custom content (optional) -->
62-
<ul slot="local-controls" class="list-inline">
62+
<ul slot="local-controls">
6363
<li>
6464
<a href="#">
6565
<span>Search</span>

‎packages/nextjs-integration/src/app/ssr/layout.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export default function Layout({ children }: { readonly children: React.ReactNod
2929
</PostLogo>
3030

3131
{/* Target Group */}
32-
<ul slot="target-group" className="target-group">
32+
<ul slot="target-group">
3333
<li>
3434
<a href="#" aria-current="location">
3535
Private customers
@@ -41,7 +41,7 @@ export default function Layout({ children }: { readonly children: React.ReactNod
4141
</ul>
4242

4343
{/* Global controls (Search) */}
44-
<ul className="list-inline" slot="global-controls">
44+
<ul slot="global-controls">
4545
<li>
4646
<a href="">
4747
<span>Search</span>
@@ -51,7 +51,7 @@ export default function Layout({ children }: { readonly children: React.ReactNod
5151
</ul>
5252

5353
{/* Meta navigation */}
54-
<ul className="list-inline" slot="meta-navigation">
54+
<ul slot="meta-navigation">
5555
<li>
5656
<a href="">
5757
Jobs
@@ -104,7 +104,7 @@ export default function Layout({ children }: { readonly children: React.ReactNod
104104
<PostMainnavigation slot="post-mainnavigation">
105105
<PostList title-hidden="">
106106
<h2>Main Navigation</h2>
107-
107+
108108
{/* Link only level 1 */}
109109
<PostListItem slot="post-list-item">
110110
<a href="/letters">Letters</a>

0 commit comments

Comments
 (0)