GithubHelp home page GithubHelp logo

ant-design / ant-design-aliyun-theme Goto Github PK

View Code? Open in Web Editor NEW
304.0 8.0 40.0 32 KB

⚙ Ant Design Theme for console.aliyun.com

License: MIT License

JavaScript 18.05% TypeScript 81.95%
aliyun theme antd ant-design less css umi

ant-design-aliyun-theme's Introduction

Ant Design Theme for Aliyun

Travis npm package NPM downloads

Ant Design theme variables for Aliyun console design.

Still being experimental, welcome to try out and help us to improve it.

Visit https://theme.antd.group/aliyun to preview.

Install

$ npm install @ant-design/aliyun-theme

Usage

webpack

import aliyunTheme from '@ant-design/aliyun-theme';

// webpack.config.js: less-loader
{
  loader: 'less-loader',
  options: {
    modifyVars: aliyunTheme,
  },
},

umi

https://umijs.org/config/#theme

import aliyunTheme from '@ant-design/aliyun-theme';

// config.js or .umirc.js
export default {
  "theme": aliyunTheme,
}

Use in Ant Design Pro: ant-design/ant-design-pro#2946

less

@import "~@ant-design/aliyun-theme/index.less";

ant-design-aliyun-theme's People

Contributors

afc163 avatar dependabot-preview[bot] avatar depfu[bot] avatar gzgogo avatar hi-zhaoyeqing avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

ant-design-aliyun-theme's Issues

什么时候更新啊?

现在的阿里云控制台设计得很漂亮,小屏幕会自动收纳菜单。
现在这个演示的菜单,体验不太友好。

button组件type为danger时样式错误

在引入阿里云主题样式下使用button按钮

<Button type="danger">按钮</Button>

当按钮处于hover/active状态下,此时生效的样式分别为

image

image

这个很容易让人误以为是禁用状态,如下在Modal.confirm按钮会自动聚焦

Modal.confirm({
    title: 'Are you sure delete this task?',
    content: 'Some descriptions',
    okText: 'Yes',
    okType: 'danger',
    cancelText: 'No',
    onOk() {
      console.log('OK');
    },
    onCancel() {
      console.log('Cancel');
    },
  });

image

ant-design

使用aliyun-theme主题,对 ant-design有版本要求吗?

预览有问

预览配置中如果改了主题色,那么其它组件的type='primary'的颜色按道理也要生效,比如ALERT组件。

在ts语言的pro版本下,无法使用aliyun-theme

重现步骤:
1、修改config/config.ts,添加下面的语句:
import aliyunTheme from '@ant-design/aliyun-theme';
2、在config/config.ts中define前面增加一下这行:
theme: aliyunTheme,
3、执行yarn、yarn start,出现下面的错误:
yarn start
yarn run v1.22.0
$ umi dev
Cannot find module '@ant-design/aliyun-theme'
Require stack:

  • D:\inspect\monitorcraft-front\config\config.ts
  • D:\inspect\monitorcraft-front\node_modules@umijs\core\lib\Config\Config.js
  • D:\inspect\monitorcraft-front\node_modules@umijs\core\lib\index.js
  • D:\inspect\monitorcraft-front\node_modules\umi\lib\ServiceWithBuiltIn.js
  • D:\inspect\monitorcraft-front\node_modules\umi\lib\forkedDev.js
    Error: Cannot find module '@ant-design/aliyun-theme'
    Require stack:
  • D:\inspect\monitorcraft-front\config\config.ts
  • D:\inspect\monitorcraft-front\node_modules@umijs\core\lib\Config\Config.js
  • D:\inspect\monitorcraft-front\node_modules@umijs\core\lib\index.js
    ......

Prefix change layout disturb

When we change prefix layout disturb. How we can change html and css prefix. Currently css prefix change but html prefix same as it is (ant).
image

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.