fix: update UI styles, adjust swiper layout, and modify filter tab colors across template components
This commit is contained in:
File diff suppressed because one or more lines are too long
+2220
-793
File diff suppressed because it is too large
Load Diff
+2
-2
@@ -321,9 +321,9 @@ public class SwiperSliderPlugin {
|
||||
}
|
||||
|
||||
seedSlideTemplate("swiper-slide-gallery", "Swiper Slide (Gallery)", "<div class=\"swiper-slide max-w-[356px] !mr-2 lg:!mr-3 xl:!mr-4\" style=\"width: 356px; max-width: 100%;\"><div class=\"relative rounded-lg aspect-[3/2] overflow-hidden\"><img src=\"{{imageUrl}}\" alt=\"{{title}}\" class=\"absolute inset-0 w-full h-full object-cover\"></div></div>");
|
||||
seedSlideTemplate("swiper-slide-chung-chi", "Swiper Slide (Chứng chỉ/Thẻ)", "<div class=\"swiper-slide h-auto max-w-[288px] mr-2 lg:!mr-3 xl:!mr-4\" style=\"width: 288px; max-width: 100%;\"><a href=\"{{linkUrl}}\" class=\"group h-full flex flex-col items-start gap-y-4 lg:gap-y-5 rounded-2xl bg-white p-4 pb-5 shadow-sm transition-shadow hover:shadow-md border border-transparent hover:border-primary-100\"><div class=\"relative w-full aspect-square overflow-hidden rounded-xl\"><img src=\"{{imageUrl}}\" alt=\"{{title}}\" class=\"absolute aspect-square inset-0 size-full object-cover transition-transform duration-500 group-hover:scale-105\"></div><div class=\"flex flex-1 flex-col justify-between w-full\"><h3 class=\"heading-5 text-gray-900 group-hover:text-primary-600 transition-colors line-clamp-3\">{{title}}</h3></div></a></div>");
|
||||
seedSlideTemplate("swiper-slide-chung-chi", "Swiper Slide (Chứng chỉ/Thẻ)", "<div class=\"swiper-slide h-auto max-w-[288px] mr-2 lg:!mr-3 xl:!mr-4\" style=\"width: 288px; max-width: 100%;\"><a href=\"{{linkUrl}}\" class=\"group h-full flex flex-col items-start gap-y-4 lg:gap-y-5 rounded-2xl bg-white p-4 pb-5 shadow-sm transition-shadow hover:shadow-md border border-transparent hover:border-primary-100\"><div class=\"relative w-full aspect-square overflow-hidden rounded-xl\"><img src=\"{{imageUrl}}\" alt=\"{{title}}\" class=\"absolute aspect-square inset-0 size-full object-cover transition-transform duration-500 group-hover:scale-105\"></div><div class=\"flex flex-1 flex-col justify-between w-full\"><h3 class=\"heading-5 text-gray-900 transition-colors line-clamp-3\">{{title}}</h3></div></a></div>");
|
||||
seedSlideTemplate("swiper-slide-hinh-anh-thuc-hanh", "Swiper Slide (Hình ảnh lớn)", "<div class=\"swiper-slide max-w-[789px] !mr-2\" style=\"width: 789px; max-width: 100%;\"><div class=\"relative rounded-lg aspect-[789/460] overflow-hidden\"><img src=\"{{imageUrl}}\" alt=\"{{title}}\" class=\"absolute inset-0 w-full h-full object-cover\"></div></div>");
|
||||
seedSlideTemplate("swiper-slide-course-card", "Swiper Slide (Course Card)", "<div class=\"swiper-slide\" style=\"width: 261px; max-width: 100%;\"><article class=\"relative p-3 lg:p-4 bg-white rounded-lg border border-gray-100 group\" style=\"display: flex; flex-direction: column; gap: 14px; text-align: left;\"><a class=\"relative overflow-hidden rounded block\" style=\"aspect-ratio: 9/5;\" href=\"{{linkUrl}}\"><img alt=\"{{title}}\" class=\"object-cover h-full w-full\" src=\"{{imageUrl}}\"/><div class=\"absolute inset-0 w-full h-full bg-black/40 opacity-0 lg:group-hover:opacity-100 duration-300 ease-in-out\"></div></a><div class=\"px-1.5 w-full\" style=\"display: flex; flex-direction: column; gap: 14px;\"><div class=\"w-full space-y-1\"><a class=\"title-1 font-bold line-clamp-2 lg:group-hover:text-primary-600 duration-300 ease-in-out block\" style=\"font-size: 20px; height: 54px; line-height: 1.5;\" href=\"{{linkUrl}}\">{{title}}</a><div class=\"body-3 text-gray-700 line-clamp-3\" style=\"font-size: 14px; height: 64px; line-height: 1.5; overflow: hidden;\">{{description}}</div></div><div class=\"w-full h-px bg-gray-100\"></div><div class=\"flex justify-between items-center w-full\"><div class=\"flex gap-4 items-center self-stretch my-auto\"><div class=\"flex gap-1.5 items-center self-stretch my-auto\"><svg class=\"lucide lucide-calendar size-3.5\" fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"14\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M8 2v4\"></path><path d=\"M16 2v4\"></path><rect height=\"18\" rx=\"2\" width=\"18\" x=\"3\" y=\"4\"></rect><path d=\"M3 10h18\"></path></svg><time class=\"self-stretch body-3 my-auto\" style=\"font-size: 14px;\">{{date}}</time></div><span class=\"text-primary-600 font-bold border-b-2 border-primary-600\" style=\"font-size: 14px;\">({{badge}})</span></div></div></div><div class=\"btn\"><a class=\"p-2 lg:p-3 w-full text-white bg-primary-600 rounded lg:hover:bg-primary-300 duration-300 ease-in-out block mt-2\" href=\"{{linkUrl}}\"><div class=\"flex items-center gap-0.5 justify-center w-full font-bold\" style=\"font-size: 18px;\"><span>{{price}}</span></div></a></div></article></div>");
|
||||
seedSlideTemplate("swiper-slide-course-card", "Swiper Slide (Course Card)", "<div class=\"swiper-slide\" style=\"width: 261px; max-width: 100%;\"><article class=\"relative p-3 lg:p-4 bg-white rounded-lg border border-gray-100 group\" style=\"display: flex; flex-direction: column; gap: 14px; text-align: left;\"><a class=\"relative overflow-hidden rounded block\" style=\"aspect-ratio: 9/5;\" href=\"{{linkUrl}}\"><img alt=\"{{title}}\" class=\"object-cover h-full w-full\" src=\"{{imageUrl}}\"/><div class=\"absolute inset-0 w-full h-full bg-black/40 opacity-0 lg:group-hover:opacity-100 duration-300 ease-in-out\"></div></a><div class=\"px-1.5 w-full\" style=\"display: flex; flex-direction: column; gap: 14px;\"><div class=\"w-full space-y-1\"><a class=\"title-1 font-bold line-clamp-2 lg: duration-300 ease-in-out block\" style=\"font-size: 20px; height: 54px; line-height: 1.5;\" href=\"{{linkUrl}}\">{{title}}</a><div class=\"body-3 text-gray-700 line-clamp-3\" style=\"font-size: 14px; height: 64px; line-height: 1.5; overflow: hidden;\">{{description}}</div></div><div class=\"w-full h-px bg-gray-100\"></div><div class=\"flex justify-between items-center w-full\"><div class=\"flex gap-4 items-center self-stretch my-auto\"><div class=\"flex gap-1.5 items-center self-stretch my-auto\"><svg class=\"lucide lucide-calendar size-3.5\" fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\" width=\"14\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M8 2v4\"></path><path d=\"M16 2v4\"></path><rect height=\"18\" rx=\"2\" width=\"18\" x=\"3\" y=\"4\"></rect><path d=\"M3 10h18\"></path></svg><time class=\"self-stretch body-3 my-auto\" style=\"font-size: 14px;\">{{date}}</time></div><span class=\"text-primary-600 font-bold border-b-2 border-primary-600\" style=\"font-size: 14px;\">({{badge}})</span></div></div></div><div class=\"btn\"><a class=\"p-2 lg:p-3 w-full text-white bg-primary-600 rounded lg:hover:bg-primary-300 duration-300 ease-in-out block mt-2\" href=\"{{linkUrl}}\"><div class=\"flex items-center gap-0.5 justify-center w-full font-bold\" style=\"font-size: 18px;\"><span>{{price}}</span></div></a></div></article></div>");
|
||||
}
|
||||
|
||||
private void seedSlideTemplate(String slug, String name, String html) {
|
||||
|
||||
@@ -670,30 +670,30 @@ figure.table table tr:hover {
|
||||
========================================================================== */
|
||||
|
||||
/* 1. Force parent elements containing centered images to text-align: center !important */
|
||||
p[style*="text-align: center"],
|
||||
p[style*="text-align:center"],
|
||||
div[style*="text-align: center"],
|
||||
div[style*="text-align:center"],
|
||||
figure[style*="text-align: center"],
|
||||
figure[style*="text-align:center"],
|
||||
section[style*="text-align: center"],
|
||||
section[style*="text-align:center"],
|
||||
p[style*='text-align: center'],
|
||||
p[style*='text-align:center'],
|
||||
div[style*='text-align: center'],
|
||||
div[style*='text-align:center'],
|
||||
figure[style*='text-align: center'],
|
||||
figure[style*='text-align:center'],
|
||||
section[style*='text-align: center'],
|
||||
section[style*='text-align:center'],
|
||||
.text-center,
|
||||
.ce-block--align-center {
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
/* 2. Parent containers auto-center if child img has auto-margin or center styles in element.style */
|
||||
p:has(> img[style*="margin-left: auto"]),
|
||||
p:has(> img[style*="margin-left:auto"]),
|
||||
div:has(> img[style*="margin-left: auto"]),
|
||||
div:has(> img[style*="margin-left:auto"]),
|
||||
figure:has(> img[style*="margin-left: auto"]),
|
||||
figure:has(> img[style*="margin-left:auto"]),
|
||||
p:has(> img[style*="text-align: center"]),
|
||||
p:has(> img[style*="text-align:center"]),
|
||||
div:has(> img[style*="text-align: center"]),
|
||||
div:has(> img[style*="text-align:center"]),
|
||||
p:has(> img[style*='margin-left: auto']),
|
||||
p:has(> img[style*='margin-left:auto']),
|
||||
div:has(> img[style*='margin-left: auto']),
|
||||
div:has(> img[style*='margin-left:auto']),
|
||||
figure:has(> img[style*='margin-left: auto']),
|
||||
figure:has(> img[style*='margin-left:auto']),
|
||||
p:has(> img[style*='text-align: center']),
|
||||
p:has(> img[style*='text-align:center']),
|
||||
div:has(> img[style*='text-align: center']),
|
||||
div:has(> img[style*='text-align:center']),
|
||||
p:has(> img.aligncenter),
|
||||
div:has(> img.aligncenter),
|
||||
figure:has(> img.aligncenter) {
|
||||
@@ -701,20 +701,20 @@ figure:has(> img.aligncenter) {
|
||||
}
|
||||
|
||||
/* 3. Center Aligned Images (Works for both block and inline-block) */
|
||||
p[style*="text-align: center"] img,
|
||||
p[style*="text-align:center"] img,
|
||||
div[style*="text-align: center"] img,
|
||||
div[style*="text-align:center"] img,
|
||||
figure[style*="text-align: center"] img,
|
||||
figure[style*="text-align:center"] img,
|
||||
section[style*="text-align: center"] img,
|
||||
section[style*="text-align:center"] img,
|
||||
[style*="text-align: center"] > img,
|
||||
[style*="text-align:center"] > img,
|
||||
img[style*="text-align: center"],
|
||||
img[style*="text-align:center"],
|
||||
img[style*="margin-left: auto"][style*="margin-right: auto"],
|
||||
img[style*="margin-left:auto"][style*="margin-right:auto"],
|
||||
p[style*='text-align: center'] img,
|
||||
p[style*='text-align:center'] img,
|
||||
div[style*='text-align: center'] img,
|
||||
div[style*='text-align:center'] img,
|
||||
figure[style*='text-align: center'] img,
|
||||
figure[style*='text-align:center'] img,
|
||||
section[style*='text-align: center'] img,
|
||||
section[style*='text-align:center'] img,
|
||||
[style*='text-align: center'] > img,
|
||||
[style*='text-align:center'] > img,
|
||||
img[style*='text-align: center'],
|
||||
img[style*='text-align:center'],
|
||||
img[style*='margin-left: auto'][style*='margin-right: auto'],
|
||||
img[style*='margin-left:auto'][style*='margin-right:auto'],
|
||||
img.aligncenter,
|
||||
figure.aligncenter,
|
||||
figure.aligncenter img,
|
||||
@@ -729,16 +729,16 @@ div.text-center img {
|
||||
}
|
||||
|
||||
/* Left Aligned Images */
|
||||
p[style*="text-align: left"] img,
|
||||
p[style*="text-align:left"] img,
|
||||
div[style*="text-align: left"] img,
|
||||
div[style*="text-align:left"] img,
|
||||
figure[style*="text-align: left"] img,
|
||||
figure[style*="text-align:left"] img,
|
||||
[style*="text-align: left"] > img,
|
||||
[style*="text-align:left"] > img,
|
||||
img[style*="text-align: left"],
|
||||
img[style*="text-align:left"],
|
||||
p[style*='text-align: left'] img,
|
||||
p[style*='text-align:left'] img,
|
||||
div[style*='text-align: left'] img,
|
||||
div[style*='text-align:left'] img,
|
||||
figure[style*='text-align: left'] img,
|
||||
figure[style*='text-align:left'] img,
|
||||
[style*='text-align: left'] > img,
|
||||
[style*='text-align:left'] > img,
|
||||
img[style*='text-align: left'],
|
||||
img[style*='text-align:left'],
|
||||
img.alignleft,
|
||||
figure.alignleft,
|
||||
figure.alignleft img,
|
||||
@@ -749,16 +749,16 @@ figure.alignleft img,
|
||||
}
|
||||
|
||||
/* Right Aligned Images */
|
||||
p[style*="text-align: right"] img,
|
||||
p[style*="text-align:right"] img,
|
||||
div[style*="text-align: right"] img,
|
||||
div[style*="text-align:right"] img,
|
||||
figure[style*="text-align: right"] img,
|
||||
figure[style*="text-align:right"] img,
|
||||
[style*="text-align: right"] > img,
|
||||
[style*="text-align:right"] > img,
|
||||
img[style*="text-align: right"],
|
||||
img[style*="text-align:right"],
|
||||
p[style*='text-align: right'] img,
|
||||
p[style*='text-align:right'] img,
|
||||
div[style*='text-align: right'] img,
|
||||
div[style*='text-align:right'] img,
|
||||
figure[style*='text-align: right'] img,
|
||||
figure[style*='text-align:right'] img,
|
||||
[style*='text-align: right'] > img,
|
||||
[style*='text-align:right'] > img,
|
||||
img[style*='text-align: right'],
|
||||
img[style*='text-align:right'],
|
||||
img.alignright,
|
||||
figure.alignright,
|
||||
figure.alignright img,
|
||||
@@ -768,6 +768,14 @@ figure.alignright img,
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
@media (hover: hover) {
|
||||
.group-hover\:text-primary-600:is(:where(.group):hover *),
|
||||
.group:hover .group-hover\:text-primary-600,
|
||||
.group-hover\:text-primary-600 {
|
||||
color: var(--color-old-brick) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
5. Responsive Breakpoints — 3 Groups Only
|
||||
========================================================================== */
|
||||
@@ -1530,7 +1538,7 @@ Large Desktop (@media (min-width: 1366px)): Lines 1421 - 1481. */
|
||||
bottom: 0;
|
||||
left: 1rem;
|
||||
width: 1px;
|
||||
background-color: var(--color-primary, #007bff);
|
||||
background-color: var(--color-old-brick);
|
||||
}
|
||||
|
||||
.sis-timeline__entry {
|
||||
@@ -1545,7 +1553,7 @@ Large Desktop (@media (min-width: 1366px)): Lines 1421 - 1481. */
|
||||
width: 0.625rem;
|
||||
height: 0.625rem;
|
||||
border-radius: 50%;
|
||||
background-color: var(--color-primary, #007bff);
|
||||
background-color: var(--color-old-brick);
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
@@ -1557,7 +1565,7 @@ Large Desktop (@media (min-width: 1366px)): Lines 1421 - 1481. */
|
||||
.sis-timeline__date {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
color: var(--color-primary, #007bff);
|
||||
color: var(--color-old-brick);
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
@@ -1677,6 +1685,14 @@ Large Desktop (@media (min-width: 1366px)): Lines 1421 - 1481. */
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
@media (hover: hover) {
|
||||
.lg\:group-hover\:text-white:is(:where(.group):hover *) {
|
||||
color: var(--color-old-brick) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Larger Desktop (min-width: 1280px) */
|
||||
@media (min-width: 1280px) {
|
||||
.sis-timeline__grid {
|
||||
|
||||
@@ -67,15 +67,15 @@
|
||||
<div style="-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(51, 51, 51);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-weight:400;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">Với chức năng là cơ sở giảng dạy thực hành, đào tạo là một trong những hoạt động nòng cốt của Bệnh viện Đại học Y Dược TP. Hồ Chí Minh, nhằm tối ưu công tác đào tạo, Bệnh viện đa dạng hóa các loại hình đào tạo để đáp ứng các yêu cầu về đào tạo của nội bộ, của các cơ sở y tế khác và của học viên nước ngoài.Với nguồn nhân lực dồi dào và trình độ chuyên môn cao, các chuyên khoa lâm sàng và cận lâm sàng lớn mạnh, số lượng người bệnh đến khám và chữa bệnh tăng cao, Bệnh viện Đại học Y Dược TP. Hồ Chí Minh còn là nơi thực hành không những của nhân viên y tế Việt Nam, mà còn là sự lựa chọn của rất nhiều sinh viên các nước như: Nhật Bản, Úc, Hoa Kỳ, Thái Lan, CHLB Đức, Pháp, Bỉ, Áo, Đan Mạch, Ấn Độ, …</div>
|
||||
<div style="-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(51, 51, 51);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-weight:400;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">Ngoài ra, hình thức đào tạo theo hợp đồng/đào tạo theo nhiệm vụ chỉ đạo tuyến/đào tạo chuyển giao kỹ thuật và các khóa đào tạo chuyên môn nghiệp vụ khác của ngành y tế mà không thuộc hệ thống bằng cấp quốc gia cũng là một nhiệm vụ của Bệnh viện Đại học Y Dược TP. Hồ Chí Minh.</div>
|
||||
<div style="-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(51, 51, 51);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-weight:400;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">Sự phát triển liên tục của Bệnh viện Đại học Y Dược TP. Hồ Chí Minh nói chung và công tác đào tạo nói riêng, đã góp phần đáp ứng đáng kể nhu cầu bồi dưỡng kiến thức, giúp các Bệnh viện ứng dụng nhiều phương pháp, kỹ thuật mới trong khám, chữa bệnh, tăng cường chất lượng điều trị và chăm sóc người bệnh.</div>
|
||||
<div style="--tw-font-weight:700;-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(13, 113, 186);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;letter-spacing:normal;margin:0px 0px 4px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">
|
||||
<div style="--tw-font-weight:700;-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:var(--color-old-brick);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;letter-spacing:normal;margin:0px 0px 4px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">
|
||||
<strong>ĐỊNH HƯỚNG VỀ HOẠT ĐỘNG ĐÀO TẠO TRONG NHỮNG NĂM TỚI</strong>
|
||||
</div>
|
||||
<div style="--tw-font-weight:700;-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(13, 113, 186);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">
|
||||
<div style="--tw-font-weight:700;-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:var(--color-old-brick);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">
|
||||
<strong>Về đào tạo chuyên môn, nghiệp vụ cho viên chức của Bệnh viện:</strong>
|
||||
</div>
|
||||
<div style="-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(51, 51, 51);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-weight:400;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">Bệnh viện luôn có chương trình hỗ trợ cho nhân viên trong việc học tập chuyên môn nghiệp vụ và các khóa đào tạo chính quy. Ban Giám đốc định hướng mỗi Đơn vị sẽ tự xây dựng kế hoạch và lập dự toán kinh phí đào tạo cho nhân viên. Lãnh đạo Đơn vị sẽ tự quyết định quy mô và chi phí đào tạo cho nhân viên dựa trên định hướng phát triển chuyên môn. Phần kinh phí này sẽ được trích từ quỹ đào tạo và nghiên cứu khoa học của Bệnh viện. Chủ trương này giúp các Đơn vị chủ động hơn trong việc đào tạo nhân lực, phát triển chuyên môn của Đơn vị mình.</div>
|
||||
<div style="-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(51, 51, 51);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-weight:400;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">Ngoài những chương trình đào tạo trong nước, Bệnh viện tiếp tục tăng cường gửi viên chức đi đào tạo ở nước ngoài. Bên cạnh việc học hỏi nâng cao trình độ chuyên môn, đây cũng là cơ hội để mở rộng kết nối, hợp tác quốc tế tiến đến hội nhập.</div>
|
||||
<div style="--tw-font-weight:700;-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(13, 113, 186);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">
|
||||
<div style="--tw-font-weight:700;-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:var(--color-old-brick);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;letter-spacing:normal;margin:0px 0px 12px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">
|
||||
<strong>Về đào tạo chuyên môn, nghiệp vụ cho nhân sự thuộc các cơ sở y tế khác:</strong>
|
||||
</div>
|
||||
<div style="-webkit-text-stroke-width:0px;border-style:solid;border-width:0px;box-sizing:border-box;color:rgb(51, 51, 51);font-family:Roboto, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-size:16px;font-style:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-weight:400;letter-spacing:normal;margin:0px;orphans:2;padding:0px;text-align:justify;text-decoration-color:initial;text-decoration-style:initial;text-decoration-thickness:initial;text-indent:0px;text-transform:none;white-space:normal;widows:2;word-spacing:0px;">Phòng KHĐT cùng Đơn vị lập kế hoạch, dự trù kinh phí cho các lớp đào tạo với các hình thức như đào tạo y khoa liên tục (CME), hội nghị, hội thảo, lớp học, … Những chương trình này có thể tổ chức tại Bệnh viện hoặc tổ chức tại các địa điểm bên ngoài tùy theo nhu cầu thực tế để đưa hoạt động đào tạo thực sự trở thành một mũi nhọn, một đặc trưng của bệnh viện.</div>
|
||||
|
||||
@@ -174,7 +174,7 @@
|
||||
|
||||
</button>
|
||||
<button type="button" class="btn space-x-2 text-center label-3 w-[286px] !py-2 disabled:opacity-50 disabled:cursor-not-allowed text-white hover:opacity-90 transition-opacity" th:data-url="${doctor.bookingUrl != null and !doctor.bookingUrl.isEmpty() ? doctor.bookingUrl : '#'}" onclick="window.location.href=this.getAttribute('data-url')">
|
||||
<a href="tel:18001115" style="color: white; text-decoration: none; width: 100%; display: flex; flex-direction: row; gap: 10px; justify-content: center; align-items: center;">Liên hệ
|
||||
<a href="tel:18001115" style="color: white; text-decoration: none; width: 100%; display: flex; flex-direction: row; gap: 10px; justify-content: center; align-items: center;">Liên hệ - 1800.1115
|
||||
<svg class="text-white" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"></path></svg>
|
||||
</a>
|
||||
|
||||
|
||||
@@ -69,8 +69,8 @@
|
||||
</div>
|
||||
<div class="relative doctor-filter-select">
|
||||
<button type="button" class="w-full group rounded-lg cursor-pointer border label-3 bg-white flex justify-between items-center border-gray-200 lg:px-5 px-4 py-3 shadow lg:hover:border-primary-600 lg:duration-150" id="btn-specialty" aria-haspopup="listbox" aria-expanded="false" onclick="toggleDropdown('list-specialty')" style="height: 100%; background-color: var(--color-white);">
|
||||
<span id="text-specialty" class="text-gray-900 lg:group-hover:text-primary-600 lg:duration-150">--Theo chuyên khoa--</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down ml-2 duration-150 md:size-5 size-4 rotate-0 text-gray-900 lg:group-hover:text-primary-600 duration-150">
|
||||
<span id="text-specialty" class="text-gray-900 lg:duration-150">--Theo chuyên khoa--</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down ml-2 duration-150 md:size-5 size-4 rotate-0 text-gray-900 duration-150">
|
||||
<path d="m6 9 6 6 6-6"></path>
|
||||
</svg>
|
||||
</button>
|
||||
@@ -81,8 +81,8 @@
|
||||
</div>
|
||||
<div class="relative doctor-filter-select">
|
||||
<button type="button" class="w-full group rounded-lg cursor-pointer border label-3 bg-white flex justify-between items-center border-gray-200 lg:px-5 px-4 py-3 shadow lg:hover:border-primary-600 lg:duration-150" id="btn-gender" aria-haspopup="listbox" aria-expanded="false" onclick="toggleDropdown('list-gender')" style="height: 100%; background-color: var(--color-white);">
|
||||
<span id="text-gender" class="text-gray-900 lg:group-hover:text-primary-600 lg:duration-150">--Theo giới tính--</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down ml-2 duration-150 md:size-5 size-4 rotate-0 text-gray-900 lg:group-hover:text-primary-600 duration-150">
|
||||
<span id="text-gender" class="text-gray-900 lg:duration-150">--Theo giới tính--</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down ml-2 duration-150 md:size-5 size-4 rotate-0 text-gray-900 duration-150">
|
||||
<path d="m6 9 6 6 6-6"></path>
|
||||
</svg>
|
||||
</button>
|
||||
@@ -136,7 +136,7 @@
|
||||
</svg>
|
||||
</a>
|
||||
<a class="btn btn-outline-primary !inline-flex w-[149px] text-center !px-0 group items-center justify-center gap-1.5" style="text-decoration: none;" href="tel:18001115">
|
||||
<div class="text-white">Liên hệ</div>
|
||||
<div class="text-white">1800.1115</div>
|
||||
<svg class="text-white" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" />
|
||||
</svg>
|
||||
|
||||
@@ -753,7 +753,8 @@
|
||||
.posts-view-more-link:hover { background-color: #0369a1; color: #ffffff; transform: translateY(-1px); text-decoration: none; }
|
||||
</style>
|
||||
<div class="posts-view-more-wrap">
|
||||
<a th:href="${block.data['viewMoreUrl']}" class="posts-view-more-link">
|
||||
<!-- posts-view-more-link -->
|
||||
<a th:href="${block.data['viewMoreUrl']}" class="">
|
||||
Xem Thêm
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
|
||||
</a>
|
||||
@@ -766,7 +767,7 @@
|
||||
.global-filter-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; justify-content: flex-start; }
|
||||
.global-filter-tabs .tab-btn { padding: 8px 18px; border: none; background-color: #f1f5f9; color: #475569; font-size: 14px; font-weight: 600; border-radius: 6px; cursor: pointer; transition: all 0.2s ease; user-select: none; }
|
||||
.global-filter-tabs .tab-btn:hover { background-color: #e2e8f0; color: #0f172a; }
|
||||
.global-filter-tabs .tab-btn.active { background-color: #0284c7; color: #ffffff; }
|
||||
.global-filter-tabs .tab-btn.active { background-color: var(--color-old-brick); color: #ffffff; }
|
||||
</style>
|
||||
<div class="filter-tabs global-filter-tabs"
|
||||
th:data-configured-tabs="${(block.data['categoryFilter'] != null ? block.data['categoryFilter'] : '') + (block.data['tagFilter'] != null and !#strings.isEmpty(block.data['tagFilter']) ? (block.data['categoryFilter'] != null and !#strings.isEmpty(block.data['categoryFilter']) ? ',' : '') + block.data['tagFilter'] : '')}">
|
||||
@@ -1076,9 +1077,9 @@
|
||||
.card-thumb { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background-color: #e2e8f0; }
|
||||
.card-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.3s ease; }
|
||||
.news-card:hover .card-thumb img { transform: scale(1.05); }
|
||||
.year-badge { position: absolute; top: 10px; right: 10px; background-color: #0284c7; color: #ffffff; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 4px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }
|
||||
.year-badge { position: absolute; top: 10px; right: 10px; background-color: var(--color-old-brick); color: #ffffff; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 4px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }
|
||||
.card-body { padding: 16px 18px 20px; display: flex; flex-direction: column; flex-grow: 1; }
|
||||
.card-title { font-size: 14px; font-weight: 700; color: #0284c7; line-height: 1.45; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
|
||||
.card-title { font-size: 14px; font-weight: 700; color: var(--color-old-brick); line-height: 1.45; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
|
||||
.pagination { display: flex; justify-content: center; align-items: center; list-style: none; gap: 8px; margin-top: 20px; padding: 0; }
|
||||
.page-link { display: inline-flex; justify-content: center; align-items: center; min-width: 36px; height: 36px; padding: 0 10px; border-radius: 50%; border: 1px solid #e2e8f0; background-color: #ffffff; color: #64748b; text-decoration: none !important; font-size: 14px; font-weight: 500; transition: all 0.2s ease; cursor: pointer; user-select: none; }
|
||||
.page-link:hover { border-color: #0284c7; color: #0284c7; }
|
||||
@@ -1352,7 +1353,7 @@
|
||||
.news-section-v3 .featured-title {
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
color: #0284c7;
|
||||
color: var(--color-old-brick);
|
||||
line-height: 1.3;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
<!-- ====== ẢNH NỀN ====== -->
|
||||
<img
|
||||
class="static-fallback-image"
|
||||
src="http://localhost:8080/uploads/2026/07/198e5233-0e9f-4618-8111-32c4df8ae318.jpg"
|
||||
src="/uploads/2026/07/198e5233-0e9f-4618-8111-32c4df8ae318.jpg"
|
||||
th:alt="${page.title}"
|
||||
style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1"
|
||||
/>
|
||||
|
||||
@@ -394,7 +394,7 @@
|
||||
<section class="relative xl:py-12 md:py-8 py-4 bg-white">
|
||||
<div class="container">
|
||||
<h2 class="display-7 text-primary-600 text-center mb-4">Thành tích và thành tựu</h2>
|
||||
<div class="relative md:flex md:items-center">
|
||||
<div class="relative md:flex md:items-center flex-wrap">
|
||||
<button
|
||||
class="btn-navigation flex-shrink-0 mr-4 !relative top-1/2 -translate-y-1/2 z-10 md:size-[42px] size-[32px] items-center justify-center rounded-full btn-navigation-award-prev md:flex hidden"
|
||||
>
|
||||
@@ -636,13 +636,15 @@
|
||||
>
|
||||
<path d="m6 9 6 6 6-6"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<div
|
||||
class="swiper-pagination swiper-pagination-award space-x-[13px] !relative [&_.swiper-pagination-bullet-active]:!bg-primary-600 [&_.swiper-pagination-bullet-active]:!opacity-100 [&_.swiper-pagination-bullet-active]:before:opacity-100 mt-4 flex justify-center md:hidden [&_.swiper-pagination-bullet]:!relative [&_.swiper-pagination-bullet]:!bottom-[-8px] [&_.swiper-pagination-bullet]:before:content-[''] [&_.swiper-pagination-bullet]:before:size-[14px] [&_.swiper-pagination-bullet]:before:bg-transparent [&_.swiper-pagination-bullet]:before:rounded-full [&_.swiper-pagination-bullet]:before:border [&_.swiper-pagination-bullet]:before:border-primary-600 [&_.swiper-pagination-bullet]:before:top-[-2.7px] [&_.swiper-pagination-bullet]:before:left-[-2.7px] [&_.swiper-pagination-bullet]:before:absolute [&_.swiper-pagination-bullet]:before:block [&_.swiper-pagination-bullet]:before:opacity-0 [&_.swiper-pagination-bullet]:!size-[8px] [&_.swiper-pagination-bullet]:!bg-black [&_.swiper-pagination-bullet]:!opacity-[5%] [&_.swiper-pagination-bullet]:!opacity-100 swiper-pagination-clickable swiper-pagination-bullets swiper-pagination-horizontal"
|
||||
class="swiper-pagination swiper-pagination-award space-x-[13px] !relative [&_.swiper-pagination-bullet-active]:!bg-primary-600 [&_.swiper-pagination-bullet-active]:!opacity-100 [&_.swiper-pagination-bullet-active]:before:opacity-100 mt-4 flex justify-center md:hidden [&_.swiper-pagination-bullet]:!relative [&_.swiper-pagination-bullet]:!bottom-[-8px] [&_.swiper-pagination-bullet]:before:content-[''] [&_.swiper-pagination-bullet]:before:size-[14px] [&_.swiper-pagination-bullet]:before:bg-transparent [&_.swiper-pagination-bullet]:before:rounded-full [&_.swiper-pagination-bullet]:before:border [&_.swiper-pagination-bullet]:before:border-primary-600 [&_.swiper-pagination-bullet]:before:top-[-2.7px] [&_.swiper-pagination-bullet]:before:left-[-2.7px] [&_.swiper-pagination-bullet]:before:absolute [&_.swiper-pagination-bullet]:before:block [&_.swiper-pagination-bullet]:before:opacity-0 [&_.swiper-pagination-bullet]:!size-[8px] [&_.swiper-pagination-bullet]:!bg-black [&_.swiper-pagination-bullet]:!opacity-[5%] [&_.swiper-pagination-bullet]:!opacity-100 swiper-pagination-clickable swiper-pagination-bullets swiper-pagination-horizontal w-full"
|
||||
>
|
||||
<span class="swiper-pagination-bullet swiper-pagination-bullet-active"></span><span class="swiper-pagination-bullet"></span
|
||||
><span class="swiper-pagination-bullet"></span><span class="swiper-pagination-bullet"></span
|
||||
><span class="swiper-pagination-bullet"></span><span class="swiper-pagination-bullet"></span>
|
||||
<span class="swiper-pagination-bullet swiper-pagination-bullet-active"></span>
|
||||
<span class="swiper-pagination-bullet"></span>
|
||||
<span class="swiper-pagination-bullet"></span>
|
||||
<span class="swiper-pagination-bullet"></span>
|
||||
<span class="swiper-pagination-bullet"></span>
|
||||
<span class="swiper-pagination-bullet"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user