feat: update footer hospital information, adjust CSS breakpoints, and reorganize main content blocks with new news and events sections.

This commit is contained in:
2026-07-20 15:13:28 +07:00
parent fdbbb7c965
commit d6d722386f
36 changed files with 546 additions and 598 deletions
@@ -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 {
@@ -120,15 +120,19 @@ body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
}
.cc--tabbed-media-content {
.c--tabbed-media-content {
max-width: var(--max-width);
margin: 0 auto;
padding: var(--s2) var(--s1);
display: grid;
grid-template-columns: 1fr;
gap: var(--s2);
.c--tabbed-media-content {
max-width: var(--max-width);
margin: 0 auto;
padding: var(--s2) var(--s1);
display: grid;
grid-template-columns: 1fr;
gap: var(--s2);
}
}
}
.header-hospital-name {
display: none;
}
}
/* --- Mobile & Tablet (<= 1024px) --- */
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

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,94 +211,98 @@
<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 id="mobile-flyout-container">
<div class="primary-navigation">
<nav class="mc--menu mc--main-menu">
<ul class="menu m--menu m--main-menu" th:if="${primaryMenu != null and not #lists.isEmpty(primaryMenu.items)}">
<th:block th:each="item : ${primaryMenu.items}" th:if="${item.parent == null}">
<!-- Flat item -->
<li class="megamenu menu-item" th:if="${#lists.isEmpty(item.children)}">
<div class="link-arrow-wrapper">
<a th:href="${item.url}" th:text="${item.label}">Menu Item</a>
</div>
</li>
<!-- Expanded item (has children) -->
<li class="megamenu menu-item menu-item--expanded" th:if="${not #lists.isEmpty(item.children)}">
<div class="link-arrow-wrapper">
<a th:href="${item.url}" th:text="${item.label}">Menu Item</a>
<button type="button" class="has-submenu arrow-toggle" aria-expanded="false" aria-haspopup="true" data-once="site-header-arrow">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 7" width="16" height="7">
<path fill-rule="evenodd" clip-rule="evenodd" fill="#881c1c" d="M7.88,7L15.75,0H0s7.88,7,7.88,7Z"></path>
</svg>
</button>
</div>
<div class="submenu-wrapper">
<button class="button-back">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 5 10" width="5" height="10">
<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#881c1c" points="0,5 5,0 5,10 "></polygon>
</svg> Back </button>
<span class="navigation-title" th:text="${item.label}">Menu Item</span>
<!-- Mobile Submenu Layout (Simple List) -->
<ul class="submenu mobile-only">
<li class="menu-item" th:each="child : ${item.children}">
<a th:href="${child.url}" th:text="${child.label}">Child Item</a>
</li>
</ul>
<!-- Mega Menu Content Layout -->
<div class="mega-menu-content desktop-only">
<!-- Column 1: Info (Title and Text) -->
<div class="mega-col-info">
<h3 th:text="${item.label}">Về Bệnh viện</h3>
<p th:if="${item.label == 'Về Bệnh viện' or item.label == 'VỀ BỆNH VIỆN'}" style="text-transform: math-auto;">Bệnh viện Đột quỵ Quốc tế tự hào là đơn vị tiên phong trong việc cung cấp dịch vụ khám chữa bệnh chất lượng cao, mang lại sự tin cậy và an tâm cho bệnh nhân.</p>
<p th:if="${item.label == 'Chuyên khoa' or item.label == 'CHUYÊN KHOA'}" style="text-transform: math-auto;">Khám phá các chuyên khoa hàng đầu với đội ngũ bác sĩ chuyên môn cao, trang thiết bị y tế hiện đại đạt tiêu chuẩn quốc tế.</p>
<p th:if="${item.label != 'Về Bệnh viện' and item.label != 'VỀ BỆNH VIỆN' and item.label != 'Chuyên khoa' and item.label != 'CHUYÊN KHOA'}" style="text-transform: math-auto;">Khám phá thêm thông tin chi tiết về các dịch vụ, chuyên gia và hoạt động của chúng tôi để bảo vệ sức khỏe của bạn.</p>
</div>
<!-- Column 2: The actual Submenu Links -->
<div class="mega-col-links">
<ul class="submenu">
<li class="menu-item" th:each="child : ${item.children}">
<a th:href="${child.url}" th:text="${child.label}">Child Item</a>
</li>
</ul>
</div>
<!-- Column 3: Featured Image -->
<div class="mega-col-image">
<!-- Try to use a hospital-like image if we can, or fallback to logo -->
<img th:src="@{/theme-assets/umass/images/logo.png}" alt="Featured Image" style="object-fit: contain; background: white; padding: 20px;"/>
</div>
</div>
<!-- End Mega Menu Layout -->
</div>
</li>
</th:block>
</ul>
</nav>
</div>
<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>
<button id="search-drawer-trigger" aria-label="Open Search" data-once="header-search">
<svg class="search-trigger-open" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 25 25">
<title>Open Search</title>
<path fill-rule="evenodd" clip-rule="evenodd" fill="#fff" d="M10.03,2.67c-4.07,0-7.36,3.29-7.36,7.36s3.29,7.36,7.36,7.36,7.36-3.29,7.36-7.36c-.01-4.07-3.3-7.36-7.36-7.36ZM10.03,0c5.54,0,10.03,4.49,10.03,10.03,0,2.29-.76,4.39-2.05,6.08l7,7-1.89,1.89-7.01-7.01c-1.68,1.29-3.79,2.05-6.08,2.05C4.49,20.04,0,15.55,0,10.03S4.49,0,10.03,0Z"></path>
</svg>
<svg class="search-trigger-close" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 22 22">
<title>Close Search</title>
<path fill-rule="evenodd" clip-rule="evenodd" fill="#fff" d="M3.64,1.2l-1.21-1.2L0,2.39l1.21,1.19,7.36,7.25-7.36,7.25-1.21,1.19,2.43,2.39,1.21-1.2,7.36-7.24,7.36,7.24,1.22,1.2,2.42-2.39-1.21-1.19-7.36-7.25,7.36-7.25,1.21-1.19-2.42-2.39-1.22,1.2-7.36,7.24L3.64,1.2Z"></path>
</svg>
</button>
<button id="mobile-hamburger" class="mobile-hamburger hamburger--squeeze" aria-label="Open Main Navigation" data-once="site-header-hamburger">
<span class="hamburger-box">
<span class="hamburger-inner"></span>
</span>
</button>
<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">
<ul class="menu m--menu m--main-menu" th:if="${primaryMenu != null and not #lists.isEmpty(primaryMenu.items)}">
<th:block th:each="item : ${primaryMenu.items}" th:if="${item.parent == null}">
<!-- Flat item -->
<li class="megamenu menu-item" th:if="${#lists.isEmpty(item.children)}">
<div class="link-arrow-wrapper">
<a th:href="${item.url}" th:text="${item.label}">Menu Item</a>
</div>
</li>
<!-- Expanded item (has children) -->
<li class="megamenu menu-item menu-item--expanded" th:if="${not #lists.isEmpty(item.children)}">
<div class="link-arrow-wrapper">
<a th:href="${item.url}" th:text="${item.label}">Menu Item</a>
<button type="button" class="has-submenu arrow-toggle" aria-expanded="false" aria-haspopup="true" data-once="site-header-arrow">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 7" width="16" height="7">
<path fill-rule="evenodd" clip-rule="evenodd" fill="#881c1c" d="M7.88,7L15.75,0H0s7.88,7,7.88,7Z"></path>
</svg>
</button>
</div>
<div class="submenu-wrapper">
<button class="button-back">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 5 10" width="5" height="10">
<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#881c1c" points="0,5 5,0 5,10 "></polygon>
</svg> Back </button>
<span class="navigation-title" th:text="${item.label}">Menu Item</span>
<!-- Mobile Submenu Layout (Simple List) -->
<ul class="submenu mobile-only">
<li class="menu-item" th:each="child : ${item.children}">
<a th:href="${child.url}" th:text="${child.label}">Child Item</a>
</li>
</ul>
<!-- Mega Menu Content Layout -->
<div class="mega-menu-content desktop-only">
<!-- Column 1: Info (Title and Text) -->
<div class="mega-col-info">
<h3 th:text="${item.label}">Về Bệnh viện</h3>
<p th:if="${item.label == 'Về Bệnh viện' or item.label == 'VỀ BỆNH VIỆN'}" style="text-transform: math-auto;">Bệnh viện Đột quỵ Quốc tế tự hào là đơn vị tiên phong trong việc cung cấp dịch vụ khám chữa bệnh chất lượng cao, mang lại sự tin cậy và an tâm cho bệnh nhân.</p>
<p th:if="${item.label == 'Chuyên khoa' or item.label == 'CHUYÊN KHOA'}" style="text-transform: math-auto;">Khám phá các chuyên khoa hàng đầu với đội ngũ bác sĩ chuyên môn cao, trang thiết bị y tế hiện đại đạt tiêu chuẩn quốc tế.</p>
<p th:if="${item.label != 'Về Bệnh viện' and item.label != 'VỀ BỆNH VIỆN' and item.label != 'Chuyên khoa' and item.label != 'CHUYÊN KHOA'}" style="text-transform: math-auto;">Khám phá thêm thông tin chi tiết về các dịch vụ, chuyên gia và hoạt động của chúng tôi để bảo vệ sức khỏe của bạn.</p>
</div>
<!-- Column 2: The actual Submenu Links -->
<div class="mega-col-links">
<ul class="submenu">
<li class="menu-item" th:each="child : ${item.children}">
<a th:href="${child.url}" th:text="${child.label}">Child Item</a>
</li>
</ul>
</div>
<!-- Column 3: Featured Image -->
<div class="mega-col-image">
<!-- Try to use a hospital-like image if we can, or fallback to logo -->
<img th:src="@{/theme-assets/umass/images/logo.png}" alt="Featured Image" style="object-fit: contain; background: white; padding: 20px;"/>
</div>
</div>
<!-- End Mega Menu Layout -->
</div>
</li>
</th:block>
</ul>
</nav>
</div>
</div>
<button id="search-drawer-trigger" aria-label="Open Search" data-once="header-search">
<svg class="search-trigger-open" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 25 25">
<title>Open Search</title>
<path fill-rule="evenodd" clip-rule="evenodd" fill="#fff" d="M10.03,2.67c-4.07,0-7.36,3.29-7.36,7.36s3.29,7.36,7.36,7.36,7.36-3.29,7.36-7.36c-.01-4.07-3.3-7.36-7.36-7.36ZM10.03,0c5.54,0,10.03,4.49,10.03,10.03,0,2.29-.76,4.39-2.05,6.08l7,7-1.89,1.89-7.01-7.01c-1.68,1.29-3.79,2.05-6.08,2.05C4.49,20.04,0,15.55,0,10.03S4.49,0,10.03,0Z"></path>
</svg>
<svg class="search-trigger-close" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 22 22">
<title>Close Search</title>
<path fill-rule="evenodd" clip-rule="evenodd" fill="#fff" d="M3.64,1.2l-1.21-1.2L0,2.39l1.21,1.19,7.36,7.25-7.36,7.25-1.21,1.19,2.43,2.39,1.21-1.2,7.36-7.24,7.36,7.24,1.22,1.2,2.42-2.39-1.21-1.19-7.36-7.25,7.36-7.25,1.21-1.19-2.42-2.39-1.22,1.2-7.36,7.24L3.64,1.2Z"></path>
</svg>
</button>
<button id="mobile-hamburger" class="mobile-hamburger hamburger--squeeze" aria-label="Open Main Navigation" data-once="site-header-hamburger">
<span class="hamburger-box">
<span class="hamburger-inner"></span>
</span>
</button>
</div>
</section>
<div data-component-id="umass_base:header-search">
@@ -351,6 +355,7 @@
</button>
</div>
</div>
</div>
</div>
</div>
</header>