frontpage.html

---
---

{% include headertop.html %}
{% include headerbottom.html %}

<div class="navigation-fade-screen"></div>
<!-- Header -->
  <header id="site-header" class="header-home">
    <div class="header-background">
      <div class="new-on-the-blog">
        <p>New on the blog:
          {% assign newPost = site.posts.first %}
          <a href="{{newPost.url}}">{{newPost.title}}</a>
        </p>
        <span class="hide"><i class="fa fa-close"></i></span>
      </div>
      <div class="wrap">
        <!-- Navigation -->
        <nav class="navigation" role="menu">
          <a href="/" class="navigation-bdand">
            <img src="/resources/img/frontpage/scala-logo-white@2x.png" alt="">
          </a>
          <div class="navigation-panel-button">
            <i class="fa fa-bars"></i>
          </div>
          <ul class="navigation-menu">
            {% for navItem in site.data.nav-header %}
            <li class="navigation-menu-item">
              <a href="{{navItem.url}}">{{navItem.title}}</a>
            </li>
            {% endfor %}
          </ul>
        </nav>
      </div>
      <div class="wrap">
        <!-- Inner Text -->
        <div class="col-lg-6">
          <div class="inner-text">
            <h1>{{page.headerTitle}}</h1>
            <p>{{page.headerSubtitle}}</p>
            {% for release in site.data.scala-releases %}
            {% if release.category == "current_version" %}
            <a href="/download/{{ release.version }}.html" class="button">
              Scala {{ release.version }}
            </a>
            {% endif %}
            {% endfor %}
            <a href="/download/all.html" class="button">
              All Releases
            </a>
          </div>
        </div>
        <div class="col-lg-6">
          {% include code-carousel.html id='scala-main-carousel' collection=site.scala_carousel_items compact=true %}
        </div>
      </div>
    </div>
    <!-- Scala Main Resources -->
    <div class="scala-main-resources">
      <div class="wrap">
        <div class="resources">
          <div class="get-started">
            <a href="{{page.gettingStarted.mainUrl}}" class="button">{{page.gettingStarted.mainTitle | upcase}}</a>
            <div class="sublinks">
              <ul>
                <li><a href="{{page.gettingStarted.subtitleLink}}">{{page.gettingStarted.subtitle}}</a></li>
                {% for link in page.gettingStarted.links %}
                  <li>•</li>
                  <li><a href="{{link.url}}">{{link.title}}</a></li>
                {% endfor %}
              </ul>
            </div>
          </div>
          <div class="learn-scala">
            <a href="{{page.apiDocs.mainUrl}}" class="button">{{page.apiDocs.mainTitle | upcase}}</a>
            <div class="sublinks">
              <ul>
                <li><a href="{{page.apiDocs.subtitleLink}}">{{page.apiDocs.subtitle}}</a></li>
                {% for link in page.apiDocs.links %}
                  <li>•</li>
                  <li><a href="{{link.url}}">{{link.title}}</a></li>
                {% endfor %}
              </ul>
            </div>
          </div>
          <div class="scala-brand-circle">
            <div class="circle-solid">
              <img src="/resources/img/frontpage/scala-spiral.png" alt="">
              <div class="scala-version">
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </header>


<main id="site-main">

<!-- Scala in a Nutshell -->
<section class="nutshell">
  <div class="wrap">
    <div class="heading-line">
      <h2><span>Scala in a Nutshell</span></h2>
      <div class="call-to-action action-medium">
        <p>Click the buttons to see Scala in action,
          or visit the <a href="/documentation/">Scala Documentation</a> to learn more.</p>
      </div>
    </div>
  </div>
  <div class="scala-items-list">
    <div class="items-menu">
      {% for scalaItem in site.scala_items %}
        {% assign loopIndexMod = forloop.index | minus: 1 | modulo: 3 %}

        {% if loopIndexMod == 0 %}
          {% assign codeSnippets = '' | split: ',' %}
          <div class="wrap">
        {% endif %}
        {% assign codeSnippets = codeSnippets | push: scalaItem.content %}
        <div class="scala-item">
          <h3>{{scalaItem.shortTitle}}</h3>
          <p>{{scalaItem.shortDescription}}</p>
          <div class="button button-more">More...</div>
        </div>
        {% if loopIndexMod == 2 or forloop.last %}
          </div>
          <div class="items-content">
            {% for snippet in codeSnippets %}
              <div class="items-code">{{snippet}}</div>
            {% endfor %}
          </div>
        {% endif %}
      {% endfor %}
    </div>
  </div>
</section>

<!-- Scala backends -->
<section class="runs">
  <div class="wrap">
    <h2>{{site.data.common.texts.scalaBackendsTitle}}</h2>
    <ul>
      {% for backend in page.scalaBackends %}
      <li class="masterTooltip" title="{{backend.description}}">
        <span>
          <a href="{{backend.link}}"><img src="{{backend.icon}}" alt="{{backend.description}}"></a>
        </span>
        {% if backend.beta == 1 %}<span class="beta">beta</span>{% endif %}
      </li>
      {% unless forloop.last %}<li></li>{% endunless %}
      {% endfor %}
    </ul>
  </div>
</section>

<!-- Scala Ecosystem -->
<section class="scala-ecosystem">
  <div class="wrap">
    <div class="heading-line">
      <h2><span>{{page.ecosystemTitle}}</span></h2>
    </div>
    <div class="browser">
      <div class="header-browser">
        <a href="{{site.data.common.scaladexUrl}}" target="_blank"><img src="/resources/img/frontpage/scaladex-logo.png"
            alt=""></a>
        <div class="main-browser">
          <div class="input-control">
            <span><i class="fa fa-search"></i></span>
            <input type="text" placeholder="Find an awesome Scala library" id="scaladex-search">
          </div>
        </div>
        <a class="button awesome" href="{{site.data.common.scaladexUrl}}/awesome">Awesome Scala</a>
      </div>
    </div>
    <div class="awesome-table">
      <div class="wrap">
        <div class="awesome-items">
          {% for awesomeLink in site.data.awesome-scala.links %}
          <a href="{{awesomeLink.url}}" class="content-card">
            <h3><i class="fa fa-search"></i>{{awesomeLink.title}}</h3>
          </a>
          {% endfor %}
        </div>
        <div class="awesome-summary">
          <p class="awesome-summary-text">{{site.data.awesome-scala.summaryText}}</p>
        </div>
      </div>
    </div>
  </div>
</section>

<!-- Supporters -->
<section class="maintenance">
  <div class="wrap">
    <div class="heading-line">
      <h2><span>{{site.data.common.texts.scalaMaintainersTitle}}</span></h2>
    </div>
    <ul class="maintained">
      {% for maintainer in site.data.scala-supporters.maintainers %}
        <li><a href="{{maintainer.url}}"><img src="{{maintainer.logo}}" alt="{{maintainer.name}}"></a></li>
      {% endfor %}
    </ul>
    <h3>{{site.data.common.texts.scalaSupportersTitle}}</h3>
    <div class="supported">
      {% for supporter in site.data.scala-supporters.supporters %}
        <a href="{{supporter.url}}"><img {% if supporter.wider-logo %} class="logo-with-wider-aspect-ratio" {% endif %} src="{{supporter.logo}}" alt="{{supporter.name}}"></a>
      {% endfor %}
    </div>
  </div>
</section>
</main>

{% include footer.html %}