Loyaly/loyalyweb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update pages, components, and add stock images for visual layout enhancements

Browse Source
This commit is contained in:
R-Bharathraj
2026-06-30 13:36:16 +05:30
parent 9b93fa0d07
commit 7175adb0db
36 changed files with 340 additions and 604 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/GetInTouch.tsx
View File

@@ -92,7 +92,7 @@ export default function GetInTouch() {
<div>
<div style={{
fontSize: 11, fontWeight: 700, letterSpacing: '0.2em', textTransform: 'uppercase',
color: '#f4be28', fontFamily: 'Manrope, sans-serif', marginBottom: 24,
color: '#f4be28', fontFamily: 'Sora, sans-serif', marginBottom: 24,
display: 'flex', alignItems: 'center', gap: 12,
}}>
<span style={{ width: 28, height: 1, background: '#f4be28', display: 'block' }} />Get in Touch
@@ -109,7 +109,7 @@ export default function GetInTouch() {
<p style={{
margin: '0 0 44px', fontSize: 16, lineHeight: 1.8,
color: 'rgba(255,255,255,0.42)', fontFamily: 'Manrope, sans-serif', maxWidth: 380,
color: 'rgba(255,255,255,0.42)', fontFamily: 'Sora, sans-serif', maxWidth: 380,
}}>
Whether you're exploring AI possibilities or ready to deploy, our team will help you find the right solution for your business.
</p>
@@ -129,8 +129,8 @@ export default function GetInTouch() {
color: '#f4be28',
}}>{d.icon}</div>
<div>
<div style={{ fontSize: 11, fontWeight: 700, letterSpacing: '0.12em', textTransform: 'uppercase', color: 'rgba(255,255,255,0.4)', fontFamily: 'Manrope, sans-serif', marginBottom: 6 }}>{d.label}</div>
<div style={{ fontSize: 15, lineHeight: 1.6, color: 'rgba(255,255,255,0.7)', fontFamily: 'Manrope, sans-serif' }}>{d.value}</div>
<div style={{ fontSize: 11, fontWeight: 700, letterSpacing: '0.12em', textTransform: 'uppercase', color: 'rgba(255,255,255,0.4)', fontFamily: 'Sora, sans-serif', marginBottom: 6 }}>{d.label}</div>
<div style={{ fontSize: 15, lineHeight: 1.6, color: 'rgba(255,255,255,0.7)', fontFamily: 'Sora, sans-serif' }}>{d.value}</div>
</div>
</div>
))}
@@ -138,7 +138,7 @@ export default function GetInTouch() {
{/* Socials */}
<div style={{ display: 'flex', alignItems: 'center', gap: 12 }}>
<span style={{ fontSize: 11, fontWeight: 700, letterSpacing: '0.12em', textTransform: 'uppercase', color: 'rgba(255,255,255,0.35)', fontFamily: 'Manrope, sans-serif' }}>Follow</span>
<span style={{ fontSize: 11, fontWeight: 700, letterSpacing: '0.12em', textTransform: 'uppercase', color: 'rgba(255,255,255,0.35)', fontFamily: 'Sora, sans-serif' }}>Follow</span>
{SOCIALS.map((s) => (
<a key={s.label} href={s.href} target="_blank" rel="noopener noreferrer" aria-label={s.label} className="git-social">
{s.icon}
@@ -167,12 +167,12 @@ export default function GetInTouch() {
<svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="#4ade80" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round"><path d="M20 6 9 17l-5-5" /></svg>
</div>
<h3 style={{ margin: '0 0 10px', fontSize: 22, fontWeight: 800, color: '#fff', fontFamily: 'Sora, sans-serif', letterSpacing: '-0.02em' }}>Message sent!</h3>
<p style={{ margin: 0, color: 'rgba(255,255,255,0.45)', fontFamily: 'Manrope, sans-serif' }}>We'll get back to you within one business day.</p>
<p style={{ margin: 0, color: 'rgba(255,255,255,0.45)', fontFamily: 'Sora, sans-serif' }}>We'll get back to you within one business day.</p>
<button onClick={() => setFormState('idle')} style={{
marginTop: 28, padding: '12px 28px', borderRadius: 100,
background: 'transparent', border: '1px solid rgba(255,255,255,0.2)',
color: '#fff', fontWeight: 600, fontSize: 14, cursor: 'pointer',
fontFamily: 'Manrope, sans-serif',
fontFamily: 'Sora, sans-serif',
}}>Send another message</button>
</div>
) : (
@@ -185,7 +185,7 @@ export default function GetInTouch() {
<div role="alert" style={{
marginBottom: 20, padding: '12px 16px',
background: 'rgba(248,113,113,0.1)', border: '1px solid rgba(248,113,113,0.3)',
color: '#fca5a5', borderRadius: 12, fontSize: 14, fontFamily: 'Manrope, sans-serif',
color: '#fca5a5', borderRadius: 12, fontSize: 14, fontFamily: 'Sora, sans-serif',
}}>{errorMessage}</div>
)}
@@ -210,7 +210,7 @@ export default function GetInTouch() {
<button type="submit" disabled={formState === 'sending'} style={{
marginTop: 4, padding: '16px 28px', borderRadius: 100, border: 'none',
background: formState === 'sending' ? 'rgba(244,190,40,0.6)' : '#f4be28',
color: '#111', fontWeight: 800, fontSize: 15, fontFamily: 'Manrope, sans-serif',
color: '#111', fontWeight: 800, fontSize: 15, fontFamily: 'Sora, sans-serif',
cursor: formState === 'sending' ? 'wait' : 'pointer',
display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 8,
boxShadow: '0 12px 36px rgba(244,190,40,0.25)',
@@ -250,7 +250,7 @@ export default function GetInTouch() {
const labelStyle: React.CSSProperties = {
display: 'flex', flexDirection: 'column', gap: 8,
fontSize: 13, fontWeight: 600, color: 'rgba(255,255,255,0.55)',
fontFamily: 'Manrope, sans-serif',
fontFamily: 'Sora, sans-serif',
};
const inputStyle: React.CSSProperties = {
@@ -263,6 +263,6 @@ const inputStyle: React.CSSProperties = {
outline: 'none',
width: '100%',
boxSizing: 'border-box',
fontFamily: 'Manrope, sans-serif',
fontFamily: 'Sora, sans-serif',
transition: 'border-color 0.2s ease, box-shadow 0.2s ease',
};