mirror of
https://github.com/bobwen-dev/react-templates
synced 2025-04-12 00:56:39 +02:00
add direction to code sample
This commit is contained in:
parent
229f046167
commit
3a1a1840df
File diff suppressed because one or more lines are too long
@ -118,4 +118,5 @@ var Playground = React.createClass({
|
||||
}
|
||||
});
|
||||
|
||||
React.render(Playground(), document.getElementById('playground'));
|
||||
var elem = React.createElement(Playground, {direction: 'horizontal'}); //vertical
|
||||
React.render(elem, document.getElementById('playground'));
|
||||
|
@ -18,13 +18,13 @@ body {
|
||||
|
||||
.code-area {
|
||||
width: 50%;
|
||||
height: 620px;
|
||||
/*height: 620px;*/
|
||||
float: left;
|
||||
}
|
||||
|
||||
.result-area {
|
||||
width: 50%;
|
||||
height: 620px;
|
||||
/*height: 620px;*/
|
||||
float: left;
|
||||
}
|
||||
|
||||
|
@ -1,6 +1,6 @@
|
||||
<!DOCTYPE rt CodeEditor="./aceEditor">
|
||||
<div>
|
||||
<div id="myTab" role="tabpanel" class="code-area">
|
||||
<div id="myTab" role="tabpanel" class="code-area" style="float: {this.props.direction === 'horizontal' ? 'left' : 'none'}">
|
||||
<!-- Nav tabs -->
|
||||
<ul class="nav nav-pills" role="tablist">
|
||||
<li role="presentation" class="active"><a href="#template" aria-controls="template" role="tab" data-toggle="tab">Template</a></li>
|
||||
@ -32,8 +32,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div key="result-area" class="result-area well">
|
||||
<br/>
|
||||
<div key="result-area" class="result-area well" style="float: {this.props.direction === 'horizontal' ? 'left' : 'none'}; margin-top: 48px;">
|
||||
<h2>Preview:</h2>
|
||||
<form class="sample-view" onSubmit="(e) => e.preventDefault();">
|
||||
<this.sample key="sample">
|
||||
|
@ -15,7 +15,8 @@ module.exports = function () {
|
||||
return React.DOM.div({}, React.DOM.div({
|
||||
'id': 'myTab',
|
||||
'role': 'tabpanel',
|
||||
'className': 'code-area'
|
||||
'className': 'code-area',
|
||||
'style': { float: this.props.direction === 'horizontal' ? 'left' : 'none' }
|
||||
} /* Nav tabs */, React.DOM.ul({
|
||||
'className': 'nav nav-pills',
|
||||
'role': 'tablist'
|
||||
@ -69,8 +70,12 @@ module.exports = function () {
|
||||
'readOnly': true
|
||||
})))), React.DOM.div({
|
||||
'key': 'result-area',
|
||||
'className': 'result-area well'
|
||||
}, React.DOM.br({}), React.DOM.h2({}, 'Preview:'), React.DOM.form({
|
||||
'className': 'result-area well',
|
||||
'style': {
|
||||
float: this.props.direction === 'horizontal' ? 'left' : 'none',
|
||||
marginTop: '48px'
|
||||
}
|
||||
}, React.DOM.h2({}, 'Preview:'), React.DOM.form({
|
||||
'className': 'sample-view',
|
||||
'onSubmit': onSubmit3.bind(this)
|
||||
}, this.sample({ 'key': 'sample' }))));
|
||||
|
Loading…
x
Reference in New Issue
Block a user