You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
<!DOCTYPE html><htmllang="en"><head><metacharset="utf-8"><metahttp-equiv="X-UA-Compatible" content="IE=edge"><metaname="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"><title>Swanky Docs - Patterns Demo - Angular</title><linkhref="https://fonts.googleapis.com/css?family=Open+Sans:300italic,600,600italic,300" rel="stylesheet" type="text/css"><linkhref="https://fonts.googleapis.com/css?family=Fira+Mono" rel="stylesheet"><scriptsrc="https://cdn.polyfill.io/v2/polyfill.min.js"></script><linkrel="shortcut icon" href="/patterns.swanky-docs.org/favicon.ico"><linkhref="/patterns.swanky-docs.org/angular.fd65bf81.css" rel="stylesheet"><linkhref="/patterns.swanky-docs.org/theme.fd65bf81.css" rel="stylesheet"><linkhref="/patterns.swanky-docs.org/docs.fd65bf81.css" rel="stylesheet"></head><bodyclass="index_has-anchors__3EyLH"><divclass="index_outer-wrap__1vW7y"><divclass="index_top-line__22n5n"></div><buttonid="navToggle" class="index_nav-toggle__1Kb7x" type="button"><spanclass="index_icon-bar__3cICM"></span><spanclass="index_icon-bar__3cICM"></span><spanclass="index_icon-bar__3cICM"></span></button><divclass="index_brand__1p0TG"><ahref="/patterns.swanky-docs.org/" class="index_logo__1x0LU"></a></div><ahref="https://github.com/swanky-docs/swanky" title="Swanky Docs - Patterns Demo Github Repo" target="_blank" class="index_github__8An62"></a><asideid="offCanvasNav" class="index_sidebar__27o42"><navclass="index_navigation__14lTH"><ulclass="index_ul__1RNVH"><liclass="index_li__3iyTZ"><ahref="/patterns.swanky-docs.org/index.html" title="Foundation" class="index_a__oUQfl">Foundation</a></li><liclass="index_li__3iyTZ index_active__1pg2E"><ahref="/patterns.swanky-docs.org/angular.html" title="Angular" class="index_a__oUQfl">Angular</a></li><liclass="index_li__3iyTZ"><ahref="/patterns.swanky-docs.org/react.html" title="React" class="index_a__oUQfl">React</a></li></ul></nav></aside><sectionclass="index_main__2py9k"><article><divclass="index_anchors__17q-7" data-gumshoe><ahref="#card-component" class="index_a__oUQfl" data-scroll><strong>1.1</strong> Card Component</a><ahref="#card-accessibility" class="index_a__oUQfl" data-scroll>1.3 Card Accessibility</a></div><h1class="index_page-header__2Qz_l index_h1__1SLAe" data-gumshoe-header>Angular</h1><sectionid="sid-kpaizpqo" class="index_section__2eRdj"><h2class="index_h2__2oHd5" id="__01__-cards"><strongclass="index_strong__F3PJg">01</strong> Cards</h2><divclass="index_lead__23C4T"><pclass="index_p__1NOy6">Lorem ipsums dolor sit amet, consectetur adipiscing elit. In ut molestie leo, ut suscipit est. Sed ut molestie ligula. Aenean in elit at erat luctus laoreet congue sit amet massa. Donec dapibus dolor sit amet neque commodo maximus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ut molestie leo, ut suscipit est.</p><pclass="index_p__1NOy6">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ut molestie leo, ut suscipit est. Sed ut molestie ligula. Aenean in elit at erat luctus laoreet congue sit amet massa. Donec dapibus dolor sit amet neque commodo maximus.</p></div><divclass="angular-badge"><divclass="angular-badge-icon"></div><p>ANGULAR v1.6</p></div></section><sectionid="card-component" class="index_section__2eRdj"><h2class="index_h2__2oHd5"><strong>1.1</strong> Card Component</h2><headerclass=""><h4class="index_h4__1f8cv"><strong>name:</strong><codeclass="index_code__3EW9K">swanky.components.card:cardComponent</code></h4></header><divclass=""><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ut molestie leo, ut suscipit est. Sed ut molestie ligula. Aenean in elit at erat luctus laoreet congue sit amet massa. Donec dapibus dolor sit amet neque commodo maximus.</p></div><h4class="index_h4__1f8cv">Example</h4><divclass="index_code-preview__1Knik component-example-cardComponent1"><divclass="card-grid"><card><card-headerhero="https://s3-ap-southeast-2.amazonaws.com/swanky-docs/images/heros/hero-01.jpg" avatar="https://s3-ap-southeast-2.amazonaws.com/swanky-docs/images/avatars/avatar-01.jpg" badge="blog"></card-header><card-content><h5>Travel / Adventure</h5><h2>Living Helsinki</h2><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p><buttonclass="btn-default">View</button></card-content><card-footer><card-actiontype="comment">6</card-action><card-actiontype="like">81</card-action></card-footer></card><card><card-headerhero="https://s3-ap-southeast-2.amazonaws.com/swanky-docs/images/heros/hero-02.jpg" avatar="https://s3-ap-southeast-2.amazonaws.com/swanky-docs/images/avatars/avatar-02.jpg" badge="blog"></card-header><card-content><h5>Travel / Adventure</h5><h2>Hipster Bearding</h2><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p><buttonclass="btn-default">View</button></card-content><card-footer><card-actiontype="comment">6</card-action><card-actiontype="like">81</card-action></card-footer></card><card><card-headerhero="https://s3-ap-southeast-2.amazonaws.com/swanky-docs/images/heros/hero-03.jpg" avatar="https://s3-ap-southeast-2.amazonaws.com/swanky-docs/images/avatars/avatar-03.jpg" badge="blog"></card-header><card-content><h5>Travel / Adventure</h5><h2>A Walk in the Woods</h2><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p><buttonclass="btn-default">View</button></card-content><card-footer><card-actiontype="comment">6</card-action><card-actiontype="like">81</card-action></card-footer></card></div></div><scriptsrc="https://unpkg.com/babel-standalone@6/babel.min.js"></script><h4class="index_h4__1f8cv">Live Edit</h4><textareaid="component-example-cardComponent1_editor" data-output="component-example-cardComponent1" class="angular-live-editor" style="display:none" rows="10"><divclass="card-grid">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
41
+
<buttonclass="btn-default">View</button>
42
+
</card-content>
43
+
44
+
<card-footer>
45
+
<card-actiontype="comment">6</card-action>
46
+
<card-actiontype="like">81</card-action>
47
+
</card-footer>
48
+
</card>
49
+
</div></textarea><script>window.onInitFn=window.onInitFn||function(){},window.addEventListener("load",function(){onInitFn&&onInitFn("component-example-cardComponent1_editor",!0,"angular")})</script></section><sectionid="card-accessibility" class="index_section__2eRdj"><h3class="index_h3__3zIem" id="__13__-card-accessibility"><strongclass="index_strong__F3PJg">1.3</strong> Card Accessibility</h3><pclass="index_p__1NOy6"><strongclass="index_strong__F3PJg">Hover State</strong></p><pclass="index_p__1NOy6">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ut molestie leo, ut suscipit est. Sed ut molestie ligula. Aenean in elit at erat luctus laoreet congue sit amet massa. Donec dapibus dolor sit amet neque commodo maximus.</p><divclass="index_callout__2LoxW"><pclass="index_p__1NOy6"><strongclass="index_strong__F3PJg">Pro Tip</strong></p><pclass="index_p__1NOy6">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ut molestie leo, ut suscipit est. Sed ut molestie ligula.</p></div></section></article></section><footerclass=""><divclass="index_version__xY3_Z">version 1.0.0</div></footer></div><scripttype="text/javascript" src="/patterns.swanky-docs.org/angular.fd65bf81.bundle.js"></script><scripttype="text/javascript" src="/patterns.swanky-docs.org/theme.fd65bf81.bundle.js"></script><scripttype="text/javascript" src="/patterns.swanky-docs.org/docs.fd65bf81.bundle.js"></script><scripttype="text/javascript" src="/patterns.swanky-docs.org/snippets.fd65bf81.bundle.js"></script></body></html>
0 commit comments