<commit_before>import {Component, provide} from 'angular2/angular2';
import {
  RouteConfig,
  ROUTER_DIRECTIVES,
  ROUTER_PROVIDERS,
  LocationStrategy,
  HashLocationStrategy
} from 'angular2/router';

import Contact from './contact/Contact';
import ContactList from './contact/components/ContactList';
import ContactsService from './contact/ContactsService';

import {Routes, APP_ROUTES} from "./routeConfig"

@RouteConfig(APP_ROUTES)
@Component({
    selector: 'contactManagerApp',
    directives: [ContactList, ROUTER_DIRECTIVES],
    providers: [
      ROUTER_PROVIDERS,
      provide(LocationStrategy, {useClass: HashLocationStrategy})
    ],
    template: `
<header class="cm-header">
	<div class="container">
	<h1>Contact Manager</h1>
	<p>Simple Angular 2 example application</p>
	</div>
</header>
<div class="container">
	<div class="row">
	<div class="col-xs-12 main-container">
    <router-outlet></router-outlet>
	</div>
	</div>
</div>
    `,
    styles: [`
.cm-header {
  position: relative;
  padding: 30px 15px;
  font-size: 20px;
  color: #cdbfe3;
  text-align: center;
  text-shadow: 0 1px 0 rgba(0,0,0,.1);
  background-color: #6f5499;
  background-image: -webkit-linear-gradient(top, #563d7c 0%, #6f5499 100%);
  background-image: linear-gradient(to bottom, #563d7c 0%, #6f5499 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#563d7c', endColorstr='#6F5499', GradientType=0);
}

.cm-header h1 {
  margin-top: 0;
  color: #fff;
}

.cm-header p {
  margin-bottom: 0;
  font-weight: 300;
  line-height: 1.4;
}
    `]
})
export default class ContactManagerApp {
  routes = Routes;
  constructor() {}
}<commit_msg>UI: making header smaller and hiding subheading on small screen size<commit_after>import {Component, provide} from 'angular2/angular2';
import {
  RouteConfig,
  ROUTER_DIRECTIVES,
  ROUTER_PROVIDERS,
  LocationStrategy,
  HashLocationStrategy
} from 'angular2/router';

import Contact from './contact/Contact';
import ContactList from './contact/components/ContactList';
import ContactsService from './contact/ContactsService';

import {Routes, APP_ROUTES} from "./routeConfig"

@RouteConfig(APP_ROUTES)
@Component({
    selector: 'contactManagerApp',
    directives: [ContactList, ROUTER_DIRECTIVES],
    providers: [
      ROUTER_PROVIDERS,
      provide(LocationStrategy, {useClass: HashLocationStrategy})
    ],
    template: `
<header class="cm-header">
	<div class="container">
	<h1>Contact Manager <small>(simple Angular 2 example app)</small></h1>
	</div>
</header>
<div class="container">
	<div class="row">
	<div class="col-xs-12 main-container">
    <router-outlet></router-outlet>
	</div>
	</div>
</div>
    `,
    styles: [`
.cm-header {
  position: relative;
  padding: 15px 15px;
  font-size: 20px;
  color: #cdbfe3;
  text-align: center;
  text-shadow: 0 1px 0 rgba(0,0,0,.1);
  background-color: #6f5499;
  background-image: -webkit-linear-gradient(top, #563d7c 0%, #6f5499 100%);
  background-image: linear-gradient(to bottom, #563d7c 0%, #6f5499 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#563d7c', endColorstr='#6F5499', GradientType=0);
}

.cm-header h1 {
  margin-top: 0;
  color: #fff;
}

.cm-header h1 small {
  position: absolute;
  padding-left: 10px;
  font-size: 50%;
  color: #CCC;
}

@media (max-width: 540px) {
  .cm-header h1 small {
    display: none;
  }
}
    `]
})
export default class ContactManagerApp {
  routes = Routes;
  constructor() {}
}
{'fraction_non_alphanumeric': 0.14892412231030577, 'fraction_numerical': 0.04105322763306908, 'mean_word_length': 4.443759630200308, 'pattern_counts': {'":': 0, '<': 35, '<?xml version=': 0, '>': 35, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2107355', 'n_tokens_mistral': 1353, 'n_tokens_neox': 1248, 'n_words': 275}