WARNING: THIS SITE IS A MIRROR OF GITHUB.COM / IT CANNOT LOGIN OR REGISTER ACCOUNTS / THE CONTENTS ARE PROVIDED AS-IS / THIS SITE ASSUMES NO RESPONSIBILITY FOR ANY DISPLAYED CONTENT OR LINKS / IF YOU FOUND SOMETHING MAY NOT GOOD FOR EVERYONE, CONTACT ADMIN AT ilovescratch@foxmail.com
Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
45 changes: 30 additions & 15 deletions adev-es/src/app/core/layout/navigation/navigation.component.en.html
Original file line number Diff line number Diff line change
Expand Up @@ -62,9 +62,9 @@
<nav
class="adev-nav-primary docs-scroll-hide"
[class.adev-nav-primary--open]="isMobileNavigationOpened()"
[class.adev-nav-primary--rc]="currentDocsVersionMode === 'rc'"
[class.adev-nav-primary--next]="currentDocsVersionMode === 'next'"
[class.adev-nav-primary--deprecated]="currentDocsVersionMode === 'deprecated'"
[class.adev-nav-primary--rc]="currentDocsVersionMode() === 'rc'"
[class.adev-nav-primary--next]="currentDocsVersionMode() === 'next'"
[class.adev-nav-primary--deprecated]="currentDocsVersionMode() === 'deprecated'"
>
<button
type="button"
Expand Down Expand Up @@ -177,7 +177,7 @@
type="button"
cdkMenuItem
[href]="item.url"
[attr.aria-label]="item.displayName"
[aria-label]="item.displayName"
>
<span>{{ item.displayName }}</span>
</a>
Expand Down Expand Up @@ -209,7 +209,7 @@
</svg>
<span
class="adev-nav-item__label adev-search-desktop"
[attr.aria-label]="'Open search dialog with ' + searchTitle"
[aria-label]="'Open search dialog with ' + searchTitle"
>
<kbd>{{ searchLabel }}</kbd>
<kbd>K</kbd>
Expand Down Expand Up @@ -446,17 +446,20 @@
</ul>
</ng-template>
</div>
<!-- TODO: Refactor this and make it better. Accessible, animated, etc. -->
<!-- Theme Picker -->
<div class="adev-nav-item" [class.adev-nav-item--active]="openedMenu() === 'theme-picker'">
<button
type="button"
[cdkMenuTriggerFor]="themeMiniMenu"
[cdkMenuPosition]="miniMenuPositions"
aria-label="Open theme picker"
[aria-label]="'Change theme. Current theme: ' + theme()"
aria-controls="theme-mini-menu"
[aria-expanded]="openedMenu() === 'theme-picker'"
aria-haspopup="menu"
(cdkMenuClosed)="closeMenu()"
(cdkMenuOpened)="openMenu('theme-picker')"
>
<docs-icon role="presentation">
<docs-icon role="presentation" class="adev-theme-icon">
@switch (theme()) {
@case ('light') {
{{ 'light_mode' }}
Expand All @@ -472,37 +475,49 @@
</button>

<ng-template #themeMiniMenu>
<ul class="adev-mini-menu" cdkMenu>
<li>
<ul
class="adev-mini-menu"
cdkMenu
id="theme-mini-menu"
role="menu"
aria-label="Theme options"
>
<li role="none">
<button
type="button"
cdkMenuItem
role="menuitemradio"
[aria-checked]="theme() === 'auto'"
(click)="setTheme('auto')"
aria-label="Set default system theme"
>
<docs-icon class="docs-icon_high-contrast">routine</docs-icon>
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">routine</docs-icon>
<span>System</span>
</button>
</li>
<li>
<li role="none">
<button
type="button"
cdkMenuItem
role="menuitemradio"
[aria-checked]="theme() === 'dark'"
(click)="setTheme('dark')"
aria-label="Set dark theme"
>
<docs-icon class="docs-icon_high-contrast">dark_mode</docs-icon>
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">dark_mode</docs-icon>
<span>Dark</span>
</button>
</li>
<li>
<li role="none">
<button
type="button"
cdkMenuItem
role="menuitemradio"
[aria-checked]="theme() === 'light'"
(click)="setTheme('light')"
aria-label="Set light theme"
>
<docs-icon class="docs-icon_high-contrast">light_mode</docs-icon>
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">light_mode</docs-icon>
<span>Light</span>
</button>
</li>
Expand Down
43 changes: 29 additions & 14 deletions adev-es/src/app/core/layout/navigation/navigation.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -62,9 +62,9 @@
<nav
class="adev-nav-primary docs-scroll-hide"
[class.adev-nav-primary--open]="isMobileNavigationOpened()"
[class.adev-nav-primary--rc]="currentDocsVersionMode === 'rc'"
[class.adev-nav-primary--next]="currentDocsVersionMode === 'next'"
[class.adev-nav-primary--deprecated]="currentDocsVersionMode === 'deprecated'"
[class.adev-nav-primary--rc]="currentDocsVersionMode() === 'rc'"
[class.adev-nav-primary--next]="currentDocsVersionMode() === 'next'"
[class.adev-nav-primary--deprecated]="currentDocsVersionMode() === 'deprecated'"
>
<button
type="button"
Expand Down Expand Up @@ -166,7 +166,7 @@
</svg>
<span
class="adev-nav-item__label adev-search-desktop"
[attr.aria-label]="'Open search dialog with ' + searchTitle"
[aria-label]="'Open search dialog with ' + searchTitle"
>
<kbd>{{ searchLabel }}</kbd>
<kbd>K</kbd>
Expand Down Expand Up @@ -307,17 +307,20 @@
</ul>
</ng-template>
</div>
<!-- TODO: Refactor this and make it better. Accessible, animated, etc. -->
<!-- Theme Picker -->
<div class="adev-nav-item" [class.adev-nav-item--active]="openedMenu() === 'theme-picker'">
<button
type="button"
[cdkMenuTriggerFor]="themeMiniMenu"
[cdkMenuPosition]="miniMenuPositions"
aria-label="Open theme picker"
[aria-label]="'Change theme. Current theme: ' + theme()"
aria-controls="theme-mini-menu"
[aria-expanded]="openedMenu() === 'theme-picker'"
aria-haspopup="menu"
(cdkMenuClosed)="closeMenu()"
(cdkMenuOpened)="openMenu('theme-picker')"
>
<docs-icon role="presentation">
<docs-icon role="presentation" class="adev-theme-icon">
@switch (theme()) {
@case ('light') {
{{ 'light_mode' }}
Expand All @@ -333,37 +336,49 @@
</button>

<ng-template #themeMiniMenu>
<ul class="adev-mini-menu" cdkMenu>
<li>
<ul
class="adev-mini-menu"
cdkMenu
id="theme-mini-menu"
role="menu"
aria-label="Theme options"
>
<li role="none">
<button
type="button"
cdkMenuItem
role="menuitemradio"
[aria-checked]="theme() === 'auto'"
(click)="setTheme('auto')"
aria-label="Set default system theme"
>
<docs-icon class="docs-icon_high-contrast">routine</docs-icon>
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">routine</docs-icon>
<span>System</span>
</button>
</li>
<li>
<li role="none">
<button
type="button"
cdkMenuItem
role="menuitemradio"
[aria-checked]="theme() === 'dark'"
(click)="setTheme('dark')"
aria-label="Set dark theme"
>
<docs-icon class="docs-icon_high-contrast">dark_mode</docs-icon>
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">dark_mode</docs-icon>
<span>Dark</span>
</button>
</li>
<li>
<li role="none">
<button
type="button"
cdkMenuItem
role="menuitemradio"
[aria-checked]="theme() === 'light'"
(click)="setTheme('light')"
aria-label="Set light theme"
>
<docs-icon class="docs-icon_high-contrast">light_mode</docs-icon>
<docs-icon class="docs-icon_high-contrast" aria-hidden="true">light_mode</docs-icon>
<span>Light</span>
</button>
</li>
Expand Down
14 changes: 9 additions & 5 deletions adev-es/src/app/features/home/home.component.en.html
Original file line number Diff line number Diff line change
@@ -1,9 +1,13 @@
<div class="adev-home" #home>
<main class="adev-home" #home>
<div class="banners-layer layer">
<div class="adev-banner-container">
<a href="https://goo.gle/angular-ai-update" class="adev-banner" target="_blank">
<h1 tabindex="-1">Available Now:</h1>
<p class="adev-banner-cta">Angular AI Developer Event Replay</p>
<a
href="events/v21"
class="adev-banner"
target="_blank"
>
<h1 tabindex="-1">Angular v21 is here!</h1>
<p class="adev-banner-cta">🕹️ Start your adventure</p>
</a>
</div>
</div>
Expand Down Expand Up @@ -486,4 +490,4 @@ <h3>Are you an LLM or curious about AI in Angular?</h3>
</div>
</div>
</section>
</div>
</main>
19 changes: 12 additions & 7 deletions adev-es/src/app/features/home/home.component.html
Original file line number Diff line number Diff line change
@@ -1,9 +1,13 @@
<div class="adev-home" #home>
<main class="adev-home" #home>
<div class="banners-layer layer">
<div class="adev-banner-container">
<a href="https://goo.gle/angular-ai-update" class="adev-banner" target="_blank">
<h1 tabindex="-1"></h1>
<p class="adev-banner-cta"></p>
<a
href="events/v21"
class="adev-banner"
target="_blank"
>
<h1 tabindex="-1">Angular v21 está aquí!</h1>
<p class="adev-banner-cta">🕹️ Comenzar tu aventura</p>
</a>
</div>
</div>
Expand Down Expand Up @@ -85,7 +89,7 @@ <h2> El framework para crear aplicaciones web escalables con confianza</h2>

<div class="learn-angular">
<a href="#learn-more" class="adev-cta">
<button class="docs-primary-btn" [attr.text]="'Get Started'" aria-label="Get Started">
<button class="docs-primary-btn" [attr.text]="'Comenzar'" aria-label="Comenzar">
Comenzar
</button>
</a>
Expand Down Expand Up @@ -186,7 +190,8 @@ <h2>Cuando el rendimiento importa</h2>
</svg>
<div class="card-content">
<p>
Alcanza tus objetivos de rendimiento con SSR, SSG, hidratación y la carga diferida de nueva generación
Alcanza tus objetivos de rendimiento con SSR, SSG, hidratación
y la carga diferida de nueva generación
</p>
</div>
<span>Aprende sobre estrategias de renderizado</span>
Expand Down Expand Up @@ -485,4 +490,4 @@ <h3>¿Eres un LLM o tienes curiosidad sobre la IA en Angular?</h3>
</div>
</div>
</section>
</div>
</main>
Loading
Loading