修复B2主题某位大佬分享的多语言翻译插件

修复源自https://mrxu.net/979.html大佬的多语言翻译插件，解决前端不显示的问题。

修复PC端完美显示：

移动端稍微有点错位，有大佬能修复的还请告诉我。哈哈哈~我实在是不会修复。

且针对图标进行了比例调整，需要在B2主题头部中引用：

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

然后添加自定义CSS：

/* --------------- 移动端登录态布局修复（仅屏幕≤768px生效） --------------- */
@media (max-width: 768px) {
  /* 1. 统一头部右侧用户区域为Flex布局，确保元素横向有序排列 */
  .header-user {
    display: flex;
    align-items: center; /* 垂直居中所有子元素 */
    gap: 8px; /* 元素之间保留8px间距，避免拥挤 */
    padding: 4px 0; /* 上下微增内边距，优化整体对齐 */
  }

  /* 2. 语言切换图标容器（translate-p）调整，避免偏移 */
  .translate-p.hover-show {
    margin-top: 0 !important; /* 清除原有inline样式的margin-top，避免上移错位 */
    margin-right: 65px;
    display: flex;
    align-items: center; /* 确保内部SVG图标垂直居中 */
  }

  /* 4. 登录后用户头像区域调整，控制大小和对齐 */
  .top-user-info .top-user-avatar {
    width: 28px; /* 移动端缩小头像尺寸，适配窄屏 */
    height: 28px;
  }
  .top-user-avatar .avatar {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 确保头像图片不拉伸 */
  }

  /* 5. 语言下拉菜单定位修复（避免遮挡或偏移） */
  .hover-show-con.dropdown-menu {
    top: 36px !important; /* 下拉菜单在图标正下方显示 */
    left: auto !important;
    right: 0; /* 右对齐，适配移动端右侧布局 */
    transform: none !important; /* 清除可能的位移干扰 */
  }
}
.social-top .change-theme>div a{
    margin-right: 1px;
}
@media screen and (max-width: 768px) {
    .top-style.header-banner .change-theme .mobile-show {
        display: block;
        margin-right: -10px;
    }
}

之后再启用插件即可。

插件下载地址：