d0bdd4dc91
Summary: Adds a simple "photo with poster and comment" layout to the landing page as an example for Android, along with the XML. Reviewed By: emilsjolander Differential Revision: D4558478 fbshipit-source-id: c7302321a67e99f5853358e711ff538d192f06e9
85 lines
3.7 KiB
Markdown
85 lines
3.7 KiB
Markdown
---
|
|
layout: home
|
|
title: Yoga
|
|
id: home
|
|
---
|
|
|
|
<div class="gridBlock alternateColor">
|
|
<h3>C</h3>
|
|
<div class="blockElement twoByGridBlock imageAlignSide">
|
|
<div class="blockContent layoutsample">
|
|
<div class="yoga sample" style="background-color: white; width: 500px; height: 120px; padding: 20px; flex-direction:row;">
|
|
<div class="yoga" style="background-color: #97dccf; width: 80px; margin-right: 20px;"></div>
|
|
<div class="yoga" style="background-color: #303846; flex-grow: 1; height: 25px; align-self: center;"></div>
|
|
</div>
|
|
</div>
|
|
<div class="blockContent gistsample">
|
|
<script src="https://gist.github.com/emilsjolander/40685eadad702e0227374f3e33daaa12.js"></script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gridBlock">
|
|
<h3>OBJ-C</h3>
|
|
<div class="blockElement twoByGridBlock imageAlignSide">
|
|
<div class="blockContent layoutsample">
|
|
<div class="yoga sample" style="background-color: white; width: 500px; height: 300px; align-items: center; justify-content: center; padding: 20px;">
|
|
<div class="yoga" style="background-color: #97dccf; width: 150px; height: 150px; margin-bottom: 20px;"></div>
|
|
<div class="yoga" style="background-color: #303846; height: 25px; width: 100px;"></div>
|
|
</div>
|
|
</div>
|
|
<div class="blockContent gistsample">
|
|
<script src="https://gist.github.com/dshahidehpour/a426c443a1e02c5432b22b09c457ede0.js"></script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gridBlock alternateColor">
|
|
<h3>JAVA</h3>
|
|
<div class="blockElement twoByGridBlock imageAlignSide">
|
|
<div class="blockContent layoutsample">
|
|
<div class="yoga sample" style="background-color: white; width: 500px; height: 300px; align-items: center; justify-content: center; padding: 20px;">
|
|
<div class="yoga" style="background-color: #303846; height: 25px; width: 200px;"></div>
|
|
<div class="yoga" style="background-color: #97dccf; width: 50px; height: 50px; position: absolute; right: 20px; top: 20px;"></div>
|
|
</div>
|
|
</div>
|
|
<div class="blockContent gistsample">
|
|
<script src="https://gist.github.com/emilsjolander/f7b9b5dc2b97577bab2f1e6e1bf80b62.js"></script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gridBlock">
|
|
<h3>C#</h3>
|
|
<div class="blockElement twoByGridBlock imageAlignSide">
|
|
<div class="blockContent layoutsample">
|
|
<div class="yoga sample" style="background-color: white; width: 500px; height: 300px;">
|
|
<div class="yoga" style="background-color: #97dccf; flex-grow: 1;"></div>
|
|
<div class="yoga" style="background-color: #303846; margin: 20px; height: 25px; width: 300px;"></div>
|
|
</div>
|
|
</div>
|
|
<div class="blockContent gistsample">
|
|
<script src="https://gist.github.com/emilsjolander/29b91608b66d56d3df81f53101ad9d8b.js"></script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gridBlock alternateColor">
|
|
<h3>Android</h3>
|
|
<div class="blockElement twoByGridBlock imageAlignSide">
|
|
<div class="blockContent layoutsample">
|
|
<div class="yoga sample" style="background-color: white; width: 500px; height: 300px; justify-content: stretch; flex-direction: column;">
|
|
<div class="yoga" style="background-color: #97dccf; flex: 1;"></div>
|
|
<div class="yoga" style="background-color: white; padding: 20px; flex-direction: row; align-items: center;">
|
|
<div class="yoga" style="background-color: #97dccf; height: 50px; width: 50px;"></div>
|
|
<div class="yoga" style="background-color: #303846; height: 25px; flex: 1; margin-left: 20px;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="blockContent gistsample">
|
|
<script src="https://gist.github.com/rspencer01/0b3e467a58ab56a23f60579ea193189f.js"></script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|