Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Overlay several Icons #871

Closed
wants to merge 1 commit into from
Closed

Overlay several Icons #871

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
52 changes: 52 additions & 0 deletions css/font-awesome.css
View file
Open in desktop
Expand Up @@ -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;
}
Expand Down
59 changes: 59 additions & 0 deletions less/font-awesome.less
View file
Open in desktop
Expand Up @@ -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
// -------------------------

Expand Down
56 changes: 56 additions & 0 deletions sass/font-awesome.sass
View file
Open in desktop
Expand Up @@ -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
// -------------------------

Expand Down
59 changes: 59 additions & 0 deletions sass/font-awesome.scss
View file
Open in desktop
Expand Up @@ -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
// -------------------------

Expand Down