Skip to content

Commit 9547fcf

Browse files
ricardochlSplaktar
ricardochl
authored and
Splaktar
committed
feat: update origin to Angular v21.0.1
- Improve translations - Update and translates guides Fixes #88
1 parent 3875f9f commit 9547fcf

417 files changed

Lines changed: 19470 additions & 12036 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎adev-es/src/app/core/layout/navigation/navigation.component.en.html‎

Lines changed: 30 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -62,9 +62,9 @@
6262
<nav
6363
class="adev-nav-primary docs-scroll-hide"
6464
[class.adev-nav-primary--open]="isMobileNavigationOpened()"
65-
[class.adev-nav-primary--rc]="currentDocsVersionMode === 'rc'"
66-
[class.adev-nav-primary--next]="currentDocsVersionMode === 'next'"
67-
[class.adev-nav-primary--deprecated]="currentDocsVersionMode === 'deprecated'"
65+
[class.adev-nav-primary--rc]="currentDocsVersionMode() === 'rc'"
66+
[class.adev-nav-primary--next]="currentDocsVersionMode() === 'next'"
67+
[class.adev-nav-primary--deprecated]="currentDocsVersionMode() === 'deprecated'"
6868
>
6969
<button
7070
type="button"
@@ -177,7 +177,7 @@
177177
type="button"
178178
cdkMenuItem
179179
[href]="item.url"
180-
[attr.aria-label]="item.displayName"
180+
[aria-label]="item.displayName"
181181
>
182182
<span>{{ item.displayName }}</span>
183183
</a>
@@ -209,7 +209,7 @@
209209
</svg>
210210
<span
211211
class="adev-nav-item__label adev-search-desktop"
212-
[attr.aria-label]="'Open search dialog with ' + searchTitle"
212+
[aria-label]="'Open search dialog with ' + searchTitle"
213213
>
214214
<kbd>{{ searchLabel }}</kbd>
215215
<kbd>K</kbd>
@@ -446,17 +446,20 @@
446446
</ul>
447447
</ng-template>
448448
</div>
449-
<!-- TODO: Refactor this and make it better. Accessible, animated, etc. -->
449+
<!-- Theme Picker -->
450450
<div class="adev-nav-item" [class.adev-nav-item--active]="openedMenu() === 'theme-picker'">
451451
<button
452452
type="button"
453453
[cdkMenuTriggerFor]="themeMiniMenu"
454454
[cdkMenuPosition]="miniMenuPositions"
455-
aria-label="Open theme picker"
455+
[aria-label]="'Change theme. Current theme: ' + theme()"
456+
aria-controls="theme-mini-menu"
457+
[aria-expanded]="openedMenu() === 'theme-picker'"
458+
aria-haspopup="menu"
456459
(cdkMenuClosed)="closeMenu()"
457460
(cdkMenuOpened)="openMenu('theme-picker')"
458461
>
459-
<docs-icon role="presentation">
462+
<docs-icon role="presentation" class="adev-theme-icon">
460463
@switch (theme()) {
461464
@case ('light') {
462465
{{ 'light_mode' }}
@@ -472,37 +475,49 @@
472475
</button>
473476

474477
<ng-template #themeMiniMenu>
475-
<ul class="adev-mini-menu" cdkMenu>
476-
<li>
478+
<ul
479+
class="adev-mini-menu"
480+
cdkMenu
481+
id="theme-mini-menu"
482+
role="menu"
483+
aria-label="Theme options"
484+
>
485+
<li role="none">
477486
<button
478487
type="button"
479488
cdkMenuItem
489+
role="menuitemradio"
490+
[aria-checked]="theme() === 'auto'"
480491
(click)="setTheme('auto')"
481492
aria-label="Set default system theme"
482493
>
483-
<docs-icon class="docs-icon_high-contrast">routine</docs-icon>
494+
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">routine</docs-icon>
484495
<span>System</span>
485496
</button>
486497
</li>
487-
<li>
498+
<li role="none">
488499
<button
489500
type="button"
490501
cdkMenuItem
502+
role="menuitemradio"
503+
[aria-checked]="theme() === 'dark'"
491504
(click)="setTheme('dark')"
492505
aria-label="Set dark theme"
493506
>
494-
<docs-icon class="docs-icon_high-contrast">dark_mode</docs-icon>
507+
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">dark_mode</docs-icon>
495508
<span>Dark</span>
496509
</button>
497510
</li>
498-
<li>
511+
<li role="none">
499512
<button
500513
type="button"
501514
cdkMenuItem
515+
role="menuitemradio"
516+
[aria-checked]="theme() === 'light'"
502517
(click)="setTheme('light')"
503518
aria-label="Set light theme"
504519
>
505-
<docs-icon class="docs-icon_high-contrast">light_mode</docs-icon>
520+
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">light_mode</docs-icon>
506521
<span>Light</span>
507522
</button>
508523
</li>

‎adev-es/src/app/core/layout/navigation/navigation.component.html‎

Lines changed: 29 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -62,9 +62,9 @@
6262
<nav
6363
class="adev-nav-primary docs-scroll-hide"
6464
[class.adev-nav-primary--open]="isMobileNavigationOpened()"
65-
[class.adev-nav-primary--rc]="currentDocsVersionMode === 'rc'"
66-
[class.adev-nav-primary--next]="currentDocsVersionMode === 'next'"
67-
[class.adev-nav-primary--deprecated]="currentDocsVersionMode === 'deprecated'"
65+
[class.adev-nav-primary--rc]="currentDocsVersionMode() === 'rc'"
66+
[class.adev-nav-primary--next]="currentDocsVersionMode() === 'next'"
67+
[class.adev-nav-primary--deprecated]="currentDocsVersionMode() === 'deprecated'"
6868
>
6969
<button
7070
type="button"
@@ -166,7 +166,7 @@
166166
</svg>
167167
<span
168168
class="adev-nav-item__label adev-search-desktop"
169-
[attr.aria-label]="'Open search dialog with ' + searchTitle"
169+
[aria-label]="'Open search dialog with ' + searchTitle"
170170
>
171171
<kbd>{{ searchLabel }}</kbd>
172172
<kbd>K</kbd>
@@ -307,17 +307,20 @@
307307
</ul>
308308
</ng-template>
309309
</div>
310-
<!-- TODO: Refactor this and make it better. Accessible, animated, etc. -->
310+
<!-- Theme Picker -->
311311
<div class="adev-nav-item" [class.adev-nav-item--active]="openedMenu() === 'theme-picker'">
312312
<button
313313
type="button"
314314
[cdkMenuTriggerFor]="themeMiniMenu"
315315
[cdkMenuPosition]="miniMenuPositions"
316-
aria-label="Open theme picker"
316+
[aria-label]="'Change theme. Current theme: ' + theme()"
317+
aria-controls="theme-mini-menu"
318+
[aria-expanded]="openedMenu() === 'theme-picker'"
319+
aria-haspopup="menu"
317320
(cdkMenuClosed)="closeMenu()"
318321
(cdkMenuOpened)="openMenu('theme-picker')"
319322
>
320-
<docs-icon role="presentation">
323+
<docs-icon role="presentation" class="adev-theme-icon">
321324
@switch (theme()) {
322325
@case ('light') {
323326
{{ 'light_mode' }}
@@ -333,37 +336,49 @@
333336
</button>
334337

335338
<ng-template #themeMiniMenu>
336-
<ul class="adev-mini-menu" cdkMenu>
337-
<li>
339+
<ul
340+
class="adev-mini-menu"
341+
cdkMenu
342+
id="theme-mini-menu"
343+
role="menu"
344+
aria-label="Theme options"
345+
>
346+
<li role="none">
338347
<button
339348
type="button"
340349
cdkMenuItem
350+
role="menuitemradio"
351+
[aria-checked]="theme() === 'auto'"
341352
(click)="setTheme('auto')"
342353
aria-label="Set default system theme"
343354
>
344-
<docs-icon class="docs-icon_high-contrast">routine</docs-icon>
355+
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">routine</docs-icon>
345356
<span>System</span>
346357
</button>
347358
</li>
348-
<li>
359+
<li role="none">
349360
<button
350361
type="button"
351362
cdkMenuItem
363+
role="menuitemradio"
364+
[aria-checked]="theme() === 'dark'"
352365
(click)="setTheme('dark')"
353366
aria-label="Set dark theme"
354367
>
355-
<docs-icon class="docs-icon_high-contrast">dark_mode</docs-icon>
368+
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">dark_mode</docs-icon>
356369
<span>Dark</span>
357370
</button>
358371
</li>
359-
<li>
372+
<li role="none">
360373
<button
361374
type="button"
362375
cdkMenuItem
376+
role="menuitemradio"
377+
[aria-checked]="theme() === 'light'"
363378
(click)="setTheme('light')"
364379
aria-label="Set light theme"
365380
>
366-
<docs-icon class="docs-icon_high-contrast">light_mode</docs-icon>
381+
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">light_mode</docs-icon>
367382
<span>Light</span>
368383
</button>
369384
</li>

‎adev-es/src/app/features/home/home.component.en.html‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
1-
<div class="adev-home" #home>
1+
<main class="adev-home" #home>
22
<div class="banners-layer layer">
33
<div class="adev-banner-container">
4-
<a href="https://goo.gle/angular-ai-update" class="adev-banner" target="_blank">
5-
<h1 tabindex="-1">Available Now:</h1>
6-
<p class="adev-banner-cta">Angular AI Developer Event Replay</p>
4+
<a
5+
href="events/v21"
6+
class="adev-banner"
7+
target="_blank"
8+
>
9+
<h1 tabindex="-1">Angular v21 is here!</h1>
10+
<p class="adev-banner-cta">🕹️ Start your adventure</p>
711
</a>
812
</div>
913
</div>
@@ -486,4 +490,4 @@ <h3>Are you an LLM or curious about AI in Angular?</h3>
486490
</div>
487491
</div>
488492
</section>
489-
</div>
493+
</main>

‎adev-es/src/app/features/home/home.component.html‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
1-
<div class="adev-home" #home>
1+
<main class="adev-home" #home>
22
<div class="banners-layer layer">
33
<div class="adev-banner-container">
4-
<a href="https://goo.gle/angular-ai-update" class="adev-banner" target="_blank">
5-
<h1 tabindex="-1"></h1>
6-
<p class="adev-banner-cta"></p>
4+
<a
5+
href="events/v21"
6+
class="adev-banner"
7+
target="_blank"
8+
>
9+
<h1 tabindex="-1">Angular v21 está aquí!</h1>
10+
<p class="adev-banner-cta">🕹️ Comenzar tu aventura</p>
711
</a>
812
</div>
913
</div>
@@ -85,7 +89,7 @@ <h2> El framework para crear aplicaciones web escalables con confianza</h2>
8589

8690
<div class="learn-angular">
8791
<a href="#learn-more" class="adev-cta">
88-
<button class="docs-primary-btn" [attr.text]="'Get Started'" aria-label="Get Started">
92+
<button class="docs-primary-btn" [attr.text]="'Comenzar'" aria-label="Comenzar">
8993
Comenzar
9094
</button>
9195
</a>
@@ -186,7 +190,8 @@ <h2>Cuando el rendimiento importa</h2>
186190
</svg>
187191
<div class="card-content">
188192
<p>
189-
Alcanza tus objetivos de rendimiento con SSR, SSG, hidratación y la carga diferida de nueva generación
193+
Alcanza tus objetivos de rendimiento con SSR, SSG, hidratación
194+
y la carga diferida de nueva generación
190195
</p>
191196
</div>
192197
<span>Aprende sobre estrategias de renderizado</span>
@@ -485,4 +490,4 @@ <h3>¿Eres un LLM o tienes curiosidad sobre la IA en Angular?</h3>
485490
</div>
486491
</div>
487492
</section>
488-
</div>
493+
</main>

0 commit comments

Comments
 (0)