mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-08-06 16:06:28 +08:00
Code Issues Actions 17 Packages Projects Releases Wiki Activity

fix metion styles

Browse Source
This commit is contained in:
afc163 2016-07-21 15:40:13 +08:00
parent aa8e02326a
commit 57a34d8f5d
7 changed files with 56 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
components/mention/demo/async.md
View File

@ -40,11 +40,14 @@ const AsyncMention = React.createClass({
}, },
render() { render() {
const { suggestions, loading } = this.state; const { suggestions, loading } = this.state;
return (<Mention return (
loading={loading} <Mention
suggestions={suggestions} style={{ width: 500, height: 100 }}
onSearchChange={this.onSearchChange} loading={loading}
/>); suggestions={suggestions}
onSearchChange={this.onSearchChange}
/>
);
}, },
}); });

13
components/mention/demo/avatar.md
View File

@ -50,11 +50,14 @@ const CustomNavMention = React.createClass({
}, },
render() { render() {
const { suggestions, loading } = this.state; const { suggestions, loading } = this.state;
return (<Mention return (
loading={loading} <Mention
suggestions={suggestions} style={{ width: 500, height: 100 }}
onSearchChange={this.onSearchChange} loading={loading}
/>); suggestions={suggestions}
onSearchChange={this.onSearchChange}
/>
);
}, },
}); });

6
components/mention/demo/basic.md
View File

@ -21,10 +21,10 @@ function onChange(editorState) {
ReactDOM.render( ReactDOM.render(
<Mention <Mention
style={{ width: 500, height: 100 }}
onChange={onChange} onChange={onChange}
defaultValue={toEditorState('@afc163')} defaultValue={toEditorState('@afc163')}
suggestions={['afc163', 'benjycui', 'yiminghe', 'RaoHai', '中文', 'にほんご']} suggestions={['afc163', 'benjycui', 'yiminghe', 'RaoHai', '中文', 'にほんご']}
/>, />
mountNode , mountNode);
);
```` ````

45
components/mention/demo/controlled.md
View File

@ -55,31 +55,30 @@ let App = React.createClass({
initialValue: this.state.initValue, initialValue: this.state.initValue,
}); });
console.log('>> render', getFieldValue('mention') === this.state.initValue); console.log('>> render', getFieldValue('mention') === this.state.initValue);
return (<Form horizontal form={this.props.form}> return (
<FormItem <Form horizontal form={this.props.form}>
id="control-mention" <FormItem
label="最帅的码农" id="control-mention"
labelCol={{ span: 6 }} label="最帅的码农"
wrapperCol={{ span: 14 }} labelCol={{ span: 6 }}
> wrapperCol={{ span: 14 }}
<Mention >
{...mentionProps} <Mention
suggestions={['afc163', 'benjycui', 'yiminghe', 'RaoHai', '中文', 'にほんご']} {...mentionProps}
/> suggestions={['afc163', 'benjycui', 'yiminghe', 'RaoHai', '中文', 'にほんご']}
</FormItem>  />
<FormItem wrapperCol={{ span: 12, offset: 7 }}> </FormItem> 
<Button type="primary" onClick={this.handleSubmit}>确定</Button> <FormItem wrapperCol={{ span: 14, offset: 6 }}>
&nbsp;&nbsp;&nbsp; <Button type="primary" onClick={this.handleSubmit}>确定</Button>
<Button type="ghost" onClick={this.handleReset}>重置</Button> &nbsp;&nbsp;&nbsp;
</FormItem> <Button type="ghost" onClick={this.handleReset}>重置</Button>
</Form>); </FormItem>
</Form>
);
}, },
}); });
App = Form.create()(App); App = Form.create()(App);
ReactDOM.render(
<App />, ReactDOM.render(<App />, mountNode);
mountNode
);
```` ````

18
components/mention/demo/custom-tag.md
View File

@ -37,22 +37,22 @@ const CustomNavMention = React.createClass({
const filtered = webFrameworks.filter(item => const filtered = webFrameworks.filter(item =>
item.name.toLowerCase().indexOf(searchValue) !== -1 item.name.toLowerCase().indexOf(searchValue) !== -1
); );
const suggestions = filtered.map(suggestion => const suggestions = filtered.map(suggestion =>
<Nav value={suggestion.name} > <Nav value={suggestion.name} >
<span>{suggestion.name} - {suggestion.type} </span> <span>{suggestion.name} - {suggestion.type} </span>
</Nav>); </Nav>);
this.setState({ this.setState({ suggestions });
suggestions,
});
}, },
render() { render() {
const { suggestions, loading } = this.state; const { suggestions, loading } = this.state;
return (<Mention return (
loading={loading} <Mention
suggestions={suggestions} style={{ width: 500, height: 100 }}
onSearchChange={this.onSearchChange} loading={loading}
/>); suggestions={suggestions}
onSearchChange={this.onSearchChange}
/>
);
}, },
}); });

7
components/mention/demo/multilines.md
View File

@ -21,11 +21,10 @@ function onChange(editorState) {
ReactDOM.render( ReactDOM.render(
<Mention <Mention
style={{ width: '100%', height: 200 }} style={{ width: 500, height: 100 }}
onChange={onChange} onChange={onChange}
suggestions={['afc163', 'benjycui', 'yiminghe', 'jljsj33', 'dqaria', 'RaoHai']} suggestions={['afc163', 'benjycui', 'yiminghe', 'jljsj33', 'dqaria', 'RaoHai']}
multiLines multiLines
/>, />
mountNode , mountNode);
);
```` ````

4
components/mention/style/index.less
View File

@ -6,12 +6,14 @@
position: relative; position: relative;
display: inline-block; display: inline-block;
width: 100%; width: 100%;
vertical-align: middle;
&.active .ant-mention-editor { &.active .ant-mention-editor {
.active; .active;
} }
.ant-mention-editor { .ant-mention-editor {
.input; .input;
padding: 0; padding: 0;
display: block;
} }
.ant-mention-editor-wrapper { .ant-mention-editor-wrapper {
overflow-y: auto; overflow-y: auto;
@ -95,4 +97,4 @@
} }
} }
} }
} }