UCLA Web Components

Buttons: Secondary 

<!-- Secondary -->
<button class="btn btn--secondary--lightbg">Secondary Button</button>
<button class="btn btn--secondary--lightbg icon--play">Secondary with Icon</button>
<button class="btn btn--secondary--lightbg icon--link">Secondary with Link</button>
<button class="btn btn--secondary--lightbg" disabled>Secondary Disabled</button>

<!-- Secondary (Dark Background) -->
<div class="has-background-ucla-blue	">
    <button class="btn btn--secondary--darkbg">Secondary Dark Background Button</button>
    <button class="btn btn--secondary--darkbg icon--play">Secondary Dark Background with Icon</button>
    <button class="btn btn--secondary--darkbg icon--link">Secondary Dark Background with Link</button>
    <button class="btn btn--secondary--darkbg" disabled>Secondary Dark Background Disabled</button>
</div>
 
<!-- Secondary -->
<button class="btn btn--secondary--lightbg">Secondary Button</button>
<button class="btn btn--secondary--lightbg icon--play">Secondary with Icon</button>
<button class="btn btn--secondary--lightbg icon--link">Secondary with Link</button>
<button class="btn btn--secondary--lightbg" disabled>Secondary Disabled</button>


<!-- Secondary (Dark Background) -->
<div class="has-background-ucla-blue	">
  <button class="btn btn--secondary--darkbg">Secondary Dark Background Button</button>
  <button class="btn btn--secondary--darkbg icon--play">Secondary Dark Background with Icon</button>
  <button class="btn btn--secondary--darkbg icon--link">Secondary Dark Background with Link</button>
  <button class="btn btn--secondary--darkbg" disabled>Secondary Dark Background Disabled</button>
</div>
 
/* No context defined. */

No notes defined.