Spaces:
Sleeping
Sleeping
File size: 11,968 Bytes
2331e8d |
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'>Our company has rented conference rooms and held many meetings and corporate events at Place D'Armes and <span class='review-span highlight' data-aligned-summaries='1'>we were extremely satisfied</span> with their service. <span class='review-span highlight' data-aligned-summaries='0'>There was always someone to greet and help</span> with the setup and make sure we have everything we needed. More importantly, <span class='review-span highlight' data-aligned-summaries='0'>technical service was efficient and really went out of their way</span> (even when it is your own equipment). <span class='review-span highlight' data-aligned-summaries='3'>The rooms are clean and beautiful</span> and staff is great. The only negative thing is that they charge for the conference room for the whole day regardless if you only need it for half a day or an hour.</div><div class='text-box'>The hotel is located in the OLD Town part of Montreal by the Notre Dame Cathedral and short walking distance to the rivers edge. This hotel was a great value and the <span class='review-span highlight' data-aligned-summaries='0 1'>staff and location were excellent</span>. <span class='review-span highlight' data-aligned-summaries='5'>There are 2 restaurants in the hotel that are very highly rated</span>. The staff and service were excellent. <span class='review-span highlight' data-aligned-summaries='0 1 3'>The rooms</span> <span class='review-span highlight' data-aligned-summaries='0 1'>are specious</span> and <span class='review-span highlight' data-aligned-summaries='3'>nicely decorated</span> <span class='review-span highlight' data-aligned-summaries='4'>The bathrooms are very nice with very big bathtubs</span>. <span class='review-span highlight' data-aligned-summaries='5'>There is also a roof terrace to have drinks</span> and enjoy the views. Couldn't use because it was raining.</div><div class='text-box'>We just returned from a mid-winter weekend get away to Montreal. We picked this hotel due to its <span class='review-span highlight' data-aligned-summaries='2'>location</span> in Old Montreal, <span class='review-span highlight' data-aligned-summaries='2'>close to restaurants</span>, Notre Dame and the cobblestone streets. From the moment we arrived when the valet service looked after the car until we checked out the <span class='review-span highlight' data-aligned-summaries='0'>service of the staff was top notch</span>. <span class='review-span highlight' data-aligned-summaries='3'>The</span> <span class='review-span highlight' data-aligned-summaries='0 3'>rooms were nice</span> <span class='review-span highlight' data-aligned-summaries='3'>with hardwood floors and exposed brick</span>. <span class='review-span highlight' data-aligned-summaries='5'>The bar, Suite701, is the perfect spot for a night cap</span>. <span class='review-span highlight' data-aligned-summaries='1'>We would definately return</span>.</div><div class='text-box'>Absolutely <span class='review-span highlight' data-aligned-summaries='0 1'>one of the best places to stay</span> while visiting old city Montreal. Staff was very friendly and accommodating. <span class='review-span highlight' data-aligned-summaries='5'>The rooftop bar and restaurant was beautiful</span> with a view of Notre Dame Basilica. We stayed in Junior Suite 3402 and <span class='review-span highlight' data-aligned-summaries='3'>really appreciated the ambiance and decor</span>. If I were to visit again I would think of staying in 3602 (second digit is the floor). The street noise was not bad however you will have early morning local truck deliveries.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0'>Lovely hotel</span> in an historic building with a <span class='review-span highlight' data-aligned-summaries='0'>fantastic location</span>. <span class='review-span highlight' data-aligned-summaries='0'>Nice rooms</span>, <span class='review-span highlight' data-aligned-summaries='0'>very friendly and service-oriented staff</span>. <span class='review-span highlight' data-aligned-summaries='0 4'>Great little touches</span> <span class='review-span highlight' data-aligned-summaries='4'>like</span> <span class='review-span highlight' data-aligned-summaries='4 5'>chocolates on the pillow</span> and turn-down service. Very helpful concierge. I was in Laval for business and went to Montreal for the weekend. <span class='review-span highlight' data-aligned-summaries='2'>I walked to restaurants, bars</span>, the river, shopping. <span class='review-span highlight' data-aligned-summaries='2'>Close enough to walk to Mont Royal</span>.</div><div class='text-box'>Stayed in one of the Suites which we got using one of the major credit card upgrades. <span class='review-span highlight' data-aligned-summaries='4'>Amazing bathroom with rain shower and a large tub.</span> <span class='review-span highlight' data-aligned-summaries='0 3'>Modern room</span>, clean bathroom, great service, <span class='review-span highlight' data-aligned-summaries='3'>great beds and blankets</span>. The <span class='review-span highlight' data-aligned-summaries='6'>only thing that it lacks it is a pool</span> but it can be overlooked. <span class='review-span highlight' data-aligned-summaries='0'>Location is great</span>, the old Montreal.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='0'>Le Place D'Armes is an amazingly elegant hotel</span> with staff that have a beautiful authenticity about them. <span class='review-span highlight' data-aligned-summaries='3'>The comfort and design of the rooms</span> is worth the price and <span class='review-span highlight' data-aligned-summaries='3'>is a great fit for both business or personal occasions</span>. If you are planning a trip to Montreal you simply need to check out this hotel.</div><div class='text-box'>Well I have nothing but good things to say about this hotel, <span class='review-span highlight' data-aligned-summaries='0'>it was just wonderful in every way</span>. Perfect location, spotless, nice staff. <span class='review-span highlight' data-aligned-summaries='0 1'>Possibly the nicest place</span> I have ever stayed. If you go to montreal and dont stay here you're missing out!</div></div><div class='column summary'><h4>Summary</h4><div class='summary-box'><span id="0" class="summary-sentence">This is a lovely place that was wonderful in all ways.</span> <span id="1" class="summary-sentence">It is definitely a place you will want to return again.</span> <span id="2" class="summary-sentence">The hotel is in walking condition to local restaurants, bars and even the Mont Royal.</span> <span id="3" class="summary-sentence">Beautifully decorated hotel rooms that are well designed and comfortable for all occasions.</span> <span id="4" class="summary-sentence">Very spacious in size with luxurious amenities in the bathroom, and it's the little touches such as chocolates on the pillow that make these rooms even more memorable.</span> <span id="5" class="summary-sentence">The hotel features some good places to have drinks and food, and there were even great chocolates left on the pillow.</span> <span id="6" class="summary-sentence">This hotel could do with a pool as that is the only thing it is really lacking.</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>
|