Skip to content

Instantly share code, notes, and snippets.

@kylebuch8

kylebuch8/pfe-card-pfe-cta.index.js

Last active December 11, 2020 20:33
Show Gist options
  • Save kylebuch8/d25dab18f68d69c60e709ce1370c659b to your computer and use it in GitHub Desktop.
Save kylebuch8/d25dab18f68d69c60e709ce1370c659b to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. kylebuch8 revised this gist Dec 11, 2020. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions pfe-card-pfe-cta.index.js
    View file
    Original file line number Diff line number Diff line change
    @@ -2,10 +2,10 @@ function App() {
    return (
    <div className="App">
    <h1>PatternFly Elements with React</h1>
    <pfe-card pfe-color="lightest">
    <pfe-card color="lightest">
    <img
    alt="From https://picsum.photos/"
    pfe-overflow="left right top"
    overflow="left right top"
    src="https://picsum.photos/id/1019/300/200"
    />
    <p>This is the light pfe-card and <a href="#">a link</a>.</p>
  2. kylebuch8 revised this gist Jun 11, 2019. 1 changed file with 27 additions and 21 deletions.
    48 changes: 27 additions & 21 deletions pfe-card-pfe-cta.index.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,21 +1,27 @@
    <h1>PatternFly Elements with React</h1>
    <pfe-card pfe-color="lightest">
    <img
    alt="From https://picsum.photos/"
    pfe-overflow="left right top"
    src="https://picsum.photos/id/1019/300/200"
    />
    <p>This is the light pfe-card and <a href="#">a link</a>.</p>
    <p>
    Leverage agile frameworks to provide a robust synopsis for high level
    overviews. Iterative approaches to corporate strategy foster collaborative
    thinking to further the overall value proposition.
    </p>
    <p>
    Organically grow the holistic world view of disruptive innovation via
    workplace diversity and empowerment.
    </p>
    <pfe-cta slot="pfe-card--footer">
    <a href="#">Learn more</a>
    </pfe-cta>
    </pfe-card>
    function App() {
    return (
    <div className="App">
    <h1>PatternFly Elements with React</h1>
    <pfe-card pfe-color="lightest">
    <img
    alt="From https://picsum.photos/"
    pfe-overflow="left right top"
    src="https://picsum.photos/id/1019/300/200"
    />
    <p>This is the light pfe-card and <a href="#">a link</a>.</p>
    <p>
    Leverage agile frameworks to provide a robust synopsis for high level
    overviews. Iterative approaches to corporate strategy foster collaborative
    thinking to further the overall value proposition.
    </p>
    <p>
    Organically grow the holistic world view of disruptive innovation via
    workplace diversity and empowerment.
    </p>
    <pfe-cta slot="pfe-card--footer">
    <a href="#">Learn more</a>
    </pfe-cta>
    </pfe-card>
    </div>
    );
    }
  3. kylebuch8 created this gist Jun 11, 2019.
    21 changes: 21 additions & 0 deletions pfe-card-pfe-cta.index.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,21 @@
    <h1>PatternFly Elements with React</h1>
    <pfe-card pfe-color="lightest">
    <img
    alt="From https://picsum.photos/"
    pfe-overflow="left right top"
    src="https://picsum.photos/id/1019/300/200"
    />
    <p>This is the light pfe-card and <a href="#">a link</a>.</p>
    <p>
    Leverage agile frameworks to provide a robust synopsis for high level
    overviews. Iterative approaches to corporate strategy foster collaborative
    thinking to further the overall value proposition.
    </p>
    <p>
    Organically grow the holistic world view of disruptive innovation via
    workplace diversity and empowerment.
    </p>
    <pfe-cta slot="pfe-card--footer">
    <a href="#">Learn more</a>
    </pfe-cta>
    </pfe-card>