@charset "UTF-8";
.container {
	background-color: #FFFFFF;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	border-bottom-width: 0px;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}
.row {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: inline-block
}
.row.blockDisplay {
	display: block;
}
.row_1 {
	width: 100%;
	background-color: #b3b3b3;
	padding-top: 10px;
	padding-bottom: 10px;
	clear: left;
}
.column_half {
	width: 50%;
	float: left;
	margin-top: 0px;
}
.columns {
	width: 13%;
	float: left;
	font-family: "Source Sans Pro";
	color: #A5A5A5;
	line-height: 20px;
	padding-top: 0px;
	padding-bottom: 10px;
	text-align: justify;
	margin-top: 0px;
	margin-bottom: 15px;
	padding-left: 0px;
	padding-right: 0px;
	margin-left: 0px;
	margin-right: 0px;
}
.columns_co {
	width: 50%;
	float: left;
	font-family: "Source Sans Pro";
	background-color: #FFFFFF;
	line-height: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	margin-left: 0px;
	margin-right: 0px;
}
.row .columns p {
	padding-left: 10%;
	padding-right: 10%;
}
.container .columns h4 {
	text-align: center;
	color: #01B2D1;
}
.primary_header {
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	clear: left;
}
.banner {
	width: 100%;
	clear: left;
}
.secondary_header {
	width: 100%;
	padding-top: 50px;
	padding-bottom: 50px;
	background-color: #B3B3B3;
	clear: left;
}
.container .secondary_header ul {
	margin-top: 0%;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 30px;
	padding-left: 0px;
	width: 100%;
}
.secondary_header ul li {
	list-style: none;
	float: left;
	margin-right: auto;
	margin-top: 0px;
	font-family: "Source Sans Pro";
	font-weight: normal;
	font-size: 20px;
	color: #FFFFFF;
	letter-spacing: 1px;
	margin-left: auto;
	text-align: center;
	width: 16.5%;
	transition: all 0.3s linear;

}
.secondary_header ul li:hover {
	color: #717070;
	cursor: pointer;
}
.button {
	font-family: "Source Sans Pro";
	font-weight: normal;
	text-decoration: none;
	color: #FFFFFF;
	letter-spacing: 1px;
	margin-left: auto;
	text-align: center;
	width: 16%;
	transition: all 0.3s linear;
}
.button:hover {
	color: #717070;
	cursor: pointer;
}
.left_article {
	background-color: #FFFFFF;
	width: 60%;
	float: left;
	font-family: "Source Sans Pro";
	color: #474747;
	padding-top: 25px;
	padding-bottom: 15px;
}
.main_article {
	background-color: #FFFFFF;
	width: 100%;
	float: left;
	font-family: "Source Sans Pro";
	color: #474747;
	padding-top: 25px;
	padding-bottom: 15px;
}
.table {
	background-color: #FFFFFF;
	width: 80%;
	font-family: "Source Sans Pro";
	color: #474747;
}
.noDisplay {
	display: none;
}
.container .left_article h3 {
	padding-left: 8%;
	padding-right: 5%;
	color: #474747;
	font-weight: bold;
	font-size: 35px;
	text-transform: uppercase;
}
.container .left_article h2 {
	padding-left: 8%;
	padding-right: 5%;
	color: #474747;
	font-weight: bold;
	font-size: 25px;
	text-transform: uppercase;
}
.container .main_article h3 {
	padding-left: 8%;
	padding-right: 5%;
	margin-top: 5%;
	color: #474747;
	font-weight: bold;
	font-size: 30px;
	text-transform: uppercase;
}
.container .left_article p {
	padding-left: 8%;
	padding-right: 9%;
	text-align: justify;
	line-height: 35px;
	margin-top: 60px;
	margin-bottom: 15px;
	color: #474747;
	font-size: 20px;
}
.container .main_article p {
	padding-left: 8%;
	padding-right: 9%;
	text-align: justify;
	line-height: 35px;
	margin-top: 60px;
	margin-bottom: 15px;
	color: #474747;
	font-size: 20px;
}
.container .table {
	line-height: 120%;
	margin-left: 8%;
	color: #474747;
	font-size: 20px; 
}
.right_article {
	width: 40%;
	float: left;
	background-color: #FFFFFF;
}
.container .right_article ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.right_article ul li {
	font-family: "Source Sans Pro";
	list-style: none;
	text-align: center;
	background-color: #B3B3B3;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-top: 15px;
	padding-bottom: 15px;
	color: #FFFFFF;
	font-weight: bold;
	border-radius: 0px;
	transition: all 0.3s linear;
	border-left: 5px solid #717070;
}
.right_article ul li:hover {
	background-color: #717070;
	cursor: pointer;
}
.footer {
	background-color: #b3b3b3;
}
.title {
	font-weight: bold;
	font-style: normal;
	font-family: "Source Sans Pro";
	text-align: center;
	color: #FFFFFF;
	letter-spacing: 2px;
}
.placeholder {
	/* [disabled]max-width: 400px;
*/
	/* [disabled]max-height: 200px;
*/
	width: 100%;
	padding-top: 0px;
	/* [disabled]padding-left: 19px;
*/
	padding-bottom: 0px;
	height: 100%;
	float: left;
}
.column_title {
	padding-top: 25px;
	padding-bottom: 25px;
}
.copyright {
	text-align: center;
	background-color: #b3b3b3;
	color: #FFFFFF;
	text-transform: uppercase;
	font-weight: lighter;
	letter-spacing: 2px;
	border-top-width: 2px;
	font-family: "Source Sans Pro";
}
body {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

@media (max-width: 320px) {
.secondary_header ul li {
	float: none;
	margin-top: 28px;
	margin-left: 0px;
	width: 100%;
}
.container .secondary_header ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	height: auto;
	width: 100%;
	text-align: center;
}
.secondary_header {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 1px;
	padding-bottom: 40px;
}
.left_article {
	width: 100%;
	height: auto;
}
.right_article {
	width: 100%;
	height: auto;
}
.main_article {
	width: 100%;
	height: auto;
}
.table {
	width: 80%;
	height: auto;
}
.placeholder {
	width: 100%;
	margin-top: 22PX;
	margin-right: 0px;
	margin-bottom: 22PX;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	max-width: 400px;
	max-height: 600px;
	height: auto;
}
.columns {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0PX;
	padding-right: 0PX;
	padding-bottom: 0PX;
	padding-left: 0PX;
}
.columns p {
	padding-left: 10px;
	padding-right: 10px;
}
	.columns_co {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0PX;
	padding-right: 0PX;
	padding-bottom: 0PX;
	padding-left: 0PX;
}
.copyright {
	padding-top: 25px;
	padding-bottom: 0px;
	margin-bottom: 0px;
}
.container .left_article h3 {
	margin-top: 30px;
}
.container .main_article h3 {
	margin-top: 30px;
}
.social .social_icon img {
	width: 80%;
}
.container .secondary_header {
}
}

@media (min-width: 321px) and (max-width: 768px) {
.secondary_header ul li {
	float: none;
	margin-top: 28px;
	margin-left: 0px;
	width: 100%;
}
.container .secondary_header ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	height: auto;
	width: 100%;
	text-align: center;
}
.secondary_header {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 1px;
	padding-bottom: 40px;
}
.left_article {
	width: 100%;
	height: auto;
}
.right_article {
	width: 100%;
	height: auto;
	padding-bottom: 25px;
}
.main_article {
	width: 100%;
	height: auto;
	}
.table {
	width: 80%;
	height: auto;
	}
.placeholder {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	width: 100%;
	max-width: 100%;
	height: auto;
	max-height: 100%;
}
.columns {
	width: 100%;
	margin-top: 6px;
	margin-right: 0px;
	margin-bottom: 6px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.columns p {
	padding-left: 14px;
	padding-right: 14px;
}
.columns_host {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0PX;
	padding-right: 0PX;
	padding-bottom: 0PX;
	padding-left: 0PX;
}
.columns_co {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0PX;
	padding-right: 0PX;
	padding-bottom: 0PX;
	padding-left: 0PX;
}
.copyright {
	padding-top: 25px;
	padding-bottom: 0px;
	margin-bottom: 0px;
}
}

@media (min-width: 769px) and (max-width: 1000px) {
.secondary_header {
	overflow: auto;
	padding-top: 30px;
	padding-bottom: 30px;
}
.secondary_header ul li {
	margin-top: 10px;
	margin-bottom: 10px;
}
.left_article {
	height: auto;
}
.right_article {
	height: auto;
	padding-bottom: 27px;
}
.main_article {
		height: auto;
	}
.table {
	width: 100%;
	height: auto;
	}
.placeholder {
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}
.columns {
	width: 50%;
	float: left;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}
.container .columns p {
	padding-left: 25px;
	padding-right: 25px;
}
.columns_host {
	width: 50%;
	float: left;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}
.columns_co {
	width: 20%;
	float: left;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}
.copyright {
	padding-top: 25px;
	padding-bottom: 0px;
	margin-bottom: 0px;
}
}

@media (min-width: 1001px) {
}
.thumbnail_1 {
	width: auto;
	margin-top: -30px;
	margin-left: auto;
}
.thumbnail_2 {
	width: auto;
	margin-top: -30px;
	margin-left: auto;
}
.thumbnail_3 {
	width: 10%;
	margin-top: auto;
	margin-left: auto;
}
.thumbnail_4 {
	width: 10%;
	margin-top: -30px;
	margin-left: auto;
	margin-right: auto;
}
.thumbnail_5 {
	width: 70%;
	margin-top: -30px;
	margin-left: auto;
}



.thumbnail_align {
	text-align: center;
	}
.social {
	text-align: center;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	width: 100%;
	background-color: #414141;
	clear: both;
	overflow: auto;
}
.social_icon {
	width: 25%;
	text-align: center;
	float: left;
	transition: all 0.3s linear;
	line-height: 0px;
	padding-top: 7px;
}
.photo {
	width: 66%;
	height:100%;
	margin-left: auto;
}
.photo_1 {
	width: 66%;
	margin-left: auto;
}
.container .social .social_icon:hover {
	cursor: pointer;
	opacity: 0.5;
}
#menu {
}
#!/usr/bin/env python3
"""自动修正 yue30 三语页面的表头字体、垂直对齐和菜单间距。"""

from __future__ import annotations

import argparse
import codecs
import re
import shutil
from datetime import datetime
from pathlib import Path


CSS_PATCH = r"""/* YUE30_HEADER_ALIGNMENT_FIX_START */
/* 表头繁体字体、垂直对齐和菜单间距修正 */

/* 英文默认字体 */
html {
    --yue30-nav-font: "Source Sans Pro", Arial, sans-serif;
}

/* 繁体中文字体 */
html[lang="zh-Hant"] {
    --yue30-nav-font:
        "Microsoft JhengHei",
        "Noto Sans TC",
        "PingFang TC",
        "Heiti TC",
        sans-serif;
}

/* 简体中文字体 */
html[lang="zh-Hans"] {
    --yue30-nav-font:
        "Microsoft YaHei",
        "Noto Sans SC",
        "PingFang SC",
        "Heiti SC",
        sans-serif;
}

/* 表头上下间距 */
#menu.secondary_header {
    box-sizing: border-box;
    padding-top: 36px;
    padding-bottom: 36px;
}

/* 使用 Flex 平均分配六个菜单 */
#menu > ul {
    display: flex;
    align-items: stretch;
    min-height: 56px;
    margin: 0;
    padding: 0;
}

/* 每个菜单垂直、水平居中 */
#menu > ul > li {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    float: none;
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    margin: 0;
    padding: 0 8px;
    font-family: var(--yue30-nav-font);
    line-height: 1.4;
}

/* 修正链接原来设置的固定宽度和 margin */
#menu .button {
    display: inline-block;
    width: auto;
    margin-left: 0;
    font-family: inherit;
    line-height: inherit;
}

/* 确保下拉菜单可以作为箭头的定位基准 */
#menu .dropdown {
    position: relative;
}

/* 原来的 <br> 会令“有用资料”比其他菜单高 */
#menu .dropdown > br {
    display: none;
}

/* 下拉箭头放在菜单文字正下方 */
#menu .dropdown > .dropbtn {
    position: absolute;
    top: 100%;
    left: 50%;
    line-height: 1;
    transform: translateX(-50%);
}

/* 使用普通三角形，避免箭头字体产生位置偏差 */
#menu .dropdown > .dropbtn::before {
    content: "\25BC";
    font-family: Arial, sans-serif;
    font-size: 0.65em;
}

/* 下拉内容的位置 */
#menu .dropdown-content {
    top: calc(100% + 24px);
    margin-top: 0;
}

/* 最后一个语言切换菜单不要换行 */
#menu > ul > li:last-child {
    white-space: nowrap;
}

/* 调整“简 | English”等文字两边的间距 */
#menu > ul > li:last-child .button {
    margin-right: 0.28em;
    margin-left: 0.28em;
}

/* 手机和平板竖屏 */
@media (max-width: 768px) {
    #menu.secondary_header {
        padding-top: 1px;
        padding-bottom: 40px;
    }

    #menu > ul {
        display: block;
        min-height: 0;
    }

    #menu > ul > li {
        width: 100%;
        margin-top: 28px;
        padding-right: 12px;
        padding-left: 12px;
    }
}

/* 平板横屏、小型电脑 */
@media (min-width: 769px) and (max-width: 1000px) {
    #menu.secondary_header {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    #menu > ul > li {
        margin-top: 10px;
        margin-bottom: 10px;
    }
}
/* YUE30_HEADER_ALIGNMENT_FIX_END */"""


HTML_TAG_RE = re.compile(r"<html\b[^>]*>", re.IGNORECASE)
LANG_ATTR_RE = re.compile(
    r"\blang\s*=\s*(?:\"[^\"]*\"|'[^']*'|[^\s>]+)", re.IGNORECASE
)


def read_utf8(path: Path) -> tuple[str, bool, str]:
    """读取 UTF-8 文件，并记录 BOM 和原来的换行格式。"""
    raw = path.read_bytes()
    has_bom = raw.startswith(codecs.BOM_UTF8)
    text = raw.decode("utf-8-sig")
    newline = "\r\n" if b"\r\n" in raw else "\n"
    return text, has_bom, newline


def write_utf8(path: Path, text: str, has_bom: bool) -> None:
    raw = text.encode("utf-8")
    if has_bom:
        raw = codecs.BOM_UTF8 + raw
    path.write_bytes(raw)


def language_for_filename(path: Path) -> str:
    name = path.name.lower()
    if name.endswith("_zh-cn.html"):
        return "zh-Hans"
    if name.endswith("_en.html"):
        return "en"
    return "zh-Hant"


def set_html_language(text: str, language: str) -> str:
    match = HTML_TAG_RE.search(text)
    if not match:
        raise ValueError("找不到 <html> 标签")

    old_tag = match.group(0)
    if LANG_ATTR_RE.search(old_tag):
        new_tag = LANG_ATTR_RE.sub(f'lang="{language}"', old_tag, count=1)
    else:
        new_tag = old_tag[:-1].rstrip() + f' lang="{language}">'

    return text[: match.start()] + new_tag + text[match.end() :]


def add_css_patch(text: str, newline: str) -> str:
    # 已经修过时不重复添加。
    if (
        "YUE30_HEADER_ALIGNMENT_FIX_START" in text
        or "--yue30-nav-font" in text
    ):
        return text

    patch = CSS_PATCH.replace("\n", newline)
    return text.rstrip("\r\n") + newline * 2 + patch + newline


def prepare_changes(folder: Path) -> list[tuple[Path, str, bool]]:
    css_path = folder / "style_c.css"
    if not css_path.is_file():
        raise FileNotFoundError(f"找不到样式文件：{css_path}")

    html_paths = sorted(folder.glob("*.html"))
    if not html_paths:
        raise FileNotFoundError(f"文件夹内没有 HTML 文件：{folder}")

    changes: list[tuple[Path, str, bool]] = []

    css_text, css_bom, css_newline = read_utf8(css_path)
    new_css = add_css_patch(css_text, css_newline)
    if new_css != css_text:
        changes.append((css_path, new_css, css_bom))

    for html_path in html_paths:
        html_text, html_bom, _ = read_utf8(html_path)
        language = language_for_filename(html_path)
        new_html = set_html_language(html_text, language)
        if new_html != html_text:
            changes.append((html_path, new_html, html_bom))

    return changes


def main() -> int:
    parser = argparse.ArgumentParser(
        description="自动修正 yue30 三语页面的表头字体、对齐和菜单间距。"
    )
    parser.add_argument(
        "folder",
        nargs="?",
        type=Path,
        default=Path(__file__).resolve().parent,
        help="yue30 文件夹路径；省略时使用脚本所在文件夹。",
    )
    parser.add_argument(
        "--dry-run",
        action="store_true",
        help="只检查将会修改哪些文件，不实际写入。",
    )
    args = parser.parse_args()

    folder = args.folder.expanduser().resolve()
    try:
        changes = prepare_changes(folder)
    except (FileNotFoundError, UnicodeDecodeError, ValueError) as exc:
        print(f"错误：{exc}")
        return 1

    if not changes:
        print("检查完成：文件已经包含修正，无需重复修改。")
        return 0

    print(f"准备修改 {len(changes)} 个文件：")
    for path, _, _ in changes:
        print(f"  - {path.name}")

    if args.dry_run:
        print("这是预览模式，尚未写入任何文件。")
        return 0

    timestamp = datetime.now().strftime("%Y%m%d_%H%M%S")
    backup_folder = folder / f"header_fix_backup_{timestamp}"
    backup_folder.mkdir()

    for path, _, _ in changes:
        shutil.copy2(path, backup_folder / path.name)

    for path, new_text, has_bom in changes:
        write_utf8(path, new_text, has_bom)

    print()
    print("修正完成。")
    print(f"原文件备份位置：{backup_folder}")
    print("请重新打开网页，或按 Ctrl+F5 强制刷新浏览器后检查表头。")
    return 0


if __name__ == "__main__":
    raise SystemExit(main())