mirror of
https://github.com/FortAwesome/Font-Awesome.git
synced 2024-12-26 21:41:29 +08:00
making borders more subtle, making examples appear better on mobile
This commit is contained in:
parent
2407f0ae2d
commit
bc01f2f8c6
@ -2,9 +2,6 @@
|
||||
<h2 class="page-header">Bootstrap 3 Examples</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-sm-4">
|
||||
<p>
|
||||
Font Awesome works great with the full range of Bootstrap components.
|
||||
</p>
|
||||
<p>
|
||||
<a class="btn btn-danger" href="#">
|
||||
<i class="fa fa-trash-o fa-lg"></i> Delete</a>
|
||||
@ -50,6 +47,9 @@
|
||||
|
||||
</div>
|
||||
<div class="col-md-9 col-sm-8">
|
||||
<p>
|
||||
Font Awesome works great with the full range of Bootstrap components.
|
||||
</p>
|
||||
{% highlight html %}
|
||||
<a class="btn btn-danger" href="#">
|
||||
<i class="fa fa-trash-o fa-lg"></i> Delete</a>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<h2 class="page-header">Fixed Width Icons</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-sm-4">
|
||||
<ul class="nav nav-pills nav-stacked">
|
||||
<ul class="nav nav-pills nav-stacked margin-bottom">
|
||||
<li class="active"><a href="#"><i class="fa fa-home fa-fw"></i> Home</a></li>
|
||||
<li><a href="#"><i class="fa fa-book fa-fw"></i> Library</a></li>
|
||||
<li><a href="#"><i class="fa fa-pencil fa-fw"></i> Applications</a></li>
|
||||
|
@ -2,7 +2,9 @@
|
||||
<h2 class="page-header">Inline Icons</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-sm-4">
|
||||
<i class="fa fa-camera-retro"></i> fa-camera-retro
|
||||
<p>
|
||||
<i class="fa fa-camera-retro"></i> fa-camera-retro
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-9 col-sm-8">
|
||||
<p>Place Font Awesome icons just about anywhere with the <code><i></code> tag.</p>
|
||||
|
@ -2,14 +2,14 @@
|
||||
<h2 class="page-header">Rotated & Flipped</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-sm-4">
|
||||
<div style="font-size: 18px;">
|
||||
<p style="font-size: 18px;">
|
||||
<i class="fa fa-shield"></i> normal<br>
|
||||
<i class="fa fa-shield fa-rotate-90"></i> fa-rotate-90<br>
|
||||
<i class="fa fa-shield fa-rotate-180"></i> fa-rotate-180<br>
|
||||
<i class="fa fa-shield fa-rotate-270"></i> fa-rotate-270<br>
|
||||
<i class="fa fa-shield fa-flip-horizontal"></i> fa-flip-horizontal<br>
|
||||
<i class="fa fa-shield fa-flip-vertical"></i> fa-flip-vertical
|
||||
</div>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-9 col-sm-8">
|
||||
<p>
|
||||
|
@ -2,9 +2,11 @@
|
||||
<h2 class="page-header">Spinning Icons</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-sm-4">
|
||||
<button class="btn btn-default btn-lg"><i class="fa fa-spinner fa-spin"></i></button>
|
||||
<button class="btn btn-default btn-lg"><i class="fa fa-refresh fa-spin"></i></button>
|
||||
<button class="btn btn-default btn-lg"><i class="fa fa-cog fa-spin"></i></button>
|
||||
<p>
|
||||
<button class="btn btn-default btn-lg"><i class="fa fa-spinner fa-spin"></i></button>
|
||||
<button class="btn btn-default btn-lg"><i class="fa fa-refresh fa-spin"></i></button>
|
||||
<button class="btn btn-default btn-lg"><i class="fa fa-cog fa-spin"></i></button>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-9 col-sm-8">
|
||||
<p>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<h2 class="page-header">Stacked Icons</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-sm-4">
|
||||
<div>
|
||||
<div class="margin-bottom">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-square-o fa-stack-2x"></i>
|
||||
<i class="fa fa-twitter fa-stack-1x"></i>
|
||||
|
@ -102,7 +102,7 @@
|
||||
// Form states and alerts
|
||||
@state-success-text: @fa-green;
|
||||
@state-success-bg: mix(@fa-green, #fff, 6%);
|
||||
@state-success-border: darken(spin(@state-success-bg, -10), 13%);
|
||||
@state-success-border: darken(spin(@state-success-bg, -10), 5%);
|
||||
|
||||
@state-info-text: mix(@blue-dark, @blue, 50%);
|
||||
@state-info-bg: @blue-lighter;
|
||||
@ -117,4 +117,4 @@
|
||||
|
||||
|
||||
// Code
|
||||
@pre-border-color: #e5e5e5;
|
||||
@pre-border-color: #eee;
|
||||
|
@ -1,7 +1,7 @@
|
||||
#carbonads-container {
|
||||
.carbonad {
|
||||
background: @table-bg-accent;
|
||||
border-color: @table-border-color;
|
||||
background: @pre-bg;
|
||||
border-color: @pre-border-color;
|
||||
border-radius: (@border-radius-base);
|
||||
border-width: 1px;
|
||||
float: right;
|
||||
|
Loading…
Reference in New Issue
Block a user