<commit_before>// (C) Copyright 2014-2016 Hewlett Packard Enterprise Development LP

import React, { Component } from 'react';
import Anchor from 'grommet/components/Anchor';
import DocsArticle from '../../components/DocsArticle';

export default class Integration extends Component {

  render () {
    return (
      <DocsArticle title='Integration'>
        <section>
          <p>
            {"Grommet's"} modular design enables you to use the parts of Grommet
            applicable to your application.  There are several ways you can
            benefit from using Grommet based on the needs of your users and
            your application.  The options range from referencing the style
            guide and its basic elements to complete adoption of the platform.
          </p>

          <h2>Style Guide</h2>
          <p>
            Your team references the <Anchor path="/docs/resources">
            Grommet style guide</Anchor> with
            an emphasis on brand alignment, primarily around the logo, font,
            and color palette.  If your application is not in a position to
            begin adopting a new platform, this option may be the most
            appropriate option.
            You may find the <a
            href={"https://github.com/grommet/grommet/tree/master/" +
              "src/scss/grommet-core"} target='_blank'>Grommet CSS</a> elements
            a useful reference.
          </p>

          <h2>Style Sheets</h2>
          <p>
            Your application uses
            the <a href={"https://github.com/grommet/grommet/tree/master/" +
              "src/scss/grommet-core"} target='_blank'>Grommet CSS</a> elements
            to ensure styling of components is aligned.  Your {"application's"}
            DOM structure will likely need to change to align with the DOM
            structure expected by the Grommet CSS.
          </p>

          <h2>Components</h2>
          <p>
            Your application leverages the <Anchor path='/docs/components'>
            Grommet components</Anchor> with
            the accompanying markup, styling, and images.
            This model is appropriate in several situations:
          </p>
          <ul>
            <li>
              Your application is new or is being refactored to use
              the Grommet components.
            </li>
            <li>
              Your application uses AngularJS and you want to use Grommet
              components for the "view" in your MVC architecture.
            </li>
            <li>
              Your application is being updated to use Grommet components
              in replacing portions of the user interface based on legacy
              technologies such as Adobe Flex or Java Applets.
            </li>
          </ul>
          <h2>Application</h2>
          <p>
            Your application is new or is being rewritten to use the Grommet
            components and a set of common services for features as search,
            associations, and dashboards.
          </p>
        </section>
      </DocsArticle>
    );
  }
};
<commit_msg>Spacing issue<commit_after>// (C) Copyright 2014-2016 Hewlett Packard Enterprise Development LP

import React, { Component } from 'react';
import Anchor from 'grommet/components/Anchor';
import DocsArticle from '../../components/DocsArticle';

export default class Integration extends Component {

  render () {
    return (
      <DocsArticle title='Integration'>
        <section>
          <p>
            {"Grommet's"} modular design enables you to use the parts of Grommet
            applicable to your application.  There are several ways you can
            benefit from using Grommet based on the needs of your users and
            your application.  The options range from referencing the style
            guide and its basic elements to complete adoption of the platform.
          </p>

          <h2>Style Guide</h2>
          <p>
            Your team references the <Anchor path="/docs/resources">
            Grommet style guide</Anchor> with
            an emphasis on brand alignment - primarily around the logo, font,
            and color palette.  If your application is not in a position to
            begin adopting a new platform, this option may be the most
            appropriate option.
            You may find the <a
            href={"https://github.com/grommet/grommet/tree/master/" +
              "src/scss/grommet-core"} target='_blank'>Grommet CSS</a> elements
            a useful reference.
          </p>

          <h2>Style Sheets</h2>
          <p>
            Your application uses
            the <a href={"https://github.com/grommet/grommet/tree/master/" +
              "src/scss/grommet-core"} target='_blank'>Grommet CSS</a> elements
            to ensure styling of components is aligned.  
            Your {"application's"} DOM structure will likely need to 
            change to align with the DOM structure expected by the Grommet CSS.
          </p>

          <h2>Components</h2>
          <p>
            Your application leverages the <Anchor path='/docs/components'>
            Grommet components</Anchor> with
            the accompanying markup, styling, and images.
            This model is appropriate in several situations:
          </p>
          <ul>
            <li>
              Your application is new or is being refactored to use
              the Grommet components.
            </li>
            <li>
              Your application uses AngularJS and you want to use Grommet
              components for the "view" in your MVC architecture.
            </li>
            <li>
              Your application is being updated to use Grommet components
              in replacing portions of the user interface based on legacy
              technologies such as Adobe Flex or Java Applets.
            </li>
          </ul>
          <h2>Application</h2>
          <p>
            Your application is new or is being rewritten to use the Grommet
            components and a set of common services for features as search,
            associations, and dashboards.
          </p>
        </section>
      </DocsArticle>
    );
  }
};

{'fraction_non_alphanumeric': 0.07302557503619109, 'fraction_numerical': 0.005147177095061927, 'mean_word_length': 1.783348254252462, 'pattern_counts': {'":': 0, '<': 79, '<?xml version=': 0, '>': 79, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7537345', 'n_tokens_mistral': 1554, 'n_tokens_neox': 1494, 'n_words': 627}