tweaking for responsive

This commit is contained in:
davegandy 2013-06-06 15:18:43 -02:30
parent 63787fc5b3
commit a8f72b417c
7 changed files with 51 additions and 11 deletions

View File

@ -14,7 +14,7 @@
</div> </div>
<div class="span4"> <div class="span4">
<h4><a href="#stacked">Stacked Icons</a></h4> <h4><a href="#stacked">Stacked Icons</a></h4>
<div class="well well-transparent"> <div class="well well-transparent stacked">
<span class="icon-stack"> <span class="icon-stack">
<i class="icon-check-empty icon-stack-base"></i> <i class="icon-check-empty icon-stack-base"></i>
<i class="icon-twitter"></i> <i class="icon-twitter"></i>

View File

@ -21,7 +21,12 @@
<i class="icon-sign-blank icon-stack-base"></i> <i class="icon-sign-blank icon-stack-base"></i>
<i class="icon-terminal icon-light"></i> <i class="icon-terminal icon-light"></i>
</span> </span>
icon-terminal on icon-sign-blank icon-terminal on icon-sign-blank<br>
<span class="icon-stack">
<i class="icon-camera"></i>
<i class="icon-ban-circle icon-stack-base text-error"></i>
</span>
icon-camera on icon-ban-circle
</div> </div>
{% highlight html %} {% highlight html %}
<span class="icon-stack"> <span class="icon-stack">
@ -38,7 +43,12 @@ icon-flag on icon-circle<br>
<i class="icon-sign-blank icon-stack-base"></i> <i class="icon-sign-blank icon-stack-base"></i>
<i class="icon-terminal icon-light"></i> <i class="icon-terminal icon-light"></i>
</span> </span>
icon-terminal on icon-sign-blank icon-terminal on icon-sign-blank<br>
<span class="icon-stack">
<i class="icon-camera"></i>
<i class="icon-ban-circle icon-stack-base text-error"></i>
</span>
icon-camera on icon-ban-circle
{% endhighlight %} {% endhighlight %}
</div> </div>
</div> </div>

View File

@ -8,8 +8,12 @@
<div> <div>
<div class="alert alert-info"> <div class="alert alert-info">
<i class="icon-info-sign icon-2x pull-left margin-top-small padding-right-small"></i>Attribution is no longer required as of Font Awesome 3.0 but is much appreciated:<br> <ul class="icons-ul margin-bottom-none">
<code>Font Awesome by Dave Gandy - http://fontawesome.io</code>. <li>
<i class="icon-li icon-info-sign icon-large"></i>Attribution is no longer required as of Font Awesome 3.0 but is much appreciated:
<code>Font Awesome by Dave Gandy - http://fontawesome.io</code>.
</li>
</ul>
</div> </div>
</div> </div>

View File

@ -7,10 +7,12 @@ relative_path: ../../
<div class="container"> <div class="container">
<div class="info-icons"> <div class="info-icons">
<i class="icon-{{ page.icon.id }} icon-6"></i>&nbsp;&nbsp; <i class="icon-{{ page.icon.id }} icon-6"></i>&nbsp;&nbsp;
<i class="icon-{{ page.icon.id }} icon-5"></i>&nbsp;&nbsp; <span class="hidden-phone">
<i class="icon-{{ page.icon.id }} icon-4"></i>&nbsp;&nbsp; <i class="icon-{{ page.icon.id }} icon-5"></i>&nbsp;&nbsp;
<i class="icon-{{ page.icon.id }} icon-3"></i>&nbsp;&nbsp; <span class="hidden-tablet"><i class="icon-{{ page.icon.id }} icon-4"></i>&nbsp;&nbsp;</span>
<i class="icon-{{ page.icon.id }} icon-2"></i>&nbsp; <i class="icon-{{ page.icon.id }} icon-3"></i>&nbsp;&nbsp;
<i class="icon-{{ page.icon.id }} icon-2"></i>&nbsp;
</span>
<i class="icon-{{ page.icon.id }} icon-1"></i> <i class="icon-{{ page.icon.id }} icon-1"></i>
</div> </div>
<h1 class="info-class"> <h1 class="info-class">
@ -23,7 +25,7 @@ relative_path: ../../
{% for category in page.icon.categories %} {% for category in page.icon.categories %}
{{ category }}{% unless forloop.last %},{% endunless %} {{ category }}{% unless forloop.last %},{% endunless %}
{% endfor %} {% endfor %}
{% if page.icon.aliases %} {% if page.icon.aliases | size == 0 %}
&middot; Aliases: &middot; Aliases:
{% for alias in page.icon.aliases %} {% for alias in page.icon.aliases %}
icon-{{ alias }}{% unless forloop.last %},{% endunless %} icon-{{ alias }}{% unless forloop.last %},{% endunless %}

View File

@ -43,6 +43,16 @@
} }
} }
.jumbotron-icon {
.icon-1, .icon-2, .icon-3, .icon-4, .icon-5, .icon-6 { margin-right: 0; }
h1 small {
display: block;
margin-top: 15px;
margin-left: 0;
line-height: 20px;
}
}
.stripe-ad .lead { .stripe-ad .lead {
margin: 0 0 30px; margin: 0 0 30px;
} }

View File

@ -32,6 +32,15 @@
p { font-size: 28px; } p { font-size: 28px; }
} }
.jumbotron-icon {
h1 small {
display: block;
margin-top: 15px;
margin-left: 0;
line-height: 20px;
}
}
.stripe-ad { .stripe-ad {
.lead { .lead {
margin: 0; margin: 0;
@ -42,7 +51,7 @@
.span4 { width: @ad-width; } .span4 { width: @ad-width; }
} }
#why, #whats-new { #why, #whats-new, #new-styles {
.span4 { width: 352px; } .span4 { width: 352px; }
} }

View File

@ -192,6 +192,11 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
section { margin-top: 40px; } section { margin-top: 40px; }
.stacked {
padding-top: 35px;
height: 105px;
}
#social-buttons { #social-buttons {
ul.unstyled { margin: 0; } ul.unstyled { margin: 0; }