2 Commits

Author SHA1 Message Date
sdarbinyan
9386fbc2f8 currency for market 2026-06-20 14:00:28 +04:00
sdarbinyan
a06b654103 logo fix 2026-06-20 13:33:52 +04:00
4 changed files with 129 additions and 41 deletions

View File

@@ -3,7 +3,7 @@
<header class="novo-header">
<div class="novo-header-container">
<div class="novo-left">
<a [routerLink]="'/' | langRoute" class="novo-logo" (click)="closeMenu()">
<a [attr.href]="homeUrl" class="novo-logo" (click)="navigateHome($event)">
<app-logo />
<!-- <span class="novo-brand">{{ brandName }}</span> -->
</a>
@@ -36,6 +36,7 @@
<app-language-selector />
<a [routerLink]="'/cart' | langRoute" routerLinkActive="novo-cart-active" class="novo-cart" (click)="closeMenu()" [attr.aria-label]="'header.cart' | translate">
<span class="novo-cart-icon">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<circle cx="9" cy="21" r="1"></circle>
<circle cx="20" cy="21" r="1"></circle>
@@ -44,6 +45,10 @@
@if (cartItemCount() > 0) {
<span class="novo-cart-badge">{{ cartItemCount() }}</span>
}
</span>
@if (cartItemCount() > 0) {
<span class="novo-cart-total">{{ formatCartTotal(cartTotal()) }}</span>
}
</a>
<button class="menu-toggle novo-menu-toggle" (click)="toggleMenu()" [class.active]="menuOpen" [class.novo-active]="menuOpen" [attr.aria-label]="menuOpen ? 'Close menu' : 'Open menu'" [attr.aria-expanded]="menuOpen">
@@ -59,7 +64,7 @@
<header class="dexar-header">
<div class="dexar-header-container">
<!-- Logo -->
<a [routerLink]="'/' | langRoute" class="dexar-logo" (click)="closeMenu()">
<a [attr.href]="homeUrl" class="dexar-logo" (click)="navigateHome($event)">
<app-logo />
</a>
@@ -102,6 +107,7 @@
<div class="dexar-actions">
<!-- Cart Button -->
<a [routerLink]="'/cart' | langRoute" routerLinkActive="dexar-cart-active" class="dexar-cart-btn" (click)="closeMenu()">
<span class="dexar-cart-icon">
<svg width="32" height="24" viewBox="0 0 48 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 0.5H36C42.3513 0.5 47.5 5.64873 47.5 12V20C47.5 26.3513 42.3513 31.5 36 31.5H12C5.64873 31.5 0.5 26.3513 0.5 20V12C0.5 5.64873 5.64873 0.5 12 0.5Z" fill="transparent" />
<path d="M12 0.5H36C42.3513 0.5 47.5 5.64873 47.5 12V20C47.5 26.3513 42.3513 31.5 36 31.5H12C5.64873 31.5 0.5 26.3513 0.5 20V12C0.5 5.64873 5.64873 0.5 12 0.5Z" stroke="#677B78" />
@@ -110,6 +116,10 @@
@if (cartItemCount() > 0) {
<span class="dexar-cart-badge">{{ cartItemCount() }}</span>
}
</span>
@if (cartItemCount() > 0) {
<span class="dexar-cart-total">{{ formatCartTotal(cartTotal()) }}</span>
}
</a>
<!-- Region Selector (desktop only) -->

View File

@@ -333,22 +333,34 @@
}
.novo-cart {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.2rem;
color: var(--text-primary);
text-decoration: none;
padding: 0.5rem;
border-radius: var(--radius-md);
transition: all 0.3s;
svg {
display: block;
}
&:hover,
&.novo-cart-active {
color: var(--primary-color);
background: var(--bg-secondary);
}
}
.novo-cart-icon {
position: relative;
display: flex;
align-items: center;
justify-content: center;
line-height: 0;
svg {
display: block;
}
}
.novo-cart-badge {
position: absolute;
@@ -367,6 +379,12 @@
padding: 0 5px;
box-shadow: var(--shadow-sm);
}
.novo-cart-total {
font-size: 0.68rem;
font-weight: 700;
line-height: 1;
white-space: nowrap;
}
.novo-menu-toggle {
@@ -492,7 +510,7 @@
display: flex;
align-items: center;
gap: 32px;
height: 48px;
min-height: 48px;
}
.dexar-logo {
@@ -615,15 +633,15 @@
}
.dexar-cart-btn {
position: relative;
width: 36px;
height: 28px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-width: 36px;
text-decoration: none;
cursor: pointer;
transition: opacity 0.3s ease;
gap: 2px;
svg {
width: 36px;
@@ -639,6 +657,15 @@
}
}
.dexar-cart-icon {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 36px;
height: 28px;
}
.dexar-cart-badge {
position: absolute;
top: -8px;
@@ -658,6 +685,15 @@
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.dexar-cart-total {
font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-weight: 700;
font-size: 10px;
line-height: 1;
color: #1e3c38;
white-space: nowrap;
}
.dexar-lang-selector {
display: flex;
align-items: center;

View File

@@ -17,6 +17,7 @@ import { TranslatePipe } from '../../i18n/translate.pipe';
})
export class HeaderComponent {
cartItemCount;
cartTotal;
menuOpen = false;
brandName = environment.brandFullName;
logo = environment.logo;
@@ -28,6 +29,11 @@ export class HeaderComponent {
constructor(private cartService: CartService, private router: Router) {
this.cartItemCount = this.cartService.itemCount;
this.cartTotal = this.cartService.totalPrice;
}
get homeUrl(): string {
return `/${this.langService.currentLanguage()}`;
}
toggleMenu(): void {
@@ -44,6 +50,23 @@ export class HeaderComponent {
this.renderer.removeClass(this.document.body, 'dexar-menu-open');
}
navigateHome(event?: Event): void {
event?.preventDefault();
this.closeMenu();
const homeUrl = this.homeUrl;
const currentUrl = this.router.url.split('?')[0].split('#')[0];
if (currentUrl === homeUrl || currentUrl === `${homeUrl}/`) {
this.document.defaultView?.scrollTo({ top: 0, behavior: 'smooth' });
return;
}
this.router.navigateByUrl(homeUrl).then(() => {
this.document.defaultView?.scrollTo({ top: 0, behavior: 'auto' });
});
}
navigateToSearch(): void {
const lang = this.langService.currentLanguage();
this.router.navigate([`/${lang}/search`]);
@@ -58,4 +81,20 @@ export class HeaderComponent {
}, 100);
});
}
formatCartTotal(total: number): string {
const locale = this.langService.currentLanguage() === 'en'
? 'en-US'
: this.langService.currentLanguage() === 'hy'
? 'hy-AM'
: 'ru-RU';
const fractionDigits = Number.isInteger(total) ? 0 : 2;
const amount = new Intl.NumberFormat(locale, {
minimumFractionDigits: fractionDigits,
maximumFractionDigits: 2,
}).format(total);
const currencySymbol = this.langService.getCurrentCurrency()?.symbol ?? this.langService.currentCurrency();
return `${amount} ${currencySymbol}`;
}
}

View File

@@ -3,12 +3,15 @@ import { environment } from '../../../environments/environment';
@Component({
selector: 'app-logo',
template: `<img [src]="logoPath" [alt]="brandName + ' logo'" class="logo-img" fetchpriority="high" />`,
template: `<img [src]="logoPath" [alt]="brandName + ' logo'" class="logo-img" fetchpriority="high" draggable="false" />`,
styles: [`
.logo-img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
pointer-events: none;
user-select: none;
}
`],
changeDetection: ChangeDetectionStrategy.OnPush