coreui / coreui-icons Goto Github PK
View Code? Open in Web Editor NEWCoreUI Free Icons - Premium designed free icon set with marks in SVG, Webfont and raster formats
Home Page: https://coreui.io/icons/
License: Other
CoreUI Free Icons - Premium designed free icon set with marks in SVG, Webfont and raster formats
Home Page: https://coreui.io/icons/
License: Other
Not sure if this is the right place for requests...but would it possible to add the Microsoft Teams Icon?
Many thanks and keep up the good work!
Ran into this yesterday when trying to build these icons. The SASS transpilation step fails because the path defined for the Icon files here: https://github.com/coreui/coreui-icons/blob/master/scss/free/_variables.scss#L2 is incorrect. The fonts
folder is actually one more level back, so this:
$coreui-icons-font-path: "../fonts" !default;
should be
$coreui-icons-font-path: "../../fonts" !default;
Here's the error I was receiving:
Syntax Error: ModuleNotFoundError: Module not found: Error: Can't resolve '../fonts/CoreUI-Icons-Free.eot' in '/project/node_modules/@coreui/icons/scss/free'
I can't find cil-sad in the repo free-icons, is this belong in this repo or is the PRO one.
All the flags are currently different sizes. It would be nice if they were all the same size.
The icons list at coreui icons shows the wrong description/name after the icon for "Bowling".
Starting from '3D' until 'Bowling' all icons have the right description but after 'Bowling' every icon seems to have shifted the description to the next items.
Here is a possible SVG to replace current logo with
https://www.trainerroad.com/static/favicons/safari-pinned-tab.svg
Hello,
I purchased CoreUI React Admin Template and then CoreUI Icons Pro package. Since then I was never able to get the Pro Icons to work the way it works like the Free Icons (using the element).
Is there a documentation that I can use? Obviously there is a missing here. You should have a support forum, or documentation on how to use the package.
I had been using your icons in a prototype, and decided to see if there were any new ones. Apparently there are, but they’re no longer in handy PNG form. This means I can’t browse through the icons with Finder (since there’s no Quick Look for SVG).
Can you restore the PNGs?
(It might also be useful to show a version number somewhere, I am not spotting one. My download has PNGs with a date stamp of 27 Jan 2020. Today’s download has SVGs with a date stamp of 6 July 2020.)
This is what we have https://github.com/coreui/coreui-icons/blob/main/svg/flag/cif-dz.svg
and this is how it should look like
Please add as simple 'check' icon, similar in style with current plus / x icons.
There's only a double-lined check icon now.
Thanks :)
Description:
I recently pulled coreui and coreui icons to a Laravel setup and when attempting to run npm build
, NPM was not able to trace the .eot
file to the right location because it was using ../
as seen in:
Experiment:
I tested replacing ../
with ~@coreui/icons/
and this did the trick. NPM was able to build the proper files and I'm now able to load the icons in the page.
Could/Should this be corrected in font related files or should I be working with these packages differently? 🧐
Thanks,
Flag icons set does not contain all country flags, for example Cook Islands flag and British Virgin Islands flag are missing.
Vuejs icons not supported with Vuejs v3 + Typescript
I'm trying to install coreui icons through npm install
and everytime I got this error:
npm ERR! code E404
npm ERR! 404 Not Found: @coreui/icons@^0.2.0
And I get the same error trying to install with npm install @coreui/icons --save
Here's the log:
2900 verbose stack Error: 404 Not Found: @coreui/icons@^0.2.0
2900 verbose stack at fetch.then.res (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/pacote/lib/fetchers/registry/fetch.js:42:19)
2900 verbose stack at tryCatcher (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/bluebird/js/release/util.js:16:23)
2900 verbose stack at Promise._settlePromiseFromHandler (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/bluebird/js/release/promise.js:512:31)
2900 verbose stack at Promise._settlePromise (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/bluebird/js/release/promise.js:569:18)
2900 verbose stack at Promise._settlePromise0 (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/bluebird/js/release/promise.js:614:10)
2900 verbose stack at Promise._settlePromises (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/bluebird/js/release/promise.js:693:18)
2900 verbose stack at Async._drainQueue (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/bluebird/js/release/async.js:133:16)
2900 verbose stack at Async._drainQueues (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/bluebird/js/release/async.js:143:10)
2900 verbose stack at Immediate.Async.drainQueues [as _onImmediate] (/home/yuri/.nvm/versions/node/v10.2.1/lib/node_modules/npm/node_modules/bluebird/js/release/async.js:17:14)
2900 verbose stack at runCallback (timers.js:696:18)
2900 verbose stack at tryOnImmediate (timers.js:667:5)
2900 verbose stack at processImmediate (timers.js:649:5)
2901 verbose cwd /home/yuri/repos/cp-frontend2
2902 verbose Linux 4.14.57-1-MANJARO
2903 verbose argv "/home/yuri/.nvm/versions/node/v10.2.1/bin/node" "/home/yuri/.nvm/versions/node/v10.2.1/bin/npm" "install"
2904 verbose node v10.2.1
2905 verbose npm v6.2.0
2906 error code E404
2907 error 404 Not Found: @coreui/icons@^0.2.0
2908 verbose exit [ 1, true ]
My environment:
Manjaro: GNOME 17.1.11
Node: 10.2.1
NVM: 0.33.11
Please add support for animating icons by adding a class to current c-icon cui-x
icon, similar to
https://fontawesome.com/how-to-use/on-the-web/styling/animating-icons
According to this the delete icon is a free icon. But I cannot find cil-delete
in the free directory.
(the same goes for cil-backspace
)
Please add a flag for Hong Kong , thx
I download coreui-free-vue-admin-template and want use whole icon from 'coreui-icons'
my code is:
in main.js
import { freeSet, brandSet, flagSet } from '@coreui/icons'
new Vue({ el: '#app', router, store, icons: { freeSet, brandSet, flagSet }, template: '<App/>', components: { App, }, })
in vue file
<CIcon name="cil-pregnant" />
but it not work it,
It seams that there a some icons that are not displayed, e.g. "cui-dashboard", "cui-chalkboard", " cui-accessible" etc..
The Plus Icon for example doesn´t work with "cui-plus" but with "icon-plus" instead. How should i know wich prefix should be used ?
How can I reduce the bundle size of the icons package?
Currently, the size is 10.2MB
I’m just importing these ones:
//icons.js
import {
cilEnvelopeClosed,
cilEnvelopeOpen,
cilMagnifyingGlass,
cilMoon,
cilSpeedometer,
cilSun,
cilAccountLogout,
cilUser,
cilXCircle,
cilX,
} from '@coreui/icons'
import { logo } from './logo'
export const iconsSet = Object.assign({}, { logo }, {
cilEnvelopeClosed,
cilEnvelopeOpen,
cilMagnifyingGlass,
cilMoon,
cilSpeedometer,
cilSun,
cilAccountLogout,
cilUser,
cilXCircle,
cilX,
})
//main.js
import { iconsSet as icons } from './assets/icons/icons.js'
...
...
...
new Vue({
el: '#app',
router,
store,
icons
components: {
App
},
template: '<App/>',
apolloProvider: createProvider(),
})
Hello,
I purchased CoreUI Admin Template (all frameworks) and then CoreUI Icons Pro package. Since then I was never able to get the Pro Icons work the way it work like the Free Icons (using the element).
Is there a documentation that I can use? Obviously there is a missing here. You should have a support forum, or documentation how to use the package.
I deployed my coreui angular app in ngnix as off root deployment. When i launch the App URL, I see few images ( rendered from CSS classes as shown below) not rendering in the UI.
CSS Class to render image:
.icon-speech {
content: "\e02c" !important;
}
Ngnix config file:
server {
#-------
location /rig-activity {
set $url http://edge_rig-activity-service;
rewrite ^/rig-activity(.*) $1 break;
proxy_pass $url;
}
location /rig-activity-ui/ {
#enable for debug mode
#proxy_pass http://localhost:4200;
#root /www/html;
alias /www/rig-activity-ui/;
#index index.html index.htm;
try_files $uri$args $uri$args/ $uri/ /rig-activity-ui/index.html;
}
On icon demo page for vue for 3.1.0 version, there is an error with icon 'CilXCircle' - correct name should be 'cil-x-circle' not 'cil-xcircle'
In the upgrade from CoreUI 2 to CoreUI 3, the recommendation is to stop using FontAwesome, and Simple Line Icons, and to start using CoreUI icons.
This is great however it comes at a cost: You lose access to a significant amount of icons.
It would be a great contribution to your dedication to open source if the free set of CoreUI icons included replacements for more of the icons that were provided by Simple Line Icons.
Given the Simple Line Icons contains <180 icons, and most of the ones missing from the free version do exist in the pro version of CoreUI icons, this would largely be a judgement call and business decision on your end that I hope you can consider.
Some of the ones that would be valuable replacements for Simple Line Icons to include in the free version:
Thanks!
I have installed coreui/icons r2.0.1 via npm, and in src/index.js:
React.icons = icons
While, I try to use cli-cart as follow:
<CIcon content="cil-cart" />
The console log tells me:
CIcon component: icon name 'cil-cart' does not exist in React.icons object. To use icons by name
prop you need to make them available globally by adding them to React.icons object. CIcon component docs: https://coreui.io/react/docs/components/CIcon
I follow the steps in:
coreui/coreui-react#177
https://stackoverflow.com/questions/62840344/coreui-icon-doesnt-appear-in-my-react-js-app
But it doesn't show any icons? Do I miss something?
Thanks.
Hi, the descriptions / names of the icons are all wrong in documentation. Also I have the last version (1.0.1), and I've been trying a lot of free icons and no one works....
Done payment 2 month ago. When should I get the 2000 icons pack?
All 902 Icons (Over 2.000 will be available soon)
Payment is for 2000 icons, not for the 902 icons.
Could you please link this repo in your readme too
Thank you and I was wondering some icons I can't find in your repo that exist on the official website?
eg: chart-area
I suppose they were added later?
Build is failing in React 18 because of older version of React in this repository
npm ERR! While resolving: @coreui/[email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! react@"~18.2.0" from the root project
npm ERR! peer react@">=17" from @coreui/[email protected]
npm ERR! node_modules/@coreui/react
npm ERR! @coreui/react@"^4.2.3" from the root project
npm ERR! 18 more (@coreui/react-pro, @emotion/react, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^[17](https://github.com/Trademanza/Trademanza-Admin-KYC/runs/7055269253?check_suite_focus=true#step:3:18)" from @coreui/[email protected]
npm ERR! node_modules/@coreui/icons-react
npm ERR! @coreui/icons-react@"^2.0.1" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/react
npm ERR! peer react@"^17" from @coreui/[email protected]
npm ERR! node_modules/@coreui/icons-react
npm ERR! @coreui/icons-react@"^2.0.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /home/runner/.npm/eresolve-report.txt for a full report.
This is similar to #20 but for the Flag icons.
The path defined here: https://github.com/coreui/coreui-icons/blob/master/scss/flag/_core.scss#L14 isn't quite right because the svg
folder is actually one level deeper. This error was emitted when transpiling the SCSS:
Syntax Error: ModuleNotFoundError: Module not found: Error: Can't resolve '../svg/flag/cif-ad.svg' in '/project/node_modules/@coreui/icons/scss/flag'
To fix this, I changed this line:
background-image: url(../svg/flag/#{$coreui-icons-prefix}#{$icon}.svg);
to
background-image: url(../../svg/flag/#{$coreui-icons-prefix}#{$icon}.svg);
The Google Pay icon seems to have changed. Would love to see a new icon if you take these sorts of requests here.
As the title describes, the variables in the SCSS for the flag icons are in uppercase:
https://github.com/coreui/coreui-icons/blob/master/scss/flag/_variables.scss#L3
But the SVG files are in lowercase:
https://github.com/coreui/coreui-icons/tree/master/svg/flag
This results in this error when trying to transpile the SCSS to CSS:
Syntax Error: ModuleNotFoundError: Module not found: Error: Can't resolve '../svg/flag/cif-AD.svg' in '/project/node_modules/@coreui/icons/scss/flag'
Changing the variables to lowercase fixed this for me.
Now there is a variable for $coreui-icons-font-path
, but not for the SVG path. Current SVG path is set to ../svg
which I would like to change.
When I installed coreui-free-bootstrap-admin-template on branch v3-next and ran npm run build
the free.min.css file inside the resulting dist/vendors/@coreui/icons/css/ folder contains git merge conflicts:
@charset "UTF-8";/*!
<<<<<<< HEAD:scss/free.scss
* CoreUI Icons Free - Open Source Icons
* @version v0.4.1
=======
* CoreUI Icons Free Open Source Icons
* @version v1.0.0-beta.3
>>>>>>> v1-next:scss/free/free-icons.scss
* @link https://coreui.io/icons
* Copyright (c) 2019 creativeLabs Łukasz Holeczek
* Licensed under MIT (https://coreui.io/icons/license)
*/@font-face{font-family:CoreUI-Icons-Free;src:url(../
Below is a part of package.json
"dependencies": {
"@coreui/coreui": "^3.2.0",
"@coreui/icons": "^2.0.0-beta.5",
"@coreui/utils": "^1.3.1",
"@coreui/vue": "^3.1.1",
"@coreui/vue-chartjs": "^1.0.5",
"@webplayer/coreplayer": "^0.2.3",
"axios": "^0.19.2",
"core-js": "^3.6.5",
"vue": "^2.6.11",
"vue-advanced-cropper": "^0.17.3",
"vue-router": "^3.2.0",
"vuex": "^3.4.0",
"vuex-persistedstate": "^3.0.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.4.0",
"@vue/cli-plugin-eslint": "~4.4.0",
"@vue/cli-plugin-router": "~4.4.0",
"@vue/cli-plugin-vuex": "~4.4.0",
"@vue/cli-service": "~4.4.0",
"@vue/eslint-config-prettier": "^6.0.0",
"babel-eslint": "^10.1.0",
"eslint": "^5.16.0",
"eslint-plugin-prettier": "^3.1.3",
"eslint-plugin-vue": "^6.2.2",
"prettier": "^1.19.1",
"vue-template-compiler": "^2.6.11",
"node-sass": "~4.14.1",
"sass-loader": "~8.0.2"
}
and the problem is that most of icons with cil-
, ,cis-
.. are not working.
It even doesn't work in Coreui admin template.
For example,
{
_name: 'CSidebarItem',
name: '**************',
to: '/',
icon: 'cil-clock',
},
If I use cil-clock
nothing shows up.
Please add a help/question icon in the free version, to be used for support/help. It's quite common in apps.
Thanks!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.