diff --git a/README.md b/README.md index fdf5031..4edba61 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ The Real Estate Website using React made by Ruchira Perrera, Sam Oyediran, Batuhan Basoglu, and Kene Ojukwu. -After npm start execute the command "node src/shared-components/contact-us/index.js" in order to set up the backend of the contact form. +After npm start execute the command "node src/shared-components/contact-us/index.js" in order to set up the backend of the contact form. (Optional) # Authors diff --git a/package.json b/package.json index 0a896a8..f1b6b48 100644 --- a/package.json +++ b/package.json @@ -3,12 +3,15 @@ "version": "0.1.0", "private": true, "dependencies": { + "@reach/combobox": "^0.10.5", + "@react-google-maps/api": "^1.9.0", "@testing-library/jest-dom": "^5.11.10", "@testing-library/react": "^11.2.5", "@testing-library/user-event": "^12.8.3", "axios": "^0.21.1", "bootstrap": "^4.6.0", "cors": "^2.8.5", + "date-fns": "^2.13.0", "email-validator": "^2.0.4", "express": "^4.17.1", "flag-icon-css": "^3.5.0", @@ -34,13 +37,10 @@ "react-router-dom": "^5.2.0", "react-scripts": "4.0.3", "react-select": "^4.3.0", - "spectre.css": "^0.5.9", - "web-vitals": "^1.1.1", - "@reach/combobox": "^0.10.2", - "@react-google-maps/api": "^1.9.0", - "date-fns": "^2.13.0", - "use-places-autocomplete": "^1.3.5", "reactstrap": "^8.9.0", + "spectre.css": "^0.5.9", + "use-places-autocomplete": "^1.3.5", + "web-vitals": "^1.1.1", "yup": "^0.32.9" }, "scripts": { diff --git a/public/assets/locales/en/translations.json b/public/assets/locales/en/translations.json index 02efad8..7514842 100644 --- a/public/assets/locales/en/translations.json +++ b/public/assets/locales/en/translations.json @@ -33,7 +33,10 @@ "Home5": "members who want to benefit from our deals. Above are some houses which can interest you. Feel free to", "Home6": "click the buttons above to explore the houses you want.", "Desc": "Description", - "Rooms": "1 Bedroom, 2 Bathroom", + "Rooms": "2 Bedroom, 3 Bathroom", + "Rooms1": "1 Bedroom, 1 Bathroom", + "Rooms2": "3 Bedroom, 3 Bathroom", + "Rooms3": "3 Bedroom, 3 Bathroom", "Danger1": "Message could not send.", "Danger2": "There are some errors in your contact form.", "Success1": "The message is successfully sent.", diff --git a/public/assets/locales/fr/translations.json b/public/assets/locales/fr/translations.json index 80b4871..16472aa 100644 --- a/public/assets/locales/fr/translations.json +++ b/public/assets/locales/fr/translations.json @@ -33,7 +33,10 @@ "Home5": "membres qui souhaitent bénéficier de nos offres. Ci-dessus, quelques maisons qui peuvent vous intéresser. N'hésitez", "Home6": "pas à cliquez sur les boutons ci-dessus pour explorer les maisons que vous souhaitez.", "Desc": "La Description", - "Rooms": "1 chambre, 2 salles de bains", + "Rooms": "2 chambre, 3 salles de bains", + "Rooms1": "1 chambre, 1 salles de bains", + "Rooms2": "3 chambre, 3 salles de bains", + "Rooms3": "3 chambre, 3 salles de bains", "Danger1": "Le message n'a pas pu être envoyé.", "Danger2": "Il y a des erreurs dans votre formulaire de contact.", "Success1": "Le message a été envoyé avec succès.", diff --git a/src/App.js b/src/App.js index be57faa..cc048ec 100644 --- a/src/App.js +++ b/src/App.js @@ -1,82 +1,31 @@ -import React, { useEffect } from "react"; +import React from "react"; import Footer from "./shared-components/footer-component/Footer"; import Navbar from "./shared-components/navbar-component/Navbar"; import { BrowserRouter, Route, Switch } from "react-router-dom"; -import i18next from "i18next"; -import { useTranslation } from "react-i18next"; -import Cookies from "js-cookie"; import HomePage from "./homePage/Homepage"; import ListingsPage from "./listings-page/ListingsPage"; import AgentPage from "./agent-page/AgentPage"; -import ListingPage from "./listings-page/single-listing/listing-page"; +import ListingPage1 from "./listings-page/single-listing-1/listing-page-1"; +import ListingPage2 from "./listings-page/single-listing-2/listing-page-2"; +import ListingPage3 from "./listings-page/single-listing-3/listing-page-3"; +import ListingPage4 from "./listings-page/single-listing-4/listing-page-4"; import Login from "./login-page/Login"; import Account from "./login-page/account/Account"; import ContactUs from "./shared-components/contact-us/contact-us"; -const langauges = [ - { - code: "fr", - name: "Français", - country_code: "fr", - }, - { - code: "en", - name: "English", - country_code: "gb", - }, -]; - function App() { - const currentLanguageCode = Cookies.get("i18next") || "en"; - const currentLanguage = langauges.find( - (lang) => lang.code === currentLanguageCode - ); - const { t } = useTranslation(); - - useEffect(() => { - document.body.dir = currentLanguage.dir || "ltr"; - }, [currentLanguage]); return (
- {/* create the translations button */} -
-
- {/* */} -
- - -
-
-
- + + + + diff --git a/src/homePage/Homepage.js b/src/homePage/Homepage.js index dc2ce32..9fe829c 100644 --- a/src/homePage/Homepage.js +++ b/src/homePage/Homepage.js @@ -43,7 +43,7 @@ class Homepage extends Component {

100 Charlie Rogers, Kanata, ON K2V 1A7

{t("Rooms")}

- +
@@ -51,9 +51,9 @@ class Homepage extends Component { Second House

1490 Youville Drive, Orléans, ON K1C 2X8

-

{t("Rooms")}

+

{t("Rooms1")}

- +
@@ -61,9 +61,9 @@ class Homepage extends Component { Third House

8720 Russell Road, Navan, ON K4B 1J1

-

{t("Rooms")}

+

{t("Rooms2")}

- +
@@ -71,9 +71,9 @@ class Homepage extends Component { Fourth House

2785 8th Line Road, Metcalfe, ON K0A 2P0

-

{t("Rooms")}

+

{t("Rooms3")}

- +
diff --git a/src/images/house3-2.png b/src/images/house3-2.jpg similarity index 100% rename from src/images/house3-2.png rename to src/images/house3-2.jpg diff --git a/src/listings-page/ListingsPage.js b/src/listings-page/ListingsPage.js index afe5953..8b5acf3 100644 --- a/src/listings-page/ListingsPage.js +++ b/src/listings-page/ListingsPage.js @@ -265,7 +265,8 @@ export default function ListingsPage() {
- +
diff --git a/src/listings-page/single-listing/listing-page.css b/src/listings-page/single-listing-1/listing-page-1.css similarity index 81% rename from src/listings-page/single-listing/listing-page.css rename to src/listings-page/single-listing-1/listing-page-1.css index 137ea6b..3be6c27 100644 --- a/src/listings-page/single-listing/listing-page.css +++ b/src/listings-page/single-listing-1/listing-page-1.css @@ -1,6 +1,7 @@ -.single-listing{ +.single-listing-1{ padding: 7% 15%; /* background-color: darksalmon; */ + text-align: center; } .listing-header{ @@ -13,32 +14,24 @@ /* font-style: italic; */ } -.title-icon{ - -} - .listing-carousel{ margin: 5% 15%; width: 70%; /* padding-right: 10; */ } -.carousel-img{ - /* width: 70%; */ -} - - .amentities{ border: 1px solid black; /* padding: 5% 0; */ margin: 3% 40%; - padding: 1% 0%; + /* padding: 1% 0%; */ } .amentities-text{ - + font-size: 2rem; } + .amentities-icon{ - margin: 0% 5%; + padding: 2% 7%; } .description-box{ @@ -49,10 +42,6 @@ .description-title{ padding: 2% 0%; -} -.listing-description{ - - } .booking-btn{ diff --git a/src/listings-page/single-listing-1/listing-page-1.js b/src/listings-page/single-listing-1/listing-page-1.js new file mode 100644 index 0000000..6c26a15 --- /dev/null +++ b/src/listings-page/single-listing-1/listing-page-1.js @@ -0,0 +1,135 @@ +import React from "react"; +import "./listing-page-1.css"; +import { Link } from "react-router-dom"; + +// import house images +import house_img1 from "../../images/house3.jpg"; +import house_img2 from "../../images/house1-2.jpg"; +import house_img3 from "../../images/house1-3.jpg"; +const ListingPage1 = () => { + return ( +
+ {/* Listing header */} +
+
+

+ 8720 Russell Road +

+
+
+ + {/* Carousel for images of the listings */} +
+ +
+ + {/* Text box for listing amenities */} +
+ 2 + + 4 + +
+ + {/* Description for the listing */} +
+

Description

+

+ RUN DON'T WALK to this beautiful former Jayman show home. This home + has every feature and convenience you could want in a home. When you + enter you will be greeted with a large entry way, open concept main + floor with a very spacious chef-like kitchen, the big eat in dinning + area is an entertainers dream and plenty of room in the living room as + to cozy up to the fireplace. When you head upstairs the owner 's suite + will impress with a gorgeous ensuite consisting of a large soaker tub, + oversized shower, separate vanities, in-floor heating and 2 separate + closest. You will also find a nice sized flex room, spacious laundry + room up stairs, 4 piece main bathroom and 2 more bedrooms. Then head + downstairs where you will find another bedroom, bathroom and Theatre + room with wet bar and beverage station that is perfect for any movie + lover. Must not forget that this home is air conditioned, has front + and back irrigation outside and speakers throughout the house. All of + this can be yours in the lake community of Auburn Bay close to all + amenities and year round lake access just a short distance away +

+
+ + + +
+
+
+ ); +}; + +// sources for the images used +//images.adsttc.com/media/images/524c/2511/e8e4/4e67/bf00/03c3/large_jpg/Tetris_House_03.jpg?1380721927 + +//House description +// ->Link 1 -https://www.realtor.ca/real-estate/23018057/9811-elbow-drive-calgary-haysboro +// images +// 1 ->house1.jpg +// 2 ->//images.adsttc.com/media/images/524c/2511/e8e4/4e67/bf00/03c3/large_jpg/Tetris_House_03.jpg?1380721927 +// 3 ->https://s3.amazonaws.com/on1-wp/wp-content/uploads/2018/08/3191-NW-Jenna-22-of-49v2-1024x683.jpg +//-> Link2 -> https://www.realtor.ca/real-estate/23020015/lot-14-67-seastone-drive-port-howe-port-howe +// 1 ->house2.jpg +// 2 ->https://static.photocdn.pt/images/articles/2019/12/24/How_to_Take_Gorgeous_Interior_Real_Estate_Photos.jpg +// 3 ->https://i.pinimg.com/originals/f3/72/87/f372870f4f99d3278193a3970aa394ce.jpg +//->Link3 -> https://www.realtor.ca/real-estate/23020040/1035-butler-boulevard-petawawa-laurentian-highlands +// 1 ->house3.jpg +// 2 ->https://miro.medium.com/max/1200/1*EyGqOwy0wQwKHUgi3xpQZA.png +// 3 ->https://i.pinimg.com/originals/9b/fe/76/9bfe76b23f7ed9dcb35f7553b8255f48.jpg +//->Link4 -> https://www.realtor.ca/real-estate/23020103/62-riddle-court-north-bay +// 1 ->house4.jpg +// 2 ->https://pictureitsoldfl.com/wp-content/uploads/2016/07/305-Rudder-Cay-Way-Jupiter-FL-print-014-28-Family-Room-4200x2800-300dpi-1170x780.jpg +// 3 ->https://www.tlcinteriors.com.au/wp-content/uploads/2018/06/hamptons-style-kitchen-from-metricon-bayville-display-home.jpg + +export default ListingPage1; diff --git a/src/listings-page/single-listing/listing-page.test.js b/src/listings-page/single-listing-1/listing-page-1.test.js similarity index 53% rename from src/listings-page/single-listing/listing-page.test.js rename to src/listings-page/single-listing-1/listing-page-1.test.js index bbe9600..07a81d5 100644 --- a/src/listings-page/single-listing/listing-page.test.js +++ b/src/listings-page/single-listing-1/listing-page-1.test.js @@ -1,10 +1,10 @@ import React from "react"; import { shallow } from "enzyme"; -import ListingPage from "./listing-page"; +import ListingPage1 from "./listing-page-1"; -describe("ListingPage", () => { +describe("ListingPage1", () => { test("matches snapshot", () => { - const wrapper = shallow(); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); }); diff --git a/src/listings-page/single-listing-2/listing-page-2.css b/src/listings-page/single-listing-2/listing-page-2.css new file mode 100644 index 0000000..8ce675b --- /dev/null +++ b/src/listings-page/single-listing-2/listing-page-2.css @@ -0,0 +1,51 @@ +.single-listing-2{ + padding: 7% 15%; + /* background-color: darksalmon; */ + text-align: center; +} + +.listing-header{ + border: 1px solid black; + text-align: left; + padding: 1%; +} +.listing-title{ + font-size: 2.5rem; + /* font-style: italic; */ +} + +.listing-carousel{ + margin: 5% 15%; + width: 70%; + /* padding-right: 10; */ +} + +.amentities{ + border: 1px solid black; + /* padding: 5% 0; */ + margin: 3% 40%; + /* padding: 1% 0%; */ +} +.amentities-text{ + font-size: 2rem; +} + +.amentities-icon{ + padding: 2% 7%; +} + +.description-box{ + border: 1px solid black; + padding: 5%; + text-align: left; +} + +.description-title{ + padding: 2% 0%; +} + +.booking-btn{ + padding: 2% 0%; + text-align: center; +} + diff --git a/src/listings-page/single-listing-2/listing-page-2.js b/src/listings-page/single-listing-2/listing-page-2.js new file mode 100644 index 0000000..feb3fcd --- /dev/null +++ b/src/listings-page/single-listing-2/listing-page-2.js @@ -0,0 +1,138 @@ +import React from "react"; +import "./listing-page-2.css"; +import { Link } from "react-router-dom"; + +// import house images +import house_img1 from "../../images/house2.jpg"; +import house_img2 from "../../images/house2-2.jpg"; +import house_img3 from "../../images/house2-3.jpg"; +const ListingPage2 = () => { + return ( +
+ {/* Listing header */} +
+
+

+ 1490 Youville Drive +

+
+
+ + {/* Carousel for images of the listings */} +
+ +
+ + {/* Text box for listing amenities */} +
+ 1 + + 1 + +
+ + {/* Description for the listing */} +
+

Description

+

+ Nature at its Finest The Shores of Toney Bay are located at the mouth + of River Phillip where it meets the Northumberland Straight with + direct access to the incredible recreational waterways of River + Phillip and nature rich Toney Bay. This nature lovers paradise boasts + a plethora of migratory bird life and the rich fish stock of River + Philip. The warm waters of the Northumberland Straight are swimmable + from your shorefront, easy access to year-around activities and close + proximity to the quaint community of Pugwash make this an ideal spot + for a permeant residence or cottage. There are also ocean view / + deeded access lots available. Large lots with unobstructed views and + well away from highway noise. Swim in the warm waters at beautiful + Heather's Beach just 4km away, fly fishing in the spring on River + Phillip, book at tee time at Northumberland links, 16km away or enjoy + a day at the Luxury Fox Harb'r Resort and Spa less then 30 mins away, + and in winter enjoy skiing at Ski Wentworth a short 30 minutes drive. + Lots are flat, cleared and ready for your dream home. All septic and + building lot approvals are in place, good roads, and power to the lot + line are included. Please take a few minutes to watch the video of the + stunning Shores at Toney Bay +

+
+ + + +
+
+
+ ); +}; + +// sources for the images used +//images.adsttc.com/media/images/524c/2511/e8e4/4e67/bf00/03c3/large_jpg/Tetris_House_03.jpg?1380721927 + +//House description +// ->Link 1 -https://www.realtor.ca/real-estate/23018057/9811-elbow-drive-calgary-haysboro +// images +// 1 ->house1.jpg +// 2 ->//images.adsttc.com/media/images/524c/2511/e8e4/4e67/bf00/03c3/large_jpg/Tetris_House_03.jpg?1380721927 +// 3 ->https://s3.amazonaws.com/on1-wp/wp-content/uploads/2018/08/3191-NW-Jenna-22-of-49v2-1024x683.jpg +//-> Link2 -> https://www.realtor.ca/real-estate/23020015/lot-14-67-seastone-drive-port-howe-port-howe +// 1 ->house2.jpg +// 2 ->https://static.photocdn.pt/images/articles/2019/12/24/How_to_Take_Gorgeous_Interior_Real_Estate_Photos.jpg +// 3 ->https://i.pinimg.com/originals/f3/72/87/f372870f4f99d3278193a3970aa394ce.jpg +//->Link3 -> https://www.realtor.ca/real-estate/23020040/1035-butler-boulevard-petawawa-laurentian-highlands +// 1 ->house3.jpg +// 2 ->https://miro.medium.com/max/1200/1*EyGqOwy0wQwKHUgi3xpQZA.png +// 3 ->https://i.pinimg.com/originals/9b/fe/76/9bfe76b23f7ed9dcb35f7553b8255f48.jpg +//->Link4 -> https://www.realtor.ca/real-estate/23020103/62-riddle-court-north-bay +// 1 ->house4.jpg +// 2 ->https://pictureitsoldfl.com/wp-content/uploads/2016/07/305-Rudder-Cay-Way-Jupiter-FL-print-014-28-Family-Room-4200x2800-300dpi-1170x780.jpg +// 3 ->https://www.tlcinteriors.com.au/wp-content/uploads/2018/06/hamptons-style-kitchen-from-metricon-bayville-display-home.jpg + +export default ListingPage2; diff --git a/src/listings-page/single-listing-2/listing-page-2.test.js b/src/listings-page/single-listing-2/listing-page-2.test.js new file mode 100644 index 0000000..a4006fe --- /dev/null +++ b/src/listings-page/single-listing-2/listing-page-2.test.js @@ -0,0 +1,10 @@ +import React from "react"; +import { shallow } from "enzyme"; +import ListingPage2 from "./listing-page-2"; + +describe("ListingPage2", () => { + test("matches snapshot", () => { + const wrapper = shallow(); + expect(wrapper).toMatchSnapshot(); + }); +}); diff --git a/src/listings-page/single-listing-3/listing-page-3.css b/src/listings-page/single-listing-3/listing-page-3.css new file mode 100644 index 0000000..e5ef061 --- /dev/null +++ b/src/listings-page/single-listing-3/listing-page-3.css @@ -0,0 +1,51 @@ +.single-listing-3{ + padding: 7% 15%; + /* background-color: darksalmon; */ + text-align: center; +} + +.listing-header{ + border: 1px solid black; + text-align: left; + padding: 1%; +} +.listing-title{ + font-size: 2.5rem; + /* font-style: italic; */ +} + +.listing-carousel{ + margin: 5% 15%; + width: 70%; + /* padding-right: 10; */ +} + +.amentities{ + border: 1px solid black; + /* padding: 5% 0; */ + margin: 3% 40%; + /* padding: 1% 0%; */ +} +.amentities-text{ + font-size: 2rem; +} + +.amentities-icon{ + padding: 2% 7%; +} + +.description-box{ + border: 1px solid black; + padding: 5%; + text-align: left; +} + +.description-title{ + padding: 2% 0%; +} + +.booking-btn{ + padding: 2% 0%; + text-align: center; +} + diff --git a/src/listings-page/single-listing-3/listing-page-3.js b/src/listings-page/single-listing-3/listing-page-3.js new file mode 100644 index 0000000..798100a --- /dev/null +++ b/src/listings-page/single-listing-3/listing-page-3.js @@ -0,0 +1,133 @@ +import React from "react"; +import "./listing-page-3.css"; +import { Link } from "react-router-dom"; + +// import house images +import house_img1 from "../../images/house1.jpg"; +import house_img2 from "../../images/house3-2.jpg"; +import house_img3 from "../../images/house3-3.jpg"; +const ListingPage3 = () => { + return ( +
+ {/* Listing header */} +
+
+

+ 100 Charlie Rogers Place +

+
+
+ + {/* Carousel for images of the listings */} +
+ +
+ + {/* Text box for listing amenities */} +
+ 2 + + 3 + +
+ + {/* Description for the listing */} +
+

Description

+

+ Custom, Hi-Ranch home located in sought after neighborhood in the + Heart of Petawawa. This home features 2+1 bedrooms and 4 bathrooms. + Main level features spacious foyer, hardwood staircase, gleaming + hardwood floors and open concept living. Large windows provide lots of + natural light, vaulted ceilings in living room, a spectacular spacious + kitchen with stainless steel appliances and large island. Master + bedroom with walk through closet and 3 piece en-suite with custom tile + shower and heated tile floor. Lower level features a finished rec room + with cozy gas fireplace, bedroom and 3 piece bathroom. Patio door in + foyer leads to large private backyard with no rear neighbours, + spacious wood deck and hot tub. Double attached garage completes the + package. Pack your backs and move right in! No Conveyances of offers + until Friday April 9th at 3PM however the seller has the right to view + and may accept pre-emptive offers +

+
+ + + +
+
+
+ ); +}; + +// sources for the images used +//images.adsttc.com/media/images/524c/2511/e8e4/4e67/bf00/03c3/large_jpg/Tetris_House_03.jpg?1380721927 + +//House description +// ->Link 1 -https://www.realtor.ca/real-estate/23018057/9811-elbow-drive-calgary-haysboro +// images +// 1 ->house1.jpg +// 2 ->//images.adsttc.com/media/images/524c/2511/e8e4/4e67/bf00/03c3/large_jpg/Tetris_House_03.jpg?1380721927 +// 3 ->https://s3.amazonaws.com/on1-wp/wp-content/uploads/2018/08/3191-NW-Jenna-22-of-49v2-1024x683.jpg +//-> Link2 -> https://www.realtor.ca/real-estate/23020015/lot-14-67-seastone-drive-port-howe-port-howe +// 1 ->house2.jpg +// 2 ->https://static.photocdn.pt/images/articles/2019/12/24/How_to_Take_Gorgeous_Interior_Real_Estate_Photos.jpg +// 3 ->https://i.pinimg.com/originals/f3/72/87/f372870f4f99d3278193a3970aa394ce.jpg +//->Link3 -> https://www.realtor.ca/real-estate/23020040/1035-butler-boulevard-petawawa-laurentian-highlands +// 1 ->house3.jpg +// 2 ->https://miro.medium.com/max/1200/1*EyGqOwy0wQwKHUgi3xpQZA.png +// 3 ->https://i.pinimg.com/originals/9b/fe/76/9bfe76b23f7ed9dcb35f7553b8255f48.jpg +//->Link4 -> https://www.realtor.ca/real-estate/23020103/62-riddle-court-north-bay +// 1 ->house4.jpg +// 2 ->https://pictureitsoldfl.com/wp-content/uploads/2016/07/305-Rudder-Cay-Way-Jupiter-FL-print-014-28-Family-Room-4200x2800-300dpi-1170x780.jpg +// 3 ->https://www.tlcinteriors.com.au/wp-content/uploads/2018/06/hamptons-style-kitchen-from-metricon-bayville-display-home.jpg + +export default ListingPage3; diff --git a/src/listings-page/single-listing-3/listing-page-3.test.js b/src/listings-page/single-listing-3/listing-page-3.test.js new file mode 100644 index 0000000..3cc850d --- /dev/null +++ b/src/listings-page/single-listing-3/listing-page-3.test.js @@ -0,0 +1,10 @@ +import React from "react"; +import { shallow } from "enzyme"; +import ListingPage3 from "./listing-page-3"; + +describe("ListingPage3", () => { + test("matches snapshot", () => { + const wrapper = shallow(); + expect(wrapper).toMatchSnapshot(); + }); +}); diff --git a/src/listings-page/single-listing-4/listing-page-4.css b/src/listings-page/single-listing-4/listing-page-4.css new file mode 100644 index 0000000..2f53717 --- /dev/null +++ b/src/listings-page/single-listing-4/listing-page-4.css @@ -0,0 +1,51 @@ +.single-listing-4{ + padding: 7% 15%; + /* background-color: darksalmon; */ + text-align: center; +} + +.listing-header{ + border: 1px solid black; + text-align: left; + padding: 1%; +} +.listing-title{ + font-size: 2.5rem; + /* font-style: italic; */ +} + +.listing-carousel{ + margin: 5% 15%; + width: 70%; + /* padding-right: 10; */ +} + +.amentities{ + border: 1px solid black; + /* padding: 5% 0; */ + margin: 3% 40%; + /* padding: 1% 0%; */ +} +.amentities-text{ + font-size: 2rem; +} + +.amentities-icon{ + padding: 2% 7%; +} + +.description-box{ + border: 1px solid black; + padding: 5%; + text-align: left; +} + +.description-title{ + padding: 2% 0%; +} + +.booking-btn{ + padding: 2% 0%; + text-align: center; +} + diff --git a/src/listings-page/single-listing/listing-page.js b/src/listings-page/single-listing-4/listing-page-4.js similarity index 90% rename from src/listings-page/single-listing/listing-page.js rename to src/listings-page/single-listing-4/listing-page-4.js index 1be54ab..6cbe56d 100644 --- a/src/listings-page/single-listing/listing-page.js +++ b/src/listings-page/single-listing-4/listing-page-4.js @@ -1,17 +1,19 @@ import React from "react"; -import "./listing-page.css"; +import "./listing-page-4.css"; import { Link } from "react-router-dom"; // import house images -import house_img1 from "../../images/house1-2.jpg"; -const ListingPage = () => { +import house_img1 from "../../images/house4.jpg"; +import house_img2 from "../../images/house4-2.jpg"; +import house_img3 from "../../images/house4-3.jpg"; +const ListingPage4 = () => { return ( -
+
{/* Listing header */}

- My title + 2785 8th Line Road

@@ -33,14 +35,14 @@ const ListingPage = () => {
diff --git a/src/login-page/account/Account.js b/src/login-page/account/Account.js index 9097434..92ca733 100644 --- a/src/login-page/account/Account.js +++ b/src/login-page/account/Account.js @@ -11,6 +11,7 @@ class Account extends Component { lastName: "Green", email: "kevon.green@kcribs.com", password: "Kcribs123", + phoneNumber: "613-234-8796", }, }; render() { @@ -93,7 +94,7 @@ class Account extends Component { type="text" class="form-control" id="account-phoneNumber" - placeholder={this.state.Account.email} + placeholder={this.state.Account.phoneNumber} required disabled={true} /> diff --git a/src/shared-components/navbar-component/Navbar.js b/src/shared-components/navbar-component/Navbar.js index 42cfa11..2dd8b0b 100644 --- a/src/shared-components/navbar-component/Navbar.js +++ b/src/shared-components/navbar-component/Navbar.js @@ -1,11 +1,33 @@ -import React from "react"; +import React, { useEffect } from "react"; import { Link, withRouter } from "react-router-dom"; import "./Navbar.css"; import logo from "./logo2.png"; +import Cookies from "js-cookie"; /* eslint-disable jsx-a11y/anchor-is-valid */ import { useTranslation } from "react-i18next"; +import i18next from "i18next"; +const langauges = [ + { + code: "fr", + name: "Français", + country_code: "fr", + }, + { + code: "en", + name: "English", + country_code: "gb", + }, +]; + const Navbar = () => { + const currentLanguageCode = Cookies.get("i18next") || "en"; + const currentLanguage = langauges.find( + (lang) => lang.code === currentLanguageCode + ); const { t } = useTranslation(); + useEffect(() => { + document.body.dir = currentLanguage.dir || "ltr"; + }, [currentLanguage]); return ( /* Nav Bar */
@@ -27,6 +49,34 @@ const Navbar = () => {