import { createGlobalStyle } from "styled-components";

export const tySkeletonCls = "ty-skeleton";

export const SkeletonInjectStyle = createGlobalStyle`body, html {
  ${`.${tySkeletonCls}`} {
    &>.ant-skeleton-content {
      .ant-skeleton-title {
        background: var(--skeleton-bg) !important;
        margin: 12px 0;
        border-radius: 12px !important;
        height: 40px !important;
      }
      
      .ant-skeleton-paragraph {
        margin: 12px 0;

        &>li {
          height: 40px !important;
          background: var(--skeleton-bg) !important;
          border-radius: 12px !important;
          margin: 12px 0 !important;
        }
      }
    }
  }
}
`;
