update backgrounnd video for header.html

This commit is contained in:
NAS\NASPC
2026-06-05 09:49:06 +07:00
parent 1fd3b689c8
commit 109c09d2a3
6 changed files with 135 additions and 74 deletions
@@ -37,8 +37,8 @@
<nav aria-label="Social media links">
<ul class="social-media-links--platforms platforms">
<li>
<a href="https://www.facebook.com/UMassAmherst/" class="ext" target="_blank"
rel="noopener noreferrer" aria-label="Facebook (opens in new window)">
<a href="#" class="ext" target="_blank" rel="noopener noreferrer"
aria-label="Facebook (opens in new window)">
<svg height="16" viewBox="0 0 16 16" width="16" aria-hidden="true" focusable="false">
<path
d="m19.9593333 5h-14.0853333c-.48269687 0-.874.39130313-.874.874v14.0853333c0 .4826969.39130313.874.874.874h7.5835333v-6.1230666h-2.0564333v-2.3965334h2.0564333v-1.7625666c0-2.04503337 1.2489334-3.15843337 3.0735667-3.15843337.6158056-.00219435 1.23127.02930829 1.8436333.09436667v2.13623333h-1.2616c-.9899 0-1.1811666.47119997-1.1811666 1.16343337v1.5263333h2.3731l-.3090667 2.3965333h-2.0640333v6.1237h4.0273666c.4826969 0 .874-.3913031.874-.874v-14.0853333c0-.48269687-.3913031-.874-.874-.874z"
@@ -71,8 +71,8 @@
</a>
</li>
<li>
<a href="https://www.instagram.com/umass/" class="ext" target="_blank"
rel="noopener noreferrer" aria-label="Instagram (opens in new window)">
<a href="#" class="ext" target="_blank" rel="noopener noreferrer"
aria-label="Instagram (opens in new window)">
<svg height="16" viewBox="0 0 16 16" width="16" aria-hidden="true" focusable="false">
<path
d="m12.9166667 5c-2.1666667 0-2.4166667 0-3.25000003.08333333-.83333334 0-1.41666667.16666667-1.91666667.33333334-.5.16666666-1 .5-1.41666667.91666666-.41666666.41666667-.75.91666667-.91666666 1.41666667-.16666667.5-.33333334 1.08333333-.33333334 1.91666667-.08333333.83333333-.08333333 1.08333333-.08333333 3.25000003 0 2.1666666 0 2.4166666.08333333 3.25 0 .8333333.16666667 1.4166666.33333334 1.9166666.16666666.5.5 1 .91666666 1.4166667.41666667.4166667.91666667.75 1.41666667.9166667.5.1666666 1.08333333.3333333 1.91666667.3333333.83333333 0 1.08333333.0833333 3.25000003.0833333 2.1666666 0 2.4166666 0 3.25-.0833333.8333333 0 1.4166666-.1666667 1.9166666-.3333333.5-.1666667 1-.5 1.4166667-.9166667s.75-.9166667.9166667-1.4166667c.1666666-.5.3333333-1.0833333.3333333-1.9166666 0-.8333334.0833333-1.0833334.0833333-3.25 0-2.1666667 0-2.4166667-.0833333-3.25000003 0-.83333334-.1666667-1.41666667-.3333333-1.91666667-.1666667-.5-.5-1-.9166667-1.41666667-.4166667-.41666666-.9166667-.75-1.4166667-.91666666-.5-.16666667-1.0833333-.33333334-1.9166666-.33333334-.8333334-.08333333-1.0833334-.08333333-3.25-.08333333m0 1.41666667c2.0833333 0 2.3333333 0 3.1666666.08333333.75 0 1.1666667.16666667 1.5.25.3333334.16666667.6666667.33333333.9166667.58333333s.4166667.58333334.5833333.91666667c.0833334.25.25.66666667.25 1.5 0 .8333333.0833334 1.0833333.0833334 3.25 0 2.0833333 0 2.3333333-.0833334 3.1666667 0 .75-.1666666 1.1666666-.25 1.5-.1666666.3333333-.3333333.6666666-.5833333.9166666s-.5.4166667-.9166667.5833334c-.25.0833333-.6666666.25-1.5.25-.8333333 0-1.0833333.0833333-3.1666666.0833333-2.0833334 0-2.3333334 0-3.1666667-.0833333-.75 0-1.16666667-.1666667-1.5-.25-.33333333-.1666667-.66666667-.3333334-.91666667-.5833334s-.41666666-.5833333-.58333333-.9166666c-.08333333-.25-.25-.6666667-.25-1.5 0-.8333334-.08333333-1.0833334-.08333333-3.1666667s0-2.3333333.08333333-3.25c0-.75.16666667-1.16666667.25-1.5.16666667-.33333333.33333333-.66666667.58333333-.91666667s.5-.41666666.91666667-.58333333c.25-.08333333.66666667-.25 1.5-.25.8333333-.08333333 1.0833333-.08333333 3.1666667-.08333333m0 9.16666663c-1.4166667 0-2.6666667-1.1666666-2.6666667-2.6666666s1.1666667-2.6666667 2.6666667-2.6666667 2.6666666 1.1666667 2.6666666 2.6666667-1.25 2.6666666-2.6666666 2.6666666m0-6.74999997c-2.25 0-4.08333337 1.83333337-4.08333337 4.08333337s1.83333337 4.0833333 4.08333337 4.0833333 4.0833333-1.8333333 4.0833333-4.0833333-1.8333333-4.08333337-4.0833333-4.08333337m5.1666666-.16666666c0 .5-.4166666.91666666-.9166666.91666666s-.9166667-.41666666-.9166667-.91666666.4166667-.91666667.9166667-.91666667.9166666.41666667.9166666.91666667"
@@ -93,8 +93,8 @@
</a>
</li>
<li>
<a href="https://www.snapchat.com/add/umassamherst" class="ext" target="_blank"
rel="noopener noreferrer" aria-label="Snapchat (opens in new window)">
<a href="#" class="ext" target="_blank" rel="noopener noreferrer"
aria-label="Snapchat (opens in new window)">
<svg height="17" viewBox="0 0 18 17" width="18" aria-hidden="true" focusable="false">
<path
d="m12.8333333 20.3333333c-.0833333 0-.0833333 0-.1666666 0h-.0833334c-1.0833333 0-1.6666666-.3333333-2.25-.75-.41666663-.3333333-.74999997-.5833333-1.16666663-.5833333-.25 0-.41666667-.0833333-.66666667-.0833333-.33333333 0-.66666667.0833333-.91666667.0833333-.16666666 0-.33333333.0833333-.41666666.0833333-.33333334 0-.5-.25-.5-.4166666 0-.1666667-.08333334-.25-.08333334-.4166667 0-.0833333-.08333333-.25-.08333333-.3333333-1.33333333-.25-2.08333333-.5-2.25-1-.08333333 0-.08333333-.0833334-.08333333-.1666667 0-.25.16666666-.4166667.41666666-.5 2.25-.3333333 3.33333334-2.75 3.33333334-2.8333333.08333333-.25.16666666-.4166667.08333333-.5833334-.08333333-.1666666-.58333333-.3333333-.91666667-.4166666-.08333333 0-.16666666-.0833334-.25-.0833334-.83333333-.3333333-1-.75-.91666666-1.0833333.08333333-.5.83333333-.75 1.25-.5833333.33333333.1666666.58333333.1666666.75.1666666h.25c0-.0833333 0-.25 0-.3333333-.08333334-1.16666667-.25-2.66666667.16666666-3.5 1.16666667-2.66666667 3.66666667-2.83333333 4.33333337-2.83333333h.3333333c.75 0 3.1666667.16666666 4.3333333 2.83333333.4166667.91666667.3333334 2.33333333.25 3.5v.0833333.25h.1666667c.1666667 0 .4166667-.0833333.6666667-.1666666.1666666-.0833334.25-.0833334.4166666-.0833334.1666667 0 .25 0 .4166667.0833334.3333333.0833333.5833333.4166666.5833333.6666666 0 .4166667-.3333333.6666667-.9166666.9166667-.0833334 0-.1666667.0833333-.25.0833333-.3333334.0833334-.8333334.25-.9166667.5-.0833333.1666667 0 .3333334.0833333.5.0833334.25 1.0833334 2.5 3.25 2.8333334.25 0 .4166667.25.4166667.5 0 .0833333 0 .1666666-.0833333.1666666-.1666667.4166667-.9166667.75-2.25 1 0 .0833334-.0833334.25-.0833334.3333334 0 .1666666-.0833333.25-.0833333.4166666-.0833333.25-.25.4166667-.5.4166667-.0833333 0-.25 0-.4166667-.0833333-.25-.0833334-.5-.0833334-.9166666-.0833334-.1666667 0-.4166667 0-.6666667.0833334-.4166667.0833333-.75.3333333-1.1666667.5833333-.6666666.5833333-1.5.8333333-2.5.8333333"
@@ -145,48 +145,46 @@
</li>
<li class="menu-item menu-item--expanded">
<span class="navigation-title">Resources</span>
<span class="navigation-title">Thông tin</span>
<div class="submenu-wrapper">
<ul class="submenu">
<li class="menu-item">
<a href="https://sisvietnam.vn/registrar/academic-calendar">Academic Calendar</a>
<a href="#">Lịch khám bệnh</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/admissions/visit/visitor-info">Campus Maps</a>
<a href="#">Sơ đồ bệnh viện</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/peoplefinder/">People Finder</a>
<a href="#">Tìm bác sĩ</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/policy/">Policies</a>
<a href="#">Chính sách & Quy định</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/atoz" title="A-Z Directory"
data-drupal-link-system-path="node/3931">Sites A-Z Directory</a>
<a href="#">Chuyên khoa & Dịch vụ</a>
</li>
</ul>
</div>
</li>
<li class="menu-item menu-item--expanded">
<span class="navigation-title">Connect</span>
<span class="navigation-title">Kết nối</span>
<div class="submenu-wrapper">
<ul class="submenu">
<li class="menu-item">
<a href="https://www.umassalumni.com/">Alumni</a>
<a href="#">Tuyển dụng</a>
</li>
<li class="menu-item">
<a href="https://umassathletics.com/">Athletics</a>
<a href="#">Tin tức & Sự kiện</a>
</li>
<li class="menu-item">
<a href="https://www.uma-foundation.org/">Giving</a>
<a href="#">Hoạt động xã hội</a>
</li>
<li class="menu-item">
<a href="https://www.library.umass.edu/">Libraries</a>
<a href="#">Thư viện y học</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/contact-us"
data-drupal-link-system-path="node/256">Contact Us</a>
<a href="#">Liên hệ</a>
</li>
</ul>
</div>
@@ -3,11 +3,11 @@
<style>
/* Fix logo visibility on dark background with Glow effect */
[data-component-id="umass_base:header-branding"] {
[data-component-id="umass_base:site-header"] [data-component-id="umass_base:header-branding"] {
position: absolute;
top: 20px;
left: 20px;
z-index: 9999;
z-index: 99;
}
[data-component-id="umass_base:site-header"] {
@@ -73,7 +73,7 @@
<nav data-component-id="umass_base:header-socials">
<ul class="social-media-links--platforms platforms ally-focus-within">
<li>
<a class="ext" href="https://www.facebook.com/UMassAmherst/" target="_blank" rel="noopener noreferrer">
<a class="ext" href="#" target="_blank" rel="noopener noreferrer">
<svg aria-hidden="true" focusable="false" viewBox="0 0 17 17">
<title>Find UMass Amherst on Facebook</title>
<path fill-rule="evenodd" fill="currentColor"
@@ -83,7 +83,7 @@
</a>
</li>
<li>
<a class="ext" href="https://www.instagram.com/umass/" target="_blank" rel="noopener noreferrer">
<a class="ext" href="#" target="_blank" rel="noopener noreferrer">
<!--?xml version="1.0" encoding="UTF-8"?-->
<svg aria-hidden="true" focusable="false" viewBox="0 0 17 20">
<title>Find UMass Amherst on Instagram</title>
@@ -94,8 +94,7 @@
</a>
</li>
<li>
<a class="ext" href="https://www.snapchat.com/add/umassamherst" target="_blank"
rel="noopener noreferrer">
<a class="ext" href="#" target="_blank" rel="noopener noreferrer">
<svg aria-hidden="true" focusable="false" viewBox="0 0 17 17">
<title>Add UMass Amherst on Snapchat</title>
<path
@@ -156,26 +155,22 @@
<ul class="submenu">
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/prospective-students"
data-drupal-link-system-path="node/42831">Bệnh nhân</a>
<a href="#" data-drupal-link-system-path="node/42831">Bệnh nhân</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/current-students"
title="Click here for info for Người nhà bệnh nhân"
<a href="#" title="Click here for info for Người nhà bệnh nhân"
data-drupal-link-system-path="node/61">Người nhà bệnh nhân</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/faculty-and-staff"
title="Click here for info for Bác sĩ / Chuyên gia y tế"
<a href="#" title="Click here for info for Bác sĩ / Chuyên gia y tế"
data-drupal-link-system-path="node/66">Bác sĩ / Chuyên gia y tế</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/parents-and-families"
title="Click here for info for Khách hàng Doanh nghiệp"
<a href="#" title="Click here for info for Khách hàng Doanh nghiệp"
data-drupal-link-system-path="node/81">Khách hàng Doanh nghiệp</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/hr/careers" title="Info for Đối tác">Đối tác</a>
<a href="#" title="Info for Đối tác">Đối tác</a>
</li>
</ul>
@@ -184,22 +179,22 @@
</div>
</li>
<li class="menu-item">
<a href="https://www.umassalumni.com/" title="UMass Amherst Alumni Association">Alumni</a>
<a href="#" title="UMass Amherst Alumni Association">Alumni</a>
</li>
<li class="menu-item">
<a href="https://umassathletics.com/" title="UMass Amherst Athletics">Athletics</a>
<a href="#" title="UMass Amherst Athletics">Athletics</a>
</li>
<li class="menu-item">
<a href="https://www.uma-foundation.org/" title="Giving to UMass Amherst">Giving</a>
<a href="#" title="Giving to UMass Amherst">Giving</a>
</li>
<li class="menu-item">
<a href="https://www.library.umass.edu/">Libraries</a>
<a href="#">Libraries</a>
</li>
@@ -239,8 +234,8 @@
<div class="f--field f--button">
<a href="https://www.uma-foundation.org/" class="button-primary button-context-light "
aria-label="Give" data-component-id="umass_base:button">
<a href="#" class="button-primary button-context-light " aria-label="Give"
data-component-id="umass_base:button">
<span class="button-text">
@@ -1093,8 +1088,8 @@
<div class="f--field f--button">
<a href="https://www.uma-foundation.org/" class="button-primary button-context-light "
aria-label="Give" data-component-id="umass_base:button">
<a href="#" class="button-primary button-context-light " aria-label="Give"
data-component-id="umass_base:button">
<span class="button-text">
@@ -1167,26 +1162,22 @@
<ul class="submenu">
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/prospective-students"
data-drupal-link-system-path="node/42831">Bệnh nhân</a>
<a href="#" data-drupal-link-system-path="node/42831">Bệnh nhân</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/current-students"
title="Click here for info for Người nhà bệnh nhân"
<a href="#" title="Click here for info for Người nhà bệnh nhân"
data-drupal-link-system-path="node/61">Người nhà bệnh nhân</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/faculty-and-staff"
title="Click here for info for Bác sĩ / Chuyên gia y tế"
<a href="#" title="Click here for info for Bác sĩ / Chuyên gia y tế"
data-drupal-link-system-path="node/66">Bác sĩ / Chuyên gia y tế</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/parents-and-families"
title="Click here for info for Khách hàng Doanh nghiệp"
<a href="#" title="Click here for info for Khách hàng Doanh nghiệp"
data-drupal-link-system-path="node/81">Khách hàng Doanh nghiệp</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/hr/careers" title="Info for Đối tác">Đối tác</a>
<a href="#" title="Info for Đối tác">Đối tác</a>
</li>
</ul>
@@ -1195,22 +1186,22 @@
</div>
</li>
<li class="menu-item">
<a href="https://www.umassalumni.com/" title="UMass Amherst Alumni Association">Alumni</a>
<a href="#" title="UMass Amherst Alumni Association">Alumni</a>
</li>
<li class="menu-item">
<a href="https://umassathletics.com/" title="UMass Amherst Athletics">Athletics</a>
<a href="#" title="UMass Amherst Athletics">Athletics</a>
</li>
<li class="menu-item">
<a href="https://www.uma-foundation.org/" title="Giving to UMass Amherst">Giving</a>
<a href="#" title="Giving to UMass Amherst">Giving</a>
</li>
<li class="menu-item">
<a href="https://www.library.umass.edu/">Libraries</a>
<a href="#">Libraries</a>
</li>
@@ -1222,8 +1213,7 @@
<nav data-component-id="umass_base:header-socials">
<ul class="social-media-links--platforms platforms ally-focus-within">
<li>
<a class="ext" href="https://www.facebook.com/UMassAmherst/" target="_blank"
rel="noopener noreferrer">
<a class="ext" href="#" target="_blank" rel="noopener noreferrer">
<svg aria-hidden="true" focusable="false" viewBox="0 0 17 17">
<title>Find UMass Amherst on Facebook</title>
<path fill-rule="evenodd" fill="currentColor"
@@ -1233,7 +1223,7 @@
</a>
</li>
<li>
<a class="ext" href="https://www.instagram.com/umass/" target="_blank" rel="noopener noreferrer">
<a class="ext" href="#" target="_blank" rel="noopener noreferrer">
<!--?xml version="1.0" encoding="UTF-8"?-->
<svg aria-hidden="true" focusable="false" viewBox="0 0 17 20">
<title>Find UMass Amherst on Instagram</title>
@@ -1244,8 +1234,7 @@
</a>
</li>
<li>
<a class="ext" href="https://www.snapchat.com/add/umassamherst" target="_blank"
rel="noopener noreferrer">
<a class="ext" href="#" target="_blank" rel="noopener noreferrer">
<svg aria-hidden="true" focusable="false" viewBox="0 0 17 17">
<title>Add UMass Amherst on Snapchat</title>
<path
@@ -1285,7 +1274,7 @@
<div data-component-id="umass_base:header-search">
<div id="search-flyout-container">
<div class="search-flyout">
<div data-component-id="umass_base:header-branding">
<div data-component-id="umass_base:header-branding" style="visibility: hidden;">
<a href="https://sisvietnam.vn/">
<img class="whitetext" src="/images/LogoSIS.svg" alt="SIS Vietnam Logo">
<img class="redtext" src="/images/LogoSIS.svg" alt="SIS Vietnam Logo">
@@ -134,10 +134,8 @@
<div class="c--component c--homepage-hero">
<div class="slides-container">
<div class="image-video-container has-video">
<img
src="./UMass Amherst _ UMass Amherst_files/2025 Undergraduate Commencement Students5.jpg"
alt="Graduating students celebrate at McGuirk Stadium prior to 2025 Undergraduate Commencement"
srcset="/sites/default/files/styles/1_1_1920x1920/public/2025-05/2025%20Undergraduate%20Commencement%20Students5.jpg?h=89bdbb65&amp;itok=eE9PBXTr 1920w">
<img src="/images/mainpage_slider/BANNER-LINNC-BAC-CUONG-05-scaled.jpg"
alt="Graduating students celebrate at McGuirk Stadium prior to 2025 Undergraduate Commencement">
<style>
.my-ambient-slider {
position: absolute;
@@ -182,6 +180,35 @@
</div>
</div>
</div>
<div class="f--ambient-video">
<video role="presentation" tabindex="-1" loop="" autoplay="" playsinline="" muted="">
<source
src="/images/YTDown_YouTube_Benh-vien-Da-Khoa-Quoc-Te-SIS-Can-Tho-Th_Media_pcz597Ou5U_001_1080p (online-video-cutter.com).mp4"
type="video/mp4">
</video>
</div>
<div class="video-controls" data-once="ambientVideo">
<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>
@@ -236,11 +263,11 @@
<div class="submenu-wrapper">
<ul class="submenu">
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/prospective-students">Bệnh
<a href="#">Bệnh
nhân</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/current-students">Người nhà
<a href="#">Người nhà
bệnh nhân</a>
</li>
<li class="menu-item">
@@ -248,11 +275,11 @@
</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/faculty-and-staff">Khách
<a href="#">Khách
hàng Doanh nghiệp</a>
</li>
<li class="menu-item">
<a href="https://www.umassalumni.com/">Đối tác</a>
<a href="#">Đối tác</a>
</li>
</ul>
@@ -262,11 +289,11 @@
<div class="submenu-wrapper-desktop">
<ul class="submenu">
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/prospective-students">Bệnh
<a href="#">Bệnh
nhân</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/current-students">Người nhà
<a href="#">Người nhà
bệnh nhân</a>
</li>
<li class="menu-item">
@@ -274,11 +301,11 @@
/ Chuyên gia y tế</a>
</li>
<li class="menu-item">
<a href="https://sisvietnam.vn/gateway/info/faculty-and-staff">Khách hàng
<a href="#">Khách hàng
Doanh nghiệp</a>
</li>
<li class="menu-item">
<a href="https://www.umassalumni.com/">Đối tác</a>
<a href="#">Đối tác</a>
</li>
</ul>