Skip to content

brainfood / bootflat

Go to a project
Toggle navigation
Toggle navigation pinning
45c8b904 by bootflat
Options

update free psd page

1 parent 7f802f1d
Inline Side-by-side
Showing 7 changed files with 295 additions and 16 deletions
......@@ -8,6 +8,13 @@ Bootflat is compatible with the following browsers: `IE8, IE9, IE10, Firefox, Sa
Thanks for supporting our framework, and enjoy!
# Preview
For the designers, we offer a free PSD file for you, it including a set of beautiful and pure components, which you can use to create startup projects, websites or iOS/Android Apps.
![Bootflat UI Kit](http://bootflat.github.io/img/bootflat-ui-kit.jpg "Bootflat UI Kit")
## Features:
### 1. Bootstrap 3.1.0
......@@ -20,7 +27,7 @@ Bootflat's components are built with HTML5 and CSS3. The pages use `header`, `na
Bootflat uses lightweight high-function plugins for maximum performance, keeping CSS and JS file sizes down.
### 4. Mobile first
Bootflat is fully responsive, built for mobile-first in mind. It provides off screen navigation, and almost all the widgets are compatible with all screen sizes.
Bootflat is fully responsive, built for mobile-first in mind. It provides off screen navigation, and almost all the widgets are compatible with all screen sizes.
## Manual Start
Install with [bower](http://bower.io/)?
......@@ -37,11 +44,12 @@ The source files are in the `bootflat/` folder. You can just grab the `bootflat/
+ [Bootflat Home page](http://bootflat.github.io/)
+ [Bootflat Documentation page](http://bootflat.github.io/documentation.html)
+ [Bootflat PSD page](http://bootflat.github.io/free-psd.html)
## Community
+ Follow [@flathemes on Twitter](https://twitter.com/flathemes).
+ Have a feature request or find a bug? [Submit an issue](https://github.com/angulargap/angulargap.github.io/issues).
+ Have a feature request or find a bug? [Submit an issue](https://github.com/bootflat/bootflat.github.io/issues).
## LICENSE
......
......@@ -145,6 +145,12 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
color: #50c1e9;
text-decoration: none;
}
.desc .desc__introduces {
border-top: 1px dashed #AAB2BD ;
}
.desc .desc__introduces:first-child {
border-top: none;
}
.desc .desc__introduces h3,
.desc .desc__introduces p {
margin: 0 auto;
......@@ -172,7 +178,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
}
.desc .desc__features .col-md-6 {
padding-left: 247px;
min-height: 240px;
min-height: 200px;
text-align: left;
}
.desc .desc__features .features__photo {
......@@ -380,6 +386,14 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
padding: 0;
font-weight: normal;
}
.topic .container a.btn {
padding: 10px 16px;
text-decoration: none;
}
.topic .github {
position: relative;
top: 10px;
}
/* ----------------------------------
* documents
* ---------------------------------- */
......@@ -580,6 +594,49 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
font-size: 12px;
}
/* ----------------------------------
* psd-download
* ---------------------------------- */
.psd-download {
padding: 40px 0;
background: #e6e9ed url(../img/github.png) no-repeat 100% 0;
min-height: 680px;
}
.psd-download h2 {
text-align: center;
}
.psd-download .infos {
font-size: 20px;
line-height: 40px;
}
.psd-download .row {
margin-top: 20px;
}
@media (max-width: 768px) {
.psd-download [class*="col-md-"] {
text-align: center;
}
}
.psd-download h4 {
margin: 0 0 15px 0;
}
.psd-download img {
margin-bottom: 15px;
}
/* ----------------------------------
* previews
* ---------------------------------- */
.previews {
text-align: center;
}
.previews p {
margin-bottom: 20px;
font-size: 20px;
line-height: 40px;
}
.previews img {
max-width: 100%;
}
/* ----------------------------------
* site-footer
* ---------------------------------- */
.site-footer {
......
This diff could not be displayed because it is too large.
......@@ -35,6 +35,7 @@
<ul class="nav navbar-nav navbar-right">
<li><a class="nav-link" href="getting-started.html">Getting Started</a></li>
<li><a class="nav-link current" href="documentation.html">Documentation</a></li>
<li><a class="nav-link" href="free-psd.html">Free PSD</a></li>
</ul>
</div>
</div>
......@@ -1994,8 +1995,8 @@
</div>
<hr class="dashed" />
<div class="copyright clearfix">
<p><b>Bootflat</b>&nbsp;&nbsp;&nbsp;&nbsp;<a href="getting-started.html">Getting Started</a>&nbsp;&bull;&nbsp;<a href="documentation.html">Documentation</a><!-- &nbsp;&bull;&nbsp;<a href="examples/">Examples</a> --></p>
<p>&copy; 2014 FLATHEMES, Inc. All rights reserved. &nbsp;&nbsp;Code licensed under <a href="http://opensource.org/licenses/mit-license.html" target="_blank" rel="external nofollow">MIT License</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/" rel="external nofollow">CC BY 3.0</a>.</p>
<p><b>Bootflat</b>&nbsp;&nbsp;&nbsp;&nbsp;<a href="getting-started.html">Getting Started</a>&nbsp;&bull;&nbsp;<a href="documentation.html">Documentation</a>&nbsp;&bull;&nbsp;<a href="free-psd.html">Free PSD</a></p>
<p>&copy; 2014 <a href="http://www.flathemes.com" target="_blank">FLATHEMES</a>, Inc. All rights reserved. &nbsp;&nbsp;Code licensed under <a href="http://opensource.org/licenses/mit-license.html" target="_blank" rel="external nofollow">MIT License</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/" rel="external nofollow">CC BY 3.0</a>.</p>
</div>
</div>
</div>
......
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootflat UI Kit Free PSD Download - Bootflat</title>
<!-- Sets initial viewport load and disables zooming -->
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<!-- SmartAddon.com Verification -->
<meta name="smartaddon-verification" content="936e8d43184bc47ef34e25e426c508fe" />
<!-- site css -->
<link rel="stylesheet" href="css/site.min.css">
<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,800,700,400italic,600italic,700italic,800italic,300italic" rel="stylesheet" type="text/css">
<!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. -->
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
<script type="text/javascript" src="js/site.min.js"></script>
</head>
<body>
<div class="docs-header">
<!--nav-->
<nav class="navbar navbar-default navbar-custom" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><img src="img/logo.png" height="40"></a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a class="nav-link" href="getting-started.html">Getting Started</a></li>
<li><a class="nav-link" href="documentation.html">Documentation</a></li>
<li><a class="nav-link current" href="free-psd.html">Free PSD</a></li>
</ul>
</div>
</div>
</nav>
<!--header-->
<div class="topic">
<div class="container">
<h3>Bootflat UI Kit (Version 2.0.0)</h3>
<h4>Bootflat UI Kit is PSD User Interface Pack including a set of beautiful and pure components, which you can use to create startup projects, websites or iOS/Android Apps.</h4>
<a class="btn btn-primary" href="https://github.com/Bootflat/Bootflat.UI.Kit.PSD/archive/master.zip">Download Bootflat UI KIT PSD</a>&nbsp;&nbsp;&nbsp;&nbsp;
<span class="github github-watch">
<iframe src="http://ghbtns.com/github-btn.html?user=bootflat&amp;repo=Bootflat.UI.Kit.PSD&amp;type=watch&amp;count=true" title="Star on GitHub" frameborder="0" scrolling="0" width="150" height="25"></iframe>
</span>
<span class="github github-fork">
<iframe src="http://ghbtns.com/github-btn.html?user=bootflat&amp;repo=Bootflat.UI.Kit.PSD&amp;type=fork&amp;count=true" title="Fork on GitHub" frameborder="0" scrolling="0" width="150" height="25"></iframe>
</span>
</div>
<div class="topic__infos">
<div class="container">
Bootflat UI is a set of beautiful components featuring the flat design trend.
</div>
</div>
</div>
</div>
<div class="psd-download">
<div class="container">
<div class="row">
<div class="col-md-10">
<h2>Overview</h2>
<p class="infos">We love the new graphic design trend, and Bootflat UI Kit is a kind of style. Simple, rich and colorful and graphic design of components of the UI almost any project is perfect, from the complex Web applications and small start-up project website, and follow the Bootflat Frame update.</p>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4"><img src="img/fast.png" /></div>
<div class="col-md-8">
<h4>Save your time</h4>
<p>Don't waste your time on the composition of the same. Use your time to develop new ideas and projects.</p>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-4"><img src="img/design.png" /></div>
<div class="col-md-8">
<h4>Elaborate design</h4>
<p>All the components are independent, easy to be integrated into the design and layout of any project.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-4"><img src="img/together.png" /></div>
<div class="col-md-8">
<h4>Components fit together</h4>
<p>All components to use the same style. You can easily apply them in the design projects of various.</p>
</div>
</div>
</div>
<div class="col-md-6 clearfix">
<div class="row">
<div class="col-md-4"><img src="img/prototyping.png" /></div>
<div class="col-md-8">
<h4>Fast prototyping</h4>
<p>You will be able to quickly develop high-quality prototypes in full-color. Your clients will appreciate prototypes with beautiful components.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="previews">
<div class="container">
<h2>Preview</h2>
<p>You will find Buttons, Text edits, Menus, Sliders and more, Beautiful Complex Blocks and many other useful web elements. </p>
</div>
<img src="img/bootflat-ui-kit.jpg" alt="Bootflat UI Kit" />
<div class="container">
<h2>Thanks for watching!</h2>
<p>I hope you will enjoy this new product, and if you use it, do not forget to share your projects with us. I love to see all the great things you are working on!</p>
</div>
</div>
<!--footer-->
<div class="site-footer">
<div class="container">
<div class="download">
<span class="download__infos">You can <b>free</b> download it.</span>&nbsp;&nbsp;&nbsp;&nbsp;
<a class="btn btn-primary" href="https://github.com/Bootflat/Bootflat.UI.Kit.PSD/archive/master.zip">Download Bootflat UI Kit PSD</a>&nbsp;&nbsp;&nbsp;&nbsp;
<!-- SmartAddon BEGIN -->
<script type="text/javascript">
(function() {
var s=document.createElement('script');s.type='text/javascript';s.async = true;
s.src='http://s1'+'.smartaddon.com/share_addon.js';
var j =document.getElementsByTagName('script')[0];j.parentNode.insertBefore(s,j);
})();
</script>
<a href="http://www.smartaddon.com/?share" title="Share Button" onclick="return sa_tellafriend('','bookmarks')"><img alt="Share" src="http://bootflat.github.io/img/share.gif" border="0" /></a>
<!-- SmartAddon END -->
</div>
<hr class="dashed" />
<div class="row">
<div class="col-md-4">
<h3>Get involved</h3>
<p>Bootflat is hosted on <a href="https://github.com/bootflat/Bootflat.UI.Kit.PSD" target="_blank" rel="external nofollow">GitHub</a> and open for everyone to contribute. Please give us some feedback and join the development!</p>
</div>
<div class="col-md-4">
<h3>Contribute</h3>
<p>You want to help us and participate in the development or the documentation? Just fork Bootflat on <a href="https://github.com/Bootflat/Bootflat.UI.Kit.PSD" target="_blank" rel="external nofollow">GitHub</a> and send us a pull request.</p>
</div>
<div class="col-md-4">
<h3>Found a bug?</h3>
<p>Open a <a href="https://github.com/bootflat/Bootflat.UI.Kit.PSD/issues" target="_blank" rel="external nofollow">new issue</a> on GitHub. Please search for existing issues first and make sure to include all relevant information.</p>
</div>
</div>
<hr class="dashed" />
<div class="row">
<div class="col-md-6">
<h3>Talk to us</h3>
<ul>
<li>Tweet us at <a href="https://twitter.com/flathemes" target="_blank">@flathemes</a>&nbsp;&nbsp;&nbsp;&nbsp;Email us at <span class="connect">info@flathemes.com</span></li>
<li>
<a title="Twitter" href="https://twitter.com/flathemes" target="_blank" rel="external nofollow"><i class="icon" data-icon="&#xe121"></i></a>
<a title="Facebook" href="https://www.facebook.com/Flathemes" target="_blank" rel="external nofollow"><i class="icon" data-icon="&#xe10b"></i></a>
<a title="Google+" href="https://plus.google.com/u/0/" target="_blank" rel="external nofollow"><i class="icon" data-icon="&#xe110"></i></a>
<a title="Github" href="https://github.com/bootflat/bootflat.github.io" target="_blank" rel="external nofollow"><i class="icon" data-icon="&#xe10e"></i></a>
</li>
</ul>
</div>
<div class="col-md-6">
<!-- Begin MailChimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">
<div id="mc_embed_signup">
<h3 style="margin-bottom: 15px;">Newsletter</h3>
<form action="http://flathemes.us3.list-manage.com/subscribe/post?u=faba9adaea2b85dc9a5c496bd&amp;id=acd08a1b0f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<input style="margin-bottom: 10px;" type="email" value="" name="EMAIL" class="email form-control" id="mce-EMAIL" placeholder="email address" required>
<span class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary"></span>
</form>
</div>
<!--End mc_embed_signup-->
</div>
</div>
<hr class="dashed" />
<div class="copyright clearfix">
<p><b>Bootflat</b>&nbsp;&nbsp;&nbsp;&nbsp;<a href="getting-started.html">Getting Started</a>&nbsp;&bull;&nbsp;<a href="documentation.html">Documentation</a>&nbsp;&bull;&nbsp;<a href="free-psd.html">Free PSD</a></p>
<p>&copy; 2014 <a href="http://www.flathemes.com" target="_blank">FLATHEMES</a>, Inc. All rights reserved. &nbsp;&nbsp;Code licensed under <a href="http://opensource.org/licenses/mit-license.html" target="_blank" rel="external nofollow">MIT License</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/" rel="external nofollow">CC BY 3.0</a>.</p>
</div>
</div>
</div>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-48721682-1', 'bootflat.github.io');
ga('send', 'pageview');
</script>
</body>
</html>
......@@ -35,6 +35,7 @@
<ul class="nav navbar-nav navbar-right">
<li><a class="nav-link current" href="getting-started.html">Getting Started</a></li>
<li><a class="nav-link" href="documentation.html">Documentation</a></li>
<li><a class="nav-link" href="free-psd.html">Free PSD</a></li>
</ul>
</div>
</div>
......@@ -76,6 +77,8 @@
<dd>You can change any or all of the colors if you wish. Bootflat is easy to configure and match to your brand's color scheme.</dd>
<dt>Easy Installation</dt>
<dd>Upload all Bootflat files and paste one line of code at the bottom of your <code>head</code> tag. That’s it!</dd>
<dt>Bootflat UI Kit Free Download</dt>
<dd><a href="free-psd.html">Bootflat UI Kit</a> is PSD User Interface Pack including a set of beautiful and pure components, which you can use to create startup projects, websites or iOS/Android Apps.</dd>
</dl>
</div>
<!-- Download
......@@ -87,7 +90,7 @@
<li>Version 2.0.0</li>
<li>Released December 18th, 2013</li>
</ul>
<p><a class="btn btn-primary" href="https://github.com/bootflat/bootflat.github.io/archive/master.zip">Download v2.0.0</a></p>
<p><a class="btn btn-primary" href="https://github.com/bootflat/bootflat.github.io/archive/master.zip">Download Bootflat Framework (v2.0.0)</a></p>
<p>You can also <a href="https://github.com/bootflat/bootflat.github.io">clone it on GitHub</a> to get the bleeding edge release. </p>
</div>
<!-- What's included
......@@ -154,6 +157,13 @@
<h3>Browser Support</h3>
<p>As such, our browser support tends to be whatever Web View API is available to native on a given platform. For Bootflat v2.0.0, that means UIWebView for E8, IE9, IE10, Firefox, Safari, Opera, Chrome.</p>
</div>
<!-- Free PSD
================================================== -->
<div class="docs-article docs--start" id="download">
<h3>Bootflat UI Kit</h3>
<p>For the designers, we offer a free PSD file for you, it including a set of beautiful and pure components, which you can use to create startup projects, websites or iOS/Android Apps.</p>
<p><a class="btn btn-primary" href="free-psd.html">Download Bootflat UI Kit (v2.0.0)</a></p>
</div>
<!-- Licensing
================================================== -->
<div class="docs-article docs--start" id="licensing">
......@@ -226,8 +236,8 @@
</div>
<hr class="dashed" />
<div class="copyright clearfix">
<p><b>Bootflat</b>&nbsp;&nbsp;&nbsp;&nbsp;<a href="getting-started.html">Getting Started</a>&nbsp;&bull;&nbsp;<a href="documentation.html">Documentation</a><!-- &nbsp;&bull;&nbsp;<a href="examples/">Examples</a> --></p>
<p>&copy; 2014 FLATHEMES, Inc. All rights reserved. &nbsp;&nbsp;Code licensed under <a href="http://opensource.org/licenses/mit-license.html" target="_blank" rel="external nofollow">MIT License</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/" rel="external nofollow">CC BY 3.0</a>.</p>
<p><b>Bootflat</b>&nbsp;&nbsp;&nbsp;&nbsp;<a href="getting-started.html">Getting Started</a>&nbsp;&bull;&nbsp;<a href="documentation.html">Documentation</a>&nbsp;&bull;&nbsp;<a href="free-psd.html">Free PSD</a></p>
<p>&copy; 2014 <a href="http://www.flathemes.com" target="_blank">FLATHEMES</a>, Inc. All rights reserved. &nbsp;&nbsp;Code licensed under <a href="http://opensource.org/licenses/mit-license.html" target="_blank" rel="external nofollow">MIT License</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/" rel="external nofollow">CC BY 3.0</a>.</p>
</div>
</div>
</div>
......
......@@ -35,6 +35,7 @@
<ul class="nav navbar-nav navbar-right">
<li><a class="nav-link" href="getting-started.html">Getting Started</a></li>
<li><a class="nav-link" href="documentation.html">Documentation</a></li>
<li><a class="nav-link" href="free-psd.html">Free PSD</a></li>
</ul>
</div>
</div>
......@@ -44,7 +45,7 @@
<h1>
<img src="img/logo-index.png" alt="Bootflat: Advanced HTML5 Hybrid Mobile App Framework">
</h1>
<h2>BOOTFLAT is an open source Flat UI KIT based on Bootstrap 3.1.0 CSS framework. <br />It provides a faster, easier and less repetitive way for web developers to create elegant web apps.</h2>
<h2>BOOTFLAT is an open source Flat UI KIT based on Bootstrap 3.1.0 CSS framework. <br/>And, for the designers, we offer a <a href="free-psd.html">free PSD Download</a>. <br />It provides a faster, easier and less repetitive way for web developers or designers to create elegant web apps. </h2>
<h3>Compatible Browsers: IE8, IE9, IE10, Firefox, Safari, Opera, Chrome.</h3>
<p class="download-link">
<a class="btn btn-primary" href="https://github.com/Bootflat/Bootflat.github.io/archive/master.zip">Download (Version 2.0.0)</a>
......@@ -101,11 +102,11 @@
</div>
</div>
</div>
<!-- <div class="desc__introduces">
<h3>Bootflat examples</h3>
<p>Check out our <a href="/examples/">examples</a>, including starter templates and showcase demos.</p>
<div class="photo--responsive"><img src="img/demo-index.png" /></div>
</div> -->
<div class="desc__introduces">
<h3>Bootflat UI Kit</h3>
<p>Bootflat UI Kit is PSD User Interface Pack including a set of beautiful and pure components, which you can use to create startup projects, websites or iOS/Android Apps. <a href="free-psd.html">Go to download it</a>.</p>
<div class="photo--responsive"><img src="img/bootflat-ui-kit.jpg" /></div>
</div>
</div>
<!--footer-->
<div class="site-footer">
......@@ -170,8 +171,8 @@
</div>
<hr class="dashed" />
<div class="copyright clearfix">
<p><b>Bootflat</b>&nbsp;&nbsp;&nbsp;&nbsp;<a href="getting-started.html">Getting Started</a>&nbsp;&bull;&nbsp;<a href="documentation.html">Documentation</a><!-- &nbsp;&bull;&nbsp;<a href="examples/">Examples</a> --></p>
<p>&copy; 2014 FLATHEMES, Inc. All rights reserved. &nbsp;&nbsp;Code licensed under <a href="http://opensource.org/licenses/mit-license.html" target="_blank" rel="external nofollow">MIT License</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/" rel="external nofollow">CC BY 3.0</a>.</p>
<p><b>Bootflat</b>&nbsp;&nbsp;&nbsp;&nbsp;<a href="getting-started.html">Getting Started</a>&nbsp;&bull;&nbsp;<a href="documentation.html">Documentation</a>&nbsp;&bull;&nbsp;<a href="free-psd.html">Free PSD</a></p>
<p>&copy; 2014 <a href="http://www.flathemes.com" target="_blank">FLATHEMES</a>, Inc. All rights reserved. &nbsp;&nbsp;Code licensed under <a href="http://opensource.org/licenses/mit-license.html" target="_blank" rel="external nofollow">MIT License</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/" rel="external nofollow">CC BY 3.0</a>.</p>
</div>
</div>
</div>
......