I'm using MediaWiki version 1.21.3 for internal documentation. I've changed WikiEditor toolbar from the Standard one to an Enhanced editing toolbar.
Issue: The icons displayed for Bold and Italics are displayed as A, A. I would like to change the Bold icon & Italics icon displayed in my Enhanced Edit tool bar to B, I.
I replaced the value of parameter icon: in
jquery.wikiEditor.toolbar.config
inside the WikiEditor modules from
'icon': { 'default': 'format-bold.png', 'en': 'format-bold-B.png',
'cs': 'format-bold-B.png', 'de': 'format-bold-F.png', 'fr':
'format-bold-G.png', 'gl': 'format-bold-N.png', 'es':
'format-bold-N.png', 'eu': 'format-bold-L.png', 'he':
'format-bold-B.png', 'hu': 'format-bold-F.png', 'it':
'format-bold-G.png', 'ka': 'format-bold-ka.png', 'nl':
'format-bold-V.png', 'os': 'format-bold-os.png', 'pt':
'format-bold-N.png', 'pt-br': 'format-bold-N.png', 'pl':
'format-bold-B.png', 'ru': 'format-bold-ru.png', 'ml':
'format-bold-B.png'}
to
'icon': 'en': 'format-bold-B.png',
but it does not seem to fix it.
Any help is much appreciated.
Thanks,
Gowri
First check that the PNG in question actually exists in the assets directory of MediaWiki, then follow the instructions at https://www.mediawiki.org/wiki/Extension:WikiEditor/Toolbar_customization#Example:_adding_localized_icons as suggested by Suriyaa.
Related
I'm trying to understand how create a Drupal 8 custom theme. I've some questions about that, and i can't find a real answer on documentation or else. Can somebody help me please ?
I've created a libraries.yml and theme_info.yml with theses informations :
name: Cosplay Academy
type: theme
description: 'A cuddly theme that offers extra fluffiness.'
core: 8.x
libraries:
- cosplayacademy/global-styling-and-scripts
regions:
header: Header
primary_menu: 'Primary menu'
secondary_menu: 'Secondary menu'
page_top: 'Page top'
page_bottom: 'Page bottom'
highlighted: Highlighted
featured_top: 'Featured top'
breadcrumb: Breadcrumb
content: Content
sidebar_first: 'Sidebar first'
sidebar_second: 'Sidebar second'
featured_bottom_first: 'Featured bottom first'
featured_bottom_second: 'Featured bottom second'
featured_bottom_third: 'Featured bottom third'
footer_first: 'Footer first'
footer_second: 'Footer second'
footer_third: 'Footer third'
footer_fourth: 'Footer fourth'
footer_fifth: 'Footer fifth'
global-styling-and-scripts:
version: VERSION
css:
theme:
css/plugins/bootstrap.min.css: {}
css/style.css: {}
css/skin-modes.css: {}
css/icons.css: {}
css/plugins/horizontal-menu.css: {}
css/colors/color6.css: {}
I see my css files in my html markup, but there is a lot of css files before it. Why ? Can i remove them ?
Also, i'm trying to display an image into a data-image-src and it won't shows up :/ When i look at my html markup and when i copy the image url, it's work, i can see it, but i can't see it into my page... I'm totally lost :/
As you can see below, my css files are loaded at the end, and my image doesn't appeared...
Extra css files:
The extra css files you are seeing are added by drupal core and various modules that have been enabled. I can see by what css files are included, that you are logged in when viewing this page, which, for example, has made the toolbar css be included on the page. Most of these css files would not be included when viewing the page as an anonymous user.
You should not worry about these, when putting the site live, you would set css and javascript aggregation under the "performance" settings and these would be combined into just a few files and only include what is needed.
data-img-src:
I am not sure what you are expecting to happen by adding 'data-img-src' ??
To set the image path on an img tag, you just use the 'src' attribute.
Any attribute that begins with 'data-' is just meant to be a data store, that, for example, you may want to use with some javascript.
More info on data attributes:
https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes
https://www.sitepoint.com/use-html5-data-attributes/
https://www.w3schools.com/tags/att_global_data.asp
Regarding removing of Drupal stylesheets in your custom theme... you can add something like this into your .info.yml
stylesheets-remove:
- core/assets/vendor/normalize-css/normalize.css
- core/modules/system/css/system.module.css
- core/modules/system/css/system.theme.css
- core/modules/views/css/views.module.css
to have them removed.
I noticed that console.info() no longer shows an (i) icon to the left of the line. There is no difference between console.info() and console.log().
On 49.0.2623.112 (on XP) it looks like this:
My current version is 64.0.3282.140 but I think the icon has been gone for a while.
Is there some setting to get the icon back?
Josh Lee's link suggest the following workaround:
console.log("%ci%c Hello", "color: white; background: blue;", "");
Elaborating on that, one can have
function logInfo(text, bgColor, color) {
console.log(`%c${text}`, `color: ${color}; background: ${bgColor};`);
}
logInfo('test 1', 'orange', 'black');
logInfo('test 2', 'white', 'green');
logInfo('test 3', 'green', 'white');
This actually gives us more flexibility - and one can customize his own special output types.
In a short: would chrome not have removed the feature, I would not learn about this :)
As already specified by Josh Lee, it sadly got removed.
I tried replicating the behavior.
Take a look at it: https://github.com/evertdespiegeleer/console.info
What changes are needed to modify tag matching in Sublime 3, Build 3143, from an underline to background color. Much of the documentation I have been able to find online seems either out of date or incomplete. Below is an example of the desired effect.
Core Sublime only matches brackets and tags with a dotted underline, and as far as I'm aware it's not possible to visually modify the style in the general case.
To get around that, you can use the BracketHighlighter package to do what you want. Once you've installed it, you will need to configure it to your liking, for which you should check out the documentation.
Briefly, in order to get it to do something like what you've outlined above, you want to select Preferences > Package Settings > BracketHighlighter > Bracket Settings from the menu (Preferences is under Sublime Text if you're on MacOS) and then add the following to the default settings:
"user_bracket_styles": {
"tag": {
"icon": "tag",
"color": "region.purplish",
"style": "solid"
},
}
Note that region.purplish as a potential scope name was added in Sublime build 3148, so for build 3143 you will need to select a scope name that is colored the way that you want in whatever color scheme you're using. For example, if you're using the Monokai color scheme, the scope constant.language looks purple.
While creating graphs using vis.js we can specify how the nodes can be displayed using the options.
var options = {
width: '400px',
height: '400px',
edges:{
style:'arrow'
},
nodes:{
shape:'icon'
}
};
by using 'icon' for style we use either bootstrap or fontawesome glyph icons. The documentation talks about using unicodes.
Created a Plunker and the Icons are not showing up.
http://plnkr.co/edit/DFYz26SOxGY9IvMqSuKm?p=preview
Not sure what i am doing wrong.
Thanks
I took a look at your plunker and I fixed it here:
http://plnkr.co/edit/NQarGkQSYeg3Cl0SdBGy?p=preview
I'm one of the devs of vis.js and I'd like to explain what went wrong here. First, you will need to include the css of fontawesome so vis knows where to find the glyphs. So we add:
< link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
Second, going by your plunker, you set the shape of the nodes to 'circle'. That means the nodes will not care about the icon options. In your question you have set the node shape to 'icon'. This means, the node will use the additional icon options for configuring the icons.
So we added (to the global nodes options):
iconFontFace:'FontAwesome',
iconSize:50
Now for the unicode. You will need to specify which icon vis is supposed to show you. This is done by the icon option. So where do we find the unicode? Lets look at this example: http://fortawesome.github.io/Font-Awesome/icon/coffee/
and we find: fa-coffee · Unicode: f0f4 · Created: v3.0 · Categories: Web Application Icons
So the unicode is f0f4 and in javascript we write this as \uf0f4
From your problem I noticed there are no default settings for the icons, which will be fixed with the 4.0 release.
For further reference you can take a look at the docs: http://visjs.org/docs/network.html#Nodes_configuration
a working example with multiple icons from fontawesome and Ionicons:
http://visjs.org/examples/network/38_node_as_icon.html
To wrap up, next time you have an issue, please post it in our Github page, we try to collect all the questions there :)
https://github.com/almende/vis/issues
Good luck!
Previously (v0.5.2) core-icons/social-icons.html was defining:
post-facebook
post-twitter
post-gplus
This doesn't seem to be the case in v0.5.4 anymore.
Are there any other icons subject to removal?
Thanks,
F.
Yes. The open source material icons do not include the post-* icons, and 0.5.3/4 rebased on the open source set.