REFACTOR: Replace fa-* in SCSS with d-icon-*

This commit is contained in:
Robin Ward 2017-07-27 15:03:41 -04:00
parent 5b590b9637
commit 6dfa3625df
29 changed files with 64 additions and 63 deletions

View File

@ -51,8 +51,8 @@ $mobile-breakpoint: 700px;
background-color: lighten($primary, 80%);
}
i.fa-chevron-down,
i.fa-chevron-up {
.d-icon-chevron-down,
.d-icon-chevron-up {
margin-left: 0.5em;
}
}
@ -869,7 +869,7 @@ section.details {
}
.update-nag {
i.fa {
.d-icon {
font-size: 1.429em;
}
}
@ -904,10 +904,10 @@ table.api-keys {
width: 100%;
.title {
i.fa {
.d-icon {
color: $primary;
}
i.fa-heart {
.d-icon-heart {
color: $love;
}
}
@ -1363,10 +1363,10 @@ table.api-keys {
}
.tl3-requirements {
.fa-check {
.d-icon-check {
color: $success;
}
.fa-times {
.d-icon-times {
color: $danger;
}
}
@ -1860,11 +1860,11 @@ table#user-badges {
.watched-word {
display: inline-block;
cursor: pointer;
i.fa {
.d-icon {
margin-right: 0.25em;
color: dark-light-diff($primary, $secondary, 50%, -50%);
}
&:hover i.fa {
&:hover .d-icon {
color: $primary;
}
}

View File

@ -98,7 +98,7 @@
li.mobile a {
padding-right: 25px;
}
.fa-mobile {
.d-icon-mobile {
position: absolute;
right: 10px;
top: 3px;

View File

@ -72,7 +72,7 @@ html.anon .topic-list a.title:visited:not(.badge-notification) {color: $primary-
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%));
font-weight: normal;
font-size: 1em;
button i.fa {color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%));}
button .d-icon {color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%));}
}
td {
@ -257,7 +257,7 @@ ol.category-breadcrumb {
}
}
.fa-thumb-tack.unpinned {
.d-icon-thumb-tack.unpinned {
@include fa-icon-rotate(180deg, 1);
color: $primary;
/* because it is rotated, right becomes left! */

View File

@ -25,7 +25,7 @@
.select2-drop {
background: $secondary;
i.fa {
.d-icon {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%));
}
}

View File

@ -10,7 +10,7 @@
margin: 0;
li {
.fa-users {
.d-icon-users {
color: lighten($primary, 40%);
padding: 0 2px;
}

View File

@ -49,11 +49,11 @@
white-space: nowrap;
width: 13%;
i.fa-heart {
.d-icon-heart {
color: $love;
margin-right: 0.5em;
}
i.fa-chevron-down, i.fa-chevron-up {
.d-icon-chevron-down, .d-icon-chevron-up {
margin-left: 0.5em;
}

View File

@ -140,7 +140,7 @@ body img.emoji {
display: none;
}
.emoji-picker .diversity-picker i.fa {
.emoji-picker .diversity-picker .d-icon {
color: #fff;
font-size: 12px;
text-shadow: 0.5px 1.5px 0 rgba(0,0,0,0.3);
@ -196,7 +196,7 @@ body img.emoji {
align-items: center;
}
.emoji-picker .filter .fa.fa-search {
.emoji-picker .filter .d-icon-search {
color: dark-light-choose(scale-color($header_primary, $lightness: 50%), $header_primary);
font-size: 16px;
margin-left: 5px;

View File

@ -16,7 +16,7 @@
}
.desc {
margin-top: 16px;
.fa-check-circle {
.d-icon-check-circle {
color: $success;
}
}

View File

@ -26,7 +26,7 @@
max-height: 40px;
}
.fa-home {
.d-icon-home {
font-size: 1.643em;
}
@ -113,7 +113,8 @@
}
}
}
[class^="fa fa-"] {
.d-icon {
width: 32px;
height: 32px;
font-size: 1.714em;

View File

@ -80,7 +80,7 @@
background-color: lighten($highlight, 23%);
padding: 3px 5px 5px 5px;
}
.fa-ban {
.d-icon-ban {
color: #f00;
}
.hidden-revision-either {

View File

@ -226,7 +226,7 @@
}
}
.is-warning {
i.fa-envelope-o {
.d-icon-envelope-o {
&:before {
content: "\f0e0";
}
@ -301,7 +301,7 @@ div.menu-links-header {
a {
font-size: 1.1em;
}
.fa-user {
.d-icon-user {
margin-right: 0.2em;
}
}

View File

@ -292,7 +292,7 @@
.permission {
margin-left: 20px;
}
.fa-times-circle {
.d-icon-times-circle {
margin-left: 5px;
}
li {

View File

@ -7,7 +7,7 @@
right: 0 !important;
}
// This is used to flip the .fa-caret-right icon
// This is used to flip the .d-icon-caret-right
@mixin rotate( $degrees ) {
-webkit-transform: rotate(#{$degrees}deg);
-moz-transform: rotate(#{$degrees}deg);
@ -21,7 +21,7 @@
}
// Get the right caret to point left
.rtl .fa-caret-right {
.rtl .d-icon-caret-right {
@include rotate(180);
}

View File

@ -207,7 +207,7 @@ header .discourse-tag {color: $tag-color }
}
.autocomplete {
.fa-tag {
.d-icon-tag {
color: dark-light-choose($primary, scale-color($primary, $lightness: 70%));
padding-right: 5px;
}

View File

@ -242,7 +242,7 @@ aside.quote {
.post-info {
&.via-email, &.whisper {
margin-right: 5px;
i.fa {
.d-icon {
font-size: 1em;
}
}

View File

@ -21,7 +21,7 @@
}
.user-main {
i.fa-heart {
.d-icon-heart {
color: $love !important;
}
.nav-pills {
@ -177,10 +177,10 @@
.user-nav {
margin: 5px 0px;
padding-top: 10px;
.fa {
.d-icon {
margin-right: 5px;
}
.fa.fa-comment {
.d-icon-comment {
margin-right: 2px;
}
}

View File

@ -158,7 +158,7 @@
padding: 5px;
width: 13px;
.fa-caret-right {
.d-icon-caret-right {
margin-left: 2px;
}
}

View File

@ -61,10 +61,10 @@
cursor: not-allowed;
}
i.fa {
.d-icon {
opacity: 0.7;
}
&.btn-primary i.fa {
&.btn-primary .d-icon {
opacity: 1;
}
}
@ -194,7 +194,7 @@
background: transparent;
border: 0;
outline: 0;
i.fa {
.d-icon {
opacity: 0.7;
}
}

View File

@ -96,7 +96,7 @@ body {
}
}
i.fa-envelope {
.d-icon-envelope {
color: $danger;
}
}

View File

@ -7,7 +7,7 @@
z-index: 1000;
padding-top: 3px;
height: 60px;
.fa-home {
.d-icon-home {
padding:8px;
font-size: 2.1em;
}

View File

@ -36,10 +36,10 @@
.topic-list {
margin: 0 0 10px;
.fa-thumb-tack { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); }
.fa-thumb-tack.unpinned { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); }
.d-icon-thumb-tack { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); }
.d-icon-thumb-tack.unpinned { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); }
a.title {color: $primary;}
.fa-bookmark { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); }
.d-icon-bookmark { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); }
th,
td {
padding: 12px 5px;
@ -51,7 +51,7 @@
}
}
th {
button i.fa {color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); }
button .d-icon {color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); }
}
> tbody > tr {
@ -68,7 +68,7 @@
.star {
width: 20px;
padding-right: 0;
.fa-star {
.d-icon-star {
position: relative;
}
+ .main-link {

View File

@ -67,7 +67,7 @@ nav.post-controls {
a, button {
color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%));
i.fa {
.d-icon {
opacity: 1.0;
}
margin-right: 2px;
@ -207,7 +207,7 @@ nav.post-controls {
width: 176px;
margin-bottom: 5px;
i.fa {
.d-icon {
width: 14px;
margin-right: 14px;
}
@ -261,7 +261,7 @@ nav.post-controls {
}
.post-date { color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); }
.fa-arrow-up, .fa-arrow-down { margin-left: 5px; }
.d-icon-arrow-up, .d-icon-arrow-down { margin-left: 5px; }
.reply:first-of-type .row { border-top: none; }
.topic-meta-data {
@ -385,7 +385,7 @@ a.star {
font-weight: bold;
font-size: 0.929em;
}
i.fa-times {
.d-icon-times {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%));
}
}
@ -446,10 +446,10 @@ a.star {
.btn {
margin-bottom: 5px;
margin-right: 10px;
.fa-bookmark.bookmarked { color: $tertiary; }
.d-icon-bookmark.bookmarked { color: $tertiary; }
}
.bookmark.bookmarked .fa-bookmark {
.bookmark.bookmarked .d-icon-bookmark {
color: $tertiary;
}
@ -526,7 +526,7 @@ video {
.topic-statuses {
i { color: $header_primary; }
i.fa-envelope { color: $danger; }
.d-icon-envelope { color: $danger; }
.unpinned { color: $header_primary; }
}

View File

@ -167,7 +167,7 @@
text-align: center;
z-index: 1;
}
i.fa {
.d-icon {
position: absolute;
right: 8px;
bottom: 9px;

View File

@ -40,7 +40,7 @@
margin-left: 0.2em;
color: blend-primary-secondary(50%);
}
i.fa-heart {
.d-icon-heart {
color: $love;
}
}

View File

@ -136,7 +136,7 @@ h2#site-text-logo
box-sizing: border-box;
display: block;
}
.fa-caret-down {
.d-icon-caret-down {
position: absolute;
right: 0px;
}

View File

@ -47,8 +47,8 @@
}
.nav-pills > li {
background: $primary-low;
i.fa-caret-down {
background: $primary-low;
.d-icon-caret-down {
margin-left: 8px;
}
}

View File

@ -47,7 +47,7 @@ span.badge-posts {
nav.post-controls {
clear: both;
i.fa {
.d-icon {
opacity: 1.0;
}
}
@ -134,7 +134,7 @@ nav.post-controls {
width: 176px;
margin-bottom: 5px;
i.fa {
.d-icon {
width: 14px;
margin-right: 14px;
}
@ -323,7 +323,7 @@ a.star {
#topic-footer-buttons {
@include clearfix;
padding: 20px 0 0 0;
.fa-bookmark.bookmarked { color: $tertiary; }
.d-icon-bookmark.bookmarked { color: $tertiary; }
.combobox {
float: left;
@ -371,7 +371,7 @@ span.post-count {
.btn {
margin-bottom: 5px;
margin-right: 10px;
.fa-star {margin-right: 5px;}
.d-icon-star {margin-right: 5px;}
}
}

View File

@ -133,7 +133,7 @@
font-size: 1.286em;
line-height: 15px;
}
i.fa {
.d-icon {
position: absolute;
right: 8px;
bottom: 9px;

View File

@ -224,11 +224,11 @@ body.wizard {
background-color: #ccc;
}
i.fa-chevron-right {
.d-icon-chevron-right {
margin-left: 0.25em;
font-size: 0.8em;
}
i.fa-chevron-left {
.d-icon-chevron-left {
margin-right: 0.25em;
font-size: 0.8em;
}
@ -287,7 +287,7 @@ body.wizard {
.wizard-btn.next {
min-width: 70px;
i.fa-chevron-right {
.d-icon-chevron-right {
margin-left: 0.25em;
font-size: 0.8em;
}