yusufipek/natours-react
1
0
Fork 0
mirror of https://github.com/yusufipk/natours-react.git synced 2026-09-11 19:16:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

finished tours section

Browse Source
This commit is contained in:
Yusuf Ipek
2021-05-03 10:31:55 +03:00
parent 11ea48a038
commit 851c0b90c2
9 changed files with 166 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/commons/about-section/about.jsx
+3 -3
View File
@@ -38,17 +38,17 @@ function About() {
<div className="composition">
<img
src={nat1Large}
alt="Photo 1"
alt="Nature 1"
className="composition__photo composition__photo--p1"
/>
<img
src={nat2Large}
alt="Photo 2"
alt="Nature 2"
className="composition__photo composition__photo--p2"
/>
<img
src={nat3Large}
alt="Photo 3"
alt="Nature 3"
className="composition__photo composition__photo--p3"
/>
</div>
src/commons/header/header.jsx
+1 -1
View File
@@ -13,7 +13,7 @@ function Header() {
<span className="heading-primary--sub">is where life happens</span>
</h1>
<ButtonMain
animationName={"move-in--bottom"}
feature={"btn btn--white move-in--bottom"}
text={"Discover our tours"}
/>
</div>
src/commons/stories-section/stories.jsx
View File
src/commons/tours-section/tours.jsx
+73 -3
View File
@@ -1,3 +1,5 @@
import ButtonMain from "../../components/button/button-main";
function Tours() {
return (
<section className="section-tours">
@@ -26,12 +28,80 @@ function Tours() {
</div>
</div>
<div className="card__side card__side--back card__side--back-1">
Back
<div className="card__cta">
<div className="card__price-box">
<p className="card__price-only">Only</p>
<p className="card__price-value">$297</p>
</div>
<ButtonMain feature={"btn btn--white"} text={"Book now!"} />
</div>
</div>
</div>
</div>
<div className="col-1-of-3"></div>
<div className="col-1-of-3"></div>
<div className="col-1-of-3">
<div className="card">
<div className="card__side card__side--front">
<div className="card__picture card__picture--2">&nbsp;</div>
<h4 className="card__heading">
<span className="card__heading-span card__heading-span--2">
The Forest Hiker
</span>
</h4>
<div className="card__details">
<ul>
<li>7 day tours</li>
<li>Up to 40 people</li>
<li>6 tour guides</li>
<li>Sleep in provided tents</li>
<li>Difficulty: medium</li>
</ul>
</div>
</div>
<div className="card__side card__side--back card__side--back-2">
<div className="card__cta">
<div className="card__price-box">
<p className="card__price-only">Only</p>
<p className="card__price-value">$497</p>
</div>
<ButtonMain feature={"btn btn--white"} text={"Book now!"} />
</div>
</div>
</div>
</div>
<div className="col-1-of-3">
<div className="card">
<div className="card__side card__side--front">
<div className="card__picture card__picture--3">&nbsp;</div>
<h4 className="card__heading">
<span className="card__heading-span card__heading-span--3">
The Snow Adventurer
</span>
</h4>
<div className="card__details">
<ul>
<li>5 day tours</li>
<li>Up to 15 people</li>
<li>3 tour guides</li>
<li>Sleep in provided tents</li>
<li>Difficulty: hard</li>
</ul>
</div>
</div>
<div className="card__side card__side--back card__side--back-3">
<div className="card__cta">
<div className="card__price-box">
<p className="card__price-only">Only</p>
<p className="card__price-value">$897</p>
</div>
<ButtonMain feature={"btn btn--white"} text={"Book now!"} />
</div>
</div>
</div>
</div>
</div>
<div className="u-center-text u-margin-top-huge">
<ButtonMain feature={"btn btn--green"} text={"Discover all tours"} />
</div>
</section>
);