index.pug

doctype html
html(dir="ltr" class="ready")
  - var title = settings.title + ' Dev Server'

  head
    meta(charset="utf-8")
    title= title
    meta(name="viewport", content="width=device-width, initial-scale=1, user-scalable=no")
    link(href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,300,400i,600i" rel="stylesheet" type="text/css")
    link(href="/main.css" rel="stylesheet")
    style.
      .hero { background-position: center; background-size: cover; }

  body
    header
      a#logo(href="/")
        img(src=settings.header.logo alt="Logo" width=settings.header.logoWidth height=36)
        if settings.header.title
          span= settings.header.title

    .body
      .hero(style=`background-image: url(${settings.header.banner})`)
        .hero-shadow
        .container: .hero-title
          h1= title

      .container.narrow
        h2 Table of Contents
        for c in Object.keys(courses)
          - var course = getCourse(c, lang)
          if course
            .course
              - var icon = course.icon || `/resources/${c}/hero.jpg`;
              .course-img(style=`background-color: ${course.color}; background-image: url(${icon});`)
              h3= course.title
              for section in course.sections
                a.course-section(href=`/course/${course.id}/${section.id}${lang === 'en' ? '' : 'hl=' + lang}`)
                  x-progress(style=`width: 20px; height: 20px; color: ${course.color}`)
                  | #{section.title}

        footer.global-footer
          .footer-left
            .footer-row
              a(href=`https://github.com/${settings.repository}` target="_blank") Source Code
              span.dot •
              a(href="https://mathigon.io" target="_blank") Documentation
              span.dot •
              a(href="https://mathigon.org/policies" target="_blank") Privacy Policy