Spaces:
Running
Running
File size: 11,937 Bytes
72f5cb0 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 |
<!DOCTYPE html>
<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 !important; /* Dark grey for muted text */
cursor: pointer;}
.not-hover-highlight { background-color: lightyellow;
color: #606060 !important; /* 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'>Would come back again and again We have been staying at Island Shangri-la once every year for the past 7 years. They have continued to improve their service year after year. The service is impeccable. <span class='review-span highlight' data-aligned-summaries='4'>The rooms were renovated</span> a couple of years ago <span class='review-span highlight' data-aligned-summaries='4'>and they added a modern twist</span>. But the level of comfort and 'homeyness' has been retained. <span class='review-span highlight' data-aligned-summaries='1'>With the Pacific Place mall right underneath the hotel, it is so convenient</span> to just go down and shop, knowing that even if you carry a lot of bulky items. There is no worry about riding through the mrt or lining up to get a taxi. You can just catch the elevator and go right up to your room. It is <span class='review-span highlight' data-aligned-summaries='0'>always a perfect experience staying at the hotel</span>.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0'>Good, but not unforgettable</span> This hotel is certainly good enough as a business hotel. However, I really will not stay here for a leisure trip. As mentioned in another review, <span class='review-span highlight' data-aligned-summaries='0'>there are just no personal touches</span> or charm. The staff is polite but the service is more mechanical, rather than from the heart. <span class='review-span highlight' data-aligned-summaries='7'>There is a pool</span>, but <span class='review-span highlight' data-aligned-summaries='3'>it offers a view of skyscrapers nearby</span>. It's really quite hard to relax in this evironment.<span class='review-span highlight' data-aligned-summaries='1'>The location is not bad</span> as <span class='review-span highlight' data-aligned-summaries='1 2'>it is connected to the</span> <span class='review-span highlight' data-aligned-summaries='2'>subway</span> via a <span class='review-span highlight' data-aligned-summaries='1'>big shopping mall</span>. However, in the morning, a cab ride can take quite long to reach the central business district due to traffic jam.</div><div class='text-box'>OK, not spectacular. I spent a few nights at the Shangri La in August. I <span class='review-span highlight' data-aligned-summaries='0'>found the overall experience lacking</span>.<span class='review-span highlight' data-aligned-summaries='4'>The rooms are bland, all function with surprisingly little style</span> (surprising given the strong feng shui influence in HK). The <span class='review-span highlight' data-aligned-summaries='0'>rooms are</span> <span class='review-span highlight' data-aligned-summaries='0 4'>also small</span>, even by HK/Toyko standards. <span class='review-span highlight' data-aligned-summaries='5'>Lunch at the cafe was expensive and disappointing</span>. <span class='review-span highlight' data-aligned-summaries='6'>Breakfast was much better</span>, though also very expensive.<span class='review-span highlight' data-aligned-summaries='7'>The pool is really nice, and the gym is good</span>. The staff was OK, but interactions felt rushed and reminded me more of a NYC business hotel than a true 5 star.Don't be afraid to try somewhere else.</div><div class='text-box'>once again, great stay once again, a great stay, <span class='review-span highlight' data-aligned-summaries='3'>upgraded to a harbour view</span> as it was our silver wedding aniversary, flowers, fruit etc as well, i love this hotel so much, such humble and smilley staff considering it is <span class='review-span highlight' data-aligned-summaries='0'>regullaly voted one of the best hotels in the world for everything</span>, fab possition, great rooms, wonderfull staff, do i own it or work for them? no,we just love staying here, well done, shangri- la once again!</div><div class='text-box'>consistently excellent I stay at the island SRL frequently with business, and it isconsistently excellent - staff are always amazing. Isupposethe only picky downside is <span class='review-span highlight' data-aligned-summaries='4'>if you like modern it may be a littlechinzy for you!The</span> service is <span class='review-span highlight' data-aligned-summaries='0'>outstanding.the bar lady in the foyer bar has remembered the drink I have on every visit</span> (as she does with every repeat guest!) and <span class='review-span highlight' data-aligned-summaries='7'>the pool is simply relaxation at its</span> <span class='review-span highlight' data-aligned-summaries='0 7'>best!Highly</span> <span class='review-span highlight' data-aligned-summaries='0'>recommended</span></div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0'>Great</span> <span class='review-span highlight' data-aligned-summaries='0 7'>hotel</span>, deserves its reputation Really <span class='review-span highlight' data-aligned-summaries='1'>great location next to luxury shopping mall</span> and park. We stayed in the lowest category room (deluxe peakview) and had no complaints. Service was excellent, staff couldn't do enough for us and our 2 kids, great welcome. <span class='review-span highlight' data-aligned-summaries='6'>Breakfast amazing</span>, <span class='review-span highlight' data-aligned-summaries='7'>loved the outdoor pool</span> - a great stay.</div><div class='text-box'>Excellent <span class='review-span highlight' data-aligned-summaries='0'>This place is great</span>. The welcome was impressive, <span class='review-span highlight' data-aligned-summaries='1 2'>the location is great</span> <span class='review-span highlight' data-aligned-summaries='2'>above</span> Pacific place and <span class='review-span highlight' data-aligned-summaries='2'>the MTR station</span>.<span class='review-span highlight' data-aligned-summaries='4'>The rooms were spacious</span>, clean and <span class='review-span highlight' data-aligned-summaries='4'>had everything you could ask for</span>. <span class='review-span highlight' data-aligned-summaries='0'>Staff are very polite and efficient</span>.Highly recommended.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0'>top of the line</span> but you pay for it showReview(3417094, 'full');</div></div><div class='column summary'><h4>Summary</h4><div class='summary-box'><span id="0" class="summary-sentence">This is a really great hotel, however, it lacks the personal touch.</span> <span id="1" class="summary-sentence">The location is great because not only is it connected via a big shopping mall</span> <span id="2" class="summary-sentence">but it is super easy to get to the subway station.</span> <span id="3" class="summary-sentence">The views aren't so great because really all you see are skyscrapers.</span> <span id="4" class="summary-sentence">The rooms of the hotel were modern and close to the elevator, but they were also on the smaller side and a little simplistic.</span> <span id="5" class="summary-sentence">The food at the hotel is very expensive and not enjoyable.</span> <span id="6" class="summary-sentence">The breakfast was nicer than the lunch.</span> <span id="7" class="summary-sentence">The hotel has very good exercise facilities such a good gym and a nice pool.</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>
|