added draft hub page and admin, student, teacher mockup

This commit is contained in:
Celeste de Guzman 2017-11-03 17:30:09 -07:00
parent 316701c63a
commit d8230a3e79
4 changed files with 145 additions and 0 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

View File

@ -0,0 +1,145 @@
---
layout: HubPage
hide_bc: true
title: Microsoft 365 Education trial in a box | Microsoft Docs
description: Find step-by-step instructions for school IT administrators, teachers, and students participating in Microsoft 365 Education trial in a box.
author: CelesteDG
ms.author: celested
---
<div id="main" class="v2">
<div class="container">
<ul class="cardsY panelContent featuredContent">
<li>
<a href="https://www.microsoft.com/en-us/education/buy-license/microsoft365/default.aspx" target="_blank">
<div class="cardSize">
<div class="cardPadding">
<div class="card">
<div class="cardImageOuter">
<div class="cardImage">
<img data-hoverimage="/media/common/i_advanced.svg" src="/media/common/i_advanced.svg" alt="Learn more about Microsoft 365 Education products." />
</div>
</div>
<div class="cardText">
<span class="likeAnH3">Learn about Microsoft 365 Education</span>
</div>
</div>
</div>
</div>
</a>
</li>
<li>
<a href="https://docs.microsoft.com/education/get-started/get-started-with-microsoft-education" target="_blank">
<div class="cardSize">
<div class="cardPadding">
<div class="card">
<div class="cardImageOuter">
<div class="cardImage">
<img data-hoverimage="/media/common/i_get-started.svg" src="/media/common/i_get-started.svg" alt="For IT Pros: Get started with Microsoft Education" />
</div>
</div>
<div class="cardText">
<span class="likeAnH3">For IT Pros: Get Started using Microsoft Education</span>
</div>
</div>
</div>
</div>
</a>
</li>
<li>
<a href="/education/windows/test-windows10s-for-edu" target="_blank">
<div class="cardSize">
<div class="cardPadding">
<div class="card">
<div class="cardImageOuter">
<div class="cardImage">
<img data-hoverimage="/media/common/i_download-install.svg" src="/media/common/i_download-install.svg" alt="Test Windows 10 S for education" />
</div>
</div>
<div class="cardText">
<span class="likeAnH3">Test Windows 10 S for Education</span>
</div>
</div>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="container">
<h1>Microsoft 365 Education Trial in a Box</h1>
<ul class="pivots">
<li>
<a href="#audience">Audience</a>
<ul id="audience">
<li>
<a href="#audience-all"></a>
<ul id="audience-all" class="cardsW">
<li class="fullSpan">
<div class="container intro">
<p>Looking for step-by-step info about Microsoft 365 Education Trial in a Box? Select your role to get started.</p>
</div>
</li>
<li>
<a href="https://docs.microsoft.com/en-us/education/get-started/get-started-with-microsoft-education" target="_blank">
<div class="cardSize">
<div class="cardPadding">
<div class="card">
<div class="cardImageOuter">
<div class="cardImage bgdAccent1">
<img src="images/it-admin.png" alt="Microsoft 365 Education Trial in a Box for school IT admins" />
</div>
</div>
<div class="cardText">
<h3>IT admin</h3>
<p>TBD</p>
</div>
</div>
</div>
</div>
</a>
</li>
<li>
<a href="https://docs.microsoft.com/education/get-started/get-started-with-microsoft-education" target="_blank">
<div class="cardSize">
<div class="cardPadding">
<div class="card">
<div class="cardImageOuter">
<div class="cardImage bgdAccent1">
<img src="images/student.png" alt="Microsoft 365 Education Trial in a Box for students" />
</div>
</div>
<div class="cardText">
<h3>Student</h3>
<p>TBD</p>
</div>
</div>
</div>
</div>
</a>
</li>
<li>
<a href="https://docs.microsoft.com/education/get-started/get-started-with-microsoft-education" target="_blank">
<div class="cardSize">
<div class="cardPadding">
<div class="card">
<div class="cardImageOuter">
<div class="cardImage bgdAccent1">
<img src="images/teacher.png" alt="Microsoft 365 Education Trial in a Box for teachers" />
</div>
</div>
<div class="cardText">
<h3>Teacher</h3>
<p>TBD</p>
</div>
</div>
</div>
</div>
</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</div>