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 >
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 >
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 >
0 commit comments