Element-Theme-Ink

Ink

A dead simple element theme.

• Docs
• New Docs(rewrite with vuepress)
• GitHub: element-theme-ink
• npm: element-theme-ink

Base on element & element-theme-chalk

Installation

Install Element

可参见 Element 官方文档 安装

npm install element-ui -S

Install Theme

npm i element-theme-ink -S
# or
yarn add element-theme-ink

Usage

ElementUI 使用方法参见官网，各組件使用方法与 Element 2.3 版本一致，本项目仅对主题样式进行定制。

提供多种方式导入

Stylesheet

• JSDelivr: https://cdn.jsdelivr.net/npm/element-theme-ink

You can use unpkg directly.

<link rel="stylesheet" href="https://unpkg.com/element-theme-ink" />

Or use css in node_modules.

<link
  rel="stylesheet"
  href="path/to/node_modules/element-theme-ink/dist/index.css"
/>

Import in Sass

@import "element-theme-ink";

Import in Javascript

Fully import

// main.js
import "element-theme-ink";

Import on demand

import "element-theme-ink/dist/input.css";
import "element-theme-ink/dist/select.css";
// ...

Import Scss

import "element-theme-ink/src/index.scss";

Example

// main.js
import Vue from "vue";
import ElementUI from "element-ui";
// 当您想要切换回 element 默认主题时，只需取消默认主题的注释，并注释 ink 主题的引入即可
// import 'element-ui/dist/theme-chalk/index.css'
import "element-theme-ink";
import App from "./App.vue";

Vue.use(ElementUI);

new Vue({
  el: "#app",
  render: (h) => h(App),
});