129 lines
4.5 KiB
HTML
Executable File
129 lines
4.5 KiB
HTML
Executable File
<!--FULL HEADER BLOCK-->
|
|
<header class="l-relative">
|
|
|
|
<!--BACKGROUND IMAGE-->
|
|
<div class="background-sky hero"></div>
|
|
|
|
<!--INTRO SECTION -->
|
|
<section id="intro">
|
|
|
|
<!-- LOGO -->
|
|
<div class="hero-logo">
|
|
<img src="assets/images/logos/angular/angular.svg"/>
|
|
</div>
|
|
|
|
<!-- CONTAINER -->
|
|
<div class="homepage-container">
|
|
<!-- container content starts -->
|
|
|
|
<div class="hero-headline no-toc">One framework.<br>Mobile & desktop.</div>
|
|
<button class="button button-large button-plain hero-cta">
|
|
<a href="guide/quickstart">Get Started</a>
|
|
</button>
|
|
</div><!-- CONTAINER END -->
|
|
</section>
|
|
|
|
|
|
</header>
|
|
|
|
<article class="l-content">
|
|
<div class="home-rows">
|
|
|
|
<!--Announcement Bar-->
|
|
<div class="homepage-container">
|
|
<div class="announcement-bar">
|
|
<img src="generated/images/marketing/angular-mix.png" height="40" width="151">
|
|
<p>Join us at our newest event, October 2017</p>
|
|
<button class="button">
|
|
<a href="https://angularmix.com/">Learn More</a>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Group 1-->
|
|
<div layout="row" layout-xs="column" class="home-row homepage-container">
|
|
<div class="promo-img-container promo-1">
|
|
<div>
|
|
<img height="222" width="340" src="assets/images/home/responsive-framework.svg" alt="responsive framework">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-container">
|
|
<div class="text-block promo-1-desc l-pad-top-2">
|
|
<div class="text-headline">Develop Across All Platforms</div>
|
|
<p class="text-body">Learn one way to build applications with Angular and reuse your code and abilities to build apps for any deployment target. For web, mobile web, native mobile and native desktop.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<!-- Group 2-->
|
|
<div layout="row" layout-xs="column" class="home-row">
|
|
<div class="text-container">
|
|
<div class="text-block">
|
|
<div class="text-headline">Speed & Performance</div>
|
|
<p class="text-body">Achieve the maximum speed possible on the Web Platform today, and take it further, via Web Workers and server-side rendering.</p>
|
|
<p class="text-body">Angular puts you in control over scalability. Meet huge data requirements by building data models on RxJS, Immutable.js or another push-model.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="promo-img-container promo-2">
|
|
<div>
|
|
<img height="222" width="323" src="assets/images/home/speed-performance.svg" alt="speed and performance">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
|
|
<!-- Group 3-->
|
|
<div layout="row" layout-xs="column" class="home-row">
|
|
<div class="promo-img-container promo-3">
|
|
<div><img src="assets/images/home/joyful-development.png" alt="IDE example"></div>
|
|
</div>
|
|
|
|
<div class="text-container">
|
|
<div class="text-block promo-3-desc">
|
|
<div class="text-headline">Incredible Tooling</div>
|
|
<p class="text-body">Build features quickly with simple, declarative templates. Extend the template language with your own components and use a wide array of existing components. Get immediate Angular-specific help and feedback with nearly every IDE and editor. All this comes together so you can focus on building amazing apps rather than trying to make the code work.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<hr>
|
|
|
|
<!-- Group 4-->
|
|
<div layout="row" layout-xs="column" class="home-row">
|
|
|
|
<div class="text-container">
|
|
<div class="text-block l-pad-top-2">
|
|
<div class="text-headline">Loved by Millions</div>
|
|
<p class="text-body">From prototype through global deployment, Angular delivers the productivity and scalable infrastructure that supports Google's largest applications.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="promo-img-container promo-4">
|
|
<div>
|
|
<img src="assets/images/home/loved-by-millions.png" alt="angular on the map" width="455" height="228">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CTA CARDS -->
|
|
<div layout="row" layout-xs="column" class="home-row">
|
|
|
|
<a href="guide/quickstart">
|
|
<div class="card">
|
|
<img src="../assets/images/icons/code-icon.svg" height="70px">
|
|
<div class="card-text-container">
|
|
<div class="text-headline">Get Started</div>
|
|
<p>Start building your Angular application.</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
</div> <!-- end of home rows -->
|
|
|
|
</article>
|