added posibility to overlay several icons

This commit is contained in:
OpenShift guest 2013-03-21 07:21:31 -04:00
parent 13d5dd373c
commit ed45ef277b
4 changed files with 226 additions and 0 deletions

52
css/font-awesome.css vendored
View File

@ -180,6 +180,58 @@ ul.icons li [class*=" icon-"] {
-moz-border-radius: 6px;
border-radius: 6px;
}
.overlay-icons {
display: inline-block;
height: 1em;
position: relative;
width: 1em;
}
.overlay-icons [class^="icon-"],
.overlay-icons [class*=" icon-"] {
left: 0;
position: absolute;
top: 0;
}
.overlay-icons .icon-small {
font-size: .5em;
}
.overlay-icons .icon-top-left {
top: 0;
left: 0;
}
.overlay-icons .icon-bottom-left {
bottom: 0;
top: auto;
}
.overlay-icons .icon-top-right {
top: 0;
left: auto;
right: 0;
}
.overlay-icons .icon-bottom-right {
bottom: 0;
right: 0;
left: auto;
top: auto;
}
.overlay-icons .icon-outer-top-right {
top: -0.25em;
left: auto;
right: -0.125em;
}
.overlay-icons .icon-outer-top-left {
top: -0.25em;
}
.overlay-icons .icon-outer-bottom-right {
bottom: -0.25em;
left: auto;
right: -0.125em;
top: auto;
}
.overlay-icons .icon-outer-bottom-left {
bottom: -0.25em;
top: auto;
}
.pull-right {
float: right;
}

View File

@ -181,6 +181,65 @@ ul.icons {
}
}
// Icon Overlay
// -------------------------
.overlay-icons {
display: inline-block;
height: 1em;
position: relative;
width: 1em;
[class^="icon-"],
[class*=" icon-"] {
left: 0;
position: absolute;
top: 0;
}
.icon-small {
font-size: .5em;
}
.icon-top-left {
top: 0;
left: 0;
}
.icon-bottom-left {
bottom: 0;
top: auto;
}
.icon-top-right {
top: 0;
left: auto;
right: 0;
}
.icon-bottom-right {
bottom: 0;
right: 0;
left: auto;
top: auto;
}
.icon-outer-top-right {
top: -.25em;
left: auto;
right: -.125em;
}
.icon-outer-top-left {
top: -.25em;
}
.icon-outer-bottom-right {
bottom: -.25em;
left: auto;
right: -.125em;
top: auto;
}
.icon-outer-bottom-left {
bottom: -.25em;
top: auto;
}
}
// Floats
// -------------------------

View File

@ -161,6 +161,62 @@ ul.icons
border-width: 4px
@include border-radius(6px)
// Icon Overlay
// -------------------------
.overlay-icons
display: inline-block
height: 1em
position: relative
width: 1em
[class^="icon-"],
[class*=" icon-"]
left: 0
position: absolute
top: 0
.icon-small
font-size: .5em
.icon-top-left
top: 0
left: 0
.icon-bottom-left
bottom: 0
top: auto
.icon-top-right
top: 0
left: auto
right: 0
.icon-bottom-right
bottom: 0
right: 0
left: auto
top: auto
.icon-outer-top-right
top: -.25em
left: auto
right: -.125em
.icon-outer-top-left
top: -.25em
.icon-outer-bottom-right
bottom: -.25em
left: auto
right: -.125em
top: auto
.icon-outer-bottom-left
bottom: -.25em
top: auto
// Floats
// -------------------------

View File

@ -178,6 +178,65 @@ ul.icons {
}
}
// Icon Overlay
// -------------------------
.overlay-icons {
display: inline-block;
height: 1em;
position: relative;
width: 1em;
[class^="icon-"],
[class*=" icon-"] {
left: 0;
position: absolute;
top: 0;
}
.icon-small {
font-size: .5em;
}
.icon-top-left {
top: 0;
left: 0;
}
.icon-bottom-left {
bottom: 0;
top: auto;
}
.icon-top-right {
top: 0;
left: auto;
right: 0;
}
.icon-bottom-right {
bottom: 0;
right: 0;
left: auto;
top: auto;
}
.icon-outer-top-right {
top: -.25em;
left: auto;
right: -.125em;
}
.icon-outer-top-left {
top: -.25em;
}
.icon-outer-bottom-right {
bottom: -.25em;
left: auto;
right: -.125em;
top: auto;
}
.icon-outer-bottom-left {
bottom: -.25em;
top: auto;
}
}
// Floats
// -------------------------