Improve bootstrap usage

This commit is contained in:
Eric Schultz 2018-10-01 15:02:03 -05:00
parent 03e48bfa15
commit 1f4314a31e
2 changed files with 9 additions and 6 deletions

View file

@ -6,8 +6,11 @@
"mixins": true, "mixins": true,
"grid": true, "grid": true,
"forms": true, "forms": true,
"responsive-utilities":true "responsive-utilities":true,
"panels": true,
"type": true
}, },
"scripts": false "scripts": false,
"styleNamespace": ".tw-bs"
} }

View file

@ -4,10 +4,10 @@ import {observer} from "mobx-react";
import * as _ from 'lodash' import * as _ from 'lodash'
export const TwoColumnFields = observer((props:{children:Array<React.ReactElement<any>>}) => { export const TwoColumnFields = observer((props:{children:Array<React.ReactElement<any>>}) => {
return <div className="clearfix"> return <div className="row">
{ {
_.take(props.children, 2).map((i:React.ReactElement<any>) => { _.take(props.children, 2).map((i:React.ReactElement<any>) => {
let className = "col-left-6" let className = "col-sm-6"
if (_.last(props.children) !== i){ if (_.last(props.children) !== i){
className += " u-paddingRight--10" className += " u-paddingRight--10"
} }
@ -21,10 +21,10 @@ export const TwoColumnFields = observer((props:{children:Array<React.ReactElemen
}) })
export const ThreeColumnFields = observer((props:{children:React.ReactElement<any>[]}) => { export const ThreeColumnFields = observer((props:{children:React.ReactElement<any>[]}) => {
return <div className="clearfix"> return <div className="row">
{ {
_.take(props.children, 3).map((i:React.ReactElement<any>) => { _.take(props.children, 3).map((i:React.ReactElement<any>) => {
let className = "col-left-4" let className = "col-sm-4"
if (_.last(props.children) !== i){ if (_.last(props.children) !== i){
className += " u-paddingRight--10" className += " u-paddingRight--10"
} }