Skip to content

jquery: Update Twitter to x ,add mastodon and replace FontAwesome font with SVG icons #489

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
HermitAssociation wants to merge 18 commits into
base: main
Choose a base branch
from
Open

jquery: Update Twitter to x ,add mastodon and replace FontAwesome font with SVG icons #489

Show file tree
Hide file tree
Changes from 13 commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
d2201b8
Add Fontawesome SVG file
HermitAssociation Feb 23, 2026
7d2aba2
Update sites.php
HermitAssociation Feb 23, 2026
a74a271
Update footer-bottom.php
HermitAssociation Feb 23, 2026
210e459
Update content-page.php
HermitAssociation Feb 23, 2026
0a85e8f
Update base.css
HermitAssociation Feb 23, 2026
ea0488e
Update style.css
HermitAssociation Feb 23, 2026
7323017
Fixed some bugs
HermitAssociation Feb 23, 2026
c6daba6
Fix SVG ViewBox issue
HermitAssociation Feb 23, 2026
03a035e
Fixed some bugs
HermitAssociation Feb 24, 2026
bd3ef84
Optimize GitHub icon display
HermitAssociation Feb 24, 2026
77e0463
Fix viewBox issue
HermitAssociation Feb 24, 2026
bf1bc3f
Fixed the position issue of the article link icon.
HermitAssociation Feb 25, 2026
97f17e8
Update footer-bottom.php
HermitAssociation Mar 4, 2026
406f15e
Update base.css
HermitAssociation Mar 4, 2026
81dff4f
Fix™ issue causing garbled text
HermitAssociation Mar 4, 2026
9b59107
Add Fontawesome SVG file
HermitAssociation Mar 7, 2026
ee9bb13
Update base.css
HermitAssociation Mar 7, 2026
3ecbf4f
Update base.css
HermitAssociation Apr 3, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 15 additions & 15 deletions sites.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@ function jquery_sites() {
'jquery_body_class' => 'jquery-ui',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'blog.jqueryui.com' => array(
Expand All @@ -95,7 +95,7 @@ function jquery_sites() {
'jquery_is_blog' => true,
'jquery_author' => 'jQuery Team',
'jquery_description' => 'jQuery: The Write Less, Do More, JavaScript Library',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'api.jqueryui.com' => array(
Expand All @@ -111,7 +111,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jqueryui.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'api.jqueryui.com/1.8' => array(
Expand All @@ -127,7 +127,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jqueryui.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'api.jqueryui.com/1.9' => array(
Expand All @@ -143,7 +143,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jqueryui.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'jquery.org' => array(
Expand All @@ -168,7 +168,7 @@ function jquery_sites() {
'jquery_body_class' => 'jquery-mobile',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jquerymobile_com',
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
'jquery_x_link' => 'https://x.com/jquerymobile',
),
),
'api.jquerymobile.com' => array(
Expand All @@ -184,7 +184,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jquerymobile.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jquerymobile_com',
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
'jquery_x_link' => 'https://x.com/jquerymobile',
),
),
'blog.jquerymobile.com' => array(
Expand All @@ -197,7 +197,7 @@ function jquery_sites() {
'jquery_is_blog' => true,
'jquery_author' => 'jQuery Team',
'jquery_description' => 'jQuery: The Write Less, Do More, JavaScript Library',
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
'jquery_x_link' => 'https://x.com/jquerymobile',
),
),
'brand.jquery.org' => array(
Expand Down Expand Up @@ -246,7 +246,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jquerymobile.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jquerymobile_com',
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
'jquery_x_link' => 'https://x.com/jquerymobile',
),
),
'api.jqueryui.com/1.10' => array(
Expand All @@ -262,7 +262,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jqueryui.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'api.jqueryui.com/1.12' => array(
Expand All @@ -278,7 +278,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jqueryui.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'api.jqueryui.com/1.11' => array(
Expand All @@ -294,7 +294,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jqueryui.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'api.jquerymobile.com/1.4' => array(
Expand All @@ -310,7 +310,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jquerymobile.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jquerymobile_com',
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
'jquery_x_link' => 'https://x.com/jquerymobile',
),
),
'releases.jquery.com' => array(
Expand Down Expand Up @@ -338,7 +338,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jqueryui.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
'api.jqueryui.com/1.14' => array(
Expand All @@ -354,7 +354,7 @@ function jquery_sites() {
'jquery_logo_link'=> 'https://jqueryui.com/',
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
'jquery_typesense_collection' => 'jqueryui_com',
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
'jquery_x_link' => 'https://x.com/jqueryui',
),
),
);
Expand Down
74 changes: 43 additions & 31 deletions themes/jquery/css/base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -105,10 +105,11 @@ body {
}
[class^="icon-"]:before,
[class*=" icon-"]:before {
font-size: 1.2em;
text-decoration: inherit;
display: inline-block;
speak: none;
display: inline-block;
width: 1.2em;
height: 1.2em;
vertical-align: sub;
filter: invert(0.4);
}
.icon-info-sign:before { content: "\f05a"; }

Expand Down Expand Up @@ -727,27 +728,28 @@ ul.icons li [class*=" icon-"] {
}
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */
.icon-bolt:before { content: "\f0e7"; } /* Used: learn */

@mgol mgol Mar 31, 2026

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The comment just above the deleted parts is no longer applicable, is it? It should be removed then.

@HermitAssociation HermitAssociation Apr 3, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I have removed the old comments

.icon-calendar:before { content: "\f073"; } /* Used: learn */
.icon-certificate:before { content: "\f0a3"; } /* Used: learn */
.icon-chevron-left:before { content: "\f053"; } /* Used: learn */
.icon-chevron-right:before { content: "\f054"; } /* Used: learn */
.icon-comments:before { content: "\f086"; } /* Used: footer */
.icon-copy:before { content: "\f0c5"; } /* Used: releases */
.icon-dashboard:before { content: "\f0e4"; } /* Used: learn */
.icon-eye-open:before { content: "\f06e"; } /* Used: jqueryui.com */
.icon-github:before { content: "\f09b"; } /* Used: footer */
.icon-link:before { content: "\f0c1"; } /* Used: toc-link, grunt-jquery-content */
.icon-magnet:before { content: "\f076"; } /* Used: learn */
.icon-pencil:before { content: "\f040"; } /* Used: footer */
.icon-picture:before { content: "\f03e"; } /* Used: learn */
.icon-question-sign:before { content: "\f059"; } /* Used: learn */
.icon-refresh:before { content: "\f021"; } /* Used: learn */
.icon-sitemap:before { content: "\f0e8"; } /* Used: learn */
.icon-star-empty:before { content: "\f006"; } /* Used: learn */
.icon-tasks:before { content: "\f0ae"; } /* Used: learn */
.icon-th-large:before { content: "\f009"; } /* Used: learn */
.icon-twitter:before { content: "\f099"; } /* Used: footer */
.icon-bolt:before { content: ""; background: url(../lib/FontAwesome/bolt.svg) no-repeat; } /* Used: learn */
.icon-calendar:before { content: ""; background: url(../lib/FontAwesome/calendar-days.svg) no-repeat; } /* Used: learn */
.icon-certificate:before { content: ""; background: url(../lib/FontAwesome/certificate.svg) no-repeat; } /* Used: learn */
.icon-chevron-left:before { content: ""; background: url(../lib/FontAwesome/chevron-left.svg) no-repeat; } /* Used: learn */
.icon-chevron-right:before { content: ""; background: url(../lib/FontAwesome/chevron-right.svg) no-repeat; } /* Used: learn */
.icon-comments:before { content: ""; background: url(../lib/FontAwesome/comments.svg) no-repeat; } /* Used: footer */
.icon-copy:before { content: ""; background: url(../lib/FontAwesome/copy.svg) no-repeat; } /* Used: releases */
.icon-dashboard:before { content: ""; background: url(../lib/FontAwesome/gauge.svg) no-repeat; } /* Used: learn */
.icon-eye-open:before { content: ""; background: url(../lib/FontAwesome/eye.svg) no-repeat; } /* Used: jqueryui.com */
.icon-github:before { content: ""; background: url(../lib/FontAwesome/github.svg) no-repeat; } /* Used: footer */
.icon-link:before { content: ""; background: url(../lib/FontAwesome/link.svg) no-repeat; } /* Used: toc-link, grunt-jquery-content */
.icon-magnet:before { content: ""; background: url(../lib/FontAwesome/magnet.svg) no-repeat; } /* Used: learn */
.icon-mastodon:before { content: ""; background: url(../lib/FontAwesome/mastodon.svg) no-repeat; } /* Used: footer */
.icon-pencil:before { content: ""; background: url(../lib/FontAwesome/pencil.svg) no-repeat; } /* Used: footer */
.icon-picture:before { content: ""; background: url(../lib/FontAwesome/image.svg) no-repeat; } /* Used: learn */
.icon-question-sign:before { content: ""; background: url(../lib/FontAwesome/circle-question.svg) no-repeat; } /* Used: learn */
.icon-refresh:before { content: ""; background: url(../lib/FontAwesome/arrows-rotate.svg) no-repeat; } /* Used: learn */
.icon-sitemap:before { content: ""; background: url(../lib/FontAwesome/sitemap.svg) no-repeat; } /* Used: learn */
.icon-star-empty:before { content: ""; background: url(../lib/FontAwesome/star.svg) no-repeat; } /* Used: learn */
.icon-tasks:before { content: ""; background: url(../lib/FontAwesome/bars-progress.svg) no-repeat; } /* Used: learn */
.icon-th-large:before { content: ""; background: url(../lib/FontAwesome/table-cells-large.svg) no-repeat; } /* Used: learn */
.icon-twitter:before { content: ""; background: url(../lib/FontAwesome/x-twitter.svg) no-repeat; } /* Used: footer */

@mgol mgol Mar 4, 2026

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you also add a duplicate .icon-x class and mark this one as deprecated?

@HermitAssociation HermitAssociation Mar 4, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Okay, I've added the icon-x attribute and declared the old icon-twitter as Deprecated, while also switching it to the old Font Awesome to prevent other pages from referencing this icon, since we haven't removed the old version of the Font Awesome file.


/* Manual Font Awesome Styles */
[class^="icon-"]::before, [class^="icon-"]::after,
Expand Down Expand Up @@ -1898,16 +1900,19 @@ footer a.do-link:before {

.footer-site-links li a:before {
position: absolute;
font-size: 1.5em;
color: #4d4d4d;
text-shadow: 0 -1px 0 #000000;
width: 1.5em;
height: 1.5em;
left: 2px;
text-shadow: 0 -1px 0 #000000;
filter: invert(0.4);
}

.footer-site-links li:hover a,
.footer-site-links li:hover a:before {
.footer-site-links li:hover a {
color: #e6e6e6;
}
.footer-site-links li:hover a:before {
filter: invert(0.9);
}

.footer-site-links li {
display: inline-block;
Expand Down Expand Up @@ -1970,14 +1975,21 @@ footer .books li a cite {

.toc-linked {
position: relative;
display: flex;
align-items: center;
}

.toc-linked .toc-link {
position: absolute;
left: -1em;
left: -1.2em;
text-decoration: none;
opacity: 0;
}

.toc-linked .icon-link:before {
filter: invert(0.1);
}

/* TODO: Remove (https://github.com/jquery/jquery-wp-content/issues/143) */
#content .toc-linked .toc-link {
text-decoration: none;
Expand Down
12 changes: 8 additions & 4 deletions themes/jquery/footer-bottom.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,13 @@
'class' => 'icon-comments',
'url' => 'https://jquery.com/support/'
),
'Twitter' => array(
'class' => 'icon-twitter',
'url' => get_option( 'jquery_twitter_link' ) ?: 'https://twitter.com/jquery'
'X' => array(
'class' => 'icon-x',
'url' => get_option( 'jquery_x_link' ) ?: 'https://x.com/jquery'
),
'Mastodon' => array(
'class' => 'icon-mastodon',
'url' => 'https://social.lfx.dev/@jquery'
),
'GitHub' => array(
'class' => 'icon-github',
Expand All @@ -25,7 +29,7 @@
<li><a class="<?php echo $link[ 'class' ]; ?>" href="<?php echo $link[ 'url' ]; ?>"><?php echo $title; ?></a></li>
<?php endforeach ?></ul>
<p class="copyright">
Copyright <?php echo date('Y'); ?> <a href="https://openjsf.org/">OpenJS Foundation</a> and jQuery contributors. All rights reserved. See <a href="https://jquery.com/license/">jQuery License</a> for more information. The <a href="https://openjsf.org/">OpenJS Foundation</a> has registered trademarks and uses trademarks. For a list of trademarks of the <a href="https://openjsf.org/">OpenJS Foundation</a>, please see our <a href="https://trademark-policy.openjsf.org/">Trademark Policy</a> and <a href="https://trademark-list.openjsf.org/">Trademark List</a>. Trademarks and logos not indicated on the <a href="https://trademark-list.openjsf.org/">list of OpenJS Foundation trademarks</a> are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them. OpenJS Foundation <a href="https://terms-of-use.openjsf.org/">Terms of Use</a>, <a href="https://privacy-policy.openjsf.org/">Privacy</a>, <a href="https://code-of-conduct.openjsf.org/">Code of Conduct</a>, and <a href="https://www.linuxfoundation.org/cookies">Cookie</a> Policies also apply.
Copyright <?php echo date('Y'); ?> <a href="https://openjsf.org/">OpenJS Foundation</a> and jQuery contributors. All rights reserved. See <a href="https://jquery.com/license/">jQuery License</a> for more information. The <a href="https://openjsf.org/">OpenJS Foundation</a> has registered trademarks and uses trademarks. For a list of trademarks of the <a href="https://openjsf.org/">OpenJS Foundation</a>, please see our <a href="https://trademark-policy.openjsf.org/">Trademark Policy</a> and <a href="https://trademark-list.openjsf.org/">Trademark List</a>. Trademarks and logos not indicated on the <a href="https://trademark-list.openjsf.org/">list of OpenJS Foundation trademarks</a> are trademarks�or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them. OpenJS Foundation <a href="https://terms-of-use.openjsf.org/">Terms of Use</a>, <a href="https://privacy-policy.openjsf.org/">Privacy</a>, <a href="https://code-of-conduct.openjsf.org/">Code of Conduct</a>, and <a href="https://www.linuxfoundation.org/cookies">Cookie</a> Policies also apply.
Comment thread
timmywil marked this conversation as resolved.
Outdated
</p>
<p><a href="https://www.digitalocean.com" class="do-link">Web hosting by Digital Ocean</a> | <a href="https://www.fastly.com/">CDN by Fastly</a> | <a href="https://wordpress.org/" class="wp-link">Powered by WordPress</a></p>
</div>
Expand Down
1 change: 1 addition & 0 deletions themes/jquery/lib/FontAwesome/arrows-rotate.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions themes/jquery/lib/FontAwesome/bars-progress.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions themes/jquery/lib/FontAwesome/bolt.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions themes/jquery/lib/FontAwesome/calendar-days.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions themes/jquery/lib/FontAwesome/certificate.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions themes/jquery/lib/FontAwesome/chevron-left.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading