Discourse/discourse
Discourse/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-09-06 10:50:21 +08:00
Code Packages Activity Actions 9

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

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

18
app/assets/stylesheets/common/admin/admin_base.scss
View file

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

2
app/assets/stylesheets/common/admin/customize.scss
View file

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

4
app/assets/stylesheets/common/base/_topic-list.scss
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%)); color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%));
font-weight: normal; font-weight: normal;
font-size: 1em; 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 { td {
@ -257,7 +257,7 @@ ol.category-breadcrumb {
} }
} }
.fa-thumb-tack.unpinned { .d-icon-thumb-tack.unpinned {
@include fa-icon-rotate(180deg, 1); @include fa-icon-rotate(180deg, 1);
color: $primary; color: $primary;
/* because it is rotated, right becomes left! */ /* because it is rotated, right becomes left! */

2
app/assets/stylesheets/common/base/combobox.scss
View file

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

2
app/assets/stylesheets/common/base/compose.scss
View file

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

4
app/assets/stylesheets/common/base/directory.scss
View file

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

4
app/assets/stylesheets/common/base/emoji.scss
View file

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

2
app/assets/stylesheets/common/base/exception.scss
View file

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

5
app/assets/stylesheets/common/base/header.scss
View file

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

2
app/assets/stylesheets/common/base/history.scss
View file

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

4
app/assets/stylesheets/common/base/menu-panel.scss
View file

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

2
app/assets/stylesheets/common/base/modal.scss
View file

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

4
app/assets/stylesheets/common/base/rtl.scss
View file

@ -7,7 +7,7 @@
right: 0 !important; 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 ) { @mixin rotate( $degrees ) {
-webkit-transform: rotate(#{$degrees}deg); -webkit-transform: rotate(#{$degrees}deg);
-moz-transform: rotate(#{$degrees}deg); -moz-transform: rotate(#{$degrees}deg);
@ -21,7 +21,7 @@
} }
// Get the right caret to point left // Get the right caret to point left
.rtl .fa-caret-right { .rtl .d-icon-caret-right {
@include rotate(180); @include rotate(180);
} }

2
app/assets/stylesheets/common/base/tagging.scss
View file

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

2
app/assets/stylesheets/common/base/topic-post.scss
View file

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

6
app/assets/stylesheets/common/base/user.scss
View file

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

2
app/assets/stylesheets/common/components/badges.scss
View file

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

6
app/assets/stylesheets/common/components/buttons.scss
View file

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

2
app/assets/stylesheets/desktop/discourse.scss
View file

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

2
app/assets/stylesheets/desktop/header.scss
View file

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

10
app/assets/stylesheets/desktop/topic-list.scss
View file

@ -36,10 +36,10 @@
.topic-list { .topic-list {
margin: 0 0 10px; margin: 0 0 10px;
.fa-thumb-tack { 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%)); }
.fa-thumb-tack.unpinned { 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;} 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, th,
td { td {
padding: 12px 5px; padding: 12px 5px;
@ -51,7 +51,7 @@
} }
} }
th { 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 { > tbody > tr {
@ -68,7 +68,7 @@
.star { .star {
width: 20px; width: 20px;
padding-right: 0; padding-right: 0;
.fa-star { .d-icon-star {
position: relative; position: relative;
} }
+ .main-link { + .main-link {

14
app/assets/stylesheets/desktop/topic-post.scss
View file

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

2
app/assets/stylesheets/desktop/topic.scss
View file

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

2
app/assets/stylesheets/mobile/directory.scss
View file

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

2
app/assets/stylesheets/mobile/discourse.scss
View file

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

4
app/assets/stylesheets/mobile/topic-list.scss
View file

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

8
app/assets/stylesheets/mobile/topic-post.scss
View file

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

2
app/assets/stylesheets/mobile/topic.scss
View file

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

6
app/assets/stylesheets/wizard.scss
View file

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