gistfile1.html

<Overlay>
 <h3>Get Started with Clef</h3>
 <p>…</p>
 
 <ProgressBar> 
   <ProgressBarStep 
     type=”created_credentials”
     completed={@state.steps.created_credentials.completed} />
   # … more ProgressBarSteps
 </ProgressBar>
 
 <IntegrationChecklist>
   <CredentialsChecklistItem 
     title=”Create a new integration.”
     completed={@state.steps.created_credentials.completed} 
     integration={@props.integration}
   />
   <ChecklistItem 
     title=”Add the Clef button to your website”
     completed={@state.steps.added_clef_button.completed}
     docs={url: “http://docs.getclef.com/v1.0/docs/adding-the-clef-button", title: “Browse our button docs”}
     code={url: “http://docs.getclef.com/v1.0/docs/clefjs-and-the-clef-button#section-using-clef-js"}>
     The Clef button is the entry point into the Clef experience. 
     It handles the initial portion of the authentication flow
     and explaining Clef to users, making your life easier as a developer.
   </ChecklistItem>
   # … more ChecklistItems
 </IntegrationChecklist>
</Overlay>