feat: implement livestream post functionality and update site theme assets

This commit is contained in:
2026-07-14 23:34:50 +07:00
parent 1b905d8c60
commit f4e24a0e00
130 changed files with 17284 additions and 277 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 176 KiB

File diff suppressed because one or more lines are too long
Binary file not shown.

After

Width:  |  Height:  |  Size: 137 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

File diff suppressed because one or more lines are too long
Binary file not shown.

After

Width:  |  Height:  |  Size: 184 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 178 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 192 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 583 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 958 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1014 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 143 KiB

File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,900 @@
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtE6F15M.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWvU6F15M.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtU6F15M.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuk6F15M.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWu06F15M.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWxU6F15M.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqW106F15M.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtk6F15M.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWt06F15M.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuU6F.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtE6F15M.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWvU6F15M.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtU6F15M.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuk6F15M.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWu06F15M.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWxU6F15M.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqW106F15M.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtk6F15M.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWt06F15M.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuU6F.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtE6F15M.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWvU6F15M.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtU6F15M.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuk6F15M.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWu06F15M.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWxU6F15M.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqW106F15M.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtk6F15M.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWt06F15M.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuU6F.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtE6F15M.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWvU6F15M.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtU6F15M.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuk6F15M.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWu06F15M.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWxU6F15M.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqW106F15M.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWtk6F15M.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWt06F15M.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memtYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWqWuU6F.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu1aB.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu1aB.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu1aB.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu1aB.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu1aB.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTVOmu1aB.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTUGmu1aB.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu1aB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu1aB.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu1aB.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu1aB.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu1aB.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu1aB.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu1aB.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTVOmu1aB.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTUGmu1aB.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu1aB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu1aB.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu1aB.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu1aB.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu1aB.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu1aB.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu1aB.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTVOmu1aB.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTUGmu1aB.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu1aB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu1aB.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu1aB.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu1aB.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu1aB.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu1aB.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu1aB.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTVOmu1aB.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTUGmu1aB.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu1aB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu1aB.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu1aB.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu1aB.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu1aB.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu1aB.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* hebrew */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu1aB.woff2) format('woff2');
unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* math */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTVOmu1aB.woff2) format('woff2');
unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTUGmu1aB.woff2) format('woff2');
unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu1aB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu1aB.woff2) format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(https://fonts.gstatic.com/s/opensans/v44/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@@ -0,0 +1,12 @@
/* @license GPL-2.0-or-later https://www.drupal.org/licensing/faq */
.progress{position:relative;}.progress__track{min-width:100px;max-width:100%;height:16px;margin-top:5px;border:1px solid;background-color:#fff;}.progress__bar{width:3%;min-width:3%;max-width:100%;height:1.5em;background-color:#000;}.progress__description,.progress__percentage{overflow:hidden;margin-top:0.2em;color:#555;font-size:0.875em;}.progress__description{float:left;}[dir="rtl"] .progress__description{float:right;}.progress__percentage{float:right;}[dir="rtl"] .progress__percentage{float:left;}.progress--small .progress__track{height:7px;}.progress--small .progress__bar{height:7px;background-size:20px 20px;}
.ajax-progress{display:inline-block;padding:1px 5px 2px 5px;}[dir="rtl"] .ajax-progress{float:right;}.ajax-progress-throbber .throbber{display:inline;padding:1px 5px 2px;background:transparent url(/themes/contrib/stable/images/core/throbber-active.gif) no-repeat 0 center;}.ajax-progress-throbber .message{display:inline;padding:1px 5px 2px;}tr .ajax-progress-throbber .throbber{margin:0 2px;}.ajax-progress-bar{width:16em;}.ajax-progress-fullscreen{position:fixed;z-index:1000;top:48.5%;left:49%;width:24px;height:24px;padding:4px;opacity:0.9;border-radius:7px;background-color:#232323;background-image:url(/themes/contrib/stable/images/core/loading-small.gif);background-repeat:no-repeat;background-position:center center;}[dir="rtl"] .ajax-progress-fullscreen{right:49%;left:auto;}
.text-align-left{text-align:left;}.text-align-right{text-align:right;}.text-align-center{text-align:center;}.text-align-justify{text-align:justify;}.align-left{float:left;}.align-right{float:right;}.align-center{display:block;margin-right:auto;margin-left:auto;}
.container-inline div,.container-inline label{display:inline;}.container-inline .details-wrapper{display:block;}
.clearfix:after{display:table;clear:both;content:"";}
.hidden{display:none;}.visually-hidden{position:absolute !important;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;word-wrap:normal;}.visually-hidden.focusable:active,.visually-hidden.focusable:focus{position:static !important;overflow:visible;clip:auto;width:auto;height:auto;}.invisible{visibility:hidden;}
.js .js-hide{display:none;}.js-show{display:none;}.js .js-show{display:block;}
.media-oembed-content{max-width:100%;}
.cc_banner-wrapper{z-index:9001;position:relative}.cc_container .cc_btn{cursor:pointer;text-align:center;font-size:0.6em;transition:font-size 200ms;line-height:1em}.cc_container .cc_message{font-size:0.6em;transition:font-size 200ms;margin:0;padding:0;line-height:1.5em}.cc_container .cc_logo{display:none;text-indent:-1000px;overflow:hidden;width:100px;height:22px;background-size:cover;background-image:url(//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/1.0.10/logo.png);opacity:0.9;transition:opacity 200ms}.cc_container .cc_logo:hover,.cc_container .cc_logo:active{opacity:1}@media screen and (min-width:500px){.cc_container .cc_btn{font-size:0.8em}.cc_container .cc_message{font-size:0.8em}}@media screen and (min-width:768px){.cc_container .cc_btn{font-size:1em}.cc_container .cc_message{font-size:1em;line-height:1em}}@media screen and (min-width:992px){.cc_container .cc_message{font-size:1em}}@media print{.cc_banner-wrapper,.cc_container{display:none}}.cc_container{position:fixed;left:0;right:0;bottom:0;overflow:hidden;padding:10px}.cc_container .cc_btn{padding:8px 10px;background-color:#f1d600;cursor:pointer;transition:font-size 200ms;text-align:center;font-size:0.6em;display:block;width:33%;margin-left:10px;float:right;max-width:120px}.cc_container .cc_message{transition:font-size 200ms;font-size:0.6em;display:block}@media screen and (min-width:500px){.cc_container .cc_btn{font-size:0.8em}.cc_container .cc_message{margin-top:0.5em;font-size:0.8em}}@media screen and (min-width:768px){.cc_container{padding:15px 30px 15px}.cc_container .cc_btn{font-size:1em;padding:8px 15px}.cc_container .cc_message{font-size:1em}}@media screen and (min-width:992px){.cc_container .cc_message{font-size:1em}}.cc_container{background:#222;color:#fff;font-size:17px;font-family:"Helvetica Neue Light","HelveticaNeue-Light","Helvetica Neue",Calibri,Helvetica,Arial;box-sizing:border-box}.cc_container ::-moz-selection{background:#ff5e99;color:#fff;text-shadow:none}.cc_container .cc_btn,.cc_container .cc_btn:visited{color:#000;background-color:#f1d600;transition:background 200ms ease-in-out,color 200ms ease-in-out,box-shadow 200ms ease-in-out;-webkit-transition:background 200ms ease-in-out,color 200ms ease-in-out,box-shadow 200ms ease-in-out;border-radius:5px;-webkit-border-radius:5px}.cc_container .cc_btn:hover,.cc_container .cc_btn:active{background-color:#fff;color:#000}.cc_container a,.cc_container a:visited{text-decoration:none;color:#31a8f0;transition:200ms color}.cc_container a:hover,.cc_container a:active{color:#b2f7ff}@-webkit-keyframes slideUp{0%{-webkit-transform:translateY(66px);transform:translateY(66px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideUp{0%{-webkit-transform:translateY(66px);-ms-transform:translateY(66px);transform:translateY(66px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.cc_container,.cc_message,.cc_btn{animation-duration:0.8s;-webkit-animation-duration:0.8s;-moz-animation-duration:0.8s;-o-animation-duration:0.8s;-webkit-animation-name:slideUp;animation-name:slideUp}
span.ext{width:10px;height:10px;padding-right:12px;text-decoration:none;background:url(/modules/contrib/extlink/images/extlink_s.png) 2px center no-repeat;}span.mailto{width:10px;height:10px;padding-right:12px;text-decoration:none;background:url(/modules/contrib/extlink/images/extlink_s.png) -20px center no-repeat;}span.tel{width:10px;height:10px;padding-right:12px;text-decoration:none;background:url(/modules/contrib/extlink/images/extlink_s.png) -42px center no-repeat;}svg.ext{width:14px;height:14px;fill:#727272;font-weight:900;}svg.mailto,svg.tel{width:14px;height:14px;fill:#727272;}[data-extlink-placement='prepend'],[data-extlink-placement='before']{padding-right:0.2rem;}[data-extlink-placement='append'],[data-extlink-placement='after']{padding-left:0.2rem;}svg.ext path,svg.mailto path,svg.tel path{stroke:#727272;stroke-width:3;}@media print{svg.ext,svg.mailto,svg.tel,span.ext,span.mailto,span.tel{display:none;padding:0;}}.extlink i{padding-left:0.2em;}.extlink-nobreak{white-space:nowrap;}
.paragraph--unpublished{background-color:#fff4f4;}
File diff suppressed because one or more lines are too long
@@ -0,0 +1,6 @@
/* @license GPL-2.0-or-later https://www.drupal.org/licensing/faq */
.c--card-grid [data-component-id="umass_base:description"].f--description a.field-stat-link{display:inline-flex;justify-content:center;align-items:center;position:relative;width:auto;min-width:10.625rem;height:3.125rem;padding:0 0.9375rem;font-family:'Open Sans',Arial,Helvetica,sans-serif;font-size:0.875rem;font-weight:800;line-height:1.2858;text-align:center;text-decoration:none;text-transform:uppercase;white-space:normal;appearance:none;border:0;border-radius:0;color:#fff;background-color:#881c1c;transition:background-color 0.1s ease-in-out;}.c--card-grid [data-component-id="umass_base:description"].f--description a.field-stat-link:hover{background-color:var(--color-brand-dark);color:var(--color-white);}
.is-chrome .fi--form-item input[type="date"]::after{top:1rem;}
.block-microsite-menu-block svg.ext,.block-microsite-menu-block svg.mailto,.block-microsite-menu-block svg.tel{fill:#ffffff;}.block-microsite-menu-block svg.ext path,.block-microsite-menu-block svg.mailto path,.block-microsite-menu-block svg.tel path{stroke:#ffffff;}
.page-node-type-story .publication-date,.story-listing .publication-date{display:none;}.story-listing .f--field.f--eyebrow{display:none;}
.mc--quicklink-button-menu svg.ext{fill:#fff;}.mc--quicklink-button-menu svg.ext path{stroke:#fff;}
@@ -0,0 +1,43 @@
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
// Drupal's global gtag ID. For more info: https://developers.google.com/tag-platform/devguides/gtag-integration
gtag('set', 'developer_id.dMDhkMT', true);
(function (drupalSettings) {
if (!drupalSettings.gtag) {return;}
const config = drupalSettings.gtag;
if (config.consentMode === true) {
gtag('consent', 'default', {
ad_storage: 'denied',
analytics_storage: 'denied',
ad_user_data: 'denied',
ad_personalization: 'denied',
wait_for_update: 500,
});
}
if (config.tagId.length !== 0) {
const script = document.createElement('script');
script.async = true;
script.src = `https://www.googletagmanager.com/gtag/js?id=${config.tagId}`;
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);
}
const additionalConfigInfo = config.additionalConfigInfo || [];
if (additionalConfigInfo.length === 0) {
gtag('config', config.tagId);
} else {
gtag('config', config.tagId, additionalConfigInfo);
}
const otherIds = config.otherIds || [];
otherIds.forEach((id) => gtag('config', id));
const events = config.events || [];
events.forEach((event) => gtag('event', event.name, event.data));
})(drupalSettings);
@@ -0,0 +1,31 @@
const dl = drupalSettings.gtm ? drupalSettings.gtm.settings.data_layer : 'dataLayer';
window[dl] = window[dl] || [];
(function (drupalSettings) {
if (!drupalSettings.gtm) {return;}
const config = drupalSettings.gtm;
window[dl].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' });
const gtmSettings = config.settings;
if (gtmSettings.include_classes === true) {
window[dl].push({
'gtm.allowlist': gtmSettings.allowlist_classes ?? [],
'gtm.blocklist': gtmSettings.blocklist_classes ?? [],
});
}
let gtm_environment = '';
if (gtmSettings.include_environment === true) {
const gtm_auth = gtmSettings.environment_token ?? '';
const gtm_preview = gtmSettings.environment_id ?? '';
gtm_environment = `&gtm_auth=${gtm_auth}&gtm_preview=${gtm_preview}&gtm_cookies_win=x`;
}
config.tagIds.forEach(function (tagId) {
const script = document.createElement('script');
script.async = true;
const dLink = dl != 'dataLayer' ? `&l=${dl}` : '';
script.src = `https://www.googletagmanager.com/gtm.js?id=${tagId}${gtm_environment}${dLink}`;
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);
});
})(drupalSettings);
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,2 @@
/* @license GPL-2.0-or-later https://www.drupal.org/licensing/faq */
(function(){const settingsElement=document.querySelector('head > script[type="application/json"][data-drupal-selector="drupal-settings-json"], body > script[type="application/json"][data-drupal-selector="drupal-settings-json"]');window.drupalSettings={};if(settingsElement!==null)window.drupalSettings=JSON.parse(settingsElement.textContent);})();;
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.

After

Width:  |  Height:  |  Size: 352 KiB

File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

+96
View File
@@ -0,0 +1,96 @@
<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>S.I.S Charity Foundation</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<main class="charity-hero" aria-label="Quỹ từ thiện bệnh nhân nghèo bị đột quỵ">
<div class="hero-bg">
<span class="blob blob-1"></span>
<span class="blob blob-2"></span>
<span class="blob blob-3"></span>
<span class="soft-grid"></span>
</div>
<section class="hero-shell">
<div class="gallery-panel" aria-label="Hình ảnh hoạt động quỹ từ thiện">
<div class="gallery-title">
<span class="eyebrow">S.I.S Charity Foundation</span>
<strong>Những khoảnh khắc sẻ chia</strong>
</div>
<div class="gallery-stage" id="galleryStage">
<article class="photo-card p1" data-index="0" style="--x:-4%; --y:2%; --r:-2.5deg; --w:205px; --delay:.05s">
<img src="assets/photo-01.jpg" alt="Trao hỗ trợ bệnh nhân 1" />
</article>
<article class="photo-card p2" data-index="1" style="--x:18%; --y:-2%; --r:1.6deg; --w:298px; --delay:.16s">
<img src="assets/photo-02.jpg" alt="Trao hỗ trợ bệnh nhân 2" />
</article>
<article class="photo-card p3" data-index="2" style="--x:63%; --y:0%; --r:-1.2deg; --w:410px; --delay:.27s">
<img src="assets/photo-05.jpg" alt="Trao hỗ trợ bệnh nhân 3" />
</article>
<article class="photo-card p4" data-index="3" style="--x:0%; --y:27%; --r:2.2deg; --w:245px; --delay:.38s">
<img src="assets/photo-03.jpg" alt="Trao hỗ trợ bệnh nhân 4" />
</article>
<article class="photo-card p5" data-index="4" style="--x:32%; --y:32%; --r:-1.8deg; --w:260px; --delay:.49s">
<img src="assets/photo-04.jpg" alt="Trao hỗ trợ bệnh nhân 5" />
</article>
<article class="photo-card p6" data-index="5" style="--x:57%; --y:35%; --r:1deg; --w:195px; --delay:.60s">
<img src="assets/photo-06.jpg" alt="Trao hỗ trợ bệnh nhân 6" />
</article>
<article class="photo-card p7" data-index="6" style="--x:4%; --y:62%; --r:-1.4deg; --w:270px; --delay:.71s">
<img src="assets/photo-07.jpg" alt="Trao hỗ trợ bệnh nhân 7" />
</article>
<article class="photo-card p8" data-index="7" style="--x:42%; --y:73%; --r:1.2deg; --w:255px; --delay:.82s">
<img src="assets/photo-08.jpg" alt="Trao hỗ trợ bệnh nhân 8" />
</article>
<article class="photo-card p9" data-index="8" style="--x:77%; --y:66%; --r:-1deg; --w:338px; --delay:.93s">
<img src="assets/photo-09.jpg" alt="Trao hỗ trợ bệnh nhân 9" />
</article>
<div class="focus-frame" aria-hidden="true"></div>
<div class="gallery-light" aria-hidden="true"></div>
</div>
<div class="gallery-controls" aria-hidden="true">
<span class="dot is-active"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
</div>
</div>
<div class="content-panel">
<div class="brand-row">
<div class="brand-text reveal-up">
<h1>Quỹ từ thiện bệnh nhân nghèo bị đột quỵ<br />khu vực Đồng bằng sông Cửu Long</h1>
<p>S.I.S Charity Foundation</p>
</div>
<img class="logo-mark reveal-up" src="assets/logo.png" alt="Stroke International Services Charity Foundation" />
</div>
<div class="slogan-card reveal-up">
<span class="quote-mark"></span>
<h2>Sẻ chia yêu thương<br /><em>đến bệnh nhân nghèo bị đột quỵ</em></h2>
<span class="heart-line" aria-hidden="true"></span>
</div>
<div class="action-row reveal-up">
<a class="btn primary" href="#">Lan tỏa yêu thương</a>
<a class="btn secondary" href="#">Xem hoạt động quỹ</a>
</div>
</div>
</section>
</main>
<script src="script.js"></script>
</body>
</html>
+64
View File
@@ -0,0 +1,64 @@
(function(){
const stage = document.getElementById('galleryStage');
const cards = Array.from(document.querySelectorAll('.photo-card'));
const dots = Array.from(document.querySelectorAll('.dot'));
let active = 0;
let timer = null;
const duration = 2800;
function setActive(index){
active = index % cards.length;
stage.classList.add('is-playing');
cards.forEach((card, i) => {
card.classList.remove('is-active','is-dim','is-next','is-exit');
const diff = (i - active + cards.length) % cards.length;
if(i === active){
card.classList.add('is-active');
}else if(diff === 1 || diff === 2){
card.classList.add('is-next');
}else if(diff === cards.length - 1){
card.classList.add('is-exit');
}else{
card.classList.add('is-dim');
}
});
dots.forEach((dot, i) => dot.classList.toggle('is-active', i === active));
}
function next(){
setActive(active + 1);
}
function start(){
stop();
timer = setInterval(next, duration);
}
function stop(){
if(timer) clearInterval(timer);
}
cards.forEach((card, i) => {
card.addEventListener('mouseenter', () => {
stop();
setActive(i);
});
card.addEventListener('mouseleave', start);
});
dots.forEach((dot, i) => {
dot.addEventListener('click', () => {
setActive(i);
start();
});
});
window.addEventListener('load', () => {
setTimeout(() => {
setActive(0);
start();
}, 900);
});
})();
+212
View File
@@ -0,0 +1,212 @@
:root{
--red:#d7193f;
--red-dark:#a90f2d;
--red-soft:#fff0f4;
--pink:#ffe3ec;
--ink:#36363a;
--muted:#74747a;
--paper:#f7f7f8;
--white:#ffffff;
--shadow:0 24px 70px rgba(174, 23, 55, .18);
--shadow-strong:0 32px 90px rgba(100, 10, 30, .28);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Segoe UI",Arial,sans-serif;color:var(--ink);background:#f1f1f2}
a{text-decoration:none;color:inherit}
.charity-hero{
position:relative;
min-height:546px;
overflow:hidden;
isolation:isolate;
background:
radial-gradient(circle at 72% 22%, rgba(255,255,255,.92), transparent 28%),
linear-gradient(110deg, #ffeaf0 0%, #f4f4f5 42%, #f9f9fa 100%);
}
.hero-bg{position:absolute;inset:0;z-index:-2;overflow:hidden}
.blob{position:absolute;border-radius:999px;filter:blur(3px);opacity:.72;animation:blobFloat 13s ease-in-out infinite alternate}
.blob-1{width:460px;height:460px;background:rgba(255,207,221,.75);left:-150px;top:-170px}
.blob-2{width:520px;height:520px;background:rgba(255,236,241,.9);right:-180px;bottom:-220px;animation-delay:-3s}
.blob-3{width:220px;height:220px;background:rgba(215,25,63,.12);left:48%;top:48%;animation-delay:-6s}
.soft-grid{position:absolute;inset:22px 150px;border:5px solid rgba(255,206,218,.68);border-radius:6px;mask:linear-gradient(90deg,transparent,black 4%,black 96%,transparent);opacity:.76}
.soft-grid:before,.soft-grid:after{content:"";position:absolute;background:var(--red);border-radius:50% 50% 48% 48%;transform:rotate(45deg);opacity:.9}
.soft-grid:before{width:36px;height:36px;left:22px;bottom:-13px;box-shadow:34px -1px 0 var(--red)}
.soft-grid:after{width:17px;height:17px;right:18px;top:285px;opacity:.55;box-shadow:20px 19px 0 rgba(215,25,63,.9)}
.hero-shell{
width:min(1580px, calc(100% - 44px));
min-height:546px;
margin:0 auto;
display:grid;
grid-template-columns:minmax(640px, 1.1fr) minmax(470px, .9fr);
gap:42px;
align-items:center;
padding:22px 0;
}
.gallery-panel{
position:relative;
min-height:500px;
padding:18px 12px 0;
}
.gallery-title{
position:absolute;left:22px;top:10px;z-index:22;
display:inline-flex;flex-direction:column;gap:4px;
padding:10px 16px;border-radius:18px;background:rgba(255,255,255,.72);
box-shadow:0 12px 30px rgba(70,40,50,.08);backdrop-filter:blur(10px);
transform:translateY(-12px);opacity:0;animation:fadeDown .7s ease forwards .25s;
}
.gallery-title .eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:2px;color:var(--red);font-weight:800}
.gallery-title strong{font-size:16px;color:#313136}
.gallery-stage{
position:relative;
height:464px;
width:100%;
overflow:visible;
perspective:1200px;
}
.gallery-light{
position:absolute;left:34%;top:35%;width:310px;height:210px;border-radius:50%;
background:radial-gradient(circle, rgba(255,255,255,.88), rgba(255,255,255,0) 66%);
pointer-events:none;opacity:.45;mix-blend-mode:screen;animation:lightPulse 4s ease-in-out infinite;
}
.focus-frame{
position:absolute;left:50%;top:50%;width:402px;height:238px;transform:translate(-50%,-50%) scale(.86);
border-radius:22px;border:1px solid rgba(215,25,63,.25);
box-shadow:0 0 0 10px rgba(255,255,255,.16), inset 0 0 42px rgba(215,25,63,.07);
opacity:0;transition:.7s ease;pointer-events:none;z-index:4;
}
.gallery-stage.is-playing .focus-frame{opacity:1;transform:translate(-50%,-50%) scale(1)}
.photo-card{
position:absolute;
left:var(--x);top:var(--y);
width:var(--w);
background:#fff;
border:4px solid var(--red);
border-radius:3px;
overflow:hidden;
box-shadow:0 14px 36px rgba(61,26,34,.22);
transform:translate3d(0,0,0) rotate(var(--r)) scale(.92);
opacity:0;
z-index:5;
will-change:transform,opacity,filter;
animation:cardIntro .85s cubic-bezier(.2,.9,.25,1.12) forwards, microFloat 6s ease-in-out infinite;
animation-delay:var(--delay), calc(var(--delay) + 1s);
transition:
opacity .75s ease,
filter .75s ease,
box-shadow .75s ease,
border-color .75s ease,
left .75s ease,
top .75s ease,
width .75s ease,
transform .95s cubic-bezier(.18,.82,.18,1);
}
.photo-card img{display:block;width:100%;height:auto;transform:scale(1.035);transition:transform 1s cubic-bezier(.18,.82,.18,1), filter .8s ease}
.photo-card:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg, transparent 20%, rgba(255,255,255,.34) 45%, transparent 70%);transform:translateX(-130%);z-index:2;pointer-events:none}
.photo-card.is-active:before{animation:shine 1.3s ease .25s}
.photo-card.is-active{
left:50%;top:50%;width:min(480px, 58vw);
transform:translate(-50%,-50%) rotate(0deg) scale(1.06);
opacity:1;
z-index:30;
border-color:#fff;
border-width:8px;
border-radius:18px;
box-shadow:var(--shadow-strong);
filter:saturate(1.08) contrast(1.03);
}
.photo-card.is-active img{transform:scale(1.08)}
.photo-card.is-dim{
opacity:.28;
filter:grayscale(.08) saturate(.8) blur(.2px);
transform:translate3d(0,0,0) rotate(var(--r)) scale(.82);
z-index:2;
}
.photo-card.is-next{
opacity:.74;
box-shadow:0 17px 45px rgba(92,24,42,.18);
}
.photo-card.is-exit{
opacity:0;
transform:translateY(28px) scale(.74) rotate(var(--r));
}
.photo-card:hover{transform:translateY(-8px) rotate(0deg) scale(1.03);z-index:35;box-shadow:0 24px 70px rgba(100,10,30,.24)}
.photo-card:hover img{transform:scale(1.1)}
.gallery-controls{position:absolute;left:50%;bottom:2px;transform:translateX(-50%);display:flex;gap:8px;z-index:40}
.dot{width:7px;height:7px;border-radius:999px;background:rgba(215,25,63,.22);transition:.35s ease}
.dot.is-active{width:28px;background:var(--red);box-shadow:0 0 0 6px rgba(215,25,63,.09)}
.content-panel{
position:relative;
min-height:430px;
display:flex;
flex-direction:column;
justify-content:center;
padding:26px 24px 26px 8px;
}
.content-panel:before{
content:"";position:absolute;inset:28px 0 18px 0;border-radius:34px;
background:linear-gradient(145deg, rgba(255,255,255,.54), rgba(255,255,255,.08));
border:1px solid rgba(255,255,255,.55);
box-shadow:0 20px 70px rgba(62,45,54,.06);
z-index:-1;
}
.brand-row{display:grid;grid-template-columns:1fr 170px;gap:24px;align-items:start;margin-bottom:54px}
.logo-mark{width:165px;justify-self:end;filter:drop-shadow(0 10px 16px rgba(215,25,63,.15));animation:logoBreath 3.6s ease-in-out infinite}
.brand-text{text-align:center;align-self:center}
.brand-text h1{margin:0 0 8px;text-transform:uppercase;line-height:1.18;font-size:clamp(20px,1.72vw,30px);letter-spacing:-.3px;color:var(--red);font-weight:900}
.brand-text p{margin:0;color:#67676c;text-transform:uppercase;font-size:clamp(16px,1.2vw,22px);font-weight:800;letter-spacing:.3px}
.slogan-card{
width:min(560px,100%);
margin:0 auto;
position:relative;text-align:center;padding:20px 18px 28px;
}
.slogan-card:before{
content:"";position:absolute;left:50%;top:50%;width:86%;height:86%;transform:translate(-50%,-50%);
border-radius:38px;background:linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,237,243,.72),rgba(255,255,255,.12));
filter:blur(.2px);z-index:-1;opacity:.8;
}
.quote-mark{position:absolute;left:12px;top:-16px;font-size:74px;line-height:1;color:rgba(215,25,63,.18);font-family:Georgia,serif}
.slogan-card h2{margin:0;color:#e13b5e;font-size:clamp(29px,2.2vw,42px);line-height:1.42;font-family:"Segoe Script","Brush Script MT",cursive;font-weight:600;text-shadow:0 8px 20px rgba(215,25,63,.12)}
.slogan-card h2 em{font-style:normal;font-size:.86em;color:#d9284c}
.heart-line{display:block;width:160px;height:22px;margin:12px auto 0;position:relative}
.heart-line:before{content:"";position:absolute;left:0;right:34px;top:11px;height:2px;background:linear-gradient(90deg,transparent,var(--red));border-radius:999px}
.heart-line:after{content:"♡";position:absolute;right:6px;top:-8px;color:var(--red);font-size:32px;transform:rotate(18deg);animation:heartBeat 1.7s ease-in-out infinite}
.action-row{display:flex;gap:12px;justify-content:center;margin-top:26px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:999px;font-weight:800;font-size:14px;letter-spacing:.2px;transition:.3s ease;box-shadow:0 12px 30px rgba(115,21,43,.12)}
.btn.primary{background:linear-gradient(135deg,var(--red),#ef4769);color:white}
.btn.secondary{background:rgba(255,255,255,.74);color:var(--red);border:1px solid rgba(215,25,63,.18)}
.btn:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(115,21,43,.18)}
.reveal-up{opacity:0;transform:translateY(24px);animation:revealUp .8s ease forwards}
.brand-text.reveal-up{animation-delay:.2s}.logo-mark.reveal-up{animation-delay:.38s}.slogan-card.reveal-up{animation-delay:.62s}.action-row.reveal-up{animation-delay:.86s}
@keyframes cardIntro{from{opacity:0;transform:translate3d(-28px,22px,0) rotate(calc(var(--r) - 7deg)) scale(.78)}to{opacity:1;transform:translate3d(0,0,0) rotate(var(--r)) scale(.92)}}
@keyframes microFloat{0%,100%{margin-top:0}50%{margin-top:-8px}}
@keyframes shine{to{transform:translateX(130%)}}
@keyframes revealUp{to{opacity:1;transform:translateY(0)}}
@keyframes fadeDown{to{opacity:1;transform:translateY(0)}}
@keyframes logoBreath{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.025)}}
@keyframes heartBeat{0%,100%{transform:rotate(18deg) scale(1)}20%{transform:rotate(18deg) scale(1.18)}38%{transform:rotate(18deg) scale(1)}}
@keyframes blobFloat{to{transform:translate(26px,20px) scale(1.05)}}
@keyframes lightPulse{0%,100%{opacity:.25;transform:scale(.96)}50%{opacity:.58;transform:scale(1.08)}}
@media (max-width:1200px){
.hero-shell{grid-template-columns:1fr;gap:10px;padding:18px 0 34px}
.charity-hero{min-height:auto}.content-panel{min-height:auto}.gallery-panel{min-height:470px}.gallery-stage{height:430px}.brand-row{grid-template-columns:1fr 130px;margin-bottom:20px}.logo-mark{width:130px}
}
@media (max-width:720px){
.hero-shell{width:calc(100% - 24px)}.soft-grid{inset:12px;border-width:3px}.gallery-panel{padding:12px 0;min-height:390px}.gallery-title{display:none}.gallery-stage{height:370px;overflow:hidden}.photo-card{width:calc(var(--w) * .72)}.photo-card.is-active{width:min(86vw,380px)}.content-panel{padding:8px}.brand-row{display:flex;flex-direction:column-reverse;align-items:center;gap:10px}.brand-text h1{text-align:center}.slogan-card h2{font-size:29px}.btn{height:42px;padding:0 16px}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}
+21
View File
@@ -0,0 +1,21 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
public class CheckSnippets {
public static void main(String[] args) {
try {
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
Statement stmt = conn.createStatement();
ResultSet rs = stmt.executeQuery("SELECT slug, content FROM html_snippet");
while (rs.next()) {
if (rs.getString("content") != null && rs.getString("content").contains("news-grid")) {
System.out.println("Snippet with news-grid: " + rs.getString("slug"));
}
}
} catch (Exception e) {
e.printStackTrace();
}
}
}
@@ -0,0 +1,93 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
public class CreateLivestreamPost {
public static void main(String[] args) {
try {
Class.forName("oracle.jdbc.OracleDriver");
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
// 1. Check if tag 'livestream' exists, if not create it
long tagId = -1;
PreparedStatement checkTag = conn.prepareStatement("SELECT id FROM sis_tag WHERE slug = 'livestream'");
ResultSet rsTag = checkTag.executeQuery();
if (rsTag.next()) {
tagId = rsTag.getLong("id");
} else {
PreparedStatement insertTag = conn.prepareStatement(
"INSERT INTO sis_tag (id, name, slug, created_by) VALUES (sequence_generator.NEXTVAL, ?, ?, 'system')"
);
insertTag.setString(1, "Livestream");
insertTag.setString(2, "livestream");
insertTag.executeUpdate();
PreparedStatement getTagId = conn.prepareStatement("SELECT id FROM sis_tag WHERE slug = 'livestream'");
ResultSet rsTag2 = getTagId.executeQuery();
if (rsTag2.next()) {
tagId = rsTag2.getLong("id");
}
}
if (tagId == -1) {
System.out.println("Failed to find or create livestream tag.");
return;
}
// 2. Insert Post
// We set Title as "Tuần 1" (so it shows nicely on the tab label)
// We set Excerpt as the long Title they provided.
String postTitle = "Tuần 1";
String postExcerpt = "SIS Vì Sức khỏe Cộng đồng kỳ 134 Thoát vị đĩa đệm Khi nào mới phẫu thuật?";
String postContent = "Đau lưng, đau cổ, tê tay, tê chân... là những triệu chứng thường gặp của thoát vị đĩa đệm. Tuy nhiên, không phải ai mắc bệnh cũng cần phẫu thuật.\n" +
"⚠️ Vậy khi nào nên điều trị bảo tồn? Khi nào cần phẫu thuật? Làm sao để tránh bỏ lỡ \"thời điểm vàng\" điều trị?\n" +
"Cùng lắng nghe những chia sẻ từ các chuyên gia trong chương trình Livestream \"S.I.S vì sức khỏe cộng đồng\" vào lúc 𝟏𝟗𝐡𝟒𝟓 Thứ Ba, ngày 𝟎𝟕/𝟎𝟕/𝟐𝟎𝟐𝟔.\n" +
"📌 Đồng hành và tư vấn trực tiếp cùng quý khán giả là các bác sĩ giàu kinh nghiệm tại Bệnh viện ĐKQT S.I.S Cần Thơ:\n" +
"• BS.CKI Nguyễn Quang Hưng, chuyên khoa Ngoại Thần kinh\n" +
"• BS.CKI Trương Đan Kha, chuyên khoa Vật lý trị liệu - Phục hồi chức năng \n" +
"• ThS.BS Lê Thị Chi Lan, chuyên khoa Ngoại Thần kinh.";
// Convert standard youtube link to embed link
String embedUrl = "https://www.youtube.com/embed/j63kT9Bjrb4";
PreparedStatement insertPost = conn.prepareStatement(
"INSERT INTO sis_post (id, title, slug, content, excerpt, meta_description, featured_image, created_by, status) " +
"VALUES (sequence_generator.NEXTVAL, ?, ?, ?, ?, ?, ?, 'system', 'PUBLISHED')"
);
insertPost.setString(1, postTitle);
insertPost.setString(2, "sis-vi-suc-khoe-cong-dong-ky-134");
insertPost.setString(3, postContent);
insertPost.setString(4, postExcerpt);
insertPost.setString(5, embedUrl);
insertPost.setString(6, "/media/livestream/livestream_tuan1.jpg"); // uploaded image
insertPost.executeUpdate();
// Get new post ID
long postId = -1;
PreparedStatement getPostId = conn.prepareStatement("SELECT id FROM sis_post WHERE slug = 'sis-vi-suc-khoe-cong-dong-ky-134'");
ResultSet rsPost = getPostId.executeQuery();
if (rsPost.next()) {
postId = rsPost.getLong("id");
}
if (postId == -1) {
System.out.println("Failed to retrieve created post ID.");
return;
}
// 3. Link post with tag
PreparedStatement linkPostTag = conn.prepareStatement(
"INSERT INTO sis_post_tag (post_id, tag_id) VALUES (?, ?)"
);
linkPostTag.setLong(1, postId);
linkPostTag.setLong(2, tagId);
linkPostTag.executeUpdate();
System.out.println("Successfully created post and linked it with the 'livestream' tag.");
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
+158
View File
@@ -0,0 +1,158 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class UpdateLivestreamJs {
public static void main(String[] args) {
try {
Class.forName("oracle.jdbc.OracleDriver");
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
String htmlTemplate =
"<style>\n" +
" .tabbed-media-content-media-item { width: 100%; aspect-ratio: 16/9; position: relative; display: flex; align-items: center; justify-content: center; }\n" +
" .tabbed-media-content-media-item .f--video-embed { display: none; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }\n" +
" .tabbed-media-content-media-item .f--video-embed iframe { width: 100%; height: 100%; }\n" +
" .tabbed-media-content-media-item .f--image { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }\n" +
" .tabbed-media-content-media-item .button-play { z-index: 10; }\n" +
"</style>\n" +
"<div class=\"cc--component-container cc--tabbed-media-content\" style=\"background-color: var(--color-gray-100);\">\n" +
" <div class=\"c--component c--tabbed-media-content\">\n" +
" <div class=\"tabbed-media-content-text-col\">\n" +
" <div data-component-id=\"umass_base:section-title\" class=\"f--section-title\">\n" +
" <h2 style=\"color: var(--color-brand);\">LiveStream</h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:tabbed-container\" data-once=\"tabbed-container\">\n" +
" <div class=\"tab-labels-container\" role=\"tablist\">\n" +
" <div class=\"tab-labels-inner\">\n" +
" {{#each livestream_posts}}\n" +
" <a href=\"#tabbed-content-{{index}}\" class=\"tab-label link-context-dark\" role=\"tab\" aria-selected=\"false\" aria-controls=\"tabbed-content-{{index}}\">{{title}}</a>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tab-content-container\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tab-content-panel\" id=\"tabbed-content-{{index}}\" role=\"tabpanel\" aria-live=\"polite\">\n" +
" <div class=\"f--field f--cta-title\">\n" +
" <h2 style=\"color: var(--color-black);\"> {{excerpt}} </h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:description\" class=\"f--description\">\n" +
" <div style=\"color:var(--color-black);\">{{content}}</div>\n" +
" </div>\n" +
" <div class=\"cta-container\">\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"/post/{{slug}}\" class=\"button-primary button-context-light \" aria-label=\"Tìm Hiểu Thêm\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-text\"> Tìm Hiểu Thêm </span>\n" +
" </a>\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tabbed-media-content-media-col\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tabbed-media-content-media-item with-video\" data-tab-id=\"tabbed-content-{{index}}\">\n" +
" <div class=\"f--field f--image\">\n" +
" <img src=\"{{featuredImageUrl}}\" data-src=\"{{featuredImageUrl}}\" class=\"lazyload\" alt=\"{{title}}\" style=\"width:100%;height:100%;object-fit:cover;\">\n" +
" </div>\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"#\" class=\"button-play button-context-light \" aria-label=\"Play video\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-icon button-icon-play\">\n" +
" <svg width=\"18\" height=\"27\" viewBox=\"0 0 18 27\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n" +
" <path d=\"M18 13.5L0 0V27L18 13.5Z\"></path>\n" +
" </svg>\n" +
" </span>\n" +
" <span class=\"button-text visually-hidden\"> Play </span>\n" +
" </a>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:video-embed\" class=\"f--field f--video-embed\">\n" +
" <iframe title=\"Video Content\" src=\"{{metaDescription}}\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen=\"\"></iframe>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
"</div>\n" +
"<script>\n" +
" document.addEventListener(\"DOMContentLoaded\", function() {\n" +
" // Set the first tab and panel as active if they exist\n" +
" var tabs = document.querySelectorAll('.tabbed-media-content-media-item[data-tab-id=\"tabbed-content-0\"]');\n" +
" if(tabs.length > 0) tabs[0].classList.add('is-active');\n" +
" \n" +
" var panels = document.querySelectorAll('#tabbed-content-0.tab-content-panel');\n" +
" if(panels.length > 0) panels[0].classList.add('is-active');\n" +
"\n" +
" var labels = document.querySelectorAll('a.tab-label[aria-controls=\"tabbed-content-0\"]');\n" +
" if(labels.length > 0) labels[0].setAttribute('aria-selected', 'true');\n" +
"\n" +
" // Tab Switching Logic\n" +
" var allLabels = document.querySelectorAll('.tab-labels-inner .tab-label');\n" +
" allLabels.forEach(function(label) {\n" +
" label.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" allLabels.forEach(function(l) { l.setAttribute('aria-selected', 'false'); });\n" +
" this.setAttribute('aria-selected', 'true');\n" +
" \n" +
" var targetId = this.getAttribute('aria-controls');\n" +
" document.querySelectorAll('.tab-content-panel').forEach(function(p) { p.classList.remove('is-active'); });\n" +
" document.querySelectorAll('.tabbed-media-content-media-item').forEach(function(m) { \n" +
" m.classList.remove('is-active'); \n" +
" // Reset video when switching tabs\n" +
" var vEmbed = m.querySelector('.f--video-embed');\n" +
" if(vEmbed) vEmbed.style.display = 'none';\n" +
" var img = m.querySelector('.f--image');\n" +
" if(img) img.style.display = 'block';\n" +
" var btn = m.querySelector('.button-play');\n" +
" if(btn) btn.style.display = 'flex'; // Or whatever default display is\n" +
" var iframe = m.querySelector('iframe');\n" +
" if(iframe) { \n" +
" var src = iframe.src;\n" +
" iframe.src = src.replace('&autoplay=1', '').replace('?autoplay=1', '');\n" +
" }\n" +
" });\n" +
" \n" +
" var targetPanel = document.getElementById(targetId);\n" +
" if(targetPanel) targetPanel.classList.add('is-active');\n" +
" var targetMedia = document.querySelector('.tabbed-media-content-media-item[data-tab-id=\"' + targetId + '\"]');\n" +
" if(targetMedia) targetMedia.classList.add('is-active');\n" +
" });\n" +
" });\n" +
"\n" +
" // Play Button Logic\n" +
" var playButtons = document.querySelectorAll('.tabbed-media-content-media-item .button-play');\n" +
" playButtons.forEach(function(btn) {\n" +
" btn.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" var mediaItem = this.closest('.tabbed-media-content-media-item');\n" +
" var img = mediaItem.querySelector('.f--image');\n" +
" var videoEmbed = mediaItem.querySelector('.f--video-embed');\n" +
" \n" +
" if(img) img.style.display = 'none';\n" +
" this.style.display = 'none';\n" +
" if(videoEmbed) videoEmbed.style.display = 'block';\n" +
" \n" +
" var iframe = mediaItem.querySelector('iframe');\n" +
" if(iframe && iframe.src.indexOf('autoplay=1') === -1) {\n" +
" iframe.src = iframe.src + (iframe.src.indexOf('?') > -1 ? '&' : '?') + 'autoplay=1';\n" +
" }\n" +
" });\n" +
" });\n" +
" });\n" +
"</script>";
PreparedStatement updateTemplate = conn.prepareStatement(
"UPDATE sis_component_template SET html_template = ? WHERE slug = 'tabbed-livestream'"
);
updateTemplate.setString(1, htmlTemplate);
int rows = updateTemplate.executeUpdate();
System.out.println("Updated rows: " + rows);
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
@@ -0,0 +1,40 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class UpdateLivestreamPost {
public static void main(String[] args) {
try {
Class.forName("oracle.jdbc.OracleDriver");
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
String postTitle = "Tuần 1";
String postExcerpt = "SIS Vì Sức khỏe Cộng đồng kỳ 134 Thoát vị đĩa đệm Khi nào mới phẫu thuật?";
String postContent = "Đau lưng, đau cổ, tê tay, tê chân... là những triệu chứng thường gặp của thoát vị đĩa đệm. Tuy nhiên, không phải ai mắc bệnh cũng cần phẫu thuật.\n" +
"⚠️ Vậy khi nào nên điều trị bảo tồn? Khi nào cần phẫu thuật? Làm sao để tránh bỏ lỡ \"thời điểm vàng\" điều trị?\n" +
"Cùng lắng nghe những chia sẻ từ các chuyên gia trong chương trình Livestream \"S.I.S vì sức khỏe cộng đồng\" vào lúc 𝟏𝟗𝐡𝟒𝟓 Thứ Ba, ngày 𝟎𝟕/𝟎𝟕/𝟐𝟎𝟐𝟔.\n" +
"📌 Đồng hành và tư vấn trực tiếp cùng quý khán giả là các bác sĩ giàu kinh nghiệm tại Bệnh viện ĐKQT S.I.S Cần Thơ:\n" +
"• BS.CKI Nguyễn Quang Hưng, chuyên khoa Ngoại Thần kinh\n" +
"• BS.CKI Trương Đan Kha, chuyên khoa Vật lý trị liệu - Phục hồi chức năng \n" +
"• ThS.BS Lê Thị Chi Lan, chuyên khoa Ngoại Thần kinh.";
String embedUrl = "https://www.youtube.com/embed/j63kT9Bjrb4";
PreparedStatement updatePost = conn.prepareStatement(
"UPDATE sis_post SET title = ?, content = ?, excerpt = ?, meta_description = ?, featured_image = ? WHERE slug = 'sis-vi-suc-khoe-cong-dong-ky-134'"
);
updatePost.setString(1, postTitle);
updatePost.setString(2, postContent);
updatePost.setString(3, postExcerpt);
updatePost.setString(4, embedUrl);
updatePost.setString(5, "/uploads/livestream/livestream_tuan1.jpg");
int rows = updatePost.executeUpdate();
System.out.println("Updated rows: " + rows);
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
@@ -0,0 +1,162 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class UpdateLivestreamTemplate {
public static void main(String[] args) {
try {
Class.forName("oracle.jdbc.OracleDriver");
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
// 1. Update the Post's meta_description (YouTube URL)
PreparedStatement updatePost = conn.prepareStatement(
"UPDATE sis_post SET meta_description = ? WHERE slug = 'sis-vi-suc-khoe-cong-dong-ky-134'"
);
updatePost.setString(1, "https://www.youtube.com/embed/j63kT9Bjrb4?si=N5JwIcuRn-iRxkYu");
updatePost.executeUpdate();
// 2. Update the template's iframe attributes
String htmlTemplate =
"<style>\n" +
" .tabbed-media-content-media-item { width: 100%; aspect-ratio: 16/9; position: relative; display: flex; align-items: center; justify-content: center; }\n" +
" .tabbed-media-content-media-item .f--video-embed { display: none; width: 100%; height: 100%; position: absolute; top: 0; left: 0; }\n" +
" .tabbed-media-content-media-item .f--video-embed iframe { width: 100%; height: 100%; }\n" +
" .tabbed-media-content-media-item .f--image { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }\n" +
" .tabbed-media-content-media-item .button-play { z-index: 10; }\n" +
"</style>\n" +
"<div class=\"cc--component-container cc--tabbed-media-content\" style=\"background-color: var(--color-gray-100);\">\n" +
" <div class=\"c--component c--tabbed-media-content\">\n" +
" <div class=\"tabbed-media-content-text-col\">\n" +
" <div data-component-id=\"umass_base:section-title\" class=\"f--section-title\">\n" +
" <h2 style=\"color: var(--color-brand);\">LiveStream</h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:tabbed-container\" data-once=\"tabbed-container\">\n" +
" <div class=\"tab-labels-container\" role=\"tablist\">\n" +
" <div class=\"tab-labels-inner\">\n" +
" {{#each livestream_posts}}\n" +
" <a href=\"#tabbed-content-{{index}}\" class=\"tab-label link-context-dark\" role=\"tab\" aria-selected=\"false\" aria-controls=\"tabbed-content-{{index}}\">{{title}}</a>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tab-content-container\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tab-content-panel\" id=\"tabbed-content-{{index}}\" role=\"tabpanel\" aria-live=\"polite\">\n" +
" <div class=\"f--field f--cta-title\">\n" +
" <h2 style=\"color: var(--color-black);\"> {{excerpt}} </h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:description\" class=\"f--description\">\n" +
" <div style=\"color:var(--color-black);\">{{content}}</div>\n" +
" </div>\n" +
" <div class=\"cta-container\">\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"/post/{{slug}}\" class=\"button-primary button-context-light \" aria-label=\"Tìm Hiểu Thêm\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-text\"> Tìm Hiểu Thêm </span>\n" +
" </a>\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tabbed-media-content-media-col\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tabbed-media-content-media-item with-video\" data-tab-id=\"tabbed-content-{{index}}\">\n" +
" <div class=\"f--field f--image\">\n" +
" <img src=\"{{featuredImageUrl}}\" data-src=\"{{featuredImageUrl}}\" class=\"lazyload\" alt=\"{{title}}\" style=\"width:100%;height:100%;object-fit:cover;\">\n" +
" </div>\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"#\" class=\"button-play button-context-light \" aria-label=\"Play video\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-icon button-icon-play\">\n" +
" <svg width=\"18\" height=\"27\" viewBox=\"0 0 18 27\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n" +
" <path d=\"M18 13.5L0 0V27L18 13.5Z\"></path>\n" +
" </svg>\n" +
" </span>\n" +
" <span class=\"button-text visually-hidden\"> Play </span>\n" +
" </a>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:video-embed\" class=\"f--field f--video-embed\">\n" +
" <iframe title=\"YouTube video player\" src=\"{{metaDescription}}\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
"</div>\n" +
"<script>\n" +
" document.addEventListener(\"DOMContentLoaded\", function() {\n" +
" var tabs = document.querySelectorAll('.tabbed-media-content-media-item[data-tab-id=\"tabbed-content-0\"]');\n" +
" if(tabs.length > 0) tabs[0].classList.add('is-active');\n" +
" \n" +
" var panels = document.querySelectorAll('#tabbed-content-0.tab-content-panel');\n" +
" if(panels.length > 0) panels[0].classList.add('is-active');\n" +
"\n" +
" var labels = document.querySelectorAll('a.tab-label[aria-controls=\"tabbed-content-0\"]');\n" +
" if(labels.length > 0) labels[0].setAttribute('aria-selected', 'true');\n" +
"\n" +
" var allLabels = document.querySelectorAll('.tab-labels-inner .tab-label');\n" +
" allLabels.forEach(function(label) {\n" +
" label.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" allLabels.forEach(function(l) { l.setAttribute('aria-selected', 'false'); });\n" +
" this.setAttribute('aria-selected', 'true');\n" +
" \n" +
" var targetId = this.getAttribute('aria-controls');\n" +
" document.querySelectorAll('.tab-content-panel').forEach(function(p) { p.classList.remove('is-active'); });\n" +
" document.querySelectorAll('.tabbed-media-content-media-item').forEach(function(m) { \n" +
" m.classList.remove('is-active'); \n" +
" var vEmbed = m.querySelector('.f--video-embed');\n" +
" if(vEmbed) vEmbed.style.display = 'none';\n" +
" var img = m.querySelector('.f--image');\n" +
" if(img) img.style.display = 'block';\n" +
" var btn = m.querySelector('.button-play');\n" +
" if(btn) btn.style.display = 'flex';\n" +
" var iframe = m.querySelector('iframe');\n" +
" if(iframe) { \n" +
" var src = iframe.src;\n" +
" iframe.src = src.replace('&autoplay=1', '').replace('?autoplay=1', '');\n" +
" }\n" +
" });\n" +
" \n" +
" var targetPanel = document.getElementById(targetId);\n" +
" if(targetPanel) targetPanel.classList.add('is-active');\n" +
" var targetMedia = document.querySelector('.tabbed-media-content-media-item[data-tab-id=\"' + targetId + '\"]');\n" +
" if(targetMedia) targetMedia.classList.add('is-active');\n" +
" });\n" +
" });\n" +
"\n" +
" var playButtons = document.querySelectorAll('.tabbed-media-content-media-item .button-play');\n" +
" playButtons.forEach(function(btn) {\n" +
" btn.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" var mediaItem = this.closest('.tabbed-media-content-media-item');\n" +
" var img = mediaItem.querySelector('.f--image');\n" +
" var videoEmbed = mediaItem.querySelector('.f--video-embed');\n" +
" \n" +
" if(img) img.style.display = 'none';\n" +
" this.style.display = 'none';\n" +
" if(videoEmbed) videoEmbed.style.display = 'block';\n" +
" \n" +
" var iframe = mediaItem.querySelector('iframe');\n" +
" if(iframe && iframe.src.indexOf('autoplay=1') === -1) {\n" +
" iframe.src = iframe.src + (iframe.src.indexOf('?') > -1 ? '&' : '?') + 'autoplay=1';\n" +
" }\n" +
" });\n" +
" });\n" +
" });\n" +
"</script>";
PreparedStatement updateTemplate = conn.prepareStatement(
"UPDATE sis_component_template SET html_template = ? WHERE slug = 'tabbed-livestream'"
);
updateTemplate.setString(1, htmlTemplate);
updateTemplate.executeUpdate();
System.out.println("Update complete!");
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
@@ -0,0 +1,161 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class UpdateLivestreamTemplate2 {
public static void main(String[] args) {
try {
Class.forName("oracle.jdbc.OracleDriver");
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
// We append &autoplay=1 to the URL in the database so it's ready to play
PreparedStatement updatePost = conn.prepareStatement(
"UPDATE sis_post SET meta_description = ? WHERE slug = 'sis-vi-suc-khoe-cong-dong-ky-134'"
);
updatePost.setString(1, "https://www.youtube.com/embed/j63kT9Bjrb4?si=N5JwIcuRn-iRxkYu&autoplay=1");
updatePost.executeUpdate();
// 2. Update the template to use data-src instead of src.
String htmlTemplate =
"<style>\n" +
" .tabbed-media-content-media-item { width: 100%; aspect-ratio: 16/9; position: relative; display: flex; align-items: center; justify-content: center; background: #000; overflow: hidden; }\n" +
" .tabbed-media-content-media-item .f--video-embed { display: none; width: 100%; height: 100%; }\n" +
" .tabbed-media-content-media-item .f--video-embed iframe { width: 100%; height: 100%; border: none; }\n" +
" .tabbed-media-content-media-item .f--image { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }\n" +
" .tabbed-media-content-media-item .button-play { z-index: 10; }\n" +
"</style>\n" +
"<div class=\"cc--component-container cc--tabbed-media-content\" style=\"background-color: var(--color-gray-100);\">\n" +
" <div class=\"c--component c--tabbed-media-content\">\n" +
" <div class=\"tabbed-media-content-text-col\">\n" +
" <div data-component-id=\"umass_base:section-title\" class=\"f--section-title\">\n" +
" <h2 style=\"color: var(--color-brand);\">LiveStream</h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:tabbed-container\" data-once=\"tabbed-container\">\n" +
" <div class=\"tab-labels-container\" role=\"tablist\">\n" +
" <div class=\"tab-labels-inner\">\n" +
" {{#each livestream_posts}}\n" +
" <a href=\"#tabbed-content-{{index}}\" class=\"tab-label link-context-dark\" role=\"tab\" aria-selected=\"false\" aria-controls=\"tabbed-content-{{index}}\">{{title}}</a>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tab-content-container\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tab-content-panel\" id=\"tabbed-content-{{index}}\" role=\"tabpanel\" aria-live=\"polite\">\n" +
" <div class=\"f--field f--cta-title\">\n" +
" <h2 style=\"color: var(--color-black);\"> {{excerpt}} </h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:description\" class=\"f--description\">\n" +
" <div style=\"color:var(--color-black);\">{{content}}</div>\n" +
" </div>\n" +
" <div class=\"cta-container\">\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"/post/{{slug}}\" class=\"button-primary button-context-light \" aria-label=\"Tìm Hiểu Thêm\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-text\"> Tìm Hiểu Thêm </span>\n" +
" </a>\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tabbed-media-content-media-col\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tabbed-media-content-media-item with-video\" data-tab-id=\"tabbed-content-{{index}}\">\n" +
" <div class=\"f--field f--image\">\n" +
" <img src=\"{{featuredImageUrl}}\" data-src=\"{{featuredImageUrl}}\" class=\"lazyload\" alt=\"{{title}}\" style=\"width:100%;height:100%;object-fit:cover;\">\n" +
" </div>\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"#\" class=\"button-play button-context-light \" aria-label=\"Play video\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-icon button-icon-play\">\n" +
" <svg width=\"18\" height=\"27\" viewBox=\"0 0 18 27\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n" +
" <path d=\"M18 13.5L0 0V27L18 13.5Z\"></path>\n" +
" </svg>\n" +
" </span>\n" +
" <span class=\"button-text visually-hidden\"> Play </span>\n" +
" </a>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:video-embed\" class=\"f--field f--video-embed\">\n" +
" <iframe title=\"YouTube video player\" data-src=\"{{metaDescription}}\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
"</div>\n" +
"<script>\n" +
" document.addEventListener(\"DOMContentLoaded\", function() {\n" +
" var tabs = document.querySelectorAll('.tabbed-media-content-media-item[data-tab-id=\"tabbed-content-0\"]');\n" +
" if(tabs.length > 0) tabs[0].classList.add('is-active');\n" +
" \n" +
" var panels = document.querySelectorAll('#tabbed-content-0.tab-content-panel');\n" +
" if(panels.length > 0) panels[0].classList.add('is-active');\n" +
"\n" +
" var labels = document.querySelectorAll('a.tab-label[aria-controls=\"tabbed-content-0\"]');\n" +
" if(labels.length > 0) labels[0].setAttribute('aria-selected', 'true');\n" +
"\n" +
" var allLabels = document.querySelectorAll('.tab-labels-inner .tab-label');\n" +
" allLabels.forEach(function(label) {\n" +
" label.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" allLabels.forEach(function(l) { l.setAttribute('aria-selected', 'false'); });\n" +
" this.setAttribute('aria-selected', 'true');\n" +
" \n" +
" var targetId = this.getAttribute('aria-controls');\n" +
" document.querySelectorAll('.tab-content-panel').forEach(function(p) { p.classList.remove('is-active'); });\n" +
" document.querySelectorAll('.tabbed-media-content-media-item').forEach(function(m) { \n" +
" m.classList.remove('is-active'); \n" +
" var vEmbed = m.querySelector('.f--video-embed');\n" +
" if(vEmbed) vEmbed.style.display = 'none';\n" +
" var img = m.querySelector('.f--image');\n" +
" if(img) img.style.display = 'block';\n" +
" var btn = m.querySelector('.button-play');\n" +
" if(btn) btn.style.display = 'flex';\n" +
" var iframe = m.querySelector('iframe');\n" +
" if(iframe) { \n" +
" iframe.src = '';\n" +
" }\n" +
" });\n" +
" \n" +
" var targetPanel = document.getElementById(targetId);\n" +
" if(targetPanel) targetPanel.classList.add('is-active');\n" +
" var targetMedia = document.querySelector('.tabbed-media-content-media-item[data-tab-id=\"' + targetId + '\"]');\n" +
" if(targetMedia) targetMedia.classList.add('is-active');\n" +
" });\n" +
" });\n" +
"\n" +
" var playButtons = document.querySelectorAll('.tabbed-media-content-media-item .button-play');\n" +
" playButtons.forEach(function(btn) {\n" +
" btn.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" var mediaItem = this.closest('.tabbed-media-content-media-item');\n" +
" var img = mediaItem.querySelector('.f--image');\n" +
" var videoEmbed = mediaItem.querySelector('.f--video-embed');\n" +
" \n" +
" if(img) img.style.display = 'none';\n" +
" this.style.display = 'none';\n" +
" if(videoEmbed) videoEmbed.style.display = 'block';\n" +
" \n" +
" var iframe = mediaItem.querySelector('iframe');\n" +
" if(iframe && iframe.getAttribute('data-src')) {\n" +
" iframe.src = iframe.getAttribute('data-src');\n" +
" }\n" +
" });\n" +
" });\n" +
" });\n" +
"</script>";
PreparedStatement updateTemplate = conn.prepareStatement(
"UPDATE sis_component_template SET html_template = ? WHERE slug = 'tabbed-livestream'"
);
updateTemplate.setString(1, htmlTemplate);
updateTemplate.executeUpdate();
System.out.println("Update complete!");
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
@@ -0,0 +1,146 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class UpdateLivestreamTemplate3 {
public static void main(String[] args) {
try {
Class.forName("oracle.jdbc.OracleDriver");
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
// We ensure it is just the standard embed without JS tampering
String htmlTemplate =
"<style>\n" +
" .tabbed-media-content-media-item { width: 100%; aspect-ratio: 16/9; position: relative; display: flex; align-items: center; justify-content: center; background: #000; overflow: hidden; }\n" +
" .tabbed-media-content-media-item .f--video-embed { display: none; width: 100%; height: 100%; }\n" +
" .tabbed-media-content-media-item .f--video-embed iframe { width: 100%; height: 100%; border: none; }\n" +
" .tabbed-media-content-media-item .f--image { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; }\n" +
" .tabbed-media-content-media-item .button-play { z-index: 10; }\n" +
"</style>\n" +
"<div class=\"cc--component-container cc--tabbed-media-content\" style=\"background-color: var(--color-gray-100);\">\n" +
" <div class=\"c--component c--tabbed-media-content\">\n" +
" <div class=\"tabbed-media-content-text-col\">\n" +
" <div data-component-id=\"umass_base:section-title\" class=\"f--section-title\">\n" +
" <h2 style=\"color: var(--color-brand);\">LiveStream</h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:tabbed-container\" data-once=\"tabbed-container\">\n" +
" <div class=\"tab-labels-container\" role=\"tablist\">\n" +
" <div class=\"tab-labels-inner\">\n" +
" {{#each livestream_posts}}\n" +
" <a href=\"#tabbed-content-{{index}}\" class=\"tab-label link-context-dark\" role=\"tab\" aria-selected=\"false\" aria-controls=\"tabbed-content-{{index}}\">{{title}}</a>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tab-content-container\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tab-content-panel\" id=\"tabbed-content-{{index}}\" role=\"tabpanel\" aria-live=\"polite\">\n" +
" <div class=\"f--field f--cta-title\">\n" +
" <h2 style=\"color: var(--color-black);\"> {{excerpt}} </h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:description\" class=\"f--description\">\n" +
" <div style=\"color:var(--color-black);\">{{content}}</div>\n" +
" </div>\n" +
" <div class=\"cta-container\">\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"/post/{{slug}}\" class=\"button-primary button-context-light \" aria-label=\"Tìm Hiểu Thêm\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-text\"> Tìm Hiểu Thêm </span>\n" +
" </a>\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tabbed-media-content-media-col\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tabbed-media-content-media-item with-video\" data-tab-id=\"tabbed-content-{{index}}\">\n" +
" <div class=\"f--field f--image\">\n" +
" <img src=\"{{featuredImageUrl}}\" data-src=\"{{featuredImageUrl}}\" class=\"lazyload\" alt=\"{{title}}\" style=\"width:100%;height:100%;object-fit:cover;\">\n" +
" </div>\n" +
" <div class=\"f--field f--button\" style=\"position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10;\">\n" +
" <a href=\"#\" class=\"button-play button-context-light \" aria-label=\"Play video\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-icon button-icon-play\">\n" +
" <svg width=\"18\" height=\"27\" viewBox=\"0 0 18 27\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n" +
" <path d=\"M18 13.5L0 0V27L18 13.5Z\"></path>\n" +
" </svg>\n" +
" </span>\n" +
" <span class=\"button-text visually-hidden\"> Play </span>\n" +
" </a>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:video-embed\" class=\"f--field f--video-embed\">\n" +
" <iframe title=\"YouTube video player\" src=\"{{metaDescription}}\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
"</div>\n" +
"<script>\n" +
" document.addEventListener(\"DOMContentLoaded\", function() {\n" +
" var tabs = document.querySelectorAll('.tabbed-media-content-media-item[data-tab-id=\"tabbed-content-0\"]');\n" +
" if(tabs.length > 0) tabs[0].classList.add('is-active');\n" +
" \n" +
" var panels = document.querySelectorAll('#tabbed-content-0.tab-content-panel');\n" +
" if(panels.length > 0) panels[0].classList.add('is-active');\n" +
"\n" +
" var labels = document.querySelectorAll('a.tab-label[aria-controls=\"tabbed-content-0\"]');\n" +
" if(labels.length > 0) labels[0].setAttribute('aria-selected', 'true');\n" +
"\n" +
" var allLabels = document.querySelectorAll('.tab-labels-inner .tab-label');\n" +
" allLabels.forEach(function(label) {\n" +
" label.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" allLabels.forEach(function(l) { l.setAttribute('aria-selected', 'false'); });\n" +
" this.setAttribute('aria-selected', 'true');\n" +
" \n" +
" var targetId = this.getAttribute('aria-controls');\n" +
" document.querySelectorAll('.tab-content-panel').forEach(function(p) { p.classList.remove('is-active'); });\n" +
" document.querySelectorAll('.tabbed-media-content-media-item').forEach(function(m) { \n" +
" m.classList.remove('is-active'); \n" +
" var vEmbed = m.querySelector('.f--video-embed');\n" +
" if(vEmbed) vEmbed.style.display = 'none';\n" +
" var img = m.querySelector('.f--image');\n" +
" if(img) img.style.display = 'block';\n" +
" var btnContainer = m.querySelector('.f--field.f--button');\n" +
" if(btnContainer) btnContainer.style.display = 'block';\n" +
" });\n" +
" \n" +
" var targetPanel = document.getElementById(targetId);\n" +
" if(targetPanel) targetPanel.classList.add('is-active');\n" +
" var targetMedia = document.querySelector('.tabbed-media-content-media-item[data-tab-id=\"' + targetId + '\"]');\n" +
" if(targetMedia) targetMedia.classList.add('is-active');\n" +
" });\n" +
" });\n" +
"\n" +
" var playButtons = document.querySelectorAll('.tabbed-media-content-media-item .button-play');\n" +
" playButtons.forEach(function(btn) {\n" +
" btn.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" var mediaItem = this.closest('.tabbed-media-content-media-item');\n" +
" var img = mediaItem.querySelector('.f--image');\n" +
" var videoEmbed = mediaItem.querySelector('.f--video-embed');\n" +
" var btnContainer = mediaItem.querySelector('.f--field.f--button');\n" +
" \n" +
" if(img) img.style.display = 'none';\n" +
" if(btnContainer) btnContainer.style.display = 'none';\n" +
" if(videoEmbed) videoEmbed.style.display = 'block';\n" +
" });\n" +
" });\n" +
" });\n" +
"</script>";
PreparedStatement updateTemplate = conn.prepareStatement(
"UPDATE sis_component_template SET html_template = ? WHERE slug = 'tabbed-livestream'"
);
updateTemplate.setString(1, htmlTemplate);
updateTemplate.executeUpdate();
System.out.println("Update complete!");
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
@@ -0,0 +1,155 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class UpdateLivestreamTemplate4 {
public static void main(String[] args) {
try {
Class.forName("oracle.jdbc.OracleDriver");
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
// Re-apply the URL to be just the embed URL without autoplay so we can append it cleanly in data-src
PreparedStatement updatePost = conn.prepareStatement(
"UPDATE sis_post SET meta_description = ? WHERE slug = 'sis-vi-suc-khoe-cong-dong-ky-134'"
);
updatePost.setString(1, "https://www.youtube.com/embed/j63kT9Bjrb4?si=N5JwIcuRn-iRxkYu");
updatePost.executeUpdate();
// We ensure it is just the standard embed without JS tampering
String htmlTemplate =
"<style>\n" +
" .tabbed-media-content-media-item { width: 100%; aspect-ratio: 16/9; position: relative; display: block; background: #000; overflow: hidden; }\n" +
" .tabbed-media-content-media-item .f--video-embed { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }\n" +
" .tabbed-media-content-media-item .f--video-embed iframe { width: 100%; height: 100%; border: none; }\n" +
" .tabbed-media-content-media-item .f--image { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; }\n" +
" .tabbed-media-content-media-item .f--button { z-index: 10; }\n" +
"</style>\n" +
"<div class=\"cc--component-container cc--tabbed-media-content\" style=\"background-color: var(--color-gray-100);\">\n" +
" <div class=\"c--component c--tabbed-media-content\">\n" +
" <div class=\"tabbed-media-content-text-col\">\n" +
" <div data-component-id=\"umass_base:section-title\" class=\"f--section-title\">\n" +
" <h2 style=\"color: var(--color-brand);\">LiveStream</h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:tabbed-container\" data-once=\"tabbed-container\">\n" +
" <div class=\"tab-labels-container\" role=\"tablist\">\n" +
" <div class=\"tab-labels-inner\">\n" +
" {{#each livestream_posts}}\n" +
" <a href=\"#tabbed-content-{{index}}\" class=\"tab-label link-context-dark\" role=\"tab\" aria-selected=\"false\" aria-controls=\"tabbed-content-{{index}}\">{{title}}</a>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tab-content-container\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tab-content-panel\" id=\"tabbed-content-{{index}}\" role=\"tabpanel\" aria-live=\"polite\">\n" +
" <div class=\"f--field f--cta-title\">\n" +
" <h2 style=\"color: var(--color-black);\"> {{excerpt}} </h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:description\" class=\"f--description\">\n" +
" <div style=\"color:var(--color-black);\">{{content}}</div>\n" +
" </div>\n" +
" <div class=\"cta-container\">\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"/post/{{slug}}\" class=\"button-primary button-context-light \" aria-label=\"Tìm Hiểu Thêm\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-text\"> Tìm Hiểu Thêm </span>\n" +
" </a>\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tabbed-media-content-media-col\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tabbed-media-content-media-item with-video\" data-tab-id=\"tabbed-content-{{index}}\">\n" +
" <div class=\"f--field f--image\">\n" +
" <img src=\"{{featuredImageUrl}}\" data-src=\"{{featuredImageUrl}}\" class=\"lazyload\" alt=\"{{title}}\" style=\"width:100%;height:100%;object-fit:cover;\">\n" +
" </div>\n" +
" <div class=\"f--field f--button\" style=\"position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10;\">\n" +
" <a href=\"#\" class=\"button-play button-context-light \" aria-label=\"Play video\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-icon button-icon-play\">\n" +
" <svg width=\"18\" height=\"27\" viewBox=\"0 0 18 27\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n" +
" <path d=\"M18 13.5L0 0V27L18 13.5Z\"></path>\n" +
" </svg>\n" +
" </span>\n" +
" <span class=\"button-text visually-hidden\"> Play </span>\n" +
" </a>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:video-embed\" class=\"f--field f--video-embed\">\n" +
" <iframe title=\"YouTube video player\" data-src=\"{{metaDescription}}&amp;autoplay=1\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
"</div>\n" +
"<script>\n" +
" document.addEventListener(\"DOMContentLoaded\", function() {\n" +
" var tabs = document.querySelectorAll('.tabbed-media-content-media-item[data-tab-id=\"tabbed-content-0\"]');\n" +
" if(tabs.length > 0) tabs[0].classList.add('is-active');\n" +
" \n" +
" var panels = document.querySelectorAll('#tabbed-content-0.tab-content-panel');\n" +
" if(panels.length > 0) panels[0].classList.add('is-active');\n" +
"\n" +
" var labels = document.querySelectorAll('a.tab-label[aria-controls=\"tabbed-content-0\"]');\n" +
" if(labels.length > 0) labels[0].setAttribute('aria-selected', 'true');\n" +
"\n" +
" var allLabels = document.querySelectorAll('.tab-labels-inner .tab-label');\n" +
" allLabels.forEach(function(label) {\n" +
" label.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" allLabels.forEach(function(l) { l.setAttribute('aria-selected', 'false'); });\n" +
" this.setAttribute('aria-selected', 'true');\n" +
" \n" +
" var targetId = this.getAttribute('aria-controls');\n" +
" document.querySelectorAll('.tab-content-panel').forEach(function(p) { p.classList.remove('is-active'); });\n" +
" document.querySelectorAll('.tabbed-media-content-media-item').forEach(function(m) { \n" +
" m.classList.remove('is-active'); \n" +
" var img = m.querySelector('.f--image');\n" +
" if(img) img.style.display = 'block';\n" +
" var btnContainer = m.querySelector('.f--field.f--button');\n" +
" if(btnContainer) btnContainer.style.display = 'block';\n" +
" var iframe = m.querySelector('iframe');\n" +
" if(iframe) iframe.removeAttribute('src'); // Stop video playing if they switch tabs\n" +
" });\n" +
" \n" +
" var targetPanel = document.getElementById(targetId);\n" +
" if(targetPanel) targetPanel.classList.add('is-active');\n" +
" var targetMedia = document.querySelector('.tabbed-media-content-media-item[data-tab-id=\"' + targetId + '\"]');\n" +
" if(targetMedia) targetMedia.classList.add('is-active');\n" +
" });\n" +
" });\n" +
"\n" +
" var playButtons = document.querySelectorAll('.tabbed-media-content-media-item .button-play');\n" +
" playButtons.forEach(function(btn) {\n" +
" btn.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" var mediaItem = this.closest('.tabbed-media-content-media-item');\n" +
" var img = mediaItem.querySelector('.f--image');\n" +
" var btnContainer = mediaItem.querySelector('.f--field.f--button');\n" +
" var iframe = mediaItem.querySelector('iframe');\n" +
" \n" +
" if(img) img.style.display = 'none';\n" +
" if(btnContainer) btnContainer.style.display = 'none';\n" +
" if(iframe && iframe.getAttribute('data-src')) {\n" +
" iframe.setAttribute('src', iframe.getAttribute('data-src'));\n" +
" }\n" +
" });\n" +
" });\n" +
" });\n" +
"</script>";
PreparedStatement updateTemplate = conn.prepareStatement(
"UPDATE sis_component_template SET html_template = ? WHERE slug = 'tabbed-livestream'"
);
updateTemplate.setString(1, htmlTemplate);
updateTemplate.executeUpdate();
System.out.println("Update complete!");
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
@@ -0,0 +1,117 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class UpdateLivestreamTemplate5 {
public static void main(String[] args) {
try {
Class.forName("oracle.jdbc.OracleDriver");
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
// Revert the URL in the database to exactly what the user requested, without autoplay
PreparedStatement updatePost = conn.prepareStatement(
"UPDATE sis_post SET meta_description = ? WHERE slug = 'sis-vi-suc-khoe-cong-dong-ky-134'"
);
updatePost.setString(1, "https://www.youtube.com/embed/j63kT9Bjrb4?si=N5JwIcuRn-iRxkYu");
updatePost.executeUpdate();
// We remove the custom image and play button entirely and let YouTube handle it!
String htmlTemplate =
"<style>\n" +
" .tabbed-media-content-media-item { width: 100%; aspect-ratio: 16/9; position: relative; display: block; overflow: hidden; }\n" +
" .tabbed-media-content-media-item .f--video-embed { width: 100%; height: 100%; }\n" +
" .tabbed-media-content-media-item .f--video-embed iframe { width: 100%; height: 100%; border: none; }\n" +
"</style>\n" +
"<div class=\"cc--component-container cc--tabbed-media-content\" style=\"background-color: var(--color-gray-100);\">\n" +
" <div class=\"c--component c--tabbed-media-content\">\n" +
" <div class=\"tabbed-media-content-text-col\">\n" +
" <div data-component-id=\"umass_base:section-title\" class=\"f--section-title\">\n" +
" <h2 style=\"color: var(--color-brand);\">LiveStream</h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:tabbed-container\" data-once=\"tabbed-container\">\n" +
" <div class=\"tab-labels-container\" role=\"tablist\">\n" +
" <div class=\"tab-labels-inner\">\n" +
" {{#each livestream_posts}}\n" +
" <a href=\"#tabbed-content-{{index}}\" class=\"tab-label link-context-dark\" role=\"tab\" aria-selected=\"false\" aria-controls=\"tabbed-content-{{index}}\">{{title}}</a>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tab-content-container\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tab-content-panel\" id=\"tabbed-content-{{index}}\" role=\"tabpanel\" aria-live=\"polite\">\n" +
" <div class=\"f--field f--cta-title\">\n" +
" <h2 style=\"color: var(--color-black);\"> {{excerpt}} </h2>\n" +
" </div>\n" +
" <div data-component-id=\"umass_base:description\" class=\"f--description\">\n" +
" <div style=\"color:var(--color-black);\">{{content}}</div>\n" +
" </div>\n" +
" <div class=\"cta-container\">\n" +
" <div class=\"f--field f--button\">\n" +
" <a href=\"/post/{{slug}}\" class=\"button-primary button-context-light \" aria-label=\"Tìm Hiểu Thêm\" data-component-id=\"umass_base:button\">\n" +
" <span class=\"button-text\"> Tìm Hiểu Thêm </span>\n" +
" </a>\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"tabbed-media-content-media-col\">\n" +
" {{#each livestream_posts}}\n" +
" <div class=\"tabbed-media-content-media-item with-video\" data-tab-id=\"tabbed-content-{{index}}\">\n" +
" <div data-component-id=\"umass_base:video-embed\" class=\"f--field f--video-embed\">\n" +
" <iframe title=\"YouTube video player\" src=\"{{metaDescription}}\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>\n" +
" </div>\n" +
" </div>\n" +
" {{/each}}\n" +
" </div>\n" +
" </div>\n" +
"</div>\n" +
"<script>\n" +
" document.addEventListener(\"DOMContentLoaded\", function() {\n" +
" var tabs = document.querySelectorAll('.tabbed-media-content-media-item[data-tab-id=\"tabbed-content-0\"]');\n" +
" if(tabs.length > 0) tabs[0].classList.add('is-active');\n" +
" \n" +
" var panels = document.querySelectorAll('#tabbed-content-0.tab-content-panel');\n" +
" if(panels.length > 0) panels[0].classList.add('is-active');\n" +
"\n" +
" var labels = document.querySelectorAll('a.tab-label[aria-controls=\"tabbed-content-0\"]');\n" +
" if(labels.length > 0) labels[0].setAttribute('aria-selected', 'true');\n" +
"\n" +
" var allLabels = document.querySelectorAll('.tab-labels-inner .tab-label');\n" +
" allLabels.forEach(function(label) {\n" +
" label.addEventListener('click', function(e) {\n" +
" e.preventDefault();\n" +
" allLabels.forEach(function(l) { l.setAttribute('aria-selected', 'false'); });\n" +
" this.setAttribute('aria-selected', 'true');\n" +
" \n" +
" var targetId = this.getAttribute('aria-controls');\n" +
" document.querySelectorAll('.tab-content-panel').forEach(function(p) { p.classList.remove('is-active'); });\n" +
" document.querySelectorAll('.tabbed-media-content-media-item').forEach(function(m) { \n" +
" m.classList.remove('is-active'); \n" +
" });\n" +
" \n" +
" var targetPanel = document.getElementById(targetId);\n" +
" if(targetPanel) targetPanel.classList.add('is-active');\n" +
" var targetMedia = document.querySelector('.tabbed-media-content-media-item[data-tab-id=\"' + targetId + '\"]');\n" +
" if(targetMedia) targetMedia.classList.add('is-active');\n" +
" });\n" +
" });\n" +
" });\n" +
"</script>";
PreparedStatement updateTemplate = conn.prepareStatement(
"UPDATE sis_component_template SET html_template = ? WHERE slug = 'tabbed-livestream'"
);
updateTemplate.setString(1, htmlTemplate);
updateTemplate.executeUpdate();
System.out.println("Update complete!");
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
@@ -0,0 +1,124 @@
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class UpdateNewsGridDesktop {
public static void main(String[] args) {
try {
Connection conn = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521/sisvietnam", "sisvietnam", "sisvietnam");
String correctHtml = "<style>\n" +
"@media screen and (min-width: 1024px) {\n" +
" .featured-grid {\n" +
" display: grid;\n" +
" grid-template-columns: repeat(2, 1fr);\n" +
" gap: 24px;\n" +
" align-items: stretch;\n" +
" }\n" +
" .featured-grid__item {\n" +
" height: 100%;\n" +
" display: flex;\n" +
" }\n" +
" .featured-grid__item .news-card--featured {\n" +
" display: flex;\n" +
" flex-direction: row;\n" +
" border: 1px solid #881C1C;\n" +
" border-radius: 16px;\n" +
" padding: 16px;\n" +
" box-sizing: border-box;\n" +
" width: 100%;\n" +
" height: 100%;\n" +
" gap: 16px;\n" +
" background: #fff;\n" +
" margin-bottom: 0 !important;\n" +
" }\n" +
" .featured-grid__item .news-card__image {\n" +
" flex: 0 0 45%;\n" +
" max-width: 45%;\n" +
" margin-bottom: 0 !important;\n" +
" }\n" +
" .featured-grid__item .news-card__image > div {\n" +
" height: 100%;\n" +
" }\n" +
" .featured-grid__item .news-card__image img {\n" +
" width: 100%;\n" +
" height: 100%;\n" +
" object-fit: cover;\n" +
" border-radius: 8px;\n" +
" }\n" +
" .featured-grid__item .news-card__content {\n" +
" flex: 1;\n" +
" display: flex;\n" +
" flex-direction: column;\n" +
" justify-content: flex-start;\n" +
" min-width: 0;\n" +
" padding: 0 !important;\n" +
" margin: 0 !important;\n" +
" }\n" +
" .featured-grid__item .featured-grid__category {\n" +
" margin-bottom: 12px;\n" +
" }\n" +
" .featured-grid__item .featured-grid__category a {\n" +
" display: inline-block;\n" +
" background-color: #f2f2f2;\n" +
" color: #881C1C;\n" +
" padding: 4px 8px;\n" +
" border-radius: 4px;\n" +
" font-size: 0.75rem;\n" +
" font-weight: bold;\n" +
" text-decoration: none;\n" +
" text-transform: uppercase;\n" +
" }\n" +
" .featured-grid__item .news-card__title {\n" +
" font-size: 1.1rem;\n" +
" font-weight: 700;\n" +
" margin-top: 0;\n" +
" margin-bottom: 12px;\n" +
" line-height: 1.4;\n" +
" }\n" +
" .featured-grid__item .news-card__title a {\n" +
" color: #000;\n" +
" text-decoration: none;\n" +
" }\n" +
" .featured-grid__item .news-card__title a:hover {\n" +
" color: #881C1C;\n" +
" }\n" +
" .featured-grid__item .news-card__date {\n" +
" margin-top: auto;\n" +
" color: #881C1C;\n" +
" font-size: 0.85rem;\n" +
" font-weight: 500;\n" +
" }\n" +
"}\n" +
"</style>\n" +
"{{#each news_posts}}\n" +
"<div class=\"featured-grid__item\">\n" +
" <article class=\"news-card news-card--featured\">\n" +
" <div class=\"news-card__image\">\n" +
" <div>\n" +
" <img loading=\"lazy\" src=\"{{featuredImageUrl}}\" alt=\"{{title}}\">\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"news-card__content\">\n" +
" <div class=\"featured-grid__category\">\n" +
" <a href=\"#\">TIN TỨC</a>\n" +
" </div>\n" +
" <h3 class=\"news-card__title\">\n" +
" <a href=\"/post/{{slug}}\" rel=\"bookmark\">\n" +
" <span>{{title}}</span>\n" +
" </a>\n" +
" </h3>\n" +
" <div class=\"news-card__date\">{{date}}</div>\n" +
" </div>\n" +
" </article>\n" +
"</div>\n" +
"{{/each}}";
PreparedStatement pstmt = conn.prepareStatement("UPDATE sis_component_template SET html_template = ? WHERE slug = 'news-grid'");
pstmt.setString(1, correctHtml);
int updated = pstmt.executeUpdate();
System.out.println("Updated rows: " + updated);
} catch (Exception e) {
e.printStackTrace();
}
}
}
+39
View File
@@ -0,0 +1,39 @@
#!/bin/bash
# Exit on any error
set -e
CONTAINER_NAME="sisvietnam-oracle-sisvietnam-oracle-1"
DUMP_FILE="sisvietnam_backup.dmp"
LOG_FILE="sisvietnam_backup.log"
echo "=== Starting Database Backup ==="
echo "Running expdp inside container: ${CONTAINER_NAME}..."
# Run expdp inside the container
docker exec ${CONTAINER_NAME} expdp sisvietnam/sisvietnam@//localhost:1521/sisvietnam \
schemas=sisvietnam \
directory=DATA_PUMP_DIR \
dumpfile=${DUMP_FILE} \
logfile=${LOG_FILE} \
reuse_dumpfiles=y
echo "=== Export Completed ==="
echo "Locating the backup file inside the container..."
# Find the file dynamically because the directory path contains a dynamic GUID
CONTAINER_PATH=$(docker exec ${CONTAINER_NAME} find /opt/oracle/admin/FREE/dpdump/ -name ${DUMP_FILE} | tr -d '\r')
if [ -z "${CONTAINER_PATH}" ]; then
echo "Error: Could not locate ${DUMP_FILE} inside the container."
exit 1
fi
echo "Found backup file at: ${CONTAINER_PATH}"
echo "Copying backup to local directory..."
# Copy to host
docker cp "${CONTAINER_NAME}:${CONTAINER_PATH}" "./${DUMP_FILE}"
echo "=== Backup Successfully Created ==="
echo "Saved to: ./${DUMP_FILE}"
+1
View File
@@ -0,0 +1 @@
SELECT meta_description FROM sis_post WHERE slug = 'sis-vi-suc-khoe-cong-dong-ky-134';
+1
View File
@@ -0,0 +1 @@
SELECT id, title, featured_image FROM sis_post WHERE slug = 'sis-vi-suc-khoe-cong-dong-ky-134';
+1
View File
@@ -0,0 +1 @@
SELECT sequence_name FROM user_sequences;
@@ -0,0 +1,72 @@
<div class="cc--component-container cc--tabbed-media-content" style="background-color: var(--color-gray-100);">
<div class="c--component c--tabbed-media-content">
<div class="tabbed-media-content-text-col">
<div data-component-id="umass_base:section-title" class="f--section-title">
<h2 style="color: var(--color-brand);">LiveStream</h2>
</div>
<div data-component-id="umass_base:tabbed-container" data-once="tabbed-container">
<div class="tab-labels-container" role="tablist">
<div class="tab-labels-inner">
{{#each livestream_posts}}
<a href="#tabbed-content-{{index}}" class="tab-label link-context-dark" role="tab" aria-selected="false" aria-controls="tabbed-content-{{index}}">{{title}}</a>
{{/each}}
</div>
</div>
<div class="tab-content-container">
{{#each livestream_posts}}
<div class="tab-content-panel" id="tabbed-content-{{index}}" role="tabpanel" aria-live="polite">
<div class="f--field f--cta-title">
<h2 style="color: var(--color-black);"> {{excerpt}} </h2>
</div>
<div data-component-id="umass_base:description" class="f--description">
<div style="color:var(--color-black);">{{content}}</div>
</div>
<div class="cta-container">
<div class="f--field f--button">
<a href="{{slug}}" class="button-primary button-context-light " aria-label="Tìm Hiểu Thêm" data-component-id="umass_base:button">
<span class="button-text"> Tìm Hiểu Thêm </span>
</a>
</div>
</div>
</div>
{{/each}}
</div>
</div>
</div>
<div class="tabbed-media-content-media-col">
{{#each livestream_posts}}
<div class="tabbed-media-content-media-item with-video" data-tab-id="tabbed-content-{{index}}">
<div class="f--field f--image">
<img src="{{featuredImageUrl}}" data-src="{{featuredImageUrl}}" class="lazyload" alt="{{title}}">
</div>
<div class="f--field f--button">
<a href="#" class="button-play button-context-light " aria-label="Play video" data-component-id="umass_base:button">
<span class="button-icon button-icon-play">
<svg width="18" height="27" viewBox="0 0 18 27" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M18 13.5L0 0V27L18 13.5Z"></path>
</svg>
</span>
<span class="button-text visually-hidden"> Play </span>
</a>
</div>
<div data-component-id="umass_base:video-embed" class="f--field f--video-embed">
<iframe title="Video Content" width="900" height="1600" src="{{metaDescription}}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
</div>
</div>
{{/each}}
</div>
</div>
</div>
<script>
document.addEventListener("DOMContentLoaded", function() {
// Set the first tab and panel as active if they exist
var tabs = document.querySelectorAll('.tabbed-media-content-media-item[data-tab-id="tabbed-content-0"]');
if(tabs.length > 0) tabs[0].classList.add('is-active');
var panels = document.querySelectorAll('#tabbed-content-0.tab-content-panel');
if(panels.length > 0) panels[0].classList.add('is-active');
var labels = document.querySelectorAll('a.tab-label[aria-controls="tabbed-content-0"]');
if(labels.length > 0) labels[0].setAttribute('aria-selected', 'true');
});
</script>
@@ -1,31 +1,180 @@
<div data-component-id="umass_base:block-multiple-ctas" data-background="solid" data-layout-variant="default">
<div class="container" th:unless="${ctaMenu != null and not #lists.isEmpty(ctaMenu.items)}">
<div class="text-container">
<body>
<div class="cc--component-container cc--tabbed-media-content" style="background-color: var(--color-gray-100);">
<div class="c--component c--tabbed-media-content">
<div class="tabbed-media-content-text-col">
<div data-component-id="umass_base:section-title" class="f--section-title">
<h2>TÌM HIỂU<span class="highlight">CHUYÊN KHOA</span></h2>
<h2 style="color: var(--color-brand);">LiveStream tháng 07</h2>
</div>
<div data-component-id="umass_base:tabbed-container" data-once="tabbed-container">
<div class="tab-labels-container" role="tablist">
<div class="tab-labels-inner">
<a href="https://www.umass.edu/#tabbed-content-campus-life" class="tab-label link-context-dark" role="tab" aria-selected="true" aria-controls="tabbed-content-campus-life">Tuần 1</a>
<a href="https://www.umass.edu/#tabbed-content-campus-housing" class="tab-label link-context-dark" role="tab" aria-selected="false" aria-controls="tabbed-content-campus-housing">Tuần 2</a>
<a href="https://www.umass.edu/#tabbed-content-dining" class="tab-label link-context-dark" role="tab" aria-selected="false" aria-controls="tabbed-content-dining">Tuần 3</a>
<a href="https://www.umass.edu/#tabbed-content-around-amherst" class="tab-label link-context-dark" role="tab" aria-selected="false" aria-controls="tabbed-content-around-amherst">Tuần 4</a>
</div>
</div>
<div class="links-container">
<div class="tab-content-container">
<div class="tab-content-panel is-active" id="tabbed-content-campus-life" role="tabpanel" aria-live="polite">
<div class="f--field f--cta-title">
<h2 style="color: var(--color-black);"> Tầm soát và phòng ngừa ung thư gan </h2>
</div>
<div data-component-id="umass_base:description" class="f--description">
<p style="color:var(--color-black);">Ung thư gan là một trong những bệnh ung thư có tỷ lệ tử vong hàng đầu tại Việt Nam. Đáng lo ngại, phần lớn người bệnh chỉ được phát hiện khi bệnh đã ở giai đoạn muộn, khi các cơ hội điều trị hiệu quả đã bị thu hẹp đáng kể.</p>
</div>
<div class="cta-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 href="https://www.umass.edu/gateway/campus-life/student-activities" class="button-primary button-context-light " aria-label="Tìm Hiểu Thêm" data-component-id="umass_base:button">
<span class="button-text"> Tìm Hiểu Thêm </span>
</a>
</div>
</div>
</div>
<div class="tab-content-panel" id="tabbed-content-campus-housing" role="tabpanel" aria-live="polite">
<div class="f--field f--cta-title">
<h3> Your Campus Home </h3>
</div>
<div data-component-id="umass_base:description" class="f--description">
<p>Choose from vibrant residential communities where students live, study, and build lasting friendships steps from the classroom.</p>
</div>
<div class="cta-container">
<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 &amp; Minors" target="_self" data-component-id="umass_base:button">
<span class="button-text"> Majors &amp; Minors </span>
<a href="https://www.umass.edu/gateway/campus-life/living-and-dining" class="button-primary button-context-light " aria-label="Learn About Living at UMass" data-component-id="umass_base:button">
<span class="button-text"> Tìm hiểu thêm </span>
</a>
</div>
</div>
</div>
<div class="tab-content-panel" id="tabbed-content-dining" role="tabpanel" aria-live="polite">
<div class="f--field f--cta-title">
<h3> Food Worth Talking About </h3>
</div>
<div data-component-id="umass_base:description" class="f--description">
<p>Discover why UMass dining is ranked #1 nationally—recognized for quality, variety, and sustainability.</p>
</div>
<div class="cta-container">
<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 &amp; Costs" target="_self" data-component-id="umass_base:button">
<span class="button-text"> Tuition &amp; Costs </span>
<a href="https://www.umassdining.com/" class="button-primary button-context-light ext" aria-label="Learn Why UMass is #1 in Dining" data-component-id="umass_base:button" data-extlink="">
<span class="button-text"> Learn Why UMass is #1 in Dining </span>
<svg focusable="false" width="1em" height="1em" class="ext" data-extlink-placement="append" aria-label="(link is external)" viewBox="0 0 80 40" role="img" aria-hidden="false">
<title>(link is external)</title>
<path d="M48 26c-1.1 0-2 0.9-2 2v26H10V18h26c1.1 0 2-0.9 2-2s-0.9-2-2-2H8c-1.1 0-2 0.9-2 2v40c0 1.1 0.9 2 2 2h40c1.1 0 2-0.9 2-2V28C50 26.9 49.1 26 48 26z"></path>
<path d="M56 6H44c-1.1 0-2 0.9-2 2s0.9 2 2 2h7.2L30.6 30.6c-0.8 0.8-0.8 2 0 2.8C31 33.8 31.5 34 32 34s1-0.2 1.4-0.6L54 12.8V20c0 1.1 0.9 2 2 2s2-0.9 2-2V8C58 6.9 57.1 6 56 6z"></path>
</svg>
</a>
</div>
</div>
</div>
<div class="tab-content-panel" id="tabbed-content-around-amherst" role="tabpanel" aria-live="polite">
<div class="f--field f--cta-title">
<h3> Amherst, Uncommon </h3>
</div>
<div data-component-id="umass_base:description" class="f--description">
<p>A vibrant creative culture, great food, and the natural beauty of the Pioneer Valley come together to shape this towns distinctive, welcoming spirit.</p>
</div>
<div class="cta-container">
<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 href="https://www.umass.edu/gateway/student-life/life-amherst" class="button-primary button-context-light " aria-label="Learn More About Amherst" data-component-id="umass_base:button">
<span class="button-text"> Learn More About Amherst </span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tabbed-media-content-media-col">
<div class="tabbed-media-content-media-item is-active with-video" data-tab-id="tabbed-content-campus-life">
<div class="f--field f--image">
<img data-src="https://www.umass.edu/sites/default/files/styles/9_16_720x1280/public/2026-03/medium_jpg-2026_Vertical_Assets_5179_John_Solem_.jpg?h=7c5befa5&amp;itok=DZUe-3fS" class=" ls-is-cached lazyloaded" alt="A UMass student plays ping pong." src="/UMass%20Amherst%20_%20UMass%20Amherst_files/medium_jpg-2026_Vertical_Assets_5179_John_Solem_.jpg">
</div>
<div class="f--field f--button">
<a href="https://www.umass.edu/#" class="button-play button-context-light " aria-label="Play video" data-component-id="umass_base:button">
<span class="button-icon button-icon-play">
<svg width="18" height="27" viewBox="0 0 18 27" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M18 13.5L0 0V27L18 13.5Z"></path>
</svg>
</span>
<span class="button-text visually-hidden"> Play </span>
</a>
</div>
<div data-component-id="umass_base:video-embed" class="f--field f--video-embed">
<iframe title="Video Content" id="video-132086-1" width="900" height="1600" src="https://www.youtube.com/embed/q0ZxZVbnMqs" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
</div>
</div>
<div class="tabbed-media-content-media-item with-video" data-tab-id="tabbed-content-campus-housing">
<div class="f--field f--image">
<img data-src="https://www.umass.edu/sites/default/files/styles/9_16_720x1280/public/2026-03/FY26_Vertical-Campus-Housing.jpg?h=75081741&amp;itok=6kDcYqy3" class="lazyload" alt="A UMass student sits on her bed in a dorm room.">
</div>
<div class="f--field f--button">
<a href="https://www.umass.edu/#" class="button-play button-context-light " aria-label="Play video" data-component-id="umass_base:button">
<span class="button-icon button-icon-play">
<svg width="18" height="27" viewBox="0 0 18 27" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M18 13.5L0 0V27L18 13.5Z"></path>
</svg>
</span>
<span class="button-text visually-hidden"> Play </span>
</a>
</div>
<div data-component-id="umass_base:video-embed" class="f--field f--video-embed">
<iframe title="Video Content" id="video-132086-2" width="900" height="1600" src="https://www.youtube.com/embed/7D_TnBztQhU" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
</div>
</div>
<div class="tabbed-media-content-media-item with-video" data-tab-id="tabbed-content-dining">
<div class="f--field f--image">
<img data-src="https://www.umass.edu/sites/default/files/styles/9_16_720x1280/public/2026-03/FY26_Vertical-Dining2.jpg?h=75081741&amp;itok=_34BDcqA" class="lazyload" alt="A student gets food at a UMass Amherst dining hall.">
</div>
<div class="f--field f--button">
<a href="https://www.umass.edu/#" class="button-play button-context-light " aria-label="Play video" data-component-id="umass_base:button">
<span class="button-icon button-icon-play">
<svg width="18" height="27" viewBox="0 0 18 27" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M18 13.5L0 0V27L18 13.5Z"></path>
</svg>
</span>
<span class="button-text visually-hidden"> Play </span>
</a>
</div>
<div data-component-id="umass_base:video-embed" class="f--field f--video-embed">
<iframe title="Video Content" id="video-132086-3" width="900" height="1600" src="https://www.youtube.com/embed/YRzZ9aRZ69w" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
</div>
</div>
<div class="tabbed-media-content-media-item with-video" data-tab-id="tabbed-content-around-amherst">
<div class="f--field f--image">
<img data-src="https://www.umass.edu/sites/default/files/styles/9_16_720x1280/public/2026-03/FY26_Vertical-Downtown-Amherst.jpg?h=75081741&amp;itok=irWjha4q" class="lazyload" alt="A UMass student holds a hote bag that reads &quot;I Love Amherst.&quot;">
</div>
<div class="f--field f--button">
<a href="https://www.umass.edu/#" class="button-play button-context-light " aria-label="Play video" data-component-id="umass_base:button">
<span class="button-icon button-icon-play">
<svg width="18" height="27" viewBox="0 0 18 27" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M18 13.5L0 0V27L18 13.5Z"></path>
</svg>
</span>
<span class="button-text visually-hidden"> Play </span>
</a>
</div>
<div data-component-id="umass_base:video-embed" class="f--field f--video-embed">
<iframe title="Video Content" id="video-132086-4" width="900" height="1600" src="https://www.youtube.com/embed/agqIJlJpbAY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
</div>
</div>
</div>
</div>
</div>
</body>
<style>* { box-sizing: border-box; } body {margin: 0;}
.tab-labels-inner {
border-bottom-color: var(--color-gray-800);
.tab-label {
font-weight: var(--font-weight-bold) !important;
color: var(--color-black) !important;
}
.tab-label {
&[aria-selected="true"] {
font-weight: 700;
color: var(--color-black);
border-bottom: 2px solid var(--color-brand) !important;
position: relative;
z-index: 10;
}
}
}
</style>

Some files were not shown because too many files have changed in this diff Show More