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'>Ideally located, <span class='review-span highlight' data-aligned-summaries='1'>within minutes of the Blue Mosque, Grand Bazaar etc and in the heart of the old City of Istanbul</span>, close to tram and autobus and the main street in Sultanahmet. <span class='review-span highlight' data-aligned-summaries='1'>Stunning views of the Bosphorus</span>, sunrise and <span class='review-span highlight' data-aligned-summaries='3'>sunset from the rooftop bar area and dining room</span>. Breakfast and dinner can also be taken in the rooftop area which has a glorious panoramic view of the City, especially after dark. Caner, our host on arrival at reception was very knowledgeble and gave good advice re places to visit, <span class='review-span highlight' data-aligned-summaries='6'>all hotel staff were very friendly</span>. <span class='review-span highlight' data-aligned-summaries='5 10'>Free internet access in the reception area was an unexpected</span> <span class='review-span highlight' data-aligned-summaries='5'>bonus. The bedroom was a little dark</span> and not a lot of space if you have large suitcases, we were here for 7 nights, <span class='review-span highlight' data-aligned-summaries='8'>plenty to chose from at breakfast</span>, although pretty much the same every day, lots of fruit, cheeses, breads, choice of eggs, teas and coffees etc. Overall a fantastic boutique style hotel, THANK YOU CANER, regards, Lyn & Shahbaz</div><div class='text-box'>We spent there 3 nights (celebrated my birthday)- and liked everything: <span class='review-span highlight' data-aligned-summaries='4'>very clean and cosy rooms</span>, <span class='review-span highlight' data-aligned-summaries='2 8 9'>breakfast on open terrace with breathtaking views</span> of the city&sea. Location is perfect ,managers are very professional and hospitable (special thanks to Mr. Ali Aldemir). <span class='review-span highlight' data-aligned-summaries='0'>We were happy to have some pleasant suprises from the hotel: wine, fruits, transfer to airport</span> :) I'm glad that we stayed at Mina hotel. <span class='review-span highlight' data-aligned-summaries='0'>Absolutely recommended</span>!</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='9'>Excellent situation</span> <span class='review-span highlight' data-aligned-summaries='1'>close to blue mosque at the heart of Sultan Ahmet district.</span> We were lucky to get a good deal in high season. <span class='review-span highlight' data-aligned-summaries='4'>Room size is small</span> but <span class='review-span highlight' data-aligned-summaries='4'>well furnished</span>. There's a beautiful <span class='review-span highlight' data-aligned-summaries='2'>roof top and terrace facing the golden horn</span> and the <span class='review-span highlight' data-aligned-summaries='2'>blue mosque</span>; Wonderful night view. The reception <span class='review-span highlight' data-aligned-summaries='6 7'>staff were polite</span> and room service was acceptable. They also <span class='review-span highlight' data-aligned-summaries='0'>offered us free shuttle service back to the airport</span>.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='9'>i liked this hotel a lot.the</span> reception was perfect, <span class='review-span highlight' data-aligned-summaries='4'>the room</span> good but <span class='review-span highlight' data-aligned-summaries='4'>not spacey</span>( no 208 or 209 i think.also the management should think to put a brush in the toilet for the .you know. there was no brush.a last thing that i d like to say is that the <span class='review-span highlight' data-aligned-summaries='7'>staff</span> of the restaurant <span class='review-span highlight' data-aligned-summaries='7'>wasnt very smiley</span> with you <span class='review-span highlight' data-aligned-summaries='7'>if you didnt leave a tip</span>.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='1'>Great location 5 minutes walk to the Grand Bazzar</span> and many other historic and traditional places in Sultanahmet. <span class='review-span highlight' data-aligned-summaries='8'>The breakfast is buffet and it's good not too bad</span>. <span class='review-span highlight' data-aligned-summaries='6 7'>The staff very friendly and always trying to help</span>. The only disadvantage we faced is that <span class='review-span highlight' data-aligned-summaries='5 10'>there is no wireless internet in the rooms, only in the looby</span>.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='9'>Lovely hotel</span> in the heart of Sultanahmet with <span class='review-span highlight' data-aligned-summaries='2'>spectacular views from the roof terrace</span>. Excellent value for money with <span class='review-span highlight' data-aligned-summaries='6 7'>friendly</span> <span class='review-span highlight' data-aligned-summaries='6'>and accommoating</span> <span class='review-span highlight' data-aligned-summaries='6 7'>staff</span>. <span class='review-span highlight' data-aligned-summaries='4'>Rooms were clean and comfortable</span>, all thats required when visiting a city. <span class='review-span highlight' data-aligned-summaries='0'>I would recommend this hotel</span> to anyone, and i would definately stay at the Mina hotel again.</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='1'>This hotel is in the old quarter of Istanbul-it is short walk to all the tourist spots</span>.<span class='review-span highlight' data-aligned-summaries='0 4'>The rooms are small but clean</span>-<span class='review-span highlight' data-aligned-summaries='8 9'>breakfast is buffet style and delicious</span>.The view from the breakfast area is fantastic.<span class='review-span highlight' data-aligned-summaries='0 6 7'>Reception staff are ready to answer any questions</span> you have about the area.We would definitely go back to the Hotel Mina again!</div><div class='text-box'><span class='review-span highlight' data-aligned-summaries='9'>Not a negative to this place</span>. Easy stay, with <span class='review-span highlight' data-aligned-summaries='8'>a breakfast fit for a king</span>!</div></div><div class='column summary'><h4>Summary</h4><div class='summary-box'><span id="0" class="summary-sentence">A highly recommended hotel that goes above and beyond for its customers, including arranged transfers to the airport and fruits and wine.</span> <span id="1" class="summary-sentence">With only a 5 minute walk to places like the Grand Bazzar or the center of Istanbul's old city, views of the Bosphorus this hotel sits in the old quarter and isn't far from popular tourist spots.</span> <span id="2" class="summary-sentence">It's rooftop terrace also offers views of the Golden Horn and the Blue Mosque and</span> <span id="3" class="summary-sentence">the sunsets are amazing from there.</span> <span id="4" class="summary-sentence">Although the size of the rooms here are small, they are well furnished, clean and comfortable.</span> <span id="5" class="summary-sentence">The only downside to the rooms at this hotel are that there is no wireless internet available unless you're in the lobby, and the rooms can seem quite dark to be in.</span> <span id="6" class="summary-sentence">The staff was okay.</span> <span id="7" class="summary-sentence">They were polite and helpful when they needed to be.</span> <span id="8" class="summary-sentence">The breakfast was Kingly.</span> <span id="9" class="summary-sentence">Very good.</span> <span id="10" class="summary-sentence">Having free WiFi in the lobby was a pleasant surprise.</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> | |