Przeglądaj źródła

add functional component inside of GridEditModal.jsx

kaoritokashiki 5 lat temu
rodzic
commit
eeed0c5270

+ 40 - 2
src/client/js/components/PageEditor/GridEditModal.jsx

@@ -5,8 +5,6 @@ import {
   Modal, ModalHeader, ModalBody, ModalFooter,
   Modal, ModalHeader, ModalBody, ModalFooter,
 } from 'reactstrap';
 } from 'reactstrap';
 
 
-import GridDivisionMenu from './GridDivisionMenu';
-
 export default class GridEditModal extends React.PureComponent {
 export default class GridEditModal extends React.PureComponent {
 
 
   constructor(props) {
   constructor(props) {
@@ -122,6 +120,46 @@ export default class GridEditModal extends React.PureComponent {
 
 
 }
 }
 
 
+function GridDivisionMenu() {
+  return (
+    <div className="container">
+      <div className="row">
+        {/* TODO: add other grid patterns by GW-3189 */}
+        <div className="col-md-4 text-center">
+          <h6 className="dropdown-header">2分割</h6>
+          <a className="dropdown-item" href="#">
+            <div className="row">
+              <span className="bg-info col-6 border">6</span>
+              <span className="bg-info col-6 border">6</span>
+            </div>
+          </a>
+        </div>
+        <div className="col-md-4 text-center">
+          <h6 className="dropdown-header">3分割</h6>
+          <a className="dropdown-item" href="#">
+            <div className="row">
+              <span className="bg-info col-4 border">4</span>
+              <span className="bg-info col-4 border">4</span>
+              <span className="bg-info col-4 border">4</span>
+            </div>
+          </a>
+        </div>
+        <div className="col-md-4 text-center">
+          <h6 className="dropdown-header">4分割</h6>
+          <a className="dropdown-item" href="#">
+            <div className="row">
+              <span className="bg-info col-3 border">3</span>
+              <span className="bg-info col-3 border">3</span>
+              <span className="bg-info col-3 border">3</span>
+              <span className="bg-info col-3 border">3</span>
+            </div>
+          </a>
+        </div>
+      </div>
+    </div>
+  );
+}
+
 GridEditModal.propTypes = {
 GridEditModal.propTypes = {
   onSave: PropTypes.func,
   onSave: PropTypes.func,
 };
 };