Live Agent

Trigger button

Developer task: JavaScript used to launch the popup window should calculate the appropriate size.

Head element

<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Live Agent popup</title>
  <link href="https://s3-eu-west-1.amazonaws.com/ucas-da-ui-framework-2016-01-28/UI/DF-1371-apply/stylesheets/liveagent.css" rel="stylesheet" type="text/css">
</head>

Production must use the https://prod.df.ucascdn.com CDN.
Development sites can use S3.

Body element

<body>
  <section class="section section--content" id="section--content">
    <div class="section__inner-wrapper">
      <div class="grid-container grid-12">
        <div class="grid__column-12">
          <div class="brick brick--vertical">
            <h1><!-- Page heading goes here. --></h1>
          </div>
          <div class="brick brick--vertical">
            <div class="brick__wrapper clearfix prose">
              <p><!-- Introductory paragraph goes here. --></p>
            </div>
          </div>
          <div class="brick brick--vertical">
            <div class="brick__wrapper clearfix prose">
              <!-- Form goes here. -->
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
</body>

See Live Agent popup demo for example form markup.