Skip to content

Instantly share code, notes, and snippets.

@kylebuch8

kylebuch8/pfe-card-pfe-cta.HelloWorld.vue

Last active December 11, 2020 21:31
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save kylebuch8/36cdf296c8ffc4de2c3e1491d71fddeb to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save kylebuch8/36cdf296c8ffc4de2c3e1491d71fddeb 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.HelloWorld.vue
    View file
    Original file line number Diff line number Diff line change
    @@ -1,10 +1,10 @@
    <template>
    <div>
    <h1>PatternFly Elements with Vue</h1>
    <pfe-card pfe-color="lightest">
    <pfe-card color="lightest" border>
    <img
    alt="From https://picsum.photos/"
    pfe-overflow="left right top"
    overflow="left right top"
    src="https://picsum.photos/id/1019/300/200"
    >
    <p>
  2. kylebuch8 created this gist Jun 14, 2019.
    29 changes: 29 additions & 0 deletions pfe-card-pfe-cta.HelloWorld.vue
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,29 @@
    <template>
    <div>
    <h1>PatternFly Elements with Vue</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>
    </template>