Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Document Review</title> | |
| <style> | |
| body { | |
| font-family: Arial, sans-serif; | |
| display: flex; | |
| justify-content: center; /* This will center the .reviews container on the screen */ | |
| align-items: flex-start; | |
| height: 100vh; | |
| margin: 2px; /* Remove default margin */ | |
| } | |
| .highlight { background-color: yellow; | |
| color: black ; /* Dark grey for muted text */ | |
| cursor: pointer;} | |
| .not-hover-highlight { background-color: lightyellow; | |
| color: #606060 ; /* Dark grey for muted text */} | |
| .summary { | |
| width: 50%; | |
| font-size: 1.0rem; | |
| padding: 10px; | |
| height: 100vh; /* Maximum height to a third of the viewport height */ | |
| background-color: #9e9e9e0a; | |
| } | |
| .reviews { | |
| width: 50%; | |
| font-size: 0.7rem; | |
| display: flex; | |
| flex-wrap: wrap; | |
| padding: 10px; | |
| max-height: 100vh; /* Maximum height to a third of the viewport height */ | |
| overflow-y: auto; /* Enable vertical scrolling */ | |
| background-color: #9e9e9e0a; /* Light grey background */ | |
| } | |
| .text-box { | |
| width: calc(100% - 20px); /* Adjust based on padding */ | |
| margin: 10px; | |
| padding: 10px; | |
| background-color: #9e9e9e0a; /* Light grey background */ | |
| color: #606060bf; | |
| border: 2px solid #ddd; /* Cartoonish border */ | |
| border-radius: 20px; /* Rounded corners for cartoonish effect */ | |
| position: relative; | |
| box-shadow: 3px 3px #bbb; /* Soft shadow for depth */ | |
| } | |
| .text-box:before { | |
| content: ''; | |
| position: absolute; | |
| right: 100%; | |
| bottom: 20%; | |
| border-top: 10px solid transparent; | |
| border-bottom: 10px solid transparent; | |
| border-right: 10px solid #ddd; /* Arrow matching the border */ | |
| } | |
| .summary-box { | |
| padding: 10px; | |
| margin: 10px 0; | |
| background-color: #e6e6fa; /* Lavender background for a pleasant look */ | |
| border: 1px solid #ddd; /* Light border for definition */ | |
| border-radius: 5px; /* Slightly rounded corners */ | |
| box-shadow: 2px 2px 5px rgba(0,0,0,0.1); /* Soft shadow for depth */ | |
| cursor: pointer; | |
| } | |
| h4 { margin-top: 0; } | |
| </style> | |
| </head> | |
| <body> | |
| <div class='column reviews'><h2>Reviews</h2><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0'>The Residence Inn was great</span>. Very central to lots of things but the people working there were what made the stay so enjoybale. Leyla at the front desk was so helpful in guiding us as to what to do and never without a big smile on her face. Franco at the valet was so friendly and helpful and since he was our very frist imprerssion of the Residence Inn it certainly was a good one. <span class='review-span highlight' data-aligned-summaries='3'>The breakfast was great</span> but again the staff was wonderful. Kemika (sp) was so helpful and warm and it certainly made for an enjoyable breakfast time with our family. The rooms were clean and modern. The parking charge was the only downfall at $35 a day. It would be better to include it in the room price.</div><div class='text-box'>I <span class='review-span highlight' data-aligned-summaries='0'>was treated very horribly</span> by the staff at this hotel, I would not recommend it to anyone no matter who you are. Maybe its because they are new they don't know how to treat guests but I can tell you this much <span class='review-span highlight' data-aligned-summaries='0'>they ruined my entire stay</span> and never bothered to do anything about it,until I took action. I am disappointed that a Marriott would act like this, but atleast now you know that they are not capable of effectively dealing with problem resolution during your stay.</div><div class='text-box'>I have stayed at this hotel numerous times since it opened. I love the location, and the <span class='review-span highlight' data-aligned-summaries='2'>kitchenette in the rooms</span> makes any hotel stay so much more comfortable. Of course, <span class='review-span highlight' data-aligned-summaries='3'>one can never complain about complementary breakfast</span>! The staff has always been super friendly and helpful, from the maintenance and housekeeping staff, to the front desk and valet. Every time I go to Toronto I look forward to staying there!</div><div class='text-box'>We stayed in <span class='review-span highlight' data-aligned-summaries='0'>the residence inn</span> over a weekend. After a Long drive from chicago <span class='review-span highlight' data-aligned-summaries='2'>we were assigned a room on a high floor as requested with a lovely view of the cn tower</span>! <span class='review-span highlight' data-aligned-summaries='1'>The hotel</span> <span class='review-span highlight' data-aligned-summaries='0 1'>is in the perfect spot</span> <span class='review-span highlight' data-aligned-summaries='1'>for</span> exploring the surrounding area and has lots of <span class='review-span highlight' data-aligned-summaries='1'>pubs and restaurants in close vicinity</span> also! Book it, <span class='review-span highlight' data-aligned-summaries='0'>you won't be dissapointed</span> :)</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0'>Excellent location</span>. 5 Minutes walking distance to both the Rogers Centre and CN Tower. <span class='review-span highlight' data-aligned-summaries='1'>Also walking distance to all the nightclubs in the entertainment district</span>. <span class='review-span highlight' data-aligned-summaries='0'>Rooms are brand new and kept spotlessly clean</span>. This property is also reasonably priced with the AAA discount. I can't think of a single negative thing to say about this property.</div><div class='text-box'>A thank you party for the clients on our first night, <span class='review-span highlight' data-aligned-summaries='0'>staff very polite</span> and <span class='review-span highlight' data-aligned-summaries='0'>room very clean</span>. Close to the CN tower and King street, <span class='review-span highlight' data-aligned-summaries='0'>well located</span>. <span class='review-span highlight' data-aligned-summaries='0'>The fact that</span> <span class='review-span highlight' data-aligned-summaries='0 2'>you have a complete kitchen</span> <span class='review-span highlight' data-aligned-summaries='0'>and</span> <span class='review-span highlight' data-aligned-summaries='0 3'>a very nice breakfast included</span> <span class='review-span highlight' data-aligned-summaries='0'>also are some of the reasons to go back to this hotel.</span></div><div class='text-box'>Stayed for 3 nights in August. Excellent location next to the CN Tower. <span class='review-span highlight' data-aligned-summaries='2'>Lovely room with full kitchen</span> - handy with young children - excellent deli round the corner which <span class='review-span highlight' data-aligned-summaries='2'>made preparing meals easier etc</span>. - less stressful than taking youngsters to restaurants. <span class='review-span highlight' data-aligned-summaries='3'>Absolutely superb breakfast</span> each morning. Courteous staff throughout.</div><div class='text-box'>I have been <span class='review-span highlight' data-aligned-summaries='0'>staying in Residence Inn for the ast 5 months</span> and its by far <span class='review-span highlight' data-aligned-summaries='0'>the best extended stay hotel</span> I have ever visited. Excelent location,Food and Guest Services</div></div><div class='column summary'><h4>Summary</h4><div class='summary-box'><span id="0" class="summary-sentence">The Residence Inn at Toronto is great and staying often is something worth considering.</span> <span id="1" class="summary-sentence">This hotel is close to nightclubs, the entertainment district, restaurants and pubs.</span> <span id="2" class="summary-sentence">Some rooms on the higher floors of the hotel can boast of lovely views, but other options are rooms with full kitchens to prepare your own food if you prefer.</span> <span id="3" class="summary-sentence">The complimentary breakfast was really great.</span></div></div> | |
| <script> | |
| document.querySelectorAll('.summary-sentence').forEach(sentence => { | |
| sentence.addEventListener('mouseenter', function() { | |
| const summaryId = this.getAttribute('id'); | |
| document.querySelectorAll('.review-span').forEach(span => { | |
| if (!span.getAttribute('data-aligned-summaries').split(' ').includes(summaryId)) { | |
| span.classList.remove('highlight'); | |
| span.classList.add('not-hover-highlight'); | |
| } | |
| }); | |
| this.classList.add('highlight'); | |
| }); | |
| sentence.addEventListener('mouseleave', function() { | |
| const summaryId = this.getAttribute('id'); | |
| document.querySelectorAll('.review-span').forEach(span => { | |
| if (!span.getAttribute('data-aligned-summaries').split(' ').includes(summaryId)) { | |
| span.classList.remove('not-hover-highlight'); | |
| span.classList.add('highlight'); | |
| } | |
| this.classList.remove('highlight'); | |
| }); | |
| }); | |
| }); | |
| document.querySelectorAll('.review-span').forEach(span => { | |
| span.addEventListener('mouseenter', function() { | |
| document.querySelectorAll('.review-span').forEach(span => { | |
| if (span !== this) { | |
| span.classList.remove('highlight'); | |
| span.classList.add('not-hover-highlight'); | |
| } | |
| }); | |
| const AlignSummariesId = this.getAttribute('data-aligned-summaries').split(' '); | |
| document.querySelectorAll('.summary-sentence').forEach(sentence => { | |
| if (AlignSummariesId.includes(sentence.getAttribute('id'))) { | |
| sentence.classList.add('highlight'); | |
| } | |
| }); | |
| }); | |
| }); | |
| document.querySelectorAll('.review-span').forEach(span => { | |
| span.addEventListener('mouseleave', function() { | |
| const AlignSummariesId = this.getAttribute('data-aligned-summaries').split(' '); | |
| document.querySelectorAll('.review-span').forEach(span => { | |
| if (span !== this) { | |
| span.classList.remove('not-hover-highlight'); | |
| span.classList.add('highlight'); | |
| } | |
| }); | |
| document.querySelectorAll('.summary-sentence').forEach(sentence => { | |
| if (AlignSummariesId.includes(sentence.getAttribute('id'))) { | |
| sentence.classList.remove('highlight'); | |
| } | |
| }); | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |