import {
  AlipayOutlined,
  LockOutlined,
  MobileOutlined,
  TaobaoOutlined,
  UserOutlined,
  WeiboOutlined,
} from '@ant-design/icons';

import LOGO from '../../assets/pr-logo.png';
import BACKGROUND_IMG from '../../assets/login_bg1.png';
import BACKGROUND_VIDEO_URL from '../../assets/login_bg.svg';
import DARK from '../../assets/dark.svg';
import GREEN from '../../assets/green.svg';
import LIGHT from '../../assets/ligth.svg';
import ORIGINAL from '../../assets/original.svg';
import PINK from '../../assets/pink.svg';

const IS_DEVELOPMENT = process.env.NODE_ENV === 'development';

export const STATIC_RESOURCE = {
  BACKGROUND_IMG,
  LOGO,
  BACKGROUND_VIDEO_URL
}

export const ImageUrl = IS_DEVELOPMENT ? `url(src/app/assets/login_bg.svg)` : `url(./login_bg.svg)`

export const THEME_RESOURCE = {
  LIGHT,
  DARK,
  GREEN,
  PINK,
  ORIGINAL
}

export const ICON_STYLE = {
  color: 'rgba(0, 0, 0, 0.2)',
  fontSize: '18px',
  verticalAlign: 'middle',
  cursor: 'pointer',
};

export const AUTH_CLIENT_ICON_MAPPING = {
  ALIPAY: <AlipayOutlined style={{...ICON_STYLE, color: '#1677FF'}}/>,
  TAOBAO: <TaobaoOutlined style={{...ICON_STYLE, color: '#FF6A10'}}/>,
  WEIBO: <WeiboOutlined style={{...ICON_STYLE, color: '#1890ff'}}/>,

  USER: <UserOutlined />,
  MOBILE: <MobileOutlined />,
  LOCK: <LockOutlined />,
}

export const COLOR_PRIMARY = {
  LEVEL1:'#1677FF',
  LEVEL2:'#5A54F9',
  LEVEL3:'#9E339F',
  LEVEL4:'#ED4192',
  LEVEL5:'#E0282E',
  LEVEL6:'#F4801A',
  LEVEL7:'#F2BD27',
  LEVEL8:'#00B96B',
  LEVEL99:'chroma',
}
