import { css, themeVars } from "src/types/vars";

export const red = css`
  .text.red .svg,
  .text.red.svg {
    // 关闭工单按钮设置为紫色
    &.octicon-issue-closed {
      color: ${themeVars.github.fgColor.done} !important;
    }
  }
  
  // 增强红色文本的视觉效果
  .text.red {
    color: ${themeVars.color.red.self} !important;
    font-weight: 500; // 增加字体粗细
  }
`;

export const grey = css`
  // 默认颜色是 --color-text-light, 主题下此颜色是亮白色, 修改为灰色
  // release 页面下一些描述信息的文本颜色
  .text.grey {
    color: ${themeVars.color.text.light.num1} !important;
  }
  
  // 增强灰色文本的视觉效果
  .text.grey {
    font-weight: 400; // 设置字体粗细
  }
`;

// 增加更多文本颜色样式
export const textColors = css`
  .text.blue {
    color: ${themeVars.color.blue.self} !important;
    font-weight: 500; // 增加字体粗细
  }
  
  .text.green {
    color: ${themeVars.color.green.self} !important;
    font-weight: 500; // 增加字体粗细
  }
  
  .text.yellow {
    color: ${themeVars.color.yellow.self} !important;
    font-weight: 500; // 增加字体粗细
  }
  
  .text.purple {
    color: ${themeVars.color.purple.self} !important;
    font-weight: 500; // 增加字体粗细
  }
  
  .text.orange {
    color: ${themeVars.color.orange.self} !important;
    font-weight: 500; // 增加字体粗细
  }
  
  // 链接文本样式
  a.text {
    transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
    &:hover {
      opacity: 0.8; // 悬停时降低不透明度
      text-decoration: underline; // 悬停时添加下划线
    }
  }
`;