You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

135 lines
4.8 KiB

---
layout : 'default'
css : 'index'
title : 'Introduction'
type : 'Semantic'
---
<% uiElements = @getCollection("uiElements").toJSON() %>
<% uiCollections = @getCollection("uiCollections").toJSON() %>
<% uiViews = @getCollection("uiViews").toJSON() %>
<% uiModules = @getCollection("uiModules").toJSON() %>
<script src="/javascript/home.js"></script>
<div class="masthead segment">
<div class="ui page grid">
<div class="column">
<div class="introduction">
<h1 class="ui inverted header">Semantic UI
<a class="ui teal tag label" href="https://github.com/semantic-org/Semantic-UI/blob/css/RELEASE%20NOTES.md">
1.0.0
</a>
</h1>
<h2 class="ui inverted header">UI is the vocabulary of the web.</h2>
<div class="mobile buttons">
<a class="ui basic pink inverted view-ui button"><i class="cube icon"></i>UI Library</a>
<a class="ui basic red inverted button" data-title="Coming Soon">
<i class="theme icon"></i>
Themes
</a>
<a class="ui basic green inverted button" data-title="Coming Soon">
<i class="cubes icon"></i>
Layouts
</a>
</div>
<div class="ui huge inverted buttons">
<a class="ui basic pink inverted view-ui button"><i class="cube icon"></i>UI Library</a>
<a class="ui basic red inverted button" data-title="Coming Soon">
<i class="theme icon"></i>
Themes
</a>
<a class="ui basic green inverted button" data-title="Coming Soon">
<i class="cubes icon"></i>
Layouts
</a>
</div>
<div class="ui hidden divider"></div>
<a class="ui huge basic inverted teal button" href="build/semantic.zip">
<i class="download icon"></i> Customize &amp; Download
</a>
</div>
<div class="inverted advertisement">
<% unless 'developments' in @getEnvironments(): %>
<div id="carbonads-container">
<div class="carbonad">
<div id="azcarbon"></div>
<script type="text/javascript">var z = document.createElement("script"); z.type = "text/javascript"; z.async = true; z.src = "http://engine.carbonads.com/z/51619/azcarbon_2_1_0_VERTDARK"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(z, s);</script>
</div>
</div>
<% end %>
</div>
</div>
</div>
</div>
<!-- <div class="stripe" >
<div class="ui three column center aligned page grid">
<div class="column">
<div class="ui statistic">
<div class="value">3362</div>
<div class="label">CSS Variables</div>
</div>
</div>
<div class="column">
<div class="ui statistic">
<div class="value">51</div>
<div class="label">UI Components</div>
</div>
</div>
<div class="column">
<div class="ui statistic">
<div class="value">1</div>
<div class="label">Coding Style</div>
</div>
</div>
</div>
</div> -->
<div class="final stripe">
<div class="ui page grid">
<div class="column">
<div class="ui stackable grid" data-demo="true">
<div class="four column center aligned row">
<div class="column">
<div class="ui piled segment">
<h4 class="ui header">Elements</h4>
<div class="ui divided selection list">
<% for element in uiElements: %>
<a class="item" href="<%= element.url %>"><%= element.title %></a>
<% end %>
</div>
</div>
</div>
<div class="column">
<div class="ui piled segment">
<h4 class="ui header">Collections</h4>
<div class="ui divided selection list">
<% for element in uiCollections: %>
<a class="item" href="<%= element.url %>"><%= element.title %></a>
<% end %>
</div>
</div>
</div>
<div class="column">
<div class="ui piled segment">
<h4 class="ui header">Views</h4>
<div class="ui divided selection list">
<% for element in uiViews: %>
<a class="item" href="<%= element.url %>"><%= element.title %></a>
<% end %>
</div>
</div>
</div>
<div class="column">
<div class="ui piled segment">
<h4 class="ui header">Modules</h4>
<div class="ui divided selection list">
<% for element in uiModules: %>
<a class="item" href="<%= element.url %>"><%= element.title %></a>
<% end %>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>