Skip to content

Commit

Permalink
Merge pull request #437 from bobronaud/switch-to-new-landing
Browse files Browse the repository at this point in the history
Closed #434
  • Loading branch information
fey authored Mar 4, 2024
2 parents 6f8177a + 1b0f45a commit dfc4130
Show file tree
Hide file tree
Showing 52 changed files with 190 additions and 205 deletions.
8 changes: 4 additions & 4 deletions frontend/src/AppRoutes.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ import ScrollToTop from './utils/scrollToTop.js';

import DefaultLoader from './components/Loaders/DefaultLoader.jsx';

const Landing = lazy(() => import('./pages/landing'));
const NewLanding = lazy(() => import('./landing/Landing.jsx'));
const Landing = lazy(() => import('./pages/landing/Landing.jsx'));
const OldLanding = lazy(() => import('./pages/old-landing'));

const ProfilePage = lazy(() => import('./pages/profile'));
const SettingsPage = lazy(() => import('./pages/settings'));
Expand Down Expand Up @@ -55,9 +55,9 @@ function AppRoutes() {
<Suspense fallback={<DefaultLoader />}>
<ScrollToTop />
<Routes>
<Route path={routes.newLandingPath()} element={<NewLanding />} />
<Route index element={<Landing />} />
<Route element={<Layout />}>
<Route index element={<Landing />} />
<Route path={routes.oldLandingPath()} element={<OldLanding />} />
<Route path={routes.homePagePath()} element={<SnippetPage />} />
<Route path={routes.snippetPagePath()} element={<SnippetPage />} />
<Route path={routes.aboutPagePath()} element={<AboutPage />} />
Expand Down
144 changes: 0 additions & 144 deletions frontend/src/landing/Header.jsx

This file was deleted.

10 changes: 8 additions & 2 deletions frontend/src/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -87,13 +87,13 @@
"dist0": "The software is distributed as an online service (SaaS solution)",
"dist1": "No special software installation steps on the user side are required",
"faq": "FAQ",
"q0": "What if an IDE?",
"q0": "What is an IDE?",
"q1": "How do IDE tools help developers?",
"q2": "What kind of IDEs are there?",
"q3": "What are the features of the Run IT IDE?"
},
"footer": {
"about": "About",
"about": "About Us",
"agreement": "Privacy",
"blog": "Blog",
"career": "Careers at Hexlet",
Expand Down Expand Up @@ -169,6 +169,12 @@
"second": "IDE"
},
"freeProject": "Free Hexlet Project",
"header": {
"about": "About",
"advantages": "Advantages",
"opportunities": "Opportunities",
"faq": "FAQ"
},
"inBrowser": "The editor runs entirely in the browser, so you can start coding in seconds",
"modern": "In modern web development, you need to constantly keep up with the latest news, and even better - to try out new products in real-world",
"moreOpportunity": "Even more opportunities in the future",
Expand Down
7 changes: 4 additions & 3 deletions frontend/src/locales/ru.json
Original file line number Diff line number Diff line change
Expand Up @@ -170,9 +170,10 @@
},
"freeProject": "Бесплатный проект Хекслета",
"header": {
"about": "О нас",
"advantages": "О проекте",
"opportunities": "Возможности"
"about": "О проекте",
"advantages": "Преимущества",
"opportunities": "Возможности",
"faq": "FAQ"
},

"inBrowser": "Редактор полностью запускается в браузере, поэтому вы можете начать кодить за считанные секунды",
Expand Down
File renamed without changes.
Original file line number Diff line number Diff line change
@@ -1,13 +1,4 @@
import {
Row,
Col,
Container,
Image,
Form,
FloatingLabel,
NavbarBrand,
Nav,
} from 'react-bootstrap';
import { Row, Col, Container, Image, NavbarBrand, Nav } from 'react-bootstrap';
import './custom-colors.scss';
import './landing.scss';
import { useTranslation } from 'react-i18next';
Expand Down Expand Up @@ -263,12 +254,12 @@ function Footer() {
<Nav as="ul" className="list-group">
<li className="mb-2">
<NavbarBrand className="p-0" href="#aboutProject">
{t('landing.header.advantages')}
{t('landing.header.about')}
</NavbarBrand>
</li>
<li className="mb-2">
<NavbarBrand className="p-0" href="#advantages">
Преимущества
{t('landing.header.advantages')}
</NavbarBrand>
</li>
<li className="mb-2">
Expand All @@ -278,7 +269,7 @@ function Footer() {
</li>
<li className="mb-2">
<NavbarBrand className="p-0" href="#faq">
{t('faq.faq')}
{t('landing.header.faq')}
</NavbarBrand>
</li>
</Nav>
Expand Down Expand Up @@ -325,21 +316,6 @@ function Footer() {
</Col>
</Row>
</Col>
<Col>
<Form.Group data-bs-theme="light">
<FloatingLabel
className="text-black"
controlId="floatingTextarea"
label={t('footer.mailSupport')}
>
<Form.Control
as="textarea"
placeholder={t('footer.mailSupport')}
style={{ height: '8rem' }}
/>
</FloatingLabel>
</Form.Group>
</Col>
<Col>
<div className="ms-auto">
<p>{t('footer.name')}</p>
Expand Down
89 changes: 89 additions & 0 deletions frontend/src/pages/landing/Header.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
import { Link } from 'react-router-dom';
import { Container, Navbar, Image, Nav, Button } from 'react-bootstrap';
import { useTranslation } from 'react-i18next';
import { useTernaryDarkMode } from 'usehooks-ts';
import LanguageSelector from '../../components/Navigation/LanguageSelector.jsx';
import ThemeSelector from '../../components/Navigation/ThemeSelector.jsx';
import routes from '../../routes.js';

import RunItLogoLight from './assets/LogoHeaderLightTheme.svg';
import RunItLogoDark from './assets/LogoHeaderDarkTheme.svg';
import Burger from './assets/Burger.svg';

import 'bootstrap/dist/css/bootstrap.min.css';
import './landing.scss';
import './custom-colors.scss';

function Header() {
const { t } = useTranslation();
const { isDarkMode } = useTernaryDarkMode();

const logo = isDarkMode ? RunItLogoDark : RunItLogoLight;
return (
<header>
<Navbar expand="lg">
<Container className="justify-content-between">
<Navbar.Brand className="mr-5">
<Image src={logo} />
</Navbar.Brand>
<Navbar.Toggle
aria-controls="navbar-responsive"
className="border-0 ms-auto"
data-bs-toogle="collapse"
>
<Image src={Burger} />
</Navbar.Toggle>
<Navbar.Collapse className="my-3 mb-lg-0" id="navbar-responsive">
<Nav as="ul" className="text-center">
<li>
<Navbar.Brand className="header-link" href="#aboutProject">
<span>{t('landing.header.about')}</span>
</Navbar.Brand>
</li>
<li>
<Navbar.Brand className="header-link" href="#advantages">
<span>{t('landing.header.advantages')}</span>
</Navbar.Brand>
</li>
<li>
<Navbar.Brand className="header-link" href="#possibilities">
<span>{t('landing.header.opportunities')}</span>
</Navbar.Brand>
</li>
<li>
<Navbar.Brand className="header-link" href="#faq">
<span>{t('landing.header.faq')}</span>
</Navbar.Brand>
</li>
</Nav>
<Nav
as="ul"
className="mb-3 mb-lg-0 gap-1 ms-auto align-items-center"
>
<LanguageSelector />
<ThemeSelector />
<Button
as={Link}
className="rounded-5 btn-signin"
to={routes.signInPagePath()}
variant="primary"
>
<span>{t('profileActions.signIn')}</span>
</Button>
<Button
as={Link}
className="rounded-5 btn-signup"
to={routes.signUpPagePath()}
variant="secondary"
>
<span>{t('profileActions.signUp')}</span>
</Button>
</Nav>
</Navbar.Collapse>
</Container>
</Navbar>
</header>
);
}

export default Header;
Loading

0 comments on commit dfc4130

Please sign in to comment.