TPS
/
exchange-client
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

footer

This commit is contained in:
Kakabay 2022-10-13 17:27:53 +05:00
parent 219e4f62ba
commit ff6e1bdb48
5 changed files with 158 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/styles/_documents.scss
View File

@ -1,3 +1,7 @@
.documents {
margin-bottom: 3.2rem;
}
.documents-wrapper {
display: flex;
flex-direction: column;

61
src/assets/styles/_footer.scss Normal file
View File

@ -0,0 +1,61 @@
.footer-top {
padding: 4.8rem 0;
background: $base-light-blue;
}
.footer-top-wrapper {
display: flex;
flex-direction: column;
gap: 4.8rem;
}
.footer-top-content {
display: grid;
grid-template-columns: repeat(2, 1fr);
row-gap: 2.4rem;
}
.footer-top-item {
display: flex;
flex-direction: column;
gap: 0.8rem;
&:nth-child(3) {
.footer-top-item-text {
text-decoration: underline;
}
}
}
.footer-top-item-title {
font-size: 1.8rem;
font-weight: 700;
color: $base-blue;
}
.footer-top-item-text {
font-size: 1.8rem;
color: $base-black;
font-weight: 400;
}
.footer-bottom {
padding: 4.8rem 0;
background: $base-blue;
}
.footer-nav-list {
display: grid;
grid-template-columns: repeat(2, 1fr);
row-gap: 1.6rem;
}
.footer-nav-list-link {
font-size: 1.8rem;
color: $base-gray;
transition: all 0.3s linear;
&:hover {
color: $base-white;
}
}

1
src/assets/styles/style.scss
View File

@ -11,3 +11,4 @@
@import './newsPost';
@import './documents';
@import './documentLink';
@import './footer';

82
src/components/Footer.jsx Normal file
View File

@ -0,0 +1,82 @@
// Modules
import { Link } from 'react-router-dom';
// Components
import SectionTitle from './SectionTitle';
const Footer = () => {
return (
<footer className="footer">
<div className="footer-top">
<div className="container">
<div className="footer-top-wrapper">
<SectionTitle title="Контакты" />
<div className="footer-top-content">
<div className="footer-top-item">
<h3 className="footer-top-item-title">Телефон:</h3>
<h4 className="footer-top-item-text">+993 12 44-60-15</h4>
</div>
<div className="footer-top-item">
<h3 className="footer-top-item-title">Время работы:</h3>
<h4 className="footer-top-item-text">Понедельник - пятница: с 9-00 по 18-00</h4>
</div>
<div className="footer-top-item">
<h3 className="footer-top-item-title">Email:</h3>
<Link to={'/'} className="footer-top-item-text">
info@exchange.gov.tm
</Link>
<Link to={'/'} className="footer-top-item-text">
broker@exchange.gov.tm
</Link>
</div>
<div className="footer-top-item">
<h3 className="footer-top-item-title">Приемные дни:</h3>
<h4 className="footer-top-item-text">Понедельник - четверг: с 9-00 по 17-00</h4>
<h4 className="footer-top-item-text">Пятница: с 9-00 по 13-00</h4>
</div>
<div className="footer-top-item">
<h3 className="footer-top-item-title">Адресс::</h3>
<h4 className="footer-top-item-text">
744000, Туркменистан г. Ашхабат, Арчабиль шаелы 52
</h4>
</div>
</div>
</div>
</div>
</div>
<div className="footer-bottom">
<div className="container">
<div className="footer-bottom-wrapper">
<ul className="footer-nav-list">
<li className="footer-nav-list-item">
<Link className="footer-nav-list-link">ГТСБТ</Link>
</li>
<li className="footer-nav-list-item">
<Link className="footer-nav-list-link">Нормативная база</Link>
</li>
<li className="footer-nav-list-item">
<Link className="footer-nav-list-link">Биржевые торги</Link>
</li>
<li className="footer-nav-list-item">
<Link className="footer-nav-list-link">Мильтимедия</Link>
</li>
<li className="footer-nav-list-item">
<Link className="footer-nav-list-link">Финансовый мониторинг</Link>
</li>
<li className="footer-nav-list-item">
<Link className="footer-nav-list-link">Новости</Link>
</li>
<li className="footer-nav-list-item">
<Link className="footer-nav-list-link">Регистрация договоров</Link>
</li>
<li className="footer-nav-list-item">
<Link className="footer-nav-list-link">Контакты</Link>
</li>
</ul>
</div>
</div>
</div>
</footer>
);
};
export default Footer;

10
src/pages/Home.jsx
View File

@ -8,13 +8,19 @@ import Ticker from '../components/Ticker';
import arrow from '../assets/icons/arrow.svg';
import NewsPost from '../components/NewsPost';
import DocumentLink from '../components/DocumentLink';
import Footer from '../components/Footer';
const Home = () => {
return (
<main className="home-main">
<div>
{/* Hero section */}
<Hero />
{/* Hero section ./ =========== */}
{/* Ticker section */}
<Ticker />
{/* Ticker section ./ =========== */}
</div>
{/* About section */}
@ -97,6 +103,10 @@ const Home = () => {
</div>
</section>
{/* Documents section ./========= */}
{/* Footer section */}
<Footer />
{/* Footer section ./========= */}
</main>
);
};