Opened 7 years ago
Closed 6 years ago
#41074 closed enhancement (fixed)
Create new Dashicons (4.9-5.2)
Reported by: | EmpireOfLight | Owned by: | desrosj |
---|---|---|---|
Milestone: | 5.2 | Priority: | normal |
Severity: | normal | Version: | 4.9 |
Component: | Administration | Keywords: | has-patch has-dev-note |
Focuses: | ui | Cc: |
Description (last modified by )
This ticket is for new Dashicons for the 4.9 release cycle.
It is a continuation of the ticket https://core.trac.wordpress.org/ticket/39296
The following icons has been requested:
Flip of Editor-RTL: https://github.com/WordPress/dashicons/issues/111
A reverse of https://developer.wordpress.org/resource/dashicons/#editor-rtl
Rest API: https://github.com/WordPress/dashicons/issues/152
Variation on earth/world icon (admin-site): https://github.com/WordPress/dashicons/issues/95
Attachments (12)
Change History (127)
This ticket was mentioned in Slack in #design-dashicons by empireoflight. View the logs.
7 years ago
This ticket was mentioned in Slack in #design-dashicons by liljimmi. View the logs.
7 years ago
#7
@
7 years ago
Yes Alt: PR submitted - https://github.com/WordPress/dashicons/pull/228
#8
@
7 years ago
Flip of Editor-RTL, Addition of Editor-LTR and Yes Alt icons: PR submitted - https://github.com/WordPress/dashicons/pull/229
#9
in reply to:
↑ description
@
7 years ago
- Milestone changed from Awaiting Review to 4.9
Replying to EmpireOfLight:
This ticket is for new Dashicons for the 4.9 release cycle.
Per above, moving to 4.9 milestone for visibility / consideration
This ticket was mentioned in Slack in #core by jeffpaul. View the logs.
7 years ago
This ticket was mentioned in Slack in #design-dashicons by melchoyce. View the logs.
7 years ago
#12
follow-up:
↓ 14
@
7 years ago
Per the latest bug scrub https://wordpress.slack.com/archives/C02RQBWTW/p1506529060000272
@EmpireOfLight Is there anything I can help with? It would be great to get these Dashicon updates into 4.9 please
This ticket was mentioned in Slack in #design-dashicons by melchoyce. View the logs.
7 years ago
#14
in reply to:
↑ 12
@
7 years ago
Replying to netweb:
Per the latest bug scrub https://wordpress.slack.com/archives/C02RQBWTW/p1506529060000272
@EmpireOfLight Is there anything I can help with? It would be great to get these Dashicon updates into 4.9 please
Uploading the latest .zip files of the font an css now; I might need help making a patch though...
#15
follow-up:
↓ 16
@
7 years ago
Having trouble creating the patch / .diff ifle. Also, there's a .woff file in /wp-includes/fonts that we don't make with the new repository (see https://github.com/WordPress/dashicons/tree/master/icon-font) ; should this be removed or should we be building a .woff file?
#16
in reply to:
↑ 15
;
follow-up:
↓ 21
@
7 years ago
Replying to EmpireOfLight:
Having trouble creating the patch / .diff ifle. Also, there's a .woff file in /wp-includes/fonts that we don't make with the new repository (see https://github.com/WordPress/dashicons/tree/master/icon-font) ; should this be removed or should we be building a .woff file?
Likewise, having trouble here also creating a patch file to upload here, most likely this will need to be performed diretly during commit for these binary files /shrug
What I have done in 41074.diff is:
- Copy the
dashicons.css
file over the existing and manually tweak the formatting to match the coding standards.
- I used SVN to rename
dashicons.woff
todashicons.woff2
and then copied over the newdashicons.woff2
from icon-font.zip.
dashicons.eot
and dashicons.ttf` are also replaced with the new versions from icon-font.zip.
dashicons.svg
remains unchanged, should anything be done to this SVG file? There is no SVG in icon-font.zip
- The remaining files in icon-font.zip I've not added to the
/wp-includes/fonts
folder, should they?
This ticket was mentioned in Slack in #core by jeffpaul. View the logs.
7 years ago
#18
@
7 years ago
@EmpireOfLight Could you create a list of new or updated dashicons, similar to this? https://core.trac.wordpress.org/ticket/30902#comment:61
This ticket was mentioned in Slack in #design-dashicons by melchoyce. View the logs.
7 years ago
#20
@
7 years ago
I think the problem is that the dashicons grunt build doesn't create a .woff file, just a .woff2 file. But there is a .woff file in wp-includes. Should the build be making a .woff file, or can we take it out?
#21
in reply to:
↑ 16
;
follow-up:
↓ 24
@
7 years ago
Replying to netweb:
Replying to EmpireOfLight:
Having trouble creating the patch / .diff ifle. Also, there's a .woff file in /wp-includes/fonts that we don't make with the new repository (see https://github.com/WordPress/dashicons/tree/master/icon-font) ; should this be removed or should we be building a .woff file?
Hoping someone can answer this...
Likewise, having trouble here also creating a patch file to upload here, most likely this will need to be performed diretly during commit for these binary files /shrug
What I have done in 41074.diff is:
- Copy the
dashicons.css
file over the existing and manually tweak the formatting to match the coding standards.
- I used SVN to rename
dashicons.woff
todashicons.woff2
and then copied over the newdashicons.woff2
from icon-font.zip.
I'm confused about what you did here...does this mean there's no longer a .woff file?
dashicons.eot
and dashicons.ttf` are also replaced with the new versions from icon-font.zip.
dashicons.svg
remains unchanged, should anything be done to this SVG file? There is no SVG in icon-font.zip
- The remaining files in icon-font.zip I've not added to the
/wp-includes/fonts
folder, should they?
I think you're referring to the .html files... dashicons.html is just for previewing the font, and I'm not sure what demo-template.html does, but they don't need to be included. Maybe the grunt build process should be updated to create a directory with just the font files, and have the html/css files go somewhere else.
#22
follow-up:
↓ 25
@
7 years ago
I was asked whether we can ditch the WOFF file. The answer is "almost certainly yes". The nuance is that IE11 doesn't support WOFF2 (see https://stackoverflow.com/questions/37086562/what-kind-of-font-files-do-i-need-for-modern-browsers-android-and-ios and https://caniuse.com/#feat=woff2), but then it should just fall back to using the .ttf font which is bundled with it.
The only way to be sure is to test https://github.com/WordPress/dashicons/blob/master/icon-font/dashicons.html in IE11 (and other browsers) and see if they show up fine. My Windows VM was lost recently, so I can't easily test.
#23
@
7 years ago
A few more details that I got from when I created the current Dashicons build script
- The build script can generate either a file or embedded (not both), in the discussion we chose to use the embedded one (chat).
- Which means:
dashicons.css
is generated with embedded WOFF, so there's no file used (source).
Which means that the new CSS from the Dashicon repository includes the WOFF content inline, making no use of the WOFF file as a separate file.
Note that some requirements might be dealt with changes in the build script — from the discussion above doesn't seem we have any need, but I wanted to clarify that just in case. :)
#24
in reply to:
↑ 21
@
7 years ago
Replying to EmpireOfLight:
I'm confused about what you did here...does this mean there's no longer a .woff file?
Yes, I'd replaced the .woff
with the .woff2
, that won't work though based on the need to keep .woff
support for IE11 per the Slack chat
Maybe the grunt build process should be updated to create a directory with just the font files, and have the html/css files go somewhere else.
Yes, I think this is the best solution, get the dashicons grunt build to build a "package" that can be "dropped" into core.
#25
in reply to:
↑ 22
@
7 years ago
Replying to Joen:
I was asked whether we can ditch the WOFF file. The answer is "almost certainly yes". The nuance is that IE11 doesn't support WOFF2 (see https://stackoverflow.com/questions/37086562/what-kind-of-font-files-do-i-need-for-modern-browsers-android-and-ios and https://caniuse.com/#feat=woff2), but then it should just fall back to using the .ttf font which is bundled with it.
The only way to be sure is to test https://github.com/WordPress/dashicons/blob/master/icon-font/dashicons.html in IE11 (and other browsers) and see if they show up fine. My Windows VM was lost recently, so I can't easily test.
Here's https://github.com/WordPress/dashicons/blob/master/icon-font/dashicons.html on Windows 10:
#26
follow-up:
↓ 33
@
7 years ago
Just uploaded the latest icon font and got a diff created. Please test.
This includes new icons for 4.9:
Dashicons: Update to the latest files.
New icons:
.dashicons-editor-rtl (f320)
.dashicons-rest-api (f124)
.dashicons-admin-site-alt (f11d)
.dashicons-admin-site-alt2 (f11e)
.dashicons-admin-site-alt3 (f11f)
.dashicons-yes-alt (f12a)
props liljimmi, melchoyce, empireoflight, netweb , folletto, joen
This ticket was mentioned in Slack in #core by melchoyce. View the logs.
7 years ago
#29
@
7 years ago
@netweb does new-dashicons.41074.diff look good to you?
This ticket was mentioned in Slack in #core by jeffpaul. View the logs.
7 years ago
This ticket was mentioned in Slack in #design-dashicons by melchoyce. View the logs.
7 years ago
#33
in reply to:
↑ 26
@
7 years ago
Replying to EmpireOfLight:
New icons:
.dashicons-editor-rtl (f320)
.dashicons-rest-api (f124)
.dashicons-admin-site-alt (f11d)
.dashicons-admin-site-alt2 (f11e)
.dashicons-admin-site-alt3 (f11f)
.dashicons-yes-alt (f12a)
This is an updated list revising on the above list:
- Icons Added
.dashicons-admin-site-alt
-f11d
.dashicons-admin-site-alt2
-f11e
.dashicons-admin-site-alt3
-f11f
.dashicons-editor-ltr
-f129
.dashicons-email-alt2
-f10a
.dashicons-menu-alt
-f10b
.dashicons-plus-light
-f10c
.dashicons-rest-api
-f124
.dashicons-yes-alt
-f12a
BuddiIcons
- These were previously only in the icon font, now they're publicly exposed indashicons.css
- Icons Removed:
.dashicons-plus-alt2
-f543
.dashicons-share1
-f237
- Icons Changed:
.dashicons-trash
- Previouslyf182
, nowf10d
#34
@
7 years ago
The review also discovered instances of missing classes no longer generated by the Dashicons build script/tools, these have been manually added back in 41074.3.diff, the source repo needs updating to accommodate these classes:
.dashicons-format-links:before
and.dashicons-format-standard:before
/* Both Admin Menu and Post Formats */ .dashicons-admin-links:before, .dashicons-format-links:before { content: "\f103"; } .dashicons-admin-post:before, .dashicons-format-standard:before { content: "\f109"; }
.dashicons-welcome-edit-page:before
/* Welcome Screen Icons */ .dashicons-welcome-write-blog:before, .dashicons-welcome-edit-page:before { content: "\f119"; }
.dashicons-editor-distractionfree:before
#35
@
7 years ago
Patch notes for 41074.3.diff
- Leaves the WOFF Base64 in
dashicons.css
- No changes to the existing WOFF
src/wp-includes/fonts/dashicons.woff
file - No changes to the existing WOFF
src/wp-includes/fonts/dashicons.svg
file - Updated
dashicons.css
manually to match WP CSS Coding Standards - Updated
dashicons.css
manually to sorting CSS classes to reduce churn and cleaner blame
This ticket was mentioned in Slack in #design-dashicons by netweb. View the logs.
7 years ago
#37
follow-up:
↓ 39
@
7 years ago
Note that if an icon shifted Unicode addresses in the new build process, this can be corrected and we can rebuild the font to include icons in the right location. You can let me know any icons that need shifting.
#38
@
7 years ago
Per https://wordpress.slack.com/archives/C03EESJAW/p1508860337000166
The only thing that might be an issue is the dashicons.svg file. I didn't include a new one in my patch basically, https://github.com/WordPress/dashicons/tree/master/svg-sprite should replace https://github.com/WordPress/WordPress/blob/master/wp-includes/fonts/dashicons.svg
I've updated the patch in 41074.4.diff to include this SVG now
#39
in reply to:
↑ 37
@
7 years ago
Replying to Joen:
Note that if an icon shifted Unicode addresses in the new build process, this can be corrected and we can rebuild the font to include icons in the right location. You can let me know any icons that need shifting.
Excellent, there is only 1 in need of this: .dashicons-trash
from f10d
back to it's original f182
#40
@
7 years ago
- Keywords needs-refresh added; has-patch removed
- Milestone changed from 4.9 to 5.0
Per https://wordpress.slack.com/archives/C03EESJAW/p1508909585000101
" I don't think the Dashicons SVG can replace the old SVG. Pretty sure the old SVG is an SVG font, whereas the new is a sprite "
In that case, ignore 41074.4.diff and let's stick with 41074.3.diff
Also per Slack discussion just now, as none of the new icons are currently used in core and to allow some time for testing and fixing the build script to fix the issues I've outlined above we are going to punt this to 5.0.
This ticket was mentioned in Slack in #core by netweb. View the logs.
7 years ago
#42
@
7 years ago
I have made a PR upstream in the dashicons repo to adjust the build process per feedback here. Please see https://github.com/WordPress/dashicons/pull/246
This ticket was mentioned in Slack in #design-dashicons by empireoflight. View the logs.
7 years ago
#44
@
7 years ago
A new dashicon for [make.wordpress.org/tide Tide] is also being worked on in dashicons/issues/248, refreshed patch will also need to include this.
#45
@
7 years ago
I've added an SVG icon for Instagram. It's formatted like the other SVGs.
I don't know the build process for the set. But I figure those smarter than me can finalize the adoption of it.
I recently had a need for it, and noticed that FB, Twitter, and G+ are all there, but Instagram wasn't. Figured it should be.
https://github.com/WordPress/dashicons/pull/272
Other people have asked for it as well:
https://github.com/WordPress/dashicons/issues/63
https://github.com/WordPress/dashicons/issues/12
https://github.com/WordPress/dashicons/issues/136
https://core.trac.wordpress.org/ticket/34166
https://core.trac.wordpress.org/ticket/32568
This ticket was mentioned in Slack in #design-dashicons by empireoflight. View the logs.
7 years ago
#47
follow-up:
↓ 107
@
7 years ago
There are lots of new icon requests on github. Here they are so we can comment on whether any should be included in the next release:
Folder icons: https://github.com/WordPress/dashicons/issues/273
Broken heart: https://github.com/WordPress/dashicons/issues/271
Coffee bean: https://github.com/WordPress/dashicons/issues/270
Printer: https://github.com/WordPress/dashicons/issues/268
Various: https://github.com/WordPress/dashicons/issues/266
Beer: https://github.com/WordPress/dashicons/issues/256
Tide team Icon: https://github.com/WordPress/dashicons/issues/248
RTL ordered list icon: https://github.com/WordPress/dashicons/issues/250
Code Standards icon: https://github.com/WordPress/dashicons/issues/263
Tide Team and RTL have been discussed and will be included in the next version of Dashicons. Printer seems pretty critical, but the rest are probably extraneous as we're trying to limit new icons until a better implementation/delivery method is finished. Any thoughts?
Edit: Also here: https://github.com/WordPress/dashicons/pull/265 is a resized a stats Gridicon that could be used as a top level menu icon.
This ticket was mentioned in Slack in #design by empireoflight. View the logs.
7 years ago
This ticket was mentioned in Slack in #design by boemedia. View the logs.
7 years ago
This ticket was mentioned in Slack in #design-dashicons by empireoflight. View the logs.
7 years ago
#51
@
7 years ago
@EmpireOfLight I'm biased (on the Tide dashicon), but I concur with your analysis of which should be included.
#52
@
7 years ago
Can we also get the coding-standards icon in as this is now an official WordPress team please :)
#53
follow-up:
↓ 54
@
7 years ago
@netweb is there someone working on the coding-standards icon?
@Joen are there any Gutenberg-related icons that would be good to land before 5.0 or are you all ok waiting for those icons to land alongside Gutenberg in 5.0?
#54
in reply to:
↑ 53
@
7 years ago
Replying to jbpaul17:
@netweb is there someone working on the coding-standards icon?
It is attached to the https://github.com/WordPress/dashicons/issues/263 issue
#55
follow-ups:
↓ 56
↓ 61
@
7 years ago
@Joen are there any Gutenberg-related icons that would be good to land before 5.0 or are you all ok waiting for those icons to land alongside Gutenberg in 5.0?
We don't need any icons to land before 5.0, no. In fact, for now and because we've needed to be able to create icons for Gutenberg fast, every new icon created for Gutenberg are in a separate directory: https://github.com/WordPress/dashicons/tree/master/sources/svg/gutenberg
Icons in that directory are not added into the icon font, they are added only to the react component. Gutenberg doesn't use the icon font at all. But anyone should feel free to comment on their design.
I think the most important thing to review, though, is the new build process. Recent work was done in https://github.com/WordPress/dashicons/pull/246. The build process means that creating new icons is not an arduous process, which is important so as to keep the project alive. It comes with only two changes per how it's been done in the past:
- we can't edit
url("...")
to beurl( "..." )
without hacking core files. - we can't customize the order of the icons, nor add "grouping" headers. Icons are output alphabetically
1 I don't care about, it seems a trivial price to pay for taking the vinegar and human error aspect out of adding icons. 2 I personally think is a benefit. But nonetheless these are aspects that should be considered before switching to the process-built icon font, which I believe still hasn't happened?
#56
in reply to:
↑ 55
@
7 years ago
Replying to Joen:
I think the most important thing to review, though, is the new build process. Recent work was done in https://github.com/WordPress/dashicons/pull/246. The build process means that creating new icons is not an arduous process, which is important so as to keep the project alive. It comes with only two changes per how it's been done in the past:
- we can't edit
url("...")
to beurl( "..." )
without hacking core files.- we can't customize the order of the icons, nor add "grouping" headers. Icons are output alphabetically
1 I don't care about, it seems a trivial price to pay for taking the vinegar and human error aspect out of adding icons. 2 I personally think is a benefit. But nonetheless these are aspects that should be considered before switching to the process-built icon font, which I believe still hasn't happened?
I've just created https://github.com/WordPress/dashicons/pull/298, this PR updates the CSS template that generates dashicons.css
to meet WordPress CSS Coding Standards. As noted in the PR I've added stylelint support so that it ignores the spacing and quotes around the URLs.
The above makes 1. above no longer a concern once stylelint is added and 2. I'm happy if your happy 🎉
#57
@
7 years ago
💥
Amazing. Sometimes the best way to get something fixed is to proclaim it as impossible.
#58
@
6 years ago
@netweb @Joen is there a way to utilize the Tide dashicon before this ticket gets committed in a major release? I'm asking as we'd start using it on make/tide, for contributor day pins/stickers, and for profile badges (among other places I'm not yet reminded of).
#59
@
6 years ago
is there a way to utilize the Tide dashicon before this ticket gets committed in a major release? I'm asking as we'd start using it on make/tide, for contributor day pins/stickers, and for profile badges (among other places I'm not yet reminded of).
Does the release of the updated icon font have to wait for a new release? Keep in mind I'm still relatively new to Dashicons, so forgive me if that was an obvious question.
You could do something like this:
https://codepen.io/joen/pen/jxQXvB?editors=1100 — that is, if it's largely used on P2s, you could paste the CSS into the custom CSS pane and utilize it as a class.
#61
in reply to:
↑ 55
@
6 years ago
Replying to Joen:
@Joen are there any Gutenberg-related icons that would be good to land before 5.0 or are you all ok waiting for those icons to land alongside Gutenberg in 5.0?
We don't need any icons to land before 5.0, no. In fact, for now and because we've needed to be able to create icons for Gutenberg fast, every new icon created for Gutenberg are in a separate directory: https://github.com/WordPress/dashicons/tree/master/sources/svg/gutenberg
Icons in that directory are not added into the icon font, they are added only to the react component. Gutenberg doesn't use the icon font at all. But anyone should feel free to comment on their design.
Do we need to change by way of moving these above mentioned Gutenberg icons for the 5.0 release @Joen ?
#62
follow-up:
↓ 63
@
6 years ago
Do we need to change by way of moving these above mentioned Gutenberg icons for the 5.0 release @Joen ?
We don't need to, no. I suppose there's a larger question here of SVG support in the rest of the admin, and I have a slight preference for keeping the icons as they are today — gutenberg specific SVGs in a separate folder — until such a time as we have a better plan for moving onwards from the icon-font.
But if we need to do some rearranging, let me know and I'll try and see about a PR.
#63
in reply to:
↑ 62
@
6 years ago
Replying to Joen:
Do we need to change by way of moving these above mentioned Gutenberg icons for the 5.0 release @Joen ?
We don't need to, no. I suppose there's a larger question here of SVG support in the rest of the admin, and I have a slight preference for keeping the icons as they are today — gutenberg specific SVGs in a separate folder — until such a time as we have a better plan for moving onwards from the icon-font.
This sounds good for 5.1 👍
But if we need to do some rearranging, let me know and I'll try and see about a PR.
I'm not sure if it is actually required, though for now I'll leave this ticket in the 5.0 milestone for merge visibility
#64
@
6 years ago
@netweb @Joen if this doesn't land in 5.0, it would be great to find another way to get the Tide dashicon available so it can be used in various community and marketing locations on make. https://github.com/WordPress/dashicons/issues/248 has been waiting patiently and would be ideal to have that landed ahead of this years' WCUS.
#65
@
6 years ago
The tide icon is in the current master branch of dashicons... what else needs to happen?
#66
@
6 years ago
if this doesn't land in 5.0, it would be great to find another way to get the Tide dashicon available so it can be used in various community and marketing locations on make. https://github.com/WordPress/dashicons/issues/248 has been waiting patiently and would be ideal to have that landed ahead of this years' WCUS.
The tide icon is in the current master branch of dashicons... what else needs to happen?
So because of all the changes that's happened to Dashicons in the past year, it might be worth a quick summary.
- Dashicons are now automatically built using a build process. Grunt is used as a tool to convert a folder full of SVG files into an icon font, an SVG sprite, a folder of minimized and optimized SVG files, and a React component.
- Development happens in https://github.com/WordPress/dashicons
- The SVG files converted, one 20x20px SVG for each icon, are stored in the
sources/svg
folder: https://github.com/WordPress/dashicons/tree/master/sources/svg — any SVG file in that folder goes into the icon font. - SVG files stored in the
sources/svg/gutenberg
do not go into the icon font. These only go into the React component.
So Ben is right. The tide icon is part of the icon font.
So what needs to happen? Well, we need to use the new icon font that's built from the SVG files, https://github.com/WordPress/dashicons/tree/master/icon-font, in WordPress, and replace the old icon font files. @netweb do you have more info on how to make this happen?
This ticket was mentioned in Slack in #meta-devhub by coffee2code. View the logs.
6 years ago
#68
@
6 years ago
- Milestone changed from 5.0 to 5.0.1
Talked this over with @Joen today.
This still needs a new patch and testing. With 5.0 RC imminent, going to punt this.
#72
@
6 years ago
- Milestone changed from 5.0.3 to 5.1
Hello,
5.0.3 is going to be released in a couple of weeks.
It doesn't appear this ticket can be handled in the next couple of weeks. Let's address it in 5.1 which is coming in February. Feel free to ask for changing the milestone if you think this issue can be quickly resolved.
Cheers,
Jb
This ticket was mentioned in Slack in #meta by cathibosco. View the logs.
6 years ago
This ticket was mentioned in Slack in #design-dashicons by jeffpaul. View the logs.
6 years ago
#76
@
6 years ago
@netweb @EmpireOfLight with trunk open for 5.2, any chance someone could work on a patch to land early in the 5.2 release cycle so we can ensure all the newly created Dashicons are available when 5.2 ships? I'm obviously biased on seeing the Tide icon become readily available, but I suspect there are others that would similarly be good to see available. Thanks!
#77
@
6 years ago
I'll do whatever I can to get Dashicons ready for 5.2... just need some guidance with the patching part.
This ticket was mentioned in Slack in #meta by folletto. View the logs.
6 years ago
#79
@
6 years ago
I went ahead and built a fresh set of dashicons files from the github dashicons repo (https://github.com/WordPress/dashicons), after merging 2 prs that requested new icons which appear to be critical for 5.2. I added them to the latest WP trunk github repo (https://github.com/WordPress/WordPress) and tested locally-new icons appear to be working. Latest files and diff have been added attachments to this ticket.
This ticket was mentioned in Slack in #design by empireoflight. View the logs.
6 years ago
#81
@
6 years ago
@melchoyce @jeremyfelt as you've both landed Dashicon updates in previous releases (albeit a while ago for each of you), can you help review this and potentially shepherd for 5.2? Note my bias is trying to see this committed so that Tide's Dashicon is finally available on Make and for marketing effort (e.g., Contributor Day, profile badges). Thanks!
This ticket was mentioned in Slack in #design by empireoflight. View the logs.
6 years ago
This ticket was mentioned in Slack in #core by jeffpaul. View the logs.
6 years ago
This ticket was mentioned in Slack in #core by empireoflight. View the logs.
6 years ago
#86
follow-up:
↓ 89
@
6 years ago
- Keywords needs-dev-note reporter-feedback added; needs-refresh removed
So I did some investigating. The developer resources Dashicons page uses the Dashicon version shipped in WordPress Core, and the font is not stored on the CDN at all. The new icons do, however, need to be added manually to the developer resources page after that site is updated to 5.2 (or trunk
, if it runs the latest commit).
I was having an issue with the most recent patch, so I pulled down the Dashicons GIT repo, built the files, and created a new patch (which does not include the font file changes).
Here is the updated list of additions I see reviewing:
.dashicons-admin-site-alt (f11d)
.dashicons-admin-site-alt2 (f11e)
.dashicons-admin-site-alt3 (f11f)
.dashicons-buddicons-activity (f452)
.dashicons-buddicons-bbpress-logo (f12b)
.dashicons-buddicons-buddypress-logo (f448)
.dashicons-buddicons-community (f453)
.dashicons-buddicons-forums (f449)
.dashicons-buddicons-friends (f454)
.dashicons-buddicons-groups (f456)
.dashicons-buddicons-pm (f457)
.dashicons-buddicons-replies (f451)
.dashicons-buddicons-topics (f450)
.dashicons-buddicons-tracking (f455)
.dashicons-businessperson (f12e)
.dashicons-businesswoman (f12f)
.dashicons-color-picker (f131)
.dashicons-editor-ltr (f129)
.dashicons-editor-ol-rtl (f12c)
.dashicons-email-alt2 (f10a)
.dashicons-instagram (f12d)
.dashicons-menu-alt (f10b)
.dashicons-plus-light (f10c)
.dashicons-rest-api (f124)
.dashicons-yes-alt (f12a)
.dashicons-tide (f10d)
Overall this is looking good (pending some Windows testing). There are two points I need addressed and this can be committed.
All the icons appear to be displaying correctly except .dashicons-instagram
. I have uploaded a screenshot of this for review.
After reading through the ticket, there are a few comments indicating that two icons were removed:
.dashicons-plus-alt2 - f543
.dashicons-share1 - f237
It is preferable to not remove icons. Once the icon is bundled and released with WordPress, we have to assume it is being used by someone and we should maintain that icon. I can't find any indication that dashicions-share1
was ever shipped in Core, but plus-alt2
was (introduced in [33126]). I have not been able to track down where in the GIT history this icon was removed, though.
Question on the .woff2
file. The .woff
file will not be updated and remain as is, but I think that the .woff2
file can be introduced for anyone that wishes to load it as long as this will continue to be maintained (which I think is the intention).
I am also marking this a needs-dev-note
so that everyone is aware of the new dashicons, and of the changes specified regarding .woff
files in the previous paragraph. Happy to write that up!
#88
@
6 years ago
@desrosj .dashicons-instagram
looks like it landed in the GitHub repo here: https://github.com/WordPress/dashicons/pull/272. I see where .dashicons-plus-alt2
was added, but I can't seem to find where it was removed either.
#89
in reply to:
↑ 86
@
6 years ago
Replying to desrosj:
I can't find any indication that
dashicions-share1
was ever shipped in Core, butplus-alt2
was (introduced in [33126]). I have not been able to track down where in the GIT history this icon was removed, though.
It appears to be lost during the switch to the new build process. plus-alt2
was added to codepoints.json
, but not to icon-font/dashicons.css
.
Seems to be an oversight, not an intentional choice. Could we restore it?
#90
@
6 years ago
Same for share1
: added to codepoints.json
in the commit linked above, but not to icon-font/dashicons.css
. Seems to be an oversight as well.
This ticket was mentioned in Slack in #design-dashicons by desrosj. View the logs.
6 years ago
#92
@
6 years ago
- Keywords needs-refresh added
Tested this with @ianbelanger on Windows today. The color-picker
icon does not work in IE11. I opened this PR to update all files to correctly include the color-picker
icon.
I looked through the history for the repo, and I can't find an SVG icon present for the plus-alt2
or the share1
icon.
Marking needs refresh pending that PR being merged.
#93
@
6 years ago
All the icons appear to be displaying correctly except .dashicons-instagram. I have uploaded a screenshot of this for review.
That instagram icon looks like it wasn't fully "flattened". By making it a compound shape in Illustrator, i.e. single path
in the SVG, it should probably go over fine.
Seems to be an oversight, not an intentional choice. Could we restore it?
Same for share1: added to codepoints.json in the commit linked above, but not to icon-font/dashicons.css. Seems to be an oversight as well.
Almost certainly an oversight, and thank you for catching this.
Just to clarify how things are _supposed_ to work.
sources/svg
should include SVGs that are included in both icon font and React componentsources/gutenberg
are not included in the icon font, these do not get codepoints, and are built only into the react componentsources/svg-unused
are icons that existed in the past, but were never actually shipped
Around codepoints.json, that file exists so that unicode locations for each icon the font persists across build processes. Many icon fonts rely solely on the CSS classname to reference an icon, and so it doesn't matter that the unicode location swaps places. That's obviously insufficient for the Dashicons font, which is why the codepoints.json file is referenced.
As we moved to a build process from the old manually built system, there was a great deal of manual work in porting existing unicode locations from the manually built font, to the codepoints file. To put it simply, every icon that existed in the font before the build process had to have its unicode location converted to hexadecimal to be included in the JSON file. This is what I referenced in this comment here: https://core.trac.wordpress.org/ticket/41074#comment:37
This is just to give some additional history and clarification. So it's entirely possible that icons that are supposed to be present in the codepoints file were forgotten due to human oversight. Thanks for helping catch these.
It is worth noting, though, that as soon as we ship the icon font that's made from the build process, everything from that point on is automated, which should reduce the chance of such human error in the future.
Hope that helps.
#94
@
6 years ago
@netweb as the owner of this ticket, are you able to help with the patch refresh while time still allows in the 5.2 release cycle?
#95
@
6 years ago
Question: can we open separate Trac tickets for the various releases? This was opened for 4.9 but it seems it's still being used for every release after that. Thanks!
#96
follow-up:
↓ 100
@
6 years ago
- Keywords reporter-feedback removed
- Summary changed from Create new Dashicons (4.9) to Create new Dashicons (4.9-5.2)
@JeffPaul Happy to own this. I can commit the changes after the items I listed above are addressed.
@folletto I think that was the previous practice, but the Gutenberg feature focus caused this one to be punted repeatedly. I have adjusted the ticket title to indicate this addition spanned multiple releases. I have some ideas to make this process go more smoothly that I'll be brain dumping and experimenting with after 5.2 beta 1 this week. If you'd like, let's connect separately!
The Instagram icon has been fixed upstream.
That leaves the missing plus-alt2
and the share1
icons as the last two items to resolve.
I have opened a PR to re-add the `share1` icon. I was incorrect in my previous assessment that this icon was never shipped with core, so this should be re-added.
I believe that the reason the plus-alt2
icon is not being included in the build is being caused by the lack of an SVG file in the sources/svg
folder. If someone can create an SVG file for this icon, a PR can be opened to re-add it to the built files. For reference, this is the <glyph>
included in the current version of the dashicons.svg
sprite:
<glyph unicode="" d="M1700 1100v-200h-600v-600h-200v600h-600v200h600v600h200v-600h600z" />
#97
@
6 years ago
@desrosj - I can create the missing
plus-alt2
as an svg today.
Can you point me to the .png or .ai file in github so I can recreate it as an SVG please? Thank you
#98
@
6 years ago
Status update -
@desrosj and I realized there is already a light weight plus-alt icon in the dashicons...
@desrosj created a pull request and is checking with @Joen regarding the impact of the css styles...
So, plus-light looks to be the same as plus-alt2 in terms of the design.
Thanks everyone for pushing this along today. I am here if you need a new .svg drafted.
#99
@
6 years ago
I took a look at https://github.com/WordPress/dashicons/pull/346 and from what I can tell it's all fine. Let me know if there's nuance I missed.
#100
in reply to:
↑ 96
@
6 years ago
- Owner changed from netweb to desrosj
Replying to desrosj:
@JeffPaul Happy to own this. I can commit the changes after the items I listed above are addressed.
Thanks @desrosj, sorry I've not had much time of late to contribute
#101
@
6 years ago
- Keywords needs-refresh removed
@netweb no worries!
41074.6.diff and fonts.zip are the most recent patches.
Here is the final list of additions:
.dashicons-admin-site-alt (f11d)
.dashicons-admin-site-alt2 (f11e)
.dashicons-admin-site-alt3 (f11f)
.dashicons-buddicons-activity (f452)
.dashicons-buddicons-bbpress-logo (f12b)
.dashicons-buddicons-buddypress-logo (f448)
.dashicons-buddicons-community (f453)
.dashicons-buddicons-forums (f449)
.dashicons-buddicons-friends (f454)
.dashicons-buddicons-groups (f456)
.dashicons-buddicons-pm (f457)
.dashicons-buddicons-replies (f451)
.dashicons-buddicons-topics (f450)
.dashicons-buddicons-tracking (f455)
.dashicons-businessperson (f12e)
.dashicons-businesswoman (f12f)
.dashicons-color-picker (f131)
.dashicons-editor-ltr (f129)
.dashicons-editor-ol-rtl (f12c)
.dashicons-email-alt2 (f10a)
.dashicons-instagram (f12d)
.dashicons-menu-alt (f10b)
.dashicons-rest-api (f124)
.dashicons-yes-alt (f12a)
.dashicons-tide (f10d)
Some notes:
- The
.dashicons-share1 - f237
icon has been re-added (see GitHub-346). - The
.dashicons-plus-light (f10c)
icon has been moved back to its original location and name of.dashicons-plus-alt2 - f543
(see GitHub-347). - The Instagram icon has been fixed (see GitHub-344).
Going to work with @ianbelanger to double check Windows, but this looks good to go.
#102
@
6 years ago
Everything looks good on Windows @desrosj. I tested in Chrome, Firefox, IE11 and Edge. All icons are now present.
#105
@
6 years ago
- Keywords commit removed
- Resolution fixed deleted
- Status changed from closed to reopened
Missed @ianbelanger on the props list.
Reopening for the following tasks to be completed:
- Add new icons to the Dashicon developer resource.
- Write dev note.
I am working on both.
#107
in reply to:
↑ 47
@
6 years ago
Replying to EmpireOfLight:
There are lots of new icon requests on github. Here they are so we can comment on whether any should be included in the next release:
Code Standards icon: https://github.com/WordPress/dashicons/issues/263
It looks like this new icon for the #wpcs team was missed in the above, before creating a new ticket @desrosj I just want to confirm if that is indeed the case thanks.
#108
@
6 years ago
@netweb I was unaware that any other icons were in progress. If this can be merged completed prior to the fixes for #46611 are committed, it can be included with those changes.
This ticket was mentioned in Slack in #core-editor by aduth. View the logs.
6 years ago
#112
@
6 years ago
- Resolution fixed deleted
- Status changed from closed to reopened
While beta testing 5.2 I noticed a plugin was missing the trash icon in its UI.
It turns out, two of the selectors are missing :before
.dashicons-exerpt-view { content: "\f164"; }
https://github.com/WordPress/dashicons/blob/master/icon-font/css/dashicons.css#L1141
and
.dashicons-post-trash { content: "\f182"; }
https://github.com/WordPress/dashicons/blob/master/icon-font/css/dashicons.css#L1153
#113
@
6 years ago
Another question seeing that CSS for the dashicons should .dashicons-exerpt-view
not be .dashicons-excerpt-view
for proper spelling of excerpt?
#114
@
6 years ago
- Keywords has-dev-note added; needs-dev-note removed
Thanks @builtbynorthby! I have opened a PR upstream to fix this.
@garrett-eclipse both are currently present. .dashicons-exerpt-view
is present for backward compatibility. The CSS had previously been released with the typo, so both versions are included. I also added a comment explaining that in the PR above. See #30832.
Also, forgot to mark this as has-dev-note
. The note was posted here: https://make.wordpress.org/core/2019/04/11/dashicons-in-wordpress-5-2/.
Flip of Editor-RTL: PR submitted - https://github.com/WordPress/dashicons/pull/227
Rest API: PR submitted - https://github.com/WordPress/dashicons/pull/226
Variation on earth/world icon (admin-site): PR merged - https://github.com/WordPress/dashicons/pull/204
Let me know if anything else is needed.