fix: 修改示例
This commit is contained in:
Boyuzhou
parent
29370a13a9
commit
6770417d91
|
|
@ -1,61 +0,0 @@
|
|||
/**
|
||||
*
|
||||
* @title Tree基本使用事例
|
||||
* @description 事例涵盖 checkbox如何选择，disable状态和部分选择状态。
|
||||
*
|
||||
*/
|
||||
|
||||
|
||||
import React, {
|
||||
Component
|
||||
} from 'react';
|
||||
import Tree from '../../src';
|
||||
|
||||
const TreeNode = Tree.TreeNode;
|
||||
|
||||
const defaultProps = {
|
||||
keys: ['0-0-0', '0-0-1']
|
||||
}
|
||||
console.log(Tree);
|
||||
class Demo1 extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
const keys = this.props.keys;
|
||||
this.state = {
|
||||
defaultExpandedKeys: keys,
|
||||
defaultSelectedKeys: keys,
|
||||
defaultCheckedKeys: keys,
|
||||
};
|
||||
}
|
||||
onSelect(info) {
|
||||
console.log('selected', info);
|
||||
}
|
||||
onCheck(info) {
|
||||
console.log('onCheck', info);
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<Tree className="myCls" showLine checkable
|
||||
defaultExpandedKeys={this.state.defaultExpandedKeys}
|
||||
defaultSelectedKeys={this.state.defaultSelectedKeys}
|
||||
defaultCheckedKeys={this.state.defaultCheckedKeys}
|
||||
onSelect={this.onSelect} onCheck={this.onCheck}
|
||||
>
|
||||
<TreeNode title="parent 1" key="0-0">
|
||||
<TreeNode title="parent 1-0" key="0-0-0" disabled>
|
||||
<TreeNode title="leaf" key="0-0-0-0" disableCheckbox />
|
||||
<TreeNode title="leaf" key="0-0-0-1" />
|
||||
</TreeNode>
|
||||
<TreeNode title="parent 1-1" key="0-0-1">
|
||||
<TreeNode title={<span style={{ color: '#08c' }}>sss</span>} key="0-0-1-0" />
|
||||
</TreeNode>
|
||||
</TreeNode>
|
||||
</Tree>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Demo1.defaultProps = defaultProps;
|
||||
|
||||
|
||||
export default Demo1;
|
||||
160
demo/Demo4.js
160
demo/Demo4.js
|
|
@ -1,160 +0,0 @@
|
|||
/**
|
||||
*
|
||||
* @title Tree可搜索事例
|
||||
* @description
|
||||
*
|
||||
*/
|
||||
|
||||
|
||||
import React, {
|
||||
Component
|
||||
} from 'react';
|
||||
import FormControl from 'bee-form-control';
|
||||
import Tree from '../../src';
|
||||
|
||||
const x = 3;
|
||||
const y = 2;
|
||||
const z = 1;
|
||||
const gData = [];
|
||||
|
||||
const generateData = (_level, _preKey, _tns) => {
|
||||
const preKey = _preKey || '0';
|
||||
const tns = _tns || gData;
|
||||
|
||||
const children = [];
|
||||
for (let i = 0; i < x; i++) {
|
||||
const key = `${preKey}-${i}`;
|
||||
tns.push({
|
||||
title: key,
|
||||
key
|
||||
});
|
||||
if (i < y) {
|
||||
children.push(key);
|
||||
}
|
||||
}
|
||||
if (_level < 0) {
|
||||
return tns;
|
||||
}
|
||||
const level = _level - 1;
|
||||
children.forEach((key, index) => {
|
||||
tns[index].children = [];
|
||||
return generateData(level, key, tns[index].children);
|
||||
});
|
||||
};
|
||||
generateData(z);
|
||||
|
||||
const TreeNode = Tree.TreeNode;
|
||||
|
||||
const dataList = [];
|
||||
const generateList = (data) => {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
const node = data[i];
|
||||
const key = node.key;
|
||||
dataList.push({
|
||||
key,
|
||||
title: key
|
||||
});
|
||||
if (node.children) {
|
||||
generateList(node.children, node.key);
|
||||
}
|
||||
}
|
||||
};
|
||||
generateList(gData);
|
||||
|
||||
const getParentKey = (key, tree) => {
|
||||
let parentKey;
|
||||
for (let i = 0; i < tree.length; i++) {
|
||||
const node = tree[i];
|
||||
if (node.children) {
|
||||
if (node.children.some(item => item.key === key)) {
|
||||
parentKey = node.key;
|
||||
} else if (getParentKey(key, node.children)) {
|
||||
parentKey = getParentKey(key, node.children);
|
||||
}
|
||||
}
|
||||
}
|
||||
return parentKey;
|
||||
};
|
||||
|
||||
|
||||
class Demo4 extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
expandedKeys: [],
|
||||
searchValue: '',
|
||||
autoExpandParent: true,
|
||||
}
|
||||
}
|
||||
onExpand = (expandedKeys) => {
|
||||
this.setState({
|
||||
expandedKeys,
|
||||
autoExpandParent: false,
|
||||
});
|
||||
}
|
||||
onChange = (value) => {
|
||||
// const value = e.target.value;
|
||||
const expandedKeys = [];
|
||||
dataList.forEach((item) => {
|
||||
if (item.key.indexOf(value) > -1) {
|
||||
expandedKeys.push(getParentKey(item.key, gData));
|
||||
}
|
||||
});
|
||||
const uniqueExpandedKeys = [];
|
||||
expandedKeys.forEach((item) => {
|
||||
if (item && uniqueExpandedKeys.indexOf(item) === -1) {
|
||||
uniqueExpandedKeys.push(item);
|
||||
}
|
||||
});
|
||||
this.setState({
|
||||
expandedKeys: uniqueExpandedKeys,
|
||||
searchValue: value,
|
||||
autoExpandParent: true,
|
||||
});
|
||||
}
|
||||
render() {
|
||||
const {
|
||||
searchValue,
|
||||
expandedKeys,
|
||||
autoExpandParent
|
||||
} = this.state;
|
||||
const loop = data => data.map((item) => {
|
||||
const index = item.key.search(searchValue);
|
||||
const beforeStr = item.key.substr(0, index);
|
||||
const afterStr = item.key.substr(index + searchValue.length);
|
||||
const title = index > -1 ? (
|
||||
<span>
|
||||
{beforeStr}
|
||||
<span className="u-tree-searchable-filter">{searchValue}</span>
|
||||
{afterStr}
|
||||
</span>
|
||||
) : <span>{item.key}</span>;
|
||||
if (item.children) {
|
||||
return (
|
||||
<TreeNode key={item.key} title={title}>
|
||||
{loop(item.children)}
|
||||
</TreeNode>
|
||||
);
|
||||
}
|
||||
return <TreeNode key={item.key} title={title} />;
|
||||
});
|
||||
return (
|
||||
<div>
|
||||
<FormControl
|
||||
style={{ width: 200 }}
|
||||
placeholder="Search"
|
||||
onChange={this.onChange}
|
||||
/>
|
||||
<Tree
|
||||
onExpand={this.onExpand}
|
||||
expandedKeys={expandedKeys}
|
||||
autoExpandParent={autoExpandParent}
|
||||
>
|
||||
{loop(gData)}
|
||||
</Tree>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Demo4;
|
||||
|
|
@ -5,19 +5,5 @@
|
|||
@import "../node_modules/bee-button/src/Button.scss";
|
||||
@import "../node_modules/bee-transition/src/Transition.scss";
|
||||
@import "../node_modules/bee-form-control/src/FormControl.scss";
|
||||
.u-tree-searchable-filter {
|
||||
color: #f50;
|
||||
transition: all .3s ease;
|
||||
}
|
||||
|
||||
.title-middle {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.edit-icon {
|
||||
float:right;
|
||||
font-size: 14px;
|
||||
}
|
||||
.title-con {
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
.u-tree-searchable-filter {
|
||||
color: #f50;
|
||||
transition: all .3s ease;
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
.title-middle {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.edit-icon {
|
||||
float:right;
|
||||
font-size: 14px;
|
||||
}
|
||||
.title-con {
|
||||
min-width: 150px;
|
||||
}
|
||||
|
|
@ -1,41 +1,9 @@
|
|||
|
||||
import { Con, Row, Col } from 'bee-layout';
|
||||
import { Panel } from 'bee-panel';
|
||||
import {Col, Row} from 'bee-layout';
|
||||
import {Panel} from 'bee-panel';
|
||||
import Button from 'bee-button';
|
||||
import React, { Component } from 'react';
|
||||
import React, {Component} from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import FormControl from 'bee-form-control';
|
||||
import Tree from '../src';
|
||||
|
||||
const x = 3;
|
||||
const y = 2;
|
||||
const z = 1;
|
||||
const gData = [];
|
||||
|
||||
const generateData = (_level, _preKey, _tns) => {
|
||||
const preKey = _preKey || '0';
|
||||
const tns = _tns || gData;
|
||||
|
||||
const children = [];
|
||||
for (let i = 0; i < x; i++) {
|
||||
const key = `${preKey}-${i}`;
|
||||
tns.push({ title: key, key });
|
||||
if (i < y) {
|
||||
children.push(key);
|
||||
}
|
||||
}
|
||||
if (_level < 0) {
|
||||
return tns;
|
||||
}
|
||||
const level = _level - 1;
|
||||
children.forEach((key, index) => {
|
||||
tns[index].children = [];
|
||||
return generateData(level, key, tns[index].children);
|
||||
});
|
||||
};
|
||||
generateData(z);
|
||||
|
||||
const TreeNode = Tree.TreeNode;
|
||||
|
||||
const CARET = <i className="uf uf-arrow-down"></i>;
|
||||
|
||||
|
|
@ -45,46 +13,40 @@ const CARETUP = <i className="uf uf-arrow-up"></i>;
|
|||
{demolist}
|
||||
|
||||
class Demo extends Component {
|
||||
constructor(props){
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
open: false
|
||||
}
|
||||
this.handleClick = this.handleClick.bind(this);
|
||||
}
|
||||
|
||||
handleClick() {
|
||||
this.setState({ open: !this.state.open })
|
||||
this.setState({open: !this.state.open})
|
||||
}
|
||||
|
||||
render () {
|
||||
const { title, example, code, desc } = this.props;
|
||||
render() {
|
||||
const {title, example, code, desc, scss_code} = this.props;
|
||||
let caret = this.state.open ? CARETUP : CARET;
|
||||
let text = this.state.open ? "隐藏代码" : "查看代码";
|
||||
|
||||
const footer = (
|
||||
<Button shape="block" onClick={ this.handleClick }>
|
||||
{ caret }
|
||||
{ text }
|
||||
</Button>
|
||||
);
|
||||
const header = (
|
||||
<Row>
|
||||
<Col md={11}>
|
||||
{ example }
|
||||
</Col>
|
||||
<Col md={1}>
|
||||
<Button shape="icon" onClick={ this.handleClick }>
|
||||
{ caret }
|
||||
<div>
|
||||
{example}
|
||||
<Button style={{"marginTop": "10px"}} shape="block" onClick={this.handleClick}>
|
||||
{caret}
|
||||
{text}
|
||||
</Button>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
);
|
||||
return (
|
||||
<Col md={12} >
|
||||
<h3>{ title }</h3>
|
||||
<p>{ desc }</p>
|
||||
<Panel collapsible headerContent expanded={ this.state.open } colors='bordered' header={ header } footer={footer} footerStyle = {{padding: 0}}>
|
||||
<pre><code className="hljs javascript">{ code }</code></pre>
|
||||
<Col md={12}>
|
||||
<h3>{title}</h3>
|
||||
<p>{desc}</p>
|
||||
<Panel collapsible headerContent expanded={this.state.open} colors='bordered' header={header}
|
||||
footerStyle={{padding: 0}}>
|
||||
<pre><code className="hljs javascript">{code}</code></pre>
|
||||
{!!scss_code ? <pre><code className="hljs css">{scss_code}</code></pre> : null}
|
||||
</Panel>
|
||||
</Col>
|
||||
)
|
||||
|
|
@ -92,20 +54,22 @@ class Demo extends Component {
|
|||
}
|
||||
|
||||
class DemoGroup extends Component {
|
||||
constructor(props){
|
||||
constructor(props) {
|
||||
super(props)
|
||||
}
|
||||
render () {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Row>
|
||||
{DemoArray.map((child,index) => {
|
||||
<Row>
|
||||
{DemoArray.map((child, index) => {
|
||||
|
||||
return (
|
||||
<Demo example= {child.example} title= {child.title} code= {child.code} desc= {child.desc} key= {index}/>
|
||||
)
|
||||
return (
|
||||
<Demo example={child.example} title={child.title} code={child.code} scss_code={child.scss_code}
|
||||
desc={child.desc} key={index}/>
|
||||
)
|
||||
|
||||
})}
|
||||
</Row>
|
||||
})}
|
||||
</Row>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
102
demo/index.js
102
demo/index.js
File diff suppressed because one or more lines are too long
|
|
@ -3490,7 +3490,7 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
.vertical-align-middle, .vertical-align-bottom {
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
font-size: 1.4rem; }
|
||||
font-size: 14px; }
|
||||
.vertical-align-middle {
|
||||
vertical-align: middle; }
|
||||
.vertical-align-bottom {
|
||||
|
|
@ -3678,7 +3678,6 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
visibility: hidden; }
|
||||
|
||||
.text-hide {
|
||||
font: "0/0" a;
|
||||
color: transparent;
|
||||
text-shadow: none;
|
||||
background-color: transparent;
|
||||
|
|
@ -4951,26 +4950,26 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
box-shadow: none; }
|
||||
|
||||
.u-shadow-2dp {
|
||||
box-shadow: 0 0.2rem 0.2rem 0 rgba(0, 0, 0, 0.14), 0 0.3rem 0.1rem -0.2rem rgba(0, 0, 0, 0.2), 0 0.1rem 0.5rem 0 rgba(0, 0, 0, 0.12);
|
||||
box-shadow: 0 0.2rem 0.2rem 0 black, 0 0.3rem 0.1rem -0.2rem black, 0 0.1rem 0.5rem 0 black \9; }
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
|
||||
box-shadow: 0 2px 2px 0 black, 0 3px 1px -2px black, 0 1px 5px 0 black \9; }
|
||||
|
||||
.u-shadow-3dp {
|
||||
box-shadow: 0 0.3rem 0.4rem 0 rgba(0, 0, 0, 0.14), 0 0.3rem 0.3rem -0.2rem rgba(0, 0, 0, 0.2), 0 0.1rem 0.8rem 0 rgba(0, 0, 0, 0.12); }
|
||||
box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); }
|
||||
|
||||
.u-shadow-4dp {
|
||||
box-shadow: 0 0.4rem 0.5rem 0 rgba(0, 0, 0, 0.14), 0 0.1rem 1rem 0 rgba(0, 0, 0, 0.12), 0 0.2rem 0.4rem -0.1rem rgba(0, 0, 0, 0.2); }
|
||||
box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.u-shadow-6dp {
|
||||
box-shadow: 0 0.6rem 1rem 0 rgba(0, 0, 0, 0.14), 0 0.1rem 1.8rem 0 rgba(0, 0, 0, 0.12), 0 0.3rem 0.5rem -0.1rem rgba(0, 0, 0, 0.2); }
|
||||
box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.u-shadow-8dp {
|
||||
box-shadow: 0 0.8rem 1rem 0.1rem rgba(0, 0, 0, 0.14), 0 0.3rem 1.4rem 0.2rem rgba(0, 0, 0, 0.12), 0 0.5rem 0.5rem -0.3rem rgba(0, 0, 0, 0.2); }
|
||||
box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.u-shadow-16dp {
|
||||
box-shadow: 0 1.6rem 2.4rem 0.2rem rgba(0, 0, 0, 0.14), 0 0.6rem 3rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.8rem 1rem -0.5rem rgba(0, 0, 0, 0.2); }
|
||||
box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.u-shadow-24dp {
|
||||
box-shadow: 0 0.9rem 4.6rem 0.8rem rgba(0, 0, 0, 0.14), 0 1.1rem 1.5rem -0.7rem rgba(0, 0, 0, 0.12), 0 2.4rem 3.8rem 0.3rem rgba(0, 0, 0, 0.2); }
|
||||
box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
/* keyframes 定义 */
|
||||
|
||||
|
|
@ -5214,14 +5213,10 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
cursor: not-allowed;
|
||||
opacity: 0.5; }
|
||||
.u-checkbox input[type='checkbox'] {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
top: 2px;
|
||||
height: 18px;
|
||||
width: 18px; }
|
||||
display: none;
|
||||
cursor: pointer; }
|
||||
.u-checkbox input[disabled] {
|
||||
cursor: not-allowed; }
|
||||
.u-checkbox.is-checked .u-checkbox-label:before {
|
||||
box-shadow: inset 0 0 0 10px rgb(30,136,229);
|
||||
border-color: rgb(30,136,229); }
|
||||
|
|
@ -5233,9 +5228,7 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
.u-checkbox .u-checkbox-label {
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
padding-left: 25px;
|
||||
color: #a9a9a9; }
|
||||
padding-left: 25px; }
|
||||
.u-checkbox .u-checkbox-label:before {
|
||||
border-radius: 3px;
|
||||
border: 1px solid;
|
||||
|
|
@ -5247,7 +5240,7 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
width: 18px;
|
||||
height: 18px;
|
||||
left: 0;
|
||||
top: -13px;
|
||||
top: 4px;
|
||||
text-align: center;
|
||||
position: absolute; }
|
||||
.u-checkbox .u-checkbox-label:after {
|
||||
|
|
@ -5257,14 +5250,10 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
width: 18px;
|
||||
height: 18px;
|
||||
left: 0;
|
||||
top: -13px;
|
||||
top: 4px;
|
||||
text-align: center;
|
||||
position: absolute; }
|
||||
|
||||
.u-checkbox-checked .u-checkbox-label, .u-checkbox-indeterminate .u-checkbox-label {
|
||||
background-color: #108ee9;
|
||||
border-color: #108ee9; }
|
||||
|
||||
.u-checkbox.u-checkbox-indeterminate .u-checkbox-label:after {
|
||||
color: #fff;
|
||||
content: "\e6ce";
|
||||
|
|
@ -5697,37 +5686,8 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
.u-panel-group .u-panel-heading + .u-panel-collapse > .list-group, .u-panel-group .u-panel-group .u-panel-heading + .u-panel-collapse > .u-panel-body {
|
||||
border-top: 1px solid #ddd; }
|
||||
|
||||
/* IMAGES */
|
||||
/* 默认颜色 */
|
||||
/* 客户化 */
|
||||
/* 波纹效果 */
|
||||
/*贝塞尔曲线动画 */
|
||||
/* 阴影 */
|
||||
/* ========== 文本字体 ========== */
|
||||
/* 控件 */
|
||||
/* 不同背景下对应的文字颜色 */
|
||||
/* UButton */
|
||||
/* UText */
|
||||
/* FormGroup */
|
||||
/* Navlayout */
|
||||
/* gridlayout */
|
||||
/* menu */
|
||||
/* Alert */
|
||||
/* Checkbox */
|
||||
/* Radio */
|
||||
/* Switch */
|
||||
/* loading */
|
||||
/* datetimepicker */
|
||||
/* message */
|
||||
/* DATA TABLE */
|
||||
/* tooltip*/
|
||||
/* 进度条 */
|
||||
/* ========== Content Tabs ========== */
|
||||
/* CARD */
|
||||
/* Card dimensions */
|
||||
/* Cover image */
|
||||
/* ========== Card ========== */
|
||||
/* ============ Forms ============*/
|
||||
/* BADGE */
|
||||
.u-container {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
|
|
@ -6340,15 +6300,14 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
|
|||
.u-button {
|
||||
background: rgb(224,224,224);
|
||||
border: none;
|
||||
border-radius: 0.4rem;
|
||||
border-radius: 4px;
|
||||
color: rgb(0,0,0);
|
||||
position: relative;
|
||||
min-width: 7.2rem;
|
||||
padding: 0.5rem 1.3rem;
|
||||
padding: 5px 13px \9;
|
||||
min-width: 72px;
|
||||
padding: 5px 13px;
|
||||
display: inline-block;
|
||||
font-family: "Open Sans", "Helvetica Neue", Arial, "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
|
||||
font-size: 1.4rem;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 1;
|
||||
letter-spacing: 0;
|
||||
|
|
@ -6382,13 +6341,11 @@ input.u-button[type="submit"] {
|
|||
|
||||
.u-button-floating {
|
||||
border-radius: 50%;
|
||||
font-size: 1.4rem;
|
||||
height: 3.8rem;
|
||||
height: 38px \9;
|
||||
font-size: 14px;
|
||||
height: 38px;
|
||||
margin: auto;
|
||||
min-width: 3.8rem;
|
||||
width: 3.8rem;
|
||||
width: 38px \9;
|
||||
min-width: 38px;
|
||||
width: 38px;
|
||||
padding: 0;
|
||||
line-height: normal;
|
||||
border: 1px solid rgb(224,224,224); }
|
||||
|
|
@ -6547,26 +6504,26 @@ input.u-button[type="submit"] {
|
|||
|
||||
.u-button-icon {
|
||||
border-radius: 50%;
|
||||
font-size: 1.4rem;
|
||||
height: 3.2rem;
|
||||
font-size: 14px;
|
||||
height: 32px;
|
||||
margin: auto;
|
||||
min-width: 3.2rem;
|
||||
width: 3.2rem;
|
||||
min-width: 32px;
|
||||
width: 32px;
|
||||
padding: 0;
|
||||
line-height: normal;
|
||||
border: 1px solid rgb(224,224,224); }
|
||||
|
||||
.u-button-lg {
|
||||
padding: 8px 15px;
|
||||
font-size: 1.4rem; }
|
||||
font-size: 14px; }
|
||||
|
||||
.u-button-xg {
|
||||
padding: 10px 18px;
|
||||
font-size: 1.6rem; }
|
||||
font-size: 16px; }
|
||||
|
||||
.u-button-sm {
|
||||
padding: 3px 5px;
|
||||
font-size: 1.2rem; }
|
||||
font-size: 12px; }
|
||||
|
||||
.u-button-squared {
|
||||
border-radius: 0; }
|
||||
|
|
@ -6608,7 +6565,7 @@ input.u-button[type="submit"] {
|
|||
width: 100%;
|
||||
height: 30px;
|
||||
cursor: text;
|
||||
font-size: 1.4rem;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
color: #424242;
|
||||
background-color: #fff;
|
||||
|
|
@ -6628,53 +6585,49 @@ input.u-button[type="submit"] {
|
|||
|
||||
.u-form-control.lg {
|
||||
height: 38px;
|
||||
font-size: 1.4rem; }
|
||||
font-size: 14px; }
|
||||
|
||||
.u-form-control.sm {
|
||||
font-size: 1.2rem;
|
||||
font-size: 12px;
|
||||
height: 24px; }
|
||||
|
||||
.u-input-search-wrapper {
|
||||
.u-form-control-search-wrapper {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 28px;
|
||||
padding: 4px;
|
||||
width: 100%; }
|
||||
.u-form-control-search-wrapper .u-form-control-search-action {
|
||||
color: #ccc;
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
right: 2px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
text-decoration: none; }
|
||||
.u-form-control-search-wrapper .u-form-control-search-action .uf {
|
||||
transition: all .3s;
|
||||
font-size: 12px;
|
||||
color: #ccc; }
|
||||
.u-form-control-search-wrapper .u-form-control-search-action .uf.uf-search:before {
|
||||
content: "\e603"; }
|
||||
|
||||
.u-input-search-action {
|
||||
color: #ccc;
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
right: 2px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
text-decoration: none; }
|
||||
|
||||
.u-input-search-action .uf {
|
||||
transition: all .3s;
|
||||
font-size: 12px;
|
||||
color: #ccc; }
|
||||
|
||||
.uf-search:before {
|
||||
content: "\e603"; }
|
||||
|
||||
.u-input-affix-wrapper {
|
||||
.u-form-control-affix-wrapper {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 100%; }
|
||||
|
||||
.u-input-affix-wrapper .u-input-prefix, .u-input-affix-wrapper .u-input-suffix {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
line-height: 0;
|
||||
right: 7px;
|
||||
color: rgba(0, 0, 0, 0.65); }
|
||||
.u-form-control-affix-wrapper .u-form-control-prefix, .u-form-control-affix-wrapper .u-form-control-suffix {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
line-height: 0;
|
||||
right: 7px;
|
||||
color: rgba(0, 0, 0, 0.65); }
|
||||
|
||||
.u-tree-searchable-filter {
|
||||
color: #f50;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue