mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-10 15:47:23 +02:00
Move Docusaurus 1 files into directory (#966)
* Move Docusaurus 1 into v1 directory * Update Circle CI commands for new v1 dir * Remove OC * Fix tests
This commit is contained in:
parent
9d4a5d5359
commit
f2927a9fc4
291 changed files with 7591 additions and 6532 deletions
95
v1/lib/core/GridBlock.js
Executable file
95
v1/lib/core/GridBlock.js
Executable file
|
@ -0,0 +1,95 @@
|
|||
/**
|
||||
* Copyright (c) 2017-present, Facebook, Inc.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
const React = require('react');
|
||||
const classNames = require('classnames');
|
||||
|
||||
const MarkdownBlock = require('./MarkdownBlock.js');
|
||||
|
||||
class GridBlock extends React.Component {
|
||||
renderBlock(block) {
|
||||
const blockClasses = classNames('blockElement', this.props.className, {
|
||||
alignCenter: this.props.align === 'center',
|
||||
alignRight: this.props.align === 'right',
|
||||
fourByGridBlock: this.props.layout === 'fourColumn',
|
||||
imageAlignSide:
|
||||
block.image &&
|
||||
(block.imageAlign === 'left' || block.imageAlign === 'right'),
|
||||
imageAlignTop: block.image && block.imageAlign === 'top',
|
||||
imageAlignRight: block.image && block.imageAlign === 'right',
|
||||
imageAlignBottom: block.image && block.imageAlign === 'bottom',
|
||||
imageAlignLeft: block.image && block.imageAlign === 'left',
|
||||
threeByGridBlock: this.props.layout === 'threeColumn',
|
||||
twoByGridBlock: this.props.layout === 'twoColumn',
|
||||
});
|
||||
|
||||
const topLeftImage =
|
||||
(block.imageAlign === 'top' || block.imageAlign === 'left') &&
|
||||
this.renderBlockImage(block.image, block.imageLink, block.imageAlt);
|
||||
|
||||
const bottomRightImage =
|
||||
(block.imageAlign === 'bottom' || block.imageAlign === 'right') &&
|
||||
this.renderBlockImage(block.image, block.imageLink, block.imageAlt);
|
||||
|
||||
return (
|
||||
<div className={blockClasses} key={block.title}>
|
||||
{topLeftImage}
|
||||
<div className="blockContent">
|
||||
{this.renderBlockTitle(block.title)}
|
||||
<MarkdownBlock>{block.content}</MarkdownBlock>
|
||||
</div>
|
||||
{bottomRightImage}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderBlockImage(image, imageLink, imageAlt) {
|
||||
if (!image) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="blockImage">
|
||||
{imageLink ? (
|
||||
<a href={imageLink}>
|
||||
<img src={image} alt={imageAlt} />
|
||||
</a>
|
||||
) : (
|
||||
<img src={image} alt={imageAlt} />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderBlockTitle(title) {
|
||||
if (!title) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<h2>
|
||||
<MarkdownBlock>{title}</MarkdownBlock>
|
||||
</h2>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="gridBlock">
|
||||
{this.props.contents.map(this.renderBlock, this)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
GridBlock.defaultProps = {
|
||||
align: 'left',
|
||||
contents: [],
|
||||
layout: 'twoColumn',
|
||||
};
|
||||
|
||||
module.exports = GridBlock;
|
Loading…
Add table
Add a link
Reference in a new issue