edx-platform/lms/templates/index.html

<%! from django.core.urlresolvers import reverse %>
<%! from time import strftime %>
<%inherit file="main.html" />
<%namespace name='static' file='static_content.html'/>

<section class="home">
  <header>
    <div class="outer-wrapper">
      <div class="title">
        <hgroup>
          <h1>The Future of Online Education</h1>
          <h2>For anyone, anywhere, anytime.</h2>
        </hgroup>

        <section class="actions">
          <div class="main-cta">
            <a href="#signup-modal" class="find-courses" rel="leanModal">Sign Up</a>
          </div>

          <div class="secondary-actions">
            <div class="social-sharing">
              <div class="sharing-message">Share with friends and family!</div>
              <a href="#" class="share">
                <img src="${static.url('images/social/twitter-sharing.png')}">
              </a>
              <a href="#" class="share">
                <img src="${static.url('images/social/facebook-sharing.png')}">
              </a>
              <a href="#" class="share">
                <img src="${static.url('images/social/email-sharing.png')}">
              </a>
            </div>
          </div>
        </section>
      </div>

        <a href="#video-modal" class="media" rel="leanModal">
          <div class="hero">
            <img src="${static.url('images/courses/space3.jpg')}" />
            <div class="play-intro"></div>
          </div>
        </a>

    </div>
  </header>

  <section class="container">
    <section class="highlighted-courses">
      <h2>Explore courses from <span class="edx">edX</span> universities</h2>

      <section class="university-partners">
        <ol class="partners">
          <li class="partner mit">
            <a href="${reverse('university_profile', args=['MITx'])}">
              <img src="${static.url('images/university/mit/mit.png')}" />
              <div class="name">
                <span>MITx</span>
              </div>
            </a>
          </li>
          <li class="partner">
            <a href="${reverse('university_profile', args=['HarvardX'])}">
              <img src="${static.url('images/university/harvard/harvard.png')}" />
              <div class="name">
                <span>HarvardX</span>
              </div>
            </a>
          </li>
          <li class="partner">
            <a href="${reverse('university_profile', args=['BerkeleyX'])}">
              <img src="${static.url('images/university/berkeley/berkeley.png')}" />
              <div class="name">
                <span>BerkeleyX</span>
              </div>
            </a>
          </li>
        </ol>
      </section>

      <section class="courses">
        <section class='university-column'>
          %for course in universities['MITx']:
            <%include file="course.html" args="course=course" />
          %endfor
        </section>
        <section class='university-column'>
          %for course in universities['HarvardX']:
            <%include file="course.html" args="course=course" />
          %endfor
        </section>
        <section class='university-column'>
          %for course in universities['BerkeleyX']:
            <%include file="course.html" args="course=course" />
          %endfor
        </section>
      </section>
    </section>
  </section>

  <section class="container">
    <section class="more-info">
      <header>
        <h2><span class="edx">edX</span> News &amp; Announcements</h2>
        <a href="${reverse('press')}">Read More &rarr;</a>
      </header>
      <section class="news">
        <section class="blog-posts">
            %for entry in entries:
            <article>
                %if entry.image:
                    <a href="${entry.link}" class="post-graphics">
                        <img src="${entry.image}" />
                    </a>
                %endif
                <div class="post-name">
                    <a href="${entry.link}">${entry.title}</a>
                    <p class="post-date">${strftime("%m/%d/%y", entry.published_parsed)}</p>
                </div>
            </article>
            %endfor
        </section>
        <section class="press-links">
          <h3>edX in the News:</h3>
          ##<a href="${reverse('pressrelease')}">The edX Press Release</a>
          <a href="http://www.nytimes.com/2012/07/20/education/edlife/anant-agarwal-discusses-free-online-courses-offered-by-a-harvard-mit-partnership.html">New York Times</a>,
          <a href="http://www.bostonglobe.com/magazine/2012/07/14/anant-agarwal-believes-online-education-from-mit-and-harvard-should-available-all/Af0kX44dPqpBKRV2IOSjPP/story.html">Boston Globe</a>,
          <a href="http://www.huffingtonpost.co.uk/2012/06/20/harvard-and-mit-create-edx-free-university-courses_n_1612143.html?utm_hp_ref=uk">Huffington Post</a>,
          <a href="http://gigaom.com/cloud/everybody-codes/">GigaOM</a>,
          <a href="http://bostinno.com/2012/07/06/why-comparing-edx-to-mit-is-like-comparing-a-toyota-to-a-ferrari/">BostInno</a>,
          <a href="http://web.mit.edu/newsoffice/2012/mitx-edx-first-course-recap-0716.html">MIT News</a>

        </section>
      </section>
    </section>
  </section>

</section>

<section id="video-modal" class="modal home-page-video-modal">
  <div class="inner-wrapper">
    <iframe width="640" height="360" src="http://www.youtube.com/embed/SA6ELdIRkRU" frameborder="0" allowfullscreen></iframe>
  </div>
</section>