Ohm-Management - Projektarbeit B-ME
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

VJumbotron.js 2.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. import '../../../src/stylus/components/_jumbotrons.styl';
  2. // Mixins
  3. import Colorable from '../../mixins/colorable';
  4. import Routable from '../../mixins/routable';
  5. import Themeable from '../../mixins/themeable';
  6. // Utils
  7. import { deprecate } from '../../util/console';
  8. /* @vue/component */
  9. export default {
  10. name: 'v-jumbotron',
  11. mixins: [Colorable, Routable, Themeable],
  12. props: {
  13. gradient: String,
  14. height: {
  15. type: [Number, String],
  16. default: '400px'
  17. },
  18. src: String,
  19. tag: {
  20. type: String,
  21. default: 'div'
  22. }
  23. },
  24. computed: {
  25. backgroundStyles: function backgroundStyles() {
  26. var styles = {};
  27. if (this.gradient) {
  28. styles.background = 'linear-gradient(' + this.gradient + ')';
  29. }
  30. return styles;
  31. },
  32. classes: function classes() {
  33. return this.themeClasses;
  34. },
  35. styles: function styles() {
  36. return {
  37. height: this.height
  38. };
  39. }
  40. },
  41. mounted: function mounted() {
  42. deprecate('v-jumbotron', this.src ? 'v-img' : 'v-responsive', this);
  43. },
  44. methods: {
  45. genBackground: function genBackground() {
  46. return this.$createElement('div', this.setBackgroundColor(this.color, {
  47. staticClass: 'v-jumbotron__background',
  48. style: this.backgroundStyles
  49. }));
  50. },
  51. genContent: function genContent() {
  52. return this.$createElement('div', {
  53. staticClass: 'v-jumbotron__content'
  54. }, this.$slots.default);
  55. },
  56. genImage: function genImage() {
  57. if (!this.src) return null;
  58. if (this.$slots.img) return this.$slots.img({ src: this.src });
  59. return this.$createElement('img', {
  60. staticClass: 'v-jumbotron__image',
  61. attrs: { src: this.src }
  62. });
  63. },
  64. genWrapper: function genWrapper() {
  65. return this.$createElement('div', {
  66. staticClass: 'v-jumbotron__wrapper'
  67. }, [this.genImage(), this.genBackground(), this.genContent()]);
  68. }
  69. },
  70. render: function render(h) {
  71. var _generateRouteLink = this.generateRouteLink(this.classes),
  72. tag = _generateRouteLink.tag,
  73. data = _generateRouteLink.data;
  74. data.staticClass = 'v-jumbotron';
  75. data.style = this.styles;
  76. return h(tag, data, [this.genWrapper()]);
  77. }
  78. };
  79. //# sourceMappingURL=VJumbotron.js.map