Produkt Page erstellt
This commit is contained in:
@@ -7,14 +7,71 @@ import { getLanguage, translations } from '../../i18n'
|
||||
const Page = () => {
|
||||
const lang = getLanguage();
|
||||
const t = translations[lang].products.boss4j;
|
||||
const common = translations[lang].common;
|
||||
|
||||
return (
|
||||
<ProductPage
|
||||
title={t.title}
|
||||
description={t.text}
|
||||
icon="layers"
|
||||
trademark={t.trademark}
|
||||
/>
|
||||
trademark={t.trademark}
|
||||
features={t.features}
|
||||
>
|
||||
<div style={{ marginTop: '6rem' }}>
|
||||
<h2 style={{ marginBottom: '3rem', display: 'block' }}>{lang === 'de' ? 'Warum Boss4J?' : 'Why Boss4J?'}</h2>
|
||||
<div style={{
|
||||
display: 'grid',
|
||||
gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 1fr))',
|
||||
gap: '2.5rem',
|
||||
textAlign: 'left'
|
||||
}}>
|
||||
<div style={{ padding: '2rem', borderLeft: '5px solid var(--accent-color)', backgroundColor: 'var(--bg-light)', borderRadius: '0 8px 8px 0' }}>
|
||||
<h4 style={{ color: 'var(--primary-color)', marginBottom: '1rem', fontSize: '1.3rem' }}>{lang === 'de' ? 'Direkte Kontrolle' : 'Direct Control'}</h4>
|
||||
<p style={{ textAlign: 'left', fontSize: '1.05rem', lineHeight: '1.6' }}>
|
||||
{lang === 'de'
|
||||
? 'Verwalten Sie Ihre Server ohne Umwege über komplexe Management-Konsolen oder eingeschränkte CLIs.'
|
||||
: 'Manage your servers directly without detours through complex management consoles or restricted CLIs.'}
|
||||
</p>
|
||||
</div>
|
||||
<div style={{ padding: '2rem', borderLeft: '5px solid var(--accent-color)', backgroundColor: 'var(--bg-light)', borderRadius: '0 8px 8px 0' }}>
|
||||
<h4 style={{ color: 'var(--primary-color)', marginBottom: '1rem', fontSize: '1.3rem' }}>{lang === 'de' ? 'Operative Sicherheit' : 'Operational Safety'}</h4>
|
||||
<p style={{ textAlign: 'left', fontSize: '1.05rem', lineHeight: '1.6' }}>
|
||||
{lang === 'de'
|
||||
? 'Minimieren Sie Fehlkonfigurationen durch Dry-Runs und die Gewissheit, jederzeit auf alte Versionen zurückgreifen zu können.'
|
||||
: 'Minimize misconfigurations with dry-runs and the certainty of being able to revert to old versions at any time.'}
|
||||
</p>
|
||||
</div>
|
||||
<div style={{ padding: '2rem', borderLeft: '5px solid var(--accent-color)', backgroundColor: 'var(--bg-light)', borderRadius: '0 8px 8px 0' }}>
|
||||
<h4 style={{ color: 'var(--primary-color)', marginBottom: '1rem', fontSize: '1.3rem' }}>{lang === 'de' ? 'Volle Transparenz' : 'Full Transparency'}</h4>
|
||||
<p style={{ textAlign: 'left', fontSize: '1.05rem', lineHeight: '1.6' }}>
|
||||
{lang === 'de'
|
||||
? 'Behalten Sie den Überblick über Ihre gesamte Infrastruktur-Topologie und den aktuellen Gesundheitszustand jeder Instanz.'
|
||||
: 'Keep track of your entire infrastructure topology and the current health status of every instance.'}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style={{
|
||||
marginTop: '6rem',
|
||||
padding: '2rem',
|
||||
backgroundColor: 'var(--bg-light)',
|
||||
borderRadius: '0px',
|
||||
textAlign: 'center',
|
||||
border: '1px solid var(--border-color)',
|
||||
}}>
|
||||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '1rem', marginBottom: '1rem' }}>
|
||||
<span className="material-icons" style={{ color: 'var(--accent-color)' }}>support_agent</span>
|
||||
<h3 style={{ margin: 0, fontSize: '1.25rem', color: 'var(--primary-color)' }}>{t.support.title}</h3>
|
||||
</div>
|
||||
<p style={{ color: 'var(--text-secondary)', fontSize: '1rem', maxWidth: '700px', margin: '0 auto 1.5rem' }}>
|
||||
{t.support.description}
|
||||
</p>
|
||||
<div style={{ fontSize: '0.85rem', color: 'var(--primary-color)', fontWeight: 'bold', textTransform: 'uppercase', letterSpacing: '1px' }}>
|
||||
{lang === 'de' ? 'Support durch das Euastra Expertenteam' : 'Direct Support by the Euastra Expert Team'}
|
||||
</div>
|
||||
</div>
|
||||
</ProductPage>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user