feat: update footer hospital information, adjust CSS breakpoints, and reorganize main content blocks with new news and events sections.
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 314 KiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 195 KiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 309 KiB |
Binary file not shown.
+20
-27
@@ -1,35 +1,28 @@
|
||||
<body>
|
||||
<div data-component-id="umass_base:block-multiple-ctas" data-background="solid" data-layout-variant="default">
|
||||
<div class="container">
|
||||
<div class="container" th:unless="${ctaMenu != null and not #lists.isEmpty(ctaMenu.items)}">
|
||||
<div class="text-container">
|
||||
<div data-component-id="umass_base:section-title" class="f--section-title">
|
||||
<h2>TÌM HIỂU<span class="highlight">KHOA ĐIỀU TRỊ</span>
|
||||
</h2>
|
||||
<h2>TÌM HIỂU<span class="highlight">CHUYÊN KHOA</span></h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="links-container">
|
||||
<div class="f--field f--button">
|
||||
<a href="https://www.umass.edu/admissions/apply" class="button-text-link button-context-light " aria-label="Apply" target="_self" data-component-id="umass_base:button">
|
||||
<span class="button-text"> Apply </span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="f--field f--button">
|
||||
<a href="https://www.umass.edu/gateway/academics/explore-our-programs" class="button-text-link button-context-light " aria-label="Majors & Minors" target="_self" data-component-id="umass_base:button">
|
||||
<span class="button-text"> Majors & Minors </span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="f--field f--button">
|
||||
<a href="https://www.umass.edu/admissions/undergraduate-admissions/costs-aid" class="button-text-link button-context-light " aria-label="Tuition & Costs" target="_self" data-component-id="umass_base:button">
|
||||
<span class="button-text"> Tuition & Costs </span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="f--field f--button">
|
||||
<a href="https://www.umass.edu/admissions/visit" class="button-text-link button-context-light " aria-label="Take a Tour" target="_self" data-component-id="umass_base:button">
|
||||
<span class="button-text"> Take a Tour </span>
|
||||
</a>
|
||||
[menu:CTA]
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<style>* { box-sizing: border-box; } body {margin: 0;}</style>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.links-container {
|
||||
display: grid !important;
|
||||
grid-template-columns: repeat(2, 1fr) !important;
|
||||
gap: 1rem;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.links-container {
|
||||
grid-template-columns: 1fr !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,51 +1,100 @@
|
||||
<div class="cc--component-container cc--news-events">
|
||||
<div class="c--component c--news-events">
|
||||
|
||||
<!-- Phần 2 cột: Tin mới (Trái) và Sự kiện (Phải) -->
|
||||
<div class="news-events-row">
|
||||
|
||||
<div class="news-column">
|
||||
<h2 class="section-title--news" style="font-size: 2rem;">
|
||||
TIN TỨC MỚI
|
||||
</h2>
|
||||
<div class="news-slider-wrapper">
|
||||
<button class="news-slider-btn prev-btn" aria-label="Previous">‹</button>
|
||||
<div class="news-slider-container">
|
||||
<div class="news-slider-track">
|
||||
<!-- Shortcode Tin Tức hiển thị dạng list (limit tăng lên 6 để có thể trượt) -->
|
||||
[component:news-grid data-source="posts:tag=news,limit=6,collection=news_posts"]
|
||||
</div>
|
||||
</div>
|
||||
<button class="news-slider-btn next-btn" aria-label="Next">›</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="events-column">
|
||||
<h2 class="events-title" style="font-size: 2rem;">
|
||||
SỰ KIỆN
|
||||
</h2>
|
||||
<div class="events-widget">
|
||||
<!-- Shortcode Sự kiện -->
|
||||
[component:events-list data-source="posts:tag=event,limit=4,collection=event_posts"]
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Header chung (Mobile) -->
|
||||
<div class="news-events-section__footer">
|
||||
<a href="/news/news-events" class="news-events-section__cta news-events-section__cta--mobile">
|
||||
Xem Thêm
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.education-slider-wrapper {
|
||||
.news-slider-wrapper {
|
||||
position: relative;
|
||||
padding: 0 30px; /* Space for buttons */
|
||||
}
|
||||
.education-slider-container {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.news-slider-container {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
.education-slider-wrapper .news-grid,
|
||||
.education-slider-wrapper .row,
|
||||
.education-slider-track {
|
||||
}
|
||||
|
||||
.news-slider-wrapper .news-grid,
|
||||
.news-slider-wrapper .row,
|
||||
.news-slider-track {
|
||||
display: flex !important;
|
||||
flex-wrap: nowrap !important;
|
||||
gap: 20px;
|
||||
margin: 0 !important;
|
||||
transition: transform 0.4s ease;
|
||||
}
|
||||
/* Force children to be fixed width cards */
|
||||
.education-slider-wrapper .news-grid > *,
|
||||
.education-slider-wrapper .row > *,
|
||||
.education-slider-track > * {
|
||||
flex: 0 0 calc(33.333% - 14px) !important; /* show 3 cards at a time */
|
||||
}
|
||||
|
||||
/* Force children to be fixed width cards - 2 cards at a time because this column is narrow */
|
||||
.news-slider-wrapper .news-grid > *,
|
||||
.news-slider-wrapper .row > *,
|
||||
.news-slider-track > * {
|
||||
flex: 0 0 calc(50% - 10px) !important;
|
||||
max-width: none !important;
|
||||
}
|
||||
@media (max-width: 992px) {
|
||||
.education-slider-wrapper .news-grid > *,
|
||||
.education-slider-wrapper .row > *,
|
||||
.education-slider-track > * {
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.news-slider-wrapper .news-grid > *,
|
||||
.news-slider-wrapper .row > *,
|
||||
.news-slider-track > * {
|
||||
flex: 0 0 calc(50% - 10px) !important;
|
||||
}
|
||||
}
|
||||
@media (max-width: 576px) {
|
||||
.education-slider-wrapper .news-grid > *,
|
||||
.education-slider-wrapper .row > *,
|
||||
.education-slider-track > * {
|
||||
}
|
||||
|
||||
@media (max-width: 576px) {
|
||||
.news-slider-wrapper .news-grid > *,
|
||||
.news-slider-wrapper .row > *,
|
||||
.news-slider-track > * {
|
||||
flex: 0 0 100% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.edu-slider-btn {
|
||||
.news-slider-btn {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
background-color: rgba(200,200,200,0.5); /* mờ / transparent */
|
||||
background-color: rgba(200, 200, 200, 0.5);
|
||||
color: #333;
|
||||
border: none;
|
||||
font-size: 30px;
|
||||
@@ -56,60 +105,38 @@
|
||||
z-index: 10;
|
||||
transition: background-color 0.2s, color 0.2s;
|
||||
line-height: 1;
|
||||
}
|
||||
.edu-slider-btn:hover {
|
||||
background-color: rgba(0,0,0,0.7);
|
||||
}
|
||||
|
||||
.news-slider-btn:hover {
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
color: #fff;
|
||||
}
|
||||
.edu-slider-btn.prev-btn {
|
||||
left: -10px;
|
||||
}
|
||||
.edu-slider-btn.next-btn {
|
||||
right: -10px;
|
||||
}
|
||||
.edu-slider-btn:disabled {
|
||||
}
|
||||
|
||||
.news-slider-btn.prev-btn {
|
||||
left: -15px;
|
||||
}
|
||||
|
||||
.news-slider-btn.next-btn {
|
||||
right: -15px;
|
||||
}
|
||||
|
||||
.news-slider-btn:disabled {
|
||||
opacity: 0.2;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="cc--component-container cc--news-events">
|
||||
<div class="c--component c--news-events"><!-- Header -->
|
||||
<div class="news-events-row">
|
||||
<div class="education-column news-column" style="width: 100%;">
|
||||
<div style="display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid var(--color-brand); margin-bottom: 16px;">
|
||||
<!-- Thêm flex-grow: 1 vào style của h2 -->
|
||||
<h2 class="section-title--news" style="font-size: 2rem; margin: 0; padding-bottom: 4px; border-bottom: unset;">ĐÀO TẠO</h2>
|
||||
<a href="/news/education" class="news-events-section__cta news-events-section__cta--desktop" style="color: var(--color-brand); font-weight: 800; font-size: 16px; text-transform: uppercase; text-decoration: none; border-bottom: unset;">XEM THÊM</a>
|
||||
</div>
|
||||
<div class="news-list education-slider-wrapper" style="padding-right: 0;">
|
||||
<button class="edu-slider-btn prev-btn" aria-label="Previous">‹</button>
|
||||
<div class="education-slider-container">
|
||||
<div class="education-slider-track">
|
||||
[component:news-grid data-source="posts:tag=education,limit=5,collection=news_posts"]
|
||||
</div>
|
||||
</div>
|
||||
<button class="edu-slider-btn next-btn" aria-label="Next">›</button>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- Mobile Footer CTA -->
|
||||
<div class="news-events-section__footer"><a href="/news/education" class="news-events-section__cta news-events-section__cta--mobile">Xem Thêm</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const wrappers = document.querySelectorAll('.education-slider-wrapper');
|
||||
const wrappers = document.querySelectorAll('.news-slider-wrapper');
|
||||
wrappers.forEach(wrapper => {
|
||||
const prevBtn = wrapper.querySelector('.prev-btn');
|
||||
const nextBtn = wrapper.querySelector('.next-btn');
|
||||
|
||||
let track = wrapper.querySelector('.education-slider-track');
|
||||
let track = wrapper.querySelector('.news-slider-track');
|
||||
if (track && track.children.length === 1 && (track.children[0].classList.contains('news-grid') || track.children[0].classList.contains('row'))) {
|
||||
track = track.children[0];
|
||||
track.classList.add('education-slider-track');
|
||||
track.classList.add('news-slider-track');
|
||||
}
|
||||
|
||||
if (!track) return;
|
||||
@@ -124,7 +151,7 @@ document.addEventListener("DOMContentLoaded", function() {
|
||||
const gap = parseFloat(window.getComputedStyle(track).gap) || 20;
|
||||
track.style.transform = `translateX(-${currentIndex * (itemWidth + gap)}px)`;
|
||||
|
||||
const containerWidth = wrapper.querySelector('.education-slider-container').getBoundingClientRect().width;
|
||||
const containerWidth = wrapper.querySelector('.news-slider-container').getBoundingClientRect().width;
|
||||
const visibleCount = Math.max(1, Math.floor((containerWidth + gap) / (itemWidth + gap)));
|
||||
|
||||
prevBtn.disabled = currentIndex === 0;
|
||||
@@ -142,7 +169,7 @@ document.addEventListener("DOMContentLoaded", function() {
|
||||
const items = track.children;
|
||||
const itemWidth = items[0].getBoundingClientRect().width;
|
||||
const gap = parseFloat(window.getComputedStyle(track).gap) || 20;
|
||||
const containerWidth = wrapper.querySelector('.education-slider-container').getBoundingClientRect().width;
|
||||
const containerWidth = wrapper.querySelector('.news-slider-container').getBoundingClientRect().width;
|
||||
const visibleCount = Math.max(1, Math.floor((containerWidth + gap) / (itemWidth + gap)));
|
||||
|
||||
if (currentIndex < items.length - visibleCount) {
|
||||
@@ -156,7 +183,7 @@ document.addEventListener("DOMContentLoaded", function() {
|
||||
if(items.length === 0) return;
|
||||
const itemWidth = items[0].getBoundingClientRect().width;
|
||||
const gap = parseFloat(window.getComputedStyle(track).gap) || 20;
|
||||
const containerWidth = wrapper.querySelector('.education-slider-container').getBoundingClientRect().width;
|
||||
const containerWidth = wrapper.querySelector('.news-slider-container').getBoundingClientRect().width;
|
||||
const visibleCount = Math.max(1, Math.floor((containerWidth + gap) / (itemWidth + gap)));
|
||||
|
||||
if (currentIndex > items.length - visibleCount) {
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -4,75 +4,96 @@
|
||||
<div class="l--layout l--full">
|
||||
<div class="lr--layout-region lr--main">
|
||||
<div class="cc--component-container cc--homepage-hero">
|
||||
<div class="c--component c--homepage-hero">
|
||||
<div class="slides-container">
|
||||
<div class="image-video-container has-video">
|
||||
<img src="https://www.umass.edu/sites/default/files/styles/1_1_1920x1920/public/2025-09/250616_UMASS_4515.jpg" alt="Students collaborate using a driving simulator in the UMass Center for Transportation." srcset="https://www.umass.edu/sites/default/files/styles/1_1_1920x1920/public/2025-09/250616_UMASS_4515.jpg?h=9855f42d&itok=d27r8GaT 1920w" />
|
||||
<div class="f--ambient-video">
|
||||
<video allowfullscreen="allowfullscreen" role="presentation" tabindex="-1" loop autoplay playsinline="" muted controls>
|
||||
<source src="https://api-files.sproutvideo.com/file/aa9ad8b61e11ebc420/de09e4945c49091f/1080.mp4" type="video/mp4" />
|
||||
<div class="c--component c--homepage-hero" style="position: relative; overflow: hidden; height: 100vh; max-height: 38.125rem;">
|
||||
|
||||
<!-- ====== LỚP 1: ẢNH TĨNH (Nằm dưới cùng, sẽ hiện trên Mobile) ====== -->
|
||||
<img class="static-fallback-image" src="https://res.cloudinary.com/ipufdhda/image/upload/v1784534008/BANNER-WEB-scaled_yeox4u.jpg" alt="Static Fallback" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1;" />
|
||||
|
||||
<!-- ====== LỚP 2: SLIDER (Chạy nếu không có Video, Ẩn trên Mobile) ====== -->
|
||||
<div class="vanilla-slider desktop-slider" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2;">
|
||||
|
||||
<div class="v-slide" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 1; transition: opacity 1s ease-in-out;">
|
||||
<img src="https://res.cloudinary.com/ipufdhda/image/upload/v1784534008/BANNER-WEB-01-scaled_epe5ui.jpg" style="width: 100%; height: 100%; object-fit: cover;" />
|
||||
</div>
|
||||
|
||||
<div class="v-slide" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1s ease-in-out;">
|
||||
<img src="https://res.cloudinary.com/ipufdhda/image/upload/v1784534008/BANNER-WEB-scaled_yeox4u.jpg" style="width: 100%; height: 100%; object-fit: cover;" />
|
||||
</div>
|
||||
|
||||
<div class="v-slide" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1s ease-in-out;">
|
||||
<img src="https://res.cloudinary.com/ipufdhda/image/upload/v1784534009/W2-01-scaled_jhmzlv.jpg" style="width: 100%; height: 100%; object-fit: cover;" />
|
||||
</div>
|
||||
|
||||
<!-- Nút điều khiển Slider -->
|
||||
<div class="v-btn v-prev" style="position: absolute; left: 20px; top: 50%; transform: translateY(-50%); color: white; font-size: 50px; font-weight: bold; cursor: pointer; z-index: 10; pointer-events: auto; text-shadow: 0 2px 4px rgba(0,0,0,0.5); user-select: none;">❮</div>
|
||||
<div class="v-btn v-next" style="position: absolute; right: 20px; top: 50%; transform: translateY(-50%); color: white; font-size: 50px; font-weight: bold; cursor: pointer; z-index: 10; pointer-events: auto; text-shadow: 0 2px 4px rgba(0,0,0,0.5); user-select: none;">❯</div>
|
||||
</div>
|
||||
|
||||
<!-- ====== LỚP 3: VIDEO (Nằm trên cùng, đè lên Slider, Ẩn trên Mobile) ====== -->
|
||||
<div class="f--ambient-video desktop-video" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none;">
|
||||
<video allowfullscreen="allowfullscreen" role="presentation" tabindex="-1" loop="loop" autoplay="autoplay" playsinline="playsinline" muted="muted" style="width: 100%; height: 100%; object-fit: cover;">
|
||||
<source src="https://res.cloudinary.com/ipufdhda/video/upload/v1784530171/homepage_f4xed9.mp4" type="video/mp4" />
|
||||
</video>
|
||||
</div>
|
||||
<div data-once="ambientVideo" class="video-controls">
|
||||
<div class="video-controls-inner">
|
||||
<button aria-labelledby="pauseBtn" class="video-button video-pause-button">
|
||||
<svg height="14" viewBox="0 0 10 14" width="10" xmlns="http://www.w3.org/2000/svg">
|
||||
<title id="pauseBtn">Pause Background Video</title>
|
||||
<path d="m1143 711v14h-3v-14zm7 0v14h-3v-14z" fill="#fff" fill-rule="evenodd" transform="translate(-1140 -711)"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button aria-labelledby="playBtn" class="video-button video-play-button">
|
||||
<svg height="29" viewBox="0 0 29 29" width="29" xmlns="http://www.w3.org/2000/svg">
|
||||
<title id="playBtn">Play Background Video</title>
|
||||
<path d="m17.5 3c-7.99789474 0-14.5 6.50210526-14.5 14.5 0 7.9978947 6.50210526 14.5 14.5 14.5 7.9978947 0 14.5-6.5021053 14.5-14.5 0-7.99789474-6.5021053-14.5-14.5-14.5zm5.6763936 15.2939067-7.3503366 4.5939604c-.6635721.408352-1.5313202-.051044-1.5313202-.8422261v-9.1879207c0-.7911821.8677481-1.2761001 1.5313202-.8422261l7.3503366 4.5939604c.612528.38283.612528 1.3016221 0 1.6844521z" fill="#fff" fill-rule="evenodd" transform="translate(-3 -3)"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-container centered">
|
||||
<div class="slide-text-container-inner">
|
||||
|
||||
<!-- ====== LỚP 4: TEXT OVERLAY (Nội dung chữ nằm trên tất cả) ====== -->
|
||||
<div class="text-container centered" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 4; pointer-events: none;">
|
||||
<div class="slide-text-container-inner" style="pointer-events: auto;">
|
||||
<h3>
|
||||
<a href="https://www.umass.edu/gateway/why-umass">Stroke International School.</a>
|
||||
</h3>
|
||||
<div class="f--field f--button">
|
||||
<a href="https://www.umass.edu/gateway/why-umass" aria-label="Learn More Learn more about UMass Amherst." data-component-id="umass_base:button" class="button-secondary button-context-dark">
|
||||
<span class="button-text"> Learn More </span>
|
||||
<a href="https://www.umass.edu/gateway/why-umass" aria-label="Learn More" data-component-id="umass_base:button" class="button-secondary button-context-dark">
|
||||
<span class="button-text"> Tìm Hiểu Thêm </span>
|
||||
</a>
|
||||
</div>
|
||||
<nav class="mc--menu mc--info-menu" th:if="${infoMenu != null and not #lists.isEmpty(infoMenu.items)}">
|
||||
<ul class="menu m--menu m--info-menu">
|
||||
<li class="menu-item menu-item--expanded">
|
||||
<details class="utility-button-wrapper mc--info-menu-container">
|
||||
<summary type="button" aria-label="Display submenu for Information menu" aria-expanded="false" aria-haspopup="true" class="utility-button arrow-toggle information-for-toggle">
|
||||
<span th:text="${infoMenu.name}">Info For</span>
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 16 7" enable-background="new 0 0 16 7" xml:space="preserve" width="16" height="7" class="arrow">
|
||||
<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#ffffff" points="7,7 0,0 16,0 "></polygon>
|
||||
</svg>
|
||||
</summary>
|
||||
<div class="submenu-wrapper">
|
||||
<ul class="submenu">
|
||||
<li class="menu-item" th:each="item : ${infoMenu.items}">
|
||||
<a th:href="${item.url}" th:text="${item.label}">Prospective Students</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</details>
|
||||
<div class="submenu-wrapper-desktop">
|
||||
<ul class="submenu">
|
||||
<li class="menu-item" th:each="item : ${infoMenu.items}">
|
||||
<a th:href="${item.url}" th:text="${item.label}">Prospective Students</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
[menu:INFO:dropdown]
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
/* Ẩn Video và Slider trên điện thoại, chỉ chừa lại Lớp 1 (Ảnh tĩnh) */
|
||||
@media (max-width: 767px) {
|
||||
.desktop-slider,
|
||||
.desktop-video {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const slides = document.querySelectorAll('.vanilla-slider .v-slide');
|
||||
const nextBtn = document.querySelector('.vanilla-slider .v-next');
|
||||
const prevBtn = document.querySelector('.vanilla-slider .v-prev');
|
||||
let currentSlide = 0;
|
||||
let slideInterval;
|
||||
|
||||
function goToSlide(index) {
|
||||
if (!slides.length) return;
|
||||
slides[currentSlide].style.opacity = 0;
|
||||
currentSlide = (index + slides.length) % slides.length;
|
||||
slides[currentSlide].style.opacity = 1;
|
||||
}
|
||||
|
||||
function nextSlide() { goToSlide(currentSlide + 1); }
|
||||
function prevSlide() { goToSlide(currentSlide - 1); }
|
||||
|
||||
function startAutoPlay() {
|
||||
if (slideInterval) clearInterval(slideInterval);
|
||||
slideInterval = setInterval(nextSlide, 3000);
|
||||
}
|
||||
|
||||
if (slides.length > 0 && nextBtn && prevBtn) {
|
||||
nextBtn.addEventListener('click', function() { nextSlide(); startAutoPlay(); });
|
||||
prevBtn.addEventListener('click', function() { prevSlide(); startAutoPlay(); });
|
||||
startAutoPlay();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Binary file not shown.
@@ -111,8 +111,8 @@ body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
||||
4. Media Queries
|
||||
========================================================================== */
|
||||
|
||||
/* --- Mobile (<= 768px) --- */
|
||||
@media (max-width: 768px) {
|
||||
/* --- Mobile (< 768px) --- */
|
||||
@media (max-width: 767px) {
|
||||
/* Hide ambient video on mobile to save bandwidth and use image fallback */
|
||||
.f--ambient-video,
|
||||
.video-controls {
|
||||
@@ -128,7 +128,11 @@ body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
||||
grid-template-columns: 1fr;
|
||||
gap: var(--s2);
|
||||
}
|
||||
}
|
||||
}
|
||||
.header-hospital-name {
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* --- Mobile & Tablet (<= 1024px) --- */
|
||||
|
||||
BIN
Binary file not shown.
BIN
Binary file not shown.
BIN
Binary file not shown.
BIN
Binary file not shown.
BIN
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 MiB After Width: | Height: | Size: 3.0 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.0 MiB After Width: | Height: | Size: 7.0 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 MiB After Width: | Height: | Size: 7.8 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 MiB After Width: | Height: | Size: 6.5 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.1 MiB After Width: | Height: | Size: 6.7 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.7 MiB After Width: | Height: | Size: 6.4 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.3 MiB After Width: | Height: | Size: 3.2 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 MiB After Width: | Height: | Size: 3.1 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 2.1 MiB |
BIN
Binary file not shown.
BIN
Binary file not shown.
BIN
Binary file not shown.
BIN
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 314 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 195 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 309 KiB |
@@ -154,18 +154,18 @@
|
||||
|
||||
<div class="sis-footer-right">
|
||||
<div class="sis-hospital-box">
|
||||
<h3>Bệnh viện 1</h3>
|
||||
<p>215 Hồng Bàng, Phường 11, Quận 5,<br>TP. Hồ Chí Minh</p>
|
||||
<p><strong>Hotline:</strong> (84.28) 3855 4269</p>
|
||||
<p><strong>Email:</strong> bvdhyd@umc.edu.vn</p>
|
||||
<h3>Bệnh viện Đa khoa Quốc Tế S.I.S Cần Thơ</h3>
|
||||
<p>397 Nguyễn Văn Cừ, P. An Bình, <br>TP. Cần Thơ</p>
|
||||
<p><strong>Hotline:</strong> 18001115</p>
|
||||
<p><strong>Email:</strong> cskh@dotquy.vn</p>
|
||||
<div class="sis-hospital-icons">
|
||||
<svg viewBox="0 0 24 24" aria-label="Website"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z"/></svg>
|
||||
<svg viewBox="0 0 24 24" aria-label="Bản đồ"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/></svg>
|
||||
<a href="https://www.google.com/maps?cid=6717580334500129934&g_mp=CiVnb29nbGUubWFwcy5wbGFjZXMudjEuUGxhY2VzLkdldFBsYWNlEAMYASAF&hl=vi&gl=GB&source=embed" target="_blank"><svg viewBox="0 0 24 24" aria-label="Bản đồ"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/></svg></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sis-hospital-box">
|
||||
<h3>Bệnh viện 2</h3>
|
||||
<h3>Bệnh viện Đa khoa Quốc Tế S.I.S Đà Nẵng</h3>
|
||||
<p>201 Nguyễn Chí Thanh, Phường 12, Quận 5,<br>TP. Hồ Chí Minh</p>
|
||||
<p><strong>Hotline:</strong> (84.28) 3955 5548</p>
|
||||
<p><strong>Email:</strong> bvdaihoccoso2@umc.edu.vn</p>
|
||||
@@ -176,7 +176,7 @@
|
||||
</div>
|
||||
|
||||
<div class="sis-hospital-box">
|
||||
<h3>Bệnh viện 3</h3>
|
||||
<h3>Bệnh viện Đa khoa Quốc Tế S.I.S Nha Trang</h3>
|
||||
<p>221B Hoàng Văn Thụ, Phường 8, Q. Phú Nhuận,<br>TP. Hồ Chí Minh</p>
|
||||
<p><strong>Hotline:</strong> (84.28) 3842 0070</p>
|
||||
<p><strong>Email:</strong> bvdaihoccoso3@umc.edu.vn</p>
|
||||
|
||||
@@ -211,7 +211,11 @@
|
||||
<img th:src="@{/theme-assets/umass/images/logo_white.png}" alt="Sisvietnamvn" style="height: auto; max-width: 250px;" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="navigation-container">
|
||||
<div class="header-right" style="display: flex; flex-direction: column; align-items: start; flex-grow: 1;">
|
||||
<div class="header-hospital-name" style="color: var(--color-brand); font-size: 1.4rem; font-weight: bold; text-transform: uppercase; margin-bottom: 5px; -webkit-text-stroke: 1px white;">
|
||||
Bệnh viện đa khoa quốc tế S.I.S Cần thơ
|
||||
</div>
|
||||
<div class="navigation-container" style="width: 100%; display: flex; justify-content: flex-end;">
|
||||
<div id="mobile-flyout-container">
|
||||
<div class="primary-navigation">
|
||||
<nav class="mc--menu mc--main-menu">
|
||||
@@ -353,5 +357,6 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
</header>
|
||||
Binary file not shown.
Reference in New Issue
Block a user