Using the Common.js file, it's very easy to add icon hyperlinks to the sidebar on Citizen skin.
Best of all, with the way I did it (really the simplest way), it doesn't add anything to the mobile sidebar. Because it's so small on mobile, being at the bottom of the screen, you don't really have the space
This is the code for the Upload file icon I added:
/* Append Upload file icon to Citizen sidebar, under megamenu icon */
(function($, mw) {
// Wait for the DOM to be ready
$(document).ready(function() {
if (!mw.user.isAnon()) {
// Create the HTML for the "Upload file" icon + link
var uploadFileIcon = '<a class="citizen-header__item" href="/wiki/Special:Upload"><div class="citizen-sidebar-upload citizen-header__button"></div></a>';
// Insert the icon HTML after the existing icon container element
$('.citizen-drawer').after(uploadFileIcon);
}
});
})(jQuery, mediaWiki);
Known problems with my additions: