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: 30%; | |
| font-size: 1.0rem; | |
| padding: 10px; | |
| height: 40vh; /* 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: 40vh; /* 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'>We had three nights at the Swissotel Sydney On Market Street and <span class='review-span highlight' data-aligned-summaries='0'>enjoyed our stay</span>. <span class='review-span highlight' data-aligned-summaries='0'>We had a corner room with views out across the city</span>. Rooms are not huge but are comfortable, clean and quiet. Breakfast was included in our three-day rate and it was excellent. We also had one evening meal at the hotel. While the meal was good, the prices were a little more than we expected. Location is excellent and in walking distance of tourist attractions, shopping and underground rail. <span class='review-span highlight' data-aligned-summaries='1'>It is a quaint hotel</span> in that the hotel is built above Myer shopping emporium and to check in means taking dropping suitcases with a porter at the small off-street entry and taking a lift to the 8th floor which opens out onto an elegant lobby and reception. Staff were courteous and help-yourself bowls of Granny Smith apples near the lifts were appreciated. <span class='review-span highlight' data-aligned-summaries='1'>Happy to recommend the hotel</span>.</div><div class='text-box'>we stayed for 5 nights in the swissotel sydney. It is a <span class='review-span highlight' data-aligned-summaries='0'>great hotel with a great location</span>. Town hall station in a 5 minute walk, St James station is about 3 mins away. If there are two or more people it is probably cheaper to get a taxi from the airport. Our room was massive, modern and spotlessly clean. the only downside was having paid the hotel bill in full before our arrival, the reception proceeded to charge my credit card again. This was a major inconvience as we were at the end of our 3 week holiday and my credit card was near it's limit. The problem was eventually sorted after a few days but it prevented me from using my card during this time. Although helpful, I didn't even get an apology from the staff!</div><div class='text-box'>I stayed at this Hotel for 6 nights, and <span class='review-span highlight' data-aligned-summaries='0 1'>not sure if I would return again if in Sydney</span>. The location is excellent and the concierge know their stuff, but sadly I think it ends there. When I checked in I was informed that I had been upgraded, but on further inspection it was the room that I had actually paid for in advance. The room itself had a balcony (for which I paid extra), but no views as such, not like it was described on their website. The Hotel was busy and I was told to check on a daily basis if I wanted to change rooms. I was hassled most mornings at breakfast, because my name did not appear on the list which it should have been. <span class='review-span highlight' data-aligned-summaries='0 1'>Definitely not a 5 Star Hotel</span>.Internet charges outrageous.</div><div class='text-box'>we booked to stay here through wotif.com after initially looking to rent a self catered apartment from which to explore sydney we found this to be a very good price for us to have a very comfortable room, our flight landed at 0530 the day we were checking in so i wrote to the hotel to <span class='review-span highlight' data-aligned-summaries='0'>ask how early we could check in</span> not expecting a positive response but we <span class='review-span highlight' data-aligned-summaries='0'>got a nice reply and</span> when we arrived after a 24hr flight from france we <span class='review-span highlight' data-aligned-summaries='0'>were given our room at 6</span>am!, very good. <span class='review-span highlight' data-aligned-summaries='1'>staff very nice would reccommend here for a good base in sydney</span>.</div><div class='text-box'>Hotel room was nicely appointed and with a good city view. For a Sunday night though the food on offer was limited - as was the service. Staff had to be asked for drinks and to order food - and it did seem to be an inconvenience that we wanted service. Breakfast was the standard continental or hot and nothing very exciting. Once again the staff seemed to be inconvenienced by our presence. <span class='review-span highlight' data-aligned-summaries='0 1'>Given the nice rooms and good location it was disappointing that the service was so slack and uninspiring</span>.<span class='review-span highlight' data-aligned-summaries='1'></span></div><div class='text-box'>the hotel itself is a bit difficult to find, and apparently not well known. <span class='review-span highlight' data-aligned-summaries='0'>location is supreme</span> however in between george and pitt street. also very near darling harbour and town hall rail station. service was not much above average. <span class='review-span highlight' data-aligned-summaries='0'>the biggest disgust</span> experienced <span class='review-span highlight' data-aligned-summaries='0'>was</span> indeed <span class='review-span highlight' data-aligned-summaries='0'>the exceedingly high cost of internet</span> and difficulty accessing once you have registered. during my trips back to sydney, <span class='review-span highlight' data-aligned-summaries='1'>i will definitely compare other hotels before here</span>, such as Hilton or Marriot.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0'>I experianced</span> <span class='review-span highlight' data-aligned-summaries='0 1'>a most enjoyable stay</span> <span class='review-span highlight' data-aligned-summaries='1'>with a nice room</span> the location to my business appointment was just ideal and the service in the resturant caould not be faulted. Nice and friendly. <span class='review-span highlight' data-aligned-summaries='0 1'>Unfortunately the sign out was very frustrating</span> - too long.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0 1'>Restaurant very good</span>. <span class='review-span highlight' data-aligned-summaries='0 1'>Problem with bathroom was resolved</span> very quickly.</div></div><div class='column summary'><h4>Summary</h4><div class='summary-box'><span id="0" class="summary-sentence">Overall an enjoyable stay.</span> <span id="1" class="summary-sentence">This is a very recommended hotel.</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'); | |
| console.log('entered!'); | |
| } | |
| }); | |
| 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'); | |
| console.log('left!'); | |
| } | |
| 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> | |