Custom icon of status bar item in vscode extensions - visual-studio-code

The documentation https://code.visualstudio.com/docs/extensionAPI/vscode-api says that icon-name can be taken from the octicon, is it possible to insert icon that is not an octicon?

No, you can't, at least, not yet.
There is an open issue asking to support more icons, but no Milestone defined.

You can add your custom icon.
https://glyphter.com/
add your 5 X 5 svg logo here in section A, then Download the font.
in vscode's package.json
"contributes": {
"icons": {
"custom-icon-id": {
"description": "custom descr",
"default": {
"fontPath": "./customicon.woff", //woff file
"fontCharacter": "\\41" //you added svg logo in section A
}
}}

Related

Flutter: Load FontAwesome icon based on api

Getting api response like this
"sample_response":
{
"id": 1,
"icon": "fa-ambulance",
}
for static icon i used
icon: FaIcon(FontAwesomeIcons.gamepad),
How to load icon based on the json response
This is not supported by Font Awesome Flutter.
There is another package to help you with that: Icons Helper
However, if you try right now, you will see that Icons Helper refers to an adobe icon that does not exist anymore. It has been removed from the package in the master on Git but not yet on PubDev.
You could also just integrate icons_helper.dart in your project and maintain the map you need in your app.

Custom Icon for Gnome Shell Extension in Top Panel not visible

I try to use a custom SVG for my GNOME shell extension as status icon in top panel. But the custom icon is never shown, just the widget's label text. And I find no error in log output.
When I try to set a build-in icon like "system-search-symbolic" it works, this icon is shown.
This is my code snippet (the SVG is in an "icons" directory of my extension: /home/myusername/.local/share/gnome-shell/extensions/my-widget#my-widgets/icons/timeclock-16x16.svg):
// ...
let widgetBoxLayout = new St.BoxLayout();
let iconPath = `${Me.path}/icons/timeclock-16x16.svg`;
// just for debug if path is correct
log(`${Me.metadata.name}: Icon path=${iconPath}`);
let gicon = Gio.icon_new_for_string(`${iconPath}`);
let icon = new St.Icon({ gicon: gicon, style_class: 'system-status-icon', icon_size: 16 });
// this works for build-in icon:
//let icon = new St.Icon({ icon_name: 'system-search-symbolic', style_class: 'system-status-icon'});
widgetBoxLayout.add(icon);
widgetBoxLayout.add(this.widgetText);
//...
Maybe it's a problem that there is an "#" char in icon path?
But why no error is logged?
What is the correct code to use a custom icon for status panel?
(I have GNOME Shell 3.30.2)
Oh no! This one of these "fight for weeks alone, finally ask the crowd, suddenly know the solution yourself" cases ...
The icon was actually visible but since I use a dark theme and the icon itself is also dark it was not "visible". I inverted the colors of this icon and now I can see the icon next to my text in top panel.
Now I have to find out which icon to use depending on user's theme, but the original issue is solved.
Maybe this answer helps other developer making same stupid error.
You need to use -symbolic icons to allow automatic theme aware re-colorization of the icons. Just change the file name of the icon to timeclock-symbolic.svg, at least this should be your first step if every other aspect is fine.

MapBox studio, style in edit mode does not display the map image

I want to create a map starting from the basic template but when I open the template in the editor I do not see the map.Even in preview mode the map does not appear
In red is where it should appear the map or am I doing something wrong?
I downloaded json file from mapbox has more than 800 lines of code, it seems that is not empty.
I created a new map from street template and still not showing nothing in edit mode
I would recommend deleting that style and creating a new one based on the style Basic. I just attempted what you described and it works fine.
To create a new Style in Mapbox Studio. You can also follow the Get started with Mapbox Studio docs.
Login into Studio
Home > New Style
Pick a template, I would recommend starting with Streets
To verify, you created a new style based on Basic and not on the Style Empty, correct? The screen capture you have above looks like Empty. You can download your Style to compare.
This is what an Empty style looks like. Empty will have no map, giving you the power to build your own map literally from the ground up.
{
"version": 8,
"name": "Empty",
"metadata": {
"mapbox:autocomposite": true,
"mapbox:type": "template"
},
"sources": {
},
"glyphs": "mapbox://fonts/mapbox/{fontstack}/{range}.pbf",
"layers": [
{
"id": "background",
"type": "background",
"interactive": true,
"paint": {
"background-color": "rgba(0,0,0,0)"
}
}
]
}
I was able to resolve this issue by changing out my video card. (I worked with Mapbox support for a while but they were unable to help.) On a whim I swapped out my BFGE Tech GeForce GTS 250 for a NVIDIA GeForce GTX 670 and it started working.
I suspected a hardware issue as the problem persisted after upgrading to Windows 10.

Firefox add-on Action Button has no icon

I added this code to my Add-on SDK extension in the index.js:
var button = ActionButton({
id: "my-button",
label: "my button",
icon: {
"16": "./us16.png",
"32": "./us32.png"
},
onClick: firstClick
});
The Action Button gets added just fine and works, but there is no icon showing. I put the two icon files in the root folder of my add-on. Should I have put them elsewhere?
(Button documentation.)
Yes. Put your icons in data folder, whilst leaving the paths in the code as they are now.
I have same problem. And solution is add this code to packet.json
"permissions": {"private-browsing": true}
see here Firefox SDK Sample Add On Exported XPI Action Button Doesn't Show Up

Changing the theme with jstree 3.0.0

I'm trying to change the theme as follows:
I copied the contents of the default folder and copied them into a folder called david
I used replace all in style.css to change instances of .jstree-default with .jstree-david in my editor
I linked to the david stylesheet
I added this code to the core object of the jstree config object
"themes": {
"name": "david",
"dots": true,
"icons": true
}
The tree renders with none of the usual dots and icons and click does not expand the root nodes.
How do you create a theme for this new jstree? The style.css file and associated sprites are different from the version 1 themes I used to work with.
Are there any themes available already created for jstree 3.0.0?
UPDATE:
So used to getting my information from StackOverflow, I was delighted to get help on this issue directly from jstree's author in a very timely manner.
Do your remember include your css file successfully?
I use the following code to change the theme to dark. Hope to help you.
$('#jstree_demo_div').jstree({
'core' : {
"themes": {
"name": "default-dark",
"dots": true,
"icons": true
},
...
<link rel="stylesheet" href="/media/images/jstree_themes/default-dark/style.min.css" />