Skip to content

Commit 906345d

Browse files
woothuwoothu
committed
refactor: remove external icon libraries
1 parent 501ed1a commit 906345d

File tree

12 files changed

+245
-4963
lines changed

12 files changed

+245
-4963
lines changed

‎package.json

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,7 @@
2626
"css-vars-ponyfill": "^1.11.1",
2727
"current-script-polyfill": "^1.0.0",
2828
"element-resize-detector": "^1.2.0",
29-
"flag-icon-css": "^3.2.0",
30-
"font-awesome": "^4.7.0",
3129
"perfect-scrollbar": "^1.4.0",
32-
"simple-line-icons": "^2.4.1",
3330
"tooltip.js": "^1.3.1",
3431
"vue": "^2.6.6",
3532
"vue-chartjs": "^3.4.0",

‎src/App.vue

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,14 +11,6 @@ export default {
1111
<style lang="scss">
1212
// CoreUI Icons Set
1313
@import '~@coreui/icons/css/coreui-icons.min.css';
14-
/* Import Font Awesome Icons Set */
15-
$fa-font-path: '~font-awesome/fonts/';
16-
@import '~font-awesome/scss/font-awesome.scss';
17-
/* Import Simple Line Icons Set */
18-
$simple-line-font-path: '~simple-line-icons/fonts/';
19-
@import '~simple-line-icons/scss/simple-line-icons.scss';
20-
/* Import Flag Icons Set */
21-
@import '~flag-icon-css/css/flag-icon.min.css';
2214
// Import Main styles for this application
2315
@import 'assets/scss/style';
2416
</style>

‎src/_nav.js

Lines changed: 2 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -157,12 +157,12 @@ export default {
157157
icon: 'cui-pie-chart'
158158
},
159159
{
160-
name: 'Icons',
160+
name: 'CoreUI Icons',
161161
url: '/icons',
162162
icon: 'cui-star',
163163
children: [
164164
{
165-
name: 'CoreUI Icons',
165+
name: 'Icons library',
166166
url: '/icons/coreui-icons',
167167
icon: 'cui-star',
168168
badge: {
@@ -174,20 +174,6 @@ export default {
174174
name: 'Flags',
175175
url: '/icons/flags',
176176
icon: 'cui-star'
177-
},
178-
{
179-
name: 'Font Awesome',
180-
url: '/icons/font-awesome',
181-
icon: 'cui-star',
182-
badge: {
183-
variant: 'secondary',
184-
text: '4.7'
185-
}
186-
},
187-
{
188-
name: 'Simple Line Icons',
189-
url: '/icons/simple-line-icons',
190-
icon: 'cui-star'
191177
}
192178
]
193179
},

‎src/icons.js

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import {
2+
facebook,
3+
twitter,
4+
linkedin,
5+
flickr,
6+
tumblr,
7+
xing,
8+
github,
9+
stackOverflow,
10+
youtube,
11+
dribbble,
12+
instagram,
13+
pinterest,
14+
vk,
15+
yahoo,
16+
behance,
17+
reddit,
18+
vimeo,
19+
ccMastercard, ccVisa, stripe, paypal, googleWallet, ccAmex
20+
} from '@coreui/icons/brands'
21+
import { US, BR, IN, FR, ES, PL } from '@coreui/icons/flags'
22+
import { iconSet } from '@coreui/icons'
23+
24+
export const iconsSet = Object.assign(
25+
{},
26+
iconSet,
27+
{ US, BR, IN, FR, ES, PL },
28+
{
29+
facebook,
30+
twitter,
31+
linkedin,
32+
flickr,
33+
tumblr,
34+
xing,
35+
github,
36+
stackOverflow,
37+
youtube,
38+
dribbble,
39+
instagram,
40+
pinterest,
41+
vk,
42+
yahoo,
43+
behance,
44+
reddit,
45+
vimeo,
46+
ccMastercard, ccVisa, stripe, paypal, googleWallet, ccAmex
47+
}
48+
)

‎src/main.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import App from './App'
1212
import router from './router'
1313
import CoreuiVue from '@coreui/vue/src'
1414
import { CIconPlugin } from '@coreui/icons/vue'
15+
import { iconsSet } from './icons.js'
1516

1617
// import CoreuiVue from '@coreui/vue'
1718
// import CoreuiVue from '@coreui/vue/dist/custom.common.js'
@@ -21,7 +22,8 @@ Vue.config.performance = true
2122
// todo
2223
// cssVars()
2324
Vue.use(CoreuiVue)
24-
Vue.use(CIconPlugin)
25+
// console.log(iconsSet)
26+
Vue.use(CIconPlugin, iconsSet)
2527

2628
/* eslint-disable no-new */
2729
var vm = new Vue({

‎src/router/index.js

Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -39,8 +39,6 @@ const BrandButtons = () => import('@/views/buttons/BrandButtons')
3939

4040
// Views - Icons
4141
const Flags = () => import('@/views/icons/Flags')
42-
const FontAwesome = () => import('@/views/icons/FontAwesome')
43-
const SimpleLineIcons = () => import('@/views/icons/SimpleLineIcons')
4442
const CoreUIIcons = () => import('@/views/icons/CoreUIIcons')
4543

4644
// Views - Notifications
@@ -62,7 +60,7 @@ Vue.use(Router)
6260

6361
export default new Router({
6462
mode: 'hash', // https://router.vuejs.org/api/#mode
65-
linkActiveClass: 'active',
63+
linkActiveClass: 'c-active',
6664
scrollBehavior: () => ({ y: 0 }),
6765
routes: [
6866
{
@@ -247,31 +245,21 @@ export default new Router({
247245
},
248246
{
249247
path: 'icons',
250-
redirect: '/icons/font-awesome',
251-
name: 'Icons',
248+
redirect: '/icons/coreui-icons',
249+
name: 'CoreUI Icons',
252250
component: {
253251
render (c) { return c('router-view') }
254252
},
255253
children: [
256254
{
257255
path: 'coreui-icons',
258-
name: 'CoreUI Icons',
256+
name: 'Icons library',
259257
component: CoreUIIcons
260258
},
261259
{
262260
path: 'flags',
263261
name: 'Flags',
264262
component: Flags
265-
},
266-
{
267-
path: 'font-awesome',
268-
name: 'Font Awesome',
269-
component: FontAwesome
270-
},
271-
{
272-
path: 'simple-line-icons',
273-
name: 'Simple Line Icons',
274-
component: SimpleLineIcons
275263
}
276264
]
277265
},

‎src/views/Dashboard.vue

Lines changed: 23 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -384,9 +384,6 @@
384384
head-variant="light"
385385
no-sorting
386386
>
387-
<!-- <div slot="activity-header">
388-
A tu nic
389-
</div> -->
390387
<td slot="avatar" class="c-text-center" slot-scope="{item}">
391388
<div class="c-avatar">
392389
<img :src="item.avatar.url" class="c-img-avatar" alt="">
@@ -410,15 +407,13 @@
410407
slot-scope="{item}"
411408
class="c-text-center"
412409
>
413-
<i
414-
class="c-h4 c-mb-0"
415-
:class="flag(item.country.flag)"
416-
:title="item.country.flag"
417-
:id="item.country.flag"
418-
></i>
410+
<CIcon
411+
:name="item.country.flag"
412+
height="25"
413+
/>
419414
</td>
420415
<td slot="usage" slot-scope="{item}">
421-
<div class="clearfix">
416+
<div class="c-clearfix">
422417
<div class="c-float-left">
423418
<strong>{{item.usage.value}}%</strong>
424419
</div>
@@ -437,7 +432,10 @@
437432
slot-scope="{item}"
438433
class="c-text-center"
439434
>
440-
<i :class="item.payment.icon" style="font-size:24px"></i>
435+
<CIcon
436+
:name="item.payment.icon"
437+
height="25"
438+
/>
441439
</td>
442440
<td slot="activity" slot-scope="{item}">
443441
<div class="c-small c-text-muted">Last login</div>
@@ -457,7 +455,6 @@ import WidgetsSocial from './widgets/WidgetsSocial'
457455
import CalloutChartExample from './charts/CalloutChartExample'
458456
import CChartLineSimple from './charts/CChartLineSimple'
459457
460-
461458
export default {
462459
name: 'Dashboard',
463460
components: {
@@ -467,61 +464,61 @@ export default {
467464
WidgetsSocial,
468465
CChartLineSimple
469466
},
470-
data: function () {
467+
data () {
471468
return {
472469
selected: 'Month',
473470
tableItems: [
474471
{
475472
avatar: { url: 'img/avatars/1.jpg', status: 'success' },
476473
user: { name: 'Yiorgos Avraamu', new: true, registered: 'Jan 1, 2015' },
477-
country: { name: 'USA', flag: 'us' },
474+
country: { name: 'USA', flag: 'US' },
478475
usage: { value: 50, period: 'Jun 11, 2015 - Jul 10, 2015' },
479-
payment: { name: 'Mastercard', icon: 'fa fa-cc-mastercard' },
476+
payment: { name: 'Mastercard', icon: 'cc-mastercard' },
480477
activity: '10 sec ago'
481478
},
482479
{
483480
avatar: { url: 'img/avatars/2.jpg', status: 'danger' },
484481
user: { name: 'Avram Tarasios', new: false, registered: 'Jan 1, 2015' },
485-
country: { name: 'Brazil', flag: 'br' },
482+
country: { name: 'Brazil', flag: 'BR' },
486483
usage: { value: 22, period: 'Jun 11, 2015 - Jul 10, 2015' },
487-
payment: { name: 'Visa', icon: 'fa fa-cc-visa' },
484+
payment: { name: 'Visa', icon: 'cc-visa' },
488485
activity: '5 minutes ago'
489486
},
490487
{
491488
avatar: { url: 'img/avatars/3.jpg', status: 'warning' },
492489
user: { name: 'Quintin Ed', new: true, registered: 'Jan 1, 2015' },
493-
country: { name: 'India', flag: 'in' },
490+
country: { name: 'India', flag: 'IN' },
494491
usage: { value: 74, period: 'Jun 11, 2015 - Jul 10, 2015' },
495-
payment: { name: 'Stripe', icon: 'fa fa-cc-stripe' },
492+
payment: { name: 'Stripe', icon: 'stripe' },
496493
activity: '1 hour ago'
497494
},
498495
{
499496
avatar: { url: 'img/avatars/4.jpg', status: '' },
500497
user: { name: 'Enéas Kwadwo', new: true, registered: 'Jan 1, 2015' },
501-
country: { name: 'France', flag: 'fr' },
498+
country: { name: 'France', flag: 'FR' },
502499
usage: { value: 98, period: 'Jun 11, 2015 - Jul 10, 2015' },
503-
payment: { name: 'PayPal', icon: 'fa fa-paypal' },
500+
payment: { name: 'PayPal', icon: 'paypal' },
504501
activity: 'Last month'
505502
},
506503
{
507504
avatar: { url: 'img/avatars/5.jpg', status: 'success' },
508505
user: { name: 'Agapetus Tadeáš', new: true, registered: 'Jan 1, 2015' },
509-
country: { name: 'Spain', flag: 'es' },
506+
country: { name: 'Spain', flag: 'ES' },
510507
usage: { value: 22, period: 'Jun 11, 2015 - Jul 10, 2015' },
511-
payment: { name: 'Google Wallet', icon: 'fa fa-google-wallet' },
508+
payment: { name: 'Google Wallet', icon: 'google-wallet' },
512509
activity: 'Last week'
513510
},
514511
{
515512
avatar: { url: 'img/avatars/6.jpg', status: 'danger' },
516513
user: { name: 'Friderik Dávid', new: true, registered: 'Jan 1, 2015' },
517-
country: { name: 'Poland', flag: 'pl' },
514+
country: { name: 'Poland', flag: 'PL' },
518515
usage: { value: 43, period: 'Jun 11, 2015 - Jul 10, 2015' },
519-
payment: { name: 'Amex', icon: 'fa fa-cc-amex' },
516+
payment: { name: 'Amex', icon: 'cc-amex' },
520517
activity: 'Last week'
521518
}
522519
],
523520
tableFields: [
524-
{ key: 'avatar', _classes: 'c-text-center' },
521+
{ key: 'avatar', label: '', _classes: 'c-text-center' },
525522
{ key: 'user' },
526523
{ key: 'country', _classes: 'c-text-center' },
527524
{ key: 'usage' },
@@ -543,9 +540,6 @@ export default {
543540
$variant = 'danger'
544541
}
545542
return $variant
546-
},
547-
flag (value) {
548-
return 'flag-icon flag-icon-' + value
549543
}
550544
}
551545
}

0 commit comments

Comments
 (0)