jade/index/index_content.html - v1-dev - githubmirror/materialize

jade/index/index_content.html
101 строка5 KB
Chang Alan
Fixing backfill styling
06 июн 2019, 09:15
06 июн 2019, 09:15be00e45
      <div class="section no-pad-bot" id="index-banner">
        <div class="container">
          <div class="row center">
            <div class="col s12 m10 offset-m1">
              <h1 class="header">Materialize</h1>
            </div>
            <div class="col s12 m8 offset-m2">
              <h4 class="light">A modern responsive front-end framework based on Material Design</h4>
            </div>
          </div>
          <div class="row center">
            <a href="http://materializecss.com/getting-started.html" id="download-button" class="btn-large waves-effect waves-light">Get Started</a>
            <a href="https://github.com/Dogfalo/materialize/blob/v1-dev/v1-upgrade-guide.md" id="upgrade-button" class="btn-large waves-effect waves-light">Upgrade from 0.100.2</a>
          </div>
          <div class="row center"><a class="current-version-number" href="https://github.com/Dogfalo/materialize">Release: 1.0.0</a></div>
          <div class="row center">
            <div class="buysellads-header buysellads-homepage">
              <!-- CarbonAds Zone Code -->
              <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?serve=CKYIK27J&placement=materializecss" id="_carbonads_js"></script>
            </div>
          </div>
          <br>

        </div>
        <div class="github-commit">
          <div class="container">
            <div class="row">
              <div class="col s12 m10 offset-m1">
                <div class="commit">
                  Latest Commit on Github:
                  &nbsp;&nbsp;
                  <a href="" class="sha"></a>
                  &nbsp;&nbsp;
                  <span class="date"></span>
                  <a id="github-button" href="https://github.com/Dogfalo/materialize" class="btn right waves-effect waves-light hide-on-small-only">Github</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="container">
        <div class="section">

          <div class="row">
            <div class="col s12 m10 offset-m1">

              <!--   Promo Section   -->
              <div class="row">
                <div class="col s12 m4">
                  <div class="center promo">
                    <i class="material-icons">flash_on</i>
                    <p class="promo-caption">Speeds up development</p>
                    <p class="light center">We did most of the heavy lifting for you to provide a default stylings that incorporate our custom components. Additionally, we refined animations and transitions to provide a smoother experience for developers.</p>
                  </div>
                </div>

                <div class="col s12 m4">
                  <div class="center promo">
                    <i class="material-icons">group</i>
                    <p class="promo-caption">User Experience Focused</p>
                    <p class="light center">By utilizing elements and principles of Material Design, we were able to create a framework that incorporates components and animations that provide more feedback to users. Additionally, a single underlying responsive system across all platforms allow for a more unified user experience.</p>
                  </div>
                </div>

                <div class="col s12 m4">
                  <div class="center promo">
                    <i class="material-icons">settings</i>
                    <p class="promo-caption">Easy to work with</p>
                    <p class="light center">We have provided detailed documentation as well as specific code examples to help new users get started. We are also always open to feedback and can answer any questions a user may have about Materialize.</p>
                  </div>
                </div>
              </div>
            </div>
          </div>


        </div>
        <div class="divider"></div>
        <div class="section">
          <div class="row center">
            <h3 class="light header">Showcase</h3>
            <p class="col s12 m8 offset-m2 caption">Checkout what people are creating with Materialize. Get inspired by these beautiful sites and you can even submit your own website to be showcased here.</p>
            <a href="http://materializecss.com/showcase.html" class="btn-large waves-effect waves-light">Explore our Showcase</a>
          </div>
        </div>
        <div class="divider"></div>
        <div class="section">
          <div class="row center">
            <h3 class="light header">Themes</h3>
            <div class="col s12 m6 offset-m3">
              <p class="caption">
              Take a look at our official themes for Materialize.</p>
              <img width="100%" src="https://s23.postimg.cc/9g7ajckrf/thunder.png" alt="">
              <br><br>
              <a href="http://materializecss.com/themes.html" class="btn-large waves-effect waves-light">Explore our Themes</a>
            </div>
          </div>
        </div>
      </div>