fix: improve phone/contact link visibility in novo theme
- Changed contact labels from green to text-secondary color - Changed contact values/links from green to text-primary with hover effect - Added proper hover state for all contact card child elements - Fixed readability issue where green text was on green-tinted background
This commit is contained in:
@@ -1,6 +1,8 @@
|
||||
import { Routes } from '@angular/router';
|
||||
import { languageGuard } from './guards/language.guard';
|
||||
|
||||
export const routes: Routes = [
|
||||
// Child routes without language prefix
|
||||
const childRoutes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
loadComponent: () => import('./pages/home/home.component').then(m => m.HomeComponent)
|
||||
@@ -64,9 +66,25 @@ export const routes: Routes = [
|
||||
{
|
||||
path: 'guarantee',
|
||||
loadComponent: () => import('./pages/info/guarantee/guarantee.component').then(m => m.GuaranteeComponent)
|
||||
},
|
||||
{
|
||||
path: '**',
|
||||
redirectTo: ''
|
||||
}
|
||||
];
|
||||
|
||||
export const routes: Routes = [
|
||||
// Routes with language prefix: /ru, /en, /hy
|
||||
{
|
||||
path: ':lang',
|
||||
canActivate: [languageGuard],
|
||||
children: childRoutes
|
||||
},
|
||||
// Redirect root to default language
|
||||
{
|
||||
path: '',
|
||||
pathMatch: 'full',
|
||||
redirectTo: 'ru'
|
||||
},
|
||||
// Catch-all: redirect unknown routes to home with default language
|
||||
{
|
||||
path: '**',
|
||||
redirectTo: 'ru'
|
||||
}
|
||||
];
|
||||
|
||||
56
src/app/guards/language.guard.ts
Normal file
56
src/app/guards/language.guard.ts
Normal file
@@ -0,0 +1,56 @@
|
||||
import { inject } from '@angular/core';
|
||||
import { CanActivateFn, Router, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
|
||||
import { LanguageService } from '../services/language.service';
|
||||
|
||||
export const languageGuard: CanActivateFn = (
|
||||
route: ActivatedRouteSnapshot,
|
||||
state: RouterStateSnapshot
|
||||
) => {
|
||||
const languageService = inject(LanguageService);
|
||||
const router = inject(Router);
|
||||
|
||||
const langParam = route.paramMap.get('lang');
|
||||
|
||||
if (langParam) {
|
||||
const validLanguage = languageService.languages.find(
|
||||
l => l.code === langParam && l.enabled
|
||||
);
|
||||
|
||||
if (validLanguage) {
|
||||
languageService.setLanguage(langParam);
|
||||
return true;
|
||||
} else {
|
||||
// Invalid language code - redirect to default language
|
||||
const currentLang = languageService.currentLanguage();
|
||||
const pathWithoutLang = state.url.replace(`/${langParam}`, '');
|
||||
router.navigate([`/${currentLang}${pathWithoutLang || '/'}`]);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
export const redirectToLanguageGuard: CanActivateFn = (
|
||||
route: ActivatedRouteSnapshot,
|
||||
state: RouterStateSnapshot
|
||||
) => {
|
||||
const languageService = inject(LanguageService);
|
||||
const router = inject(Router);
|
||||
|
||||
// Check if URL already has language prefix
|
||||
const firstSegment = state.url.split('/')[1];
|
||||
const hasLangPrefix = languageService.languages.some(
|
||||
l => l.code === firstSegment && l.enabled
|
||||
);
|
||||
|
||||
if (!hasLangPrefix) {
|
||||
// Redirect to URL with language prefix
|
||||
const currentLang = languageService.currentLanguage();
|
||||
const newUrl = `/${currentLang}${state.url === '/' ? '' : state.url}`;
|
||||
router.navigate([newUrl], { replaceUrl: true });
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
@@ -27,14 +27,17 @@
|
||||
strong {
|
||||
display: block;
|
||||
margin-bottom: 0.25rem;
|
||||
color: var(--text-primary);
|
||||
color: var(--text-secondary);
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--primary-color);
|
||||
color: var(--text-primary);
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
|
||||
&:hover {
|
||||
color: var(--primary-color);
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -391,20 +391,22 @@
|
||||
transform: translateY(-2px);
|
||||
box-shadow: var(--shadow-sm);
|
||||
|
||||
strong, p, a {
|
||||
*, strong, p, a, .contact-label, .contact-value {
|
||||
color: white !important;
|
||||
}
|
||||
}
|
||||
|
||||
strong {
|
||||
strong, .contact-label {
|
||||
display: block;
|
||||
color: var(--primary-color);
|
||||
color: var(--text-secondary);
|
||||
margin-bottom: 0.5rem;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
p, a {
|
||||
p, a, .contact-value {
|
||||
margin: 0;
|
||||
color: var(--text-primary);
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user