Merge branch 'jumbotron' into woothu

Author: woothu

src/components/Jumbotron/CJumbotron.js

@@ -0,0 +1,60 @@
+import { mergeData } from 'vue-functional-data-merge'
+
+export const props = {
+  tag: {
+    type: String,
+    default: 'div'
+  },
+  fluid: Boolean,
+  header: String,
+  lead: String,
+  variant: String,
+  borderVariant: String,
+  textVariant: String,
+}
+
+export default {
+  functional: true,
+  name: 'CJumbotron',
+  props,
+  render (h, { props, data, slots }) {
+    let childNodes = []
+    const $slots = slots()
+
+    if ($slots.header || props.header){
+      const header = $slots.header || h('h1', { staticClass: 'display-3' }, props.header)
+      childNodes.push(header)
+    }
+
+    if ($slots.lead || props.lead){
+      const lead = $slots.lead || h('p', { staticClass: 'lead' }, props.lead)
+      childNodes.push(lead)
+    }
+
+    if ($slots.default)
+      childNodes.push($slots.default)
+
+    if (props.fluid) {
+      childNodes = [h(
+        'div',
+        { staticClass: 'container-fluid' },
+        childNodes
+      )]
+    }
+    
+    return h(
+      props.tag,
+      mergeData(data, {
+        staticClass: 'jumbotron',
+        class: {
+          'jumbotron-fluid': props.fluid,
+          [`text-${props.textVariant}`]: Boolean(props.textVariant),
+          [`bg-${props.variant}`]: Boolean(props.variant),
+          [`border-${props.borderVariant}`]: Boolean(props.borderVariant),
+          'border': Boolean(props.borderVariant)
+        }
+      }),
+      childNodes
+    )
+  }
+}

src/components/Jumbotron/index.js

@@ -0,0 +1,5 @@
+import CJumbotron from './CJumbotron'
+
+export {
+  CJumbotron
+}

src/components/index.js

@@ -19,6 +19,7 @@ export * from './ListGroup'
 <<<<<<< HEAD
 <<<<<<< HEAD
 <<<<<<< HEAD
+<<<<<<< HEAD
 export * from './Toolip'
 =======
 export * from './Pagination'
@@ -29,3 +30,6 @@ export * from './Navbar'
 =======
 export * from './Media'
 >>>>>>> media
+=======
+export * from './Jumbotron'
+>>>>>>> jumbotron