mirror of
				https://github.com/lingble/chatwoot.git
				synced 2025-11-03 20:48:07 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			71 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			Vue
		
	
	
		
			Executable File
		
	
	
	
	
			
		
		
	
	
			71 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			Vue
		
	
	
		
			Executable File
		
	
	
	
	
<template>
 | 
						|
  <header class="header-expanded">
 | 
						|
    <div>
 | 
						|
      <!-- <img
 | 
						|
        class="logo"
 | 
						|
        src="http://www.hennigcompany.com/wp-content/uploads/2014/06/starbucks-logo.png"
 | 
						|
      /> -->
 | 
						|
      <h2 class="title">
 | 
						|
        {{ introHeading }}
 | 
						|
      </h2>
 | 
						|
      <p class="body">
 | 
						|
        {{ introBody }}
 | 
						|
      </p>
 | 
						|
    </div>
 | 
						|
  </header>
 | 
						|
</template>
 | 
						|
 | 
						|
<script>
 | 
						|
import { mapGetters } from 'vuex';
 | 
						|
 | 
						|
export default {
 | 
						|
  name: 'ChatHeaderExpanded',
 | 
						|
  computed: {
 | 
						|
    ...mapGetters({
 | 
						|
      widgetColor: 'appConfig/getWidgetColor',
 | 
						|
    }),
 | 
						|
  },
 | 
						|
  props: {
 | 
						|
    introHeading: {
 | 
						|
      type: String,
 | 
						|
      default: 'Hi there ! 🙌🏼',
 | 
						|
    },
 | 
						|
    introBody: {
 | 
						|
      type: String,
 | 
						|
      default:
 | 
						|
        'We make it simple to connect with us. Ask us anything, or share your feedback.',
 | 
						|
    },
 | 
						|
  },
 | 
						|
};
 | 
						|
</script>
 | 
						|
 | 
						|
<style scoped lang="scss">
 | 
						|
@import '~widget/assets/scss/variables.scss';
 | 
						|
@import '~widget/assets/scss/mixins.scss';
 | 
						|
 | 
						|
.header-expanded {
 | 
						|
  padding: $space-larger $space-medium $space-large;
 | 
						|
  width: 100%;
 | 
						|
  box-sizing: border-box;
 | 
						|
 | 
						|
  .logo {
 | 
						|
    width: 64px;
 | 
						|
    height: 64px;
 | 
						|
  }
 | 
						|
 | 
						|
  .title {
 | 
						|
    color: $color-heading;
 | 
						|
    font-size: $font-size-mega;
 | 
						|
    font-weight: $font-weight-normal;
 | 
						|
    margin-bottom: $space-slab;
 | 
						|
    margin-top: $space-large;
 | 
						|
  }
 | 
						|
 | 
						|
  .body {
 | 
						|
    color: $color-body;
 | 
						|
    font-size: 1.8rem;
 | 
						|
    line-height: 1.5;
 | 
						|
  }
 | 
						|
}
 | 
						|
</style>
 |