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

created overview

Browse Source
This commit is contained in:
Yusuf Ipek
2021-05-10 09:13:17 +03:00
parent e09f62bb39
commit 038b2f41ac
7 changed files with 157 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/commons/hotel-view/hotel-view.jsx
+54 -1
View File
@@ -1,5 +1,58 @@
import hotel1 from "../img/hotel-1.jpg";
import hotel2 from "../img/hotel-2.jpg";
import hotel3 from "../img/hotel-3.jpg";
import sprite from "../img/sprite.svg";
function HotelView() {
return <main className="hotel-view">Hotel view</main>;
return (
<main className="hotel-view">
<div className="gallery">
<figure className="gallery__item">
<img src={hotel1} alt="Hotel" className="gallery__photo" />
</figure>
<figure className="gallery__item">
<img src={hotel2} alt="Hotel" className="gallery__photo" />
</figure>
<figure className="gallery__item">
<img src={hotel3} alt="Hotel" className="gallery__photo" />
</figure>
</div>
<div className="overview">
<h1 className="heading-main">Hotel Las Palmas</h1>
<div className="overview__stars">
<svg className="overview__icon-star">
<use href={`${sprite}#icon-star`}></use>
</svg>
<svg className="overview__icon-star">
<use href={`${sprite}#icon-star`}></use>
</svg>
<svg className="overview__icon-star">
<use href={`${sprite}#icon-star`}></use>
</svg>
<svg className="overview__icon-star">
<use href={`${sprite}#icon-star`}></use>
</svg>
<svg className="overview__icon-star">
<use href={`${sprite}#icon-star`}></use>
</svg>
</div>
<div className="overview__location">
<svg className="overview__icon-location">
<use href={`${sprite}#icon-location-pin`}></use>
</svg>
<button className="btn-inline">Albufeira, Portugal</button>
</div>
<div className="overview__rating">
<div className="overview__rating-average">8.6</div>
<div className="overview__rating-count">429 votes</div>
</div>
</div>
</main>
);
}
export default HotelView;