Skin talk:Timeless/Archive 1

Location of $wgTimelessWordmark Image

Does the image invoked by $wgTimelessWordmark need to be located in resources/assets like the $wgLogo image? Thanks! DHillBCA (talk) 16:27, 17 September 2020 (UTC)

Skin width on large screens

Does anyone know how to make the skin less wide on large screens (1080p or larger)? My goal is for the content block to be a lot slimmer, and therefore there to be more whitespace on the left and right of the website. I tried fiddling around with the CSS, but I couldn't make it work so that it lines up with the searchbar. Edit: Nevermind, I managed to achieve what I want by changing the "@media screen and (min-width: 851px){.ts-inner {max-width" value.

Broken TOC (Table of Contents): No indentation -- SOLVED

Does anyone know how to fix this? https://i.imgur.com/0eUDx0m.png I can't figure out why this is happening. It's a completely fresh install of MediaWiki 1.31.1 using the bundled Timeless skin. Drirton (talk) 23:49, 23 October 2018 (UTC)

So as it would turn out, it was an easy fix. I was using the bundled version of the skin that came with MediaWiki 1.31.1. So I deleted it from my /skins/ directory and installed the latest development version (master), reloaded the page, and it worked perfectly. Hopefully this helps anyone else who runs into this problem. Anywho- thanks for fixing that in the latest version. It's a beautiful skin. That was just a really big problem for me. Drirton (talk) 00:05, 24 October 2018 (UTC)

Thanx U

Thanx U very much for your skin ;) Anonimous user 10:56, 17 Feb 2017 (UTC+3)

Thanks for this skin, Isarra. It's beautiful! NiharikaKohli (talk) 02:11, 23 January 2016 (UTC)

<3 -— Isarra ༆ 23:26, 6 December 2018 (UTC)

Purge page tab not working

Tracked in Phabricator
Task T214207

I love the skin. It is beautiful, and I love that it is responsive. But I am trying to either install the Purge extension or the Purge gadget, which is supposed to add a menu or tab item to easily purge a page. Both the extension and the gadget work fine in the vector skin, but they do not work in the timeless skin. It seems that the Timeless skin is not recognizing the Hooks/SkinTemplateNavigation . Are there any plans to fix this?

Zzmonty (talk) 06:31, 12 October 2018 (UTC)

@Zzmonty: Not sure exactly what the issues are, but there's definitely something going on somewhere, so I've filed a task to look into it. -— Isarra ༆ 21:43, 18 January 2019 (UTC)

Visual Editor support

Hi, thanks for the best skin for mediawiki. But i have question, can it be edited to work with visual editor?

Well i made progress here: https://github.com/ElNovi/mediawiki-skins-Timeless

This actually resulted in it being supported in general! -— Isarra ༆ 00:16, 6 December 2018 (UTC)

Formatting on search page.

I don't know if anyone else will come across this, but I was getting some weird formatting on the search page.

I was however able to get this fixed (at least for now) by editing /w/resources/src/mediawiki.special/mediawiki.special.search.css.

Specifically this;

.mw-search-results {
	margin-left: 0.4em;
	float: left;
}

Changed to;

.mw-search-results {
	margin-left: 0.4em;
	float: center;
}

Now it displays like this:

Just putting this here in case anyone else comes across this issue.

General note, this has been fixed at some point. -— Isarra ༆ 20:18, 26 August 2019 (UTC)

Y'all should sign your posts.

Also, like, thanks and stuff. I've filed bugs for all of the mentioned bugs. Sorry I didn't see this sooner; I kind of abandoned the entire thing for awhile there. -— Isarra ༆ 05:12, 7 April 2016 (UTC)

You could turn on Flow for this page. Then all the things are signed. :) Sam Wilson 00:10, 28 March 2017 (UTC)

Oh, let's! Then I could just ignore everyone completely! -— Isarra ༆ 20:16, 8 May 2018 (UTC)

Hover menus

Tracked in Phabricator
Task T211357

Speaking of something I noticed when trying it out here: https://simple.wikipedia.beta.wmflabs.org/wiki/Baseball_uniform?useskin=timeless

Hover menus like that require skilled mouse pointing/usage, which can prove difficult for people with hand mobility issues or who don't fully master mouse usage yet (eg. young children, people who are new to computers, etc.). Since the hover areas aren't links themselves, you could mitigate that problem by making hover menus stick open if one clicks on the area that triggers the hover menu at the moment. Subsequently trying to click on the links the menu contains, with the menu stuck open, becomes less difficult because accidentally hovering outside no longer closes the menu.

There are probably other solutions, but as it stands, this kind of hover menu can create frustration for people who already have a frustrating web browsing experience where clicking on a link that doesn't move is already a challenge, let alone one that is conditionally visible.

Also, I don't know how well that hover menu would interact with screen readers, that probably needs testing.

--GDubuc (WMF) (talk) 08:26, 29 March 2017 (UTC)

Filed: phab:T211357. -— Isarra ༆ 17:35, 6 December 2018 (UTC)

Thank you for an elegant skin. I have one small problem: with a narrow window so the side panes disappear, the drop-down menu only work if javascript is turned on. Turning off javascript save SO much money on mobile data plans. It would be excellent to have as many features as possible work with no javascript. Also don't know if this affects screenreaders. 75.159.190.12 23:14, 12 June 2019 (UTC)

Clarification: the menus work without javascript, until the screen is so narrow that the drop-down menus all switch from text labels to icon labels (similar to those shown below, but not the same files). At this test page, narrowing eventually causes the menus "Navigation", "Wiki tools", "Page tools", and (all of which work) to be replaced by a menu, two menus and a a menu (none of which work). However, with javascript turned on, the menus not only work, they work in the click-toggle manner GDubuc (WMF) advocated above. The icons do not seem to have alt-texts in either script setting, so they might be a problem for screenreaders. Sorry for the ambiguity, Isarra. 75.159.190.12 17:08, 17 June 2019 (UTC)

Each of the mobile click toggles is an h2 with the label outdented, and so should work with screen readers. But yeah, definitely need more consistent handling, including nojs support, here. -— Isarra ༆ 14:00, 17 August 2019 (UTC)

Feedback

This skin has got several features I have been thinking about for years. Well done, @Isarra: ! However, there are a few improvements I would humbly like to suggest:

• Looking at a page like this, one sees too many colors. The colors of the links and images are inevitable. Nor do I mind the colored horizontal line under the search box (although one color might be better than three, I don't know), but the red and the blue under the headings are definitely superfluous.
• Headings of different levels are too similar in size.
• I think that "site functions" and "page functions" should be appropriately differentiated. They are not differentiated in the current Vector skin, but this could be a major area of improvement. It would not be bad, for example, to have all "site functions" in the left sidebar and all "page functions" on the right. You could try moving "Print/export", as well as all the "Wiki tools" except "Upload file" and "Special pages", to the right; the result may be interesting.

Anyway, congratulations for your work so far!--Erasmo Barresi (talk) 23:19, 16 May 2017 (UTC)

I see on your userpage that you are also creating less "serious" skins, which better suit certain kinds of non-Wikimedia projects. The suggestions I give above, especially the one about the colors, are specifically intended for the kind of work we do here at Wikimedia projects. So they may or may not interest you, depending on the scope you want your skin to have.--Erasmo Barresi (talk) 23:26, 16 May 2017 (UTC)

@Erasmo Barresi:

1. The colours problem has been partially addressed, but I've left phab:T182388 open regardless, as it's still perhaps a bit much. Also apparently filed phab:T207608 later as a partial duplicate, but that might be more about the internal specification of the colours.
2. Heading sizes/distinction has been a running issue for a long time, not just in Timeless. Filed phab:T211360 for general case here, though, and some specific examples are also on phabricator.
3. Doesn't Timeless already do this? That's like half the skin's internal horribleness just to do that. And as I recall someone killed most of the other half to get hotcat working...

-— Isarra ༆ 17:47, 6 December 2018 (UTC)

@Isarra: #3 I'm looking at an article on the English Wikipedia: "Print/export" and "In other projects", which concern the page, are placed alongside "Navigation" and "Interaction", which concern the site; just below these, "Cite this page" and "Get shortened URL", which concern the page, are placed alongside "Upload file" and "Special pages", which concern the site. But maybe you have no control over this… Does it all depend on how the individual wikis are manually set up?--Erasmo Barresi (talk) 21:52, 10 December 2018 (UTC)

@Erasmo Barresi: Some of it, yeah. Timeless' handling is literally just me having it try to sort out specific things by searching for them specifically, but it also may be time I updated it for things that aren't just part of the wiki's config, too... -— Isarra ༆ 14:02, 17 August 2019 (UTC)

Compatibility

Seems to work with MW 1.27.3 other experiences?RichardHeigl (talk) 14:08, 19 July 2017 (UTC)

I'm using it in 1.29 and it works well, as far as I can tell Txantimedia (talk) 22:29, 17 October 2017 (UTC)

Timeless seems to work fine on 1.30, as far as I can tell Noloader (talk) 04:08, 24 December 2017 (UTC)

Font needs improvement

Tracked in Phabricator
Task T173228

Somehow the font used by this skin is bad. After a couple of minutes I get a headache probably since it is pretty blurry and small. I think it will be better to use the same font as for the Vector skin. I am using the skin an a regular PC with 1920 x 1080. Cheers --[[kgh]] (talk) 22:35, 4 September 2017 (UTC)

@kgh - At the risk of sounding argumentative, I think the font selection is fine. I have older eyes, and I configure the browser with 110% Zoom for all pages. Maybe that speaks to the need for a $wgTimelessFontScale setting. Noloader (talk) 04:35, 24 December 2017 (UTC)

Well, I think it's bad too, but whether or not it's apt to be an issue is a bit of a platform-specific thing. I just haven't gotten around to killing it. -— Isarra ༆ 22:28, 1 May 2018 (UTC)

Grant proposal: Post-deployment support for Timeless and stuff

Note, I've submitted a grant proposal on meta to better address all the work needed on Timeless.

Also, separate note, I do appreciate all the issues/questions people are bringing up here and do plan to properly address them as well when I can. I'm not just ignoring you, I swear. -— Isarra ༆ 19:50, 17 October 2017 (UTC)

Good luck with the proposal and grant. It would be nice to see you compensated for your time. Its one thing when a small number of users need support and you can do it in your spare time. It's a different situation when the skin is adopted system-wide and support demands increase 5 fold. Noloader (talk) 04:11, 24 December 2017 (UTC)

To be fair, wide adoption does mean it can be much more quickly debugged and such, so there is that. Generally speaking the issues would be there whether there's ten users or several hundred. -— Isarra ༆ 22:27, 1 May 2018 (UTC)

Can I help?

I love the Timeless skin. It's way better than the defaults. If I can help track down bugs, I'm willing to do so. I'm not a programmer, but I can read and understand code somewhat, and I can track things down pretty well. One thing I'm having trouble with is a custom button in WikiEditor appears randomly. Sometimes it's there when you open edit. Sometimes I have to reload the page repeatedly before it shows up. I don't think this is a problem related to the Timeless skin, but perhaps it is. Txantimedia (talk) 22:29, 17 October 2017 (UTC)

@Txantimedia: Can you test and see if this issue occurs in other skins? -— Isarra ༆ 20:06, 6 December 2018 (UTC)

wikisource feedback

• s:Wikisource:Scriptorium#Timeless skin .E2.80.94 noted issues. Slowking4 (talk) 01:04, 26 November 2017 (UTC)

• • Archived to s:Wikisource:Scriptorium/Archives/2017-12#Timeless_skin_—_noted_issues

For more inline reference:

1. Index: namespace— drop down list field for "type" is too wide for central pane
2. both right and left menus, the opposite of "minerva", loads fast - top "your account" drop down box - hides some left menu, would rather move it all there. "more" menu on right is a waste of real estate. waste of space on top toolbar for a large search box

   apparently works better on wikipedia, with four dropdown menus: navigation; wiki tools; page tools; languages. with a fifth user menu with search box. maybe they should check out why it does not work the same for wikisource?

3. font-size is too big which is causing wrapping in prev/next, and in pop-up forms.

1. appears to have since been fixed; 2. seems to cover various issues with the nav layout... UX ain't great, but we'll see if some of the other rijigs help with this (improved header, user preferences for how to handle the site nav). 3. is... a problem, yes.

@Slowking4: I know it's been a stupidly long time, but can you link to specific examples for any of these? -— Isarra ༆ 21:50, 6 December 2018 (UTC)

User:Isarra - sorry about the the delay.

1. . Index seems to be working well.
2. . did not realize that the menus dynamically shift to top drop down at higher zoom level. this is a nice feature for small screens. (maybe some user orientation would be good)
3. . i see "previous page" ; "next page" buttons work well (other skins use "<" ; ">" alternate solution for font size problem)

here are some screenshots showing zoom level, to make left menu collapse. File:Timeless skin half zoomed in.jpg; File:Timeless skin zoomed in.jpg - i will be using this going forward, it allows more zoom on a small screen, by grabbing real estate from left hand menu. and give a VE-like appearance, but with better wikisource menu options (VE has a wikipedia focus of menu choices, which renders it less useful) don't know what adoption will be among the grumpy old men, but i will try demonstrating with newbies. Slowking4 (talk) 02:58, 17 January 2019 (UTC)

Thanks. Filed phab:T231250. -— Isarra ༆ 20:16, 26 August 2019 (UTC)

Wierd link

Hello, Isarra. I am on Special:Watchlist now. The manu "page tools" has a button "special page", connected to itself. Why do you need it? Thank you. IKhitron (talk) 10:08, 27 November 2017 (UTC)

It's the page self-link (the page tab in others) often used to reload the page/whatever. That's probably not the best place for it on mobile special pages, though... if it even makes sense to keep it at all at that point. -— Isarra ༆ 22:25, 1 May 2018 (UTC)

Nice

Nice skin! Works great on es.wiki. --Miaow 00:02, 28 November 2017 (UTC)

Not quite…

Tracked in Phabricator
Task T211394

It looks nice, but after a while I start to notice a kind of error. There are simply to many layers at the top in the half-compact view. You have site (with search and personal), site navigation, page, and page navigation. Four levels? Add that some pages at Wikipedia has their own levels. This is simply way to much!

Add site navigation as icons at the site level, and likewise add page navigation as icons at the page level. That would shrink the top to two levels, and make it more manageable.

In the very-compact view there are icons for this, but the line for page navigation is still there. That leaves three levels, which is one too many.

My gut feeling is that this skin needs further cleansing of unneeded stuff, it tries to keep to many elements visible. What we sell is content, not navigation. Now it has become way to much navigation. Jeblad (talk) 07:43, 28 November 2017 (UTC)

en.wiki

Beautiful skin but I can't see Twinkle options when I'am on a user talk page to warn them when their edits are unconstructive. --Miaow 17:08, 28 November 2017 (UTC)

Was marked and fixed as an issue in Twinkle specifically (phab:T181206 was filed and closed for Timeless), but underlying problems with dom inconsistency between skins/lack of standard apis remains... -— Isarra ༆ 23:21, 6 December 2018 (UTC)

nl.wiki

On the Dutch Wikipedia, clicking "+" to add a new section or topic doesn't do anything. This button does work on the English Wikipedia and here on MediaWiki. Woodcutterty (talk) 18:52, 28 November 2017 (UTC)

Works for me on nl:Overleg:Hoofdpagina. IKhitron (talk) 19:15, 28 November 2017 (UTC)

Doesn't do anything for me: [1]. Woodcutterty (talk) 21:23, 28 November 2017 (UTC)

I hope this fixed itself, because it's downright peculiar. (Also can't replicate, a year later.) -— Isarra ༆ 23:21, 6 December 2018 (UTC)

Resume editing

I use the 2017 wikitext editor, and I noticed that after clicking "Show preview" the "Resume editing" button in the top left corner is missing. So I have to return to the save form first and resume editing from there. Woodcutterty (talk) 10:28, 29 November 2017 (UTC)

Appears resolved now. -— Isarra ༆ 23:34, 6 December 2018 (UTC)

Removing the right and left sides

Tracked in Phabricator
Task T131803

Hello, Is there any way that we can remove the right and the left sides of the body ? I mean to remove the logo and all menus from the left and right side in order to use the whole wide for the body of the page ? Adrianevs (talk) 20:30, 29 November 2017 (UTC)

Very stupid answer: make you browser window a little narrower. IKhitron (talk) 18:44, 30 November 2017 (UTC)

Remove wiki logo through LocalSettings.php

Isarra, thank you very much for the Timeless skin. I think it is one of the best MediaWiki offers.

I would like to use Timeless as our default skin, but I would like one change. I would like to disable the logo on our wiki, and I would like the menu's on the left shifted up to take its place. The menu's on the left are Navigation and Wiki Tools. I think our logo looks bad on this particular skin (though it looks good with MonoSpace, Vector, and other skins).

A second request is, I would like to set "no logo" through LocalSettings.php. That's because our skins (and extensions) are clones of the repo's that provide them. Each night a cron job runs that does a git reset --hard HEAD && git pull in the local repo. The script resets any changes and updates the skin to the latest source (you can see the script here). Because the daily update would discard a local change we like to persist the change through LocalSettings.php.

As [I believe] the image on the right shows, our logo detracts from the skin's handsomeness.

Noloader (talk) 03:53, 24 December 2017 (UTC)

@Noloader: You should be able to remove it using the onwiki MediaWiki:Timeless.css - add the following there and it'll disappear. -— Isarra ༆ 22:34, 1 May 2018 (UTC)

#p-logo { 
	display: none;
}

FastCCI on Commons

One issue in Wikimedia Commons, when you are in a category and you want to open the menu of the tool FastCCI then it is opened in background and the menu is hidden. --Christian Ferrer (talk) 00:10, 25 December 2017 (UTC)

• + Also the "page tools" section on the File pages don't include all the option selected in the "preferences", example such as the Image search gadgets or any similar gadgets that you can write yourself in your common.js. --Christian Ferrer (talk) 00:57, 25 December 2017 (UTC)

Tracked in Phabricator
Task T211398

FastCCI seems fine now, but the other gadgets could be various issues even now. I should probably have surveyed various projects back when first deployed to figure out what all the likely problems are going to be with any new skin, but perhaps this can still go somewhere... -— Isarra ༆ 00:24, 7 December 2018 (UTC)

Indenting on Legend list

Tracked in Phabricator
Task T173151

I'm using Firefox 57.0.2 on Windows. It looks like the indenting for the legend is off a bit: https://imgur.com/a/wltk5 .

Sorry I did not post to mediawiki. The buttons for file upload are hidden in the Timeless skin, so I cannot operate the File Select dialog box. Hint: I am using a laptop, not a tablet in portrait mode. You don't have the screen real-estate you expect.

19:06, 26 December 2017 (UTC)

Cripes, this still hasn't been fixed. -— Isarra ༆ 00:27, 7 December 2018 (UTC)

Issues with very small screens

On small screens (in particular smartphones) there appear a few issues with overlapping content etc wich makes it difficult to use there. I’ve added a bit css, so this does not concern me on wmf-wikis:

.oo-ui-clippableElement-clippable {
	width:auto !important;
}
.oo-ui-popupWidget-popup {
	width:auto !important;
	max-width:400px !important;
}
@media screen and (max-width: 500px) {
	#p-logo-text {
		display:none;	
	}
	#hauptseite {
		display:block;
		width:auto;
	}
} 
.suggestions {
	z-index: 100 !important;
	margin-top:50px;
}

regards –KPFC (talk) 18:19, 28 January 2018 (UTC) [edited –KPFC (talk) 15:06, 1 May 2018 (UTC)]

Heading anchors

heading anchor problem with timeless skin

When I click a link from an article TOC to a heading I expect it to be visible but it is covered by the 'mediawiki search 35,036 pages <personal bar>' pane instead. See included screencast. Is there a workaround? --Gryllida 22:56, 18 March 2018 (UTC)

Should now (or whenever it's actually deployed) be fixed (again, but properly this time). -— Isarra ༆ 00:46, 7 December 2018 (UTC)

Aha! Thank you! I have put Timeless-master-0b821b4 into the development version of my wiki. Anchors are working better now than in the MW1.31.1 Timeless version. However, each page Table of Contents link still overshoots its anchor targets every time after the first time it is clicked. One time use? Hmm. If I do a page reload each page Table of Contents item works again the first time I click it, but overshoots it's target thereafter, till I reload the page again. So something is not quite right there I think. Hope this helps! BTW, my favorite feature of Timeless is the way the page layout automatically modifies to suit small screens like smartphones. Well done! :) --Rogerhc (talk) 05:27, 7 January 2019 (UTC)

AAAAAGH. -— Isarra ༆ 21:25, 18 January 2019 (UTC)

So, yeah, it appears to just be totally broken again regardless of page load, based on some quick testing. -— Isarra ༆ 21:30, 18 January 2019 (UTC)

Highlighting issue

Now that's pretty odd, but I have a highlighting problem in Chrome (also Opera and Maxthon, but not IE!). When I try to select some symbols to copy with my mouse, it just selects three or four symbols and then stops doing that. I move the cursor, but nothing happens - four symbols selected, that's all. Then if I move mouse far away - to the other line, for example, plenty of symbols suddenly get selected, but then it freezes again. I've figured this happens only with this skin applied. Also I've noticed, that this happens only to those pages which are short and don't have a scrollbar. This is extremeley wierd, but that's how it works. Also I've noticed, that if I narrow my browser window so that scrollbar appears, highlighting starts to work.

15:24, 3 May 2018 (UTC)

Sounds like phabricator:T183215 and related - chrome is a piece of crap and just does not like certain overflow rules, it seems... it's a high priority, though. -— Isarra ༆ 20:15, 8 May 2018 (UTC)

How to display the title of the link called from the summary?

When I click on a link of summary, I arrive at the content, but, the title, it is at the top, I have to use the ascenceur of the navigator to go up and to be able to see the title.

Need help, i want display the title of the link called from the summary.

After a few tests, I notice that it is the banner in fixed position which covers the title called since the anchor of the summary, but, I can not modify the CSS so that the call of a link since the summary can display the title, below the fixed search banner.

Was phab:T181484. Fixed. -— Isarra ༆ 00:49, 7 December 2018 (UTC)

Thankfulness

I'd simply like to express my gratitude for that beautiful skin. --Cherämon (talk) 10:47, 4 August 2018 (UTC)

Thank you! -— Isarra ༆ 00:50, 7 December 2018 (UTC)

Title breaks

Hello, I have a problem with the title (site name) in the top-left corner breaking over two decks in Firefox and IE11. It stays on a single line in Chrome.

The title is two words, 12 characters (including the space) and should fit on a single line.

Is there a css solution to this?

Make it... smaller, perhaps. Sounds like chrome is doing the fonts differently, or something. -— Isarra ༆ 00:57, 7 December 2018 (UTC)

How do I hide the sidebar with Timeless skin?

Hello, I have tried to edit Mediawiki:common.css to hide my sidebar with use Timeless skin. It works for my Chameleon skin, but when I switch to Timeless, it doesn't work?

Is it possable to hide sidebar when use timeless skin? I want my contant have full wide screen, and also want to replace a dropdown menu to the site logo place.

FirehorseMG (talk)

@FirehorseMG: Would having phab:T131803 available plus some CSS to make the skin full-width do what you want? -— Isarra ༆ 00:56, 7 December 2018 (UTC)

Disable View source and History for non-logged in users

Hi, how can I do that? I guess in that case I also want to hide the "View" button (again for non-logged in users only) as it will be the only possibility. Many thanks :)--Spiros71 (talk) 10:18, 6 December 2018 (UTC)

@Spiros71: Simplest way I can think of would be to put some js in your MediaWiki:Timeless.js to check if user is logged in, and if not, hide/remove the elements. There might be better, though. -— Isarra ༆ 02:38, 7 December 2018 (UTC)

@Spiros71: Hi, I used the way described here, it worked perfectly. https://www.mediawiki.org/wiki/Topic:Qyydsoxnt44t8arl . Here what I added at the end of localsettings.php:

function efAddSkinStyles(OutputPage &$out, Skin &$skin) {
   if(!$skin->getUser()->isLoggedIn()) {
       if ($skin->getSkinName() == 'timeless') {
               $out->addInlineStyle('#ca-history { display:none; }');
               $out->addInlineStyle('#ca-view { display:none; }');
               $out->addInlineStyle('#ca-viewsource { display:none; }');
               $out->addInlineStyle('#ca-talk { display:none; }');
               $out->addInlineStyle('#ca-nstab-main {display:none; }');
       }
   }
   return true;
}
$wgHooks['BeforePageDisplay'][] = 'efAddSkinStyles';

Injecting content below page tools

Thank you for the previous reply and the beautiful skin :) I wonder where exactly I can add some dynamic content on the template so that it appears below the page tools level (View-Edit-History).--Spiros71 (talk) 08:40, 8 December 2018 (UTC)

I know of no way to do this wiki-side, but we should probably add something for that to all skins, frankly... hrrrng. -— Isarra ༆ 09:52, 27 May 2019 (UTC)

@Spiros71: Wait, do you mean you just want to add another section below tools in the sidebar? (I'm guessing not, having reread that.) Or you want to add a thing to the page under all the header stuff, including the page links/cactions? Above the firstheading? -— Isarra ༆ 09:54, 27 May 2019 (UTC)

Hello.

This skin is quality. But there is something bothering me: the cat. Can you give me a code for Timeless.css to hide the cat? Thanks --122.106.254.105 23:55, 11 December 2018 (UTC)

Man, nobody likes the cat. Adding #mw-content-container { background-image: none } or some such to the site's MediaWiki:Timeless.css or your user timeless.css should do it. -— Isarra ༆ 21:22, 18 January 2019 (UTC)

Not Valid W3C HTML

In TimelessTemplate.php class "pokey" in <h2> tag, this is not valid!

Аlso a problem not directly related to this skin
In /includes/skins/SkinTemplate.php
"$content_navigation['views']['view']['redundant'] = true;"
add not valid parameter in tag <a> "redundant"
if set "false" and comment class "pokey", code in THML is a clean!
if comment these valuess of the code will cause my site to malfunction?

In footer links it's nice to have a different color from the normal text.
screen-common.less
example:
add this in: #mw-footer

#mw-footer {
	/* My style links */
	a {
        text-decoration: none;
        color: #FF7F50;

        &:hover,
        &:visited {
		color: #FF7F50;
        }       
	}

--Ncode-iv (talk) 07:52, 26 December 2018 (UTC)

@Ncode-iv: Thanks, filed as phab:T214204 and phab:T214202 for now. -— Isarra ༆ 21:00, 18 January 2019 (UTC)

Any way to force only one sidebar in widescreen view?

This is a great skin, but there seems to be a lot of unused space with the double sidebar layout on wide screens. Is it possible to force it to show only the left sidebar without breaking the functionality of the dynamic layout? Ozycaevias (talk) 22:42, 17 January 2019 (UTC)

@Ozycaevias: Not yet, but it's definitely on the to-do list to have that as an option. While apparently this wasn't explicitly listed as a bug, I've added it to phab:T131803. -— Isarra ༆ 21:16, 18 January 2019 (UTC)

@Ozycaevias: Wanted to do the same thing to use more of the space and build it similar to Vector skin. Found myself following workaround: Edit timeless/resources/screen-desktop-full.less and change its content to:

@import 'variables.less';

#mw-site-navigation {
        .column-left();
}

#mw-content {
        margin-left: @column-left-size;
        //margin-right: @column-right-size;//Place for right sidebar
        overflow: auto;
}

#mw-related-navigation {
        .column-left(); //default: .column-right();
}

// Redundant content category list
#catlinks {
        display: none;
}

Hope that's helpful. Schlagmichdoch (talk) 01:57, 4 August 2019 (UTC)

---

I found a fairly clean way to remove the right side bar via css instead of editing the core files that will get wiped on update... it's from Heddy10 on phabricator T131803.
TiltedCerebellum (talk) 13:05, 5 April 2020 (UTC)

In MediaWiki:Timeless.css add the following:

@media (min-width: 1340px) {
  #mw-content-block {
    display: block;
  }
  #mw-content,
  #content-bottom-stuff {
  margin-left: 14em;
  }
  #mw-content-wrapper {
    float: right;
    margin-left: -14em;
    width: 100%;
  }
  #mw-related-navigation {
    width: 14em;
    padding: 0 1em 0 0;
  }
}

Editing theme files is problematic, making the change via CSS preserves the change on update. TiltedCerebellum (talk) 13:05, 5 April 2020 (UTC)

CSS customisation

I am running a wiki with Timeless as the default skin (thank-you people it is wonderful) and would like to move all of the portlets that exist by default (#site-navigation and #site-tools) with the exception of the logo (#p-logo) to the right of the content (#mw-content) as I am expecting to add a lot of sidebar links and I don't want it to look lopsided.

Anyone got any CSS to do the trick? El komodos drago (talk) 16:27, 17 February 2019 (UTC)

Anchor links cuts off header text

Tracked in Phabricator
Task T181484

The text starts below the header. You can see the header if you scroll up. We need to show the header text so the user can see that he is in the right chapter.

I have tried several solution I've found online, but no one works. Can this be done in Timeless.css? — Preceding unsigned comment added by 185.52.41.81 (talk • contribs)

Yeah, nothing working (consistently) has been a problem I've encountered as well, having tried to fix it several times - I'll try again uuuuh next week, probably, because this is seriously annoying. -— Isarra ༆ 10:49, 23 May 2019 (UTC)

Add content after h1

Thanks a lot for skin, it perfectly works for mobile devices! Is it possible to add some html or javascript code after tag H1? — Preceding unsigned comment added by 93.188.32.252 (talk • contribs)

Well, js is easy - just attach it to h1s as usual with jQuery or whatever... but I don't know that doing it through interface messages or even skin-side is really feasible. Don't think we have anything to do that. -— Isarra ༆ 10:29, 23 May 2019 (UTC)

Or do you mean like what WikiVoyage does with Extension:WikidataPageBanner? -— Isarra ༆ 10:53, 23 May 2019 (UTC)

Font change recently?

I have noticed today (6th May 2019) that there is new font in Timeless skin for Wikipedia. Or is it some bug on my PC? Anyway, I like it, it makes wiki more readable than arial. Wector88 (talk) 11:42, 6 May 2019 (UTC)

@Wector88: Yeah. It changed, and then it changed again. Hopefully it's not worse again now - I tried very hard to keep arial out of it, because I Do Not Like arial, but this doesn't mean the others are that great either... -— Isarra ༆ 10:27, 23 May 2019 (UTC)

@Isarra: as a person who bored with Arial in MediaWiki the new font is fresh.Vulphere 14:36, 9 June 2019 (UTC)

Whoo! -— Isarra ༆ 23:34, 3 July 2019 (UTC)

Two-column references

At this test page, the references always come in two columns, even if the screen is really wide or really narrow. It would be a bit easier to read if it adapted. 75.159.190.12 18:02, 17 June 2019 (UTC)

Related? phab:T197056 -— Isarra ༆ 19:53, 26 August 2019 (UTC)

Change style of TOC (Table of contents)

Is there a way to get vector-skin-look on toc in timeless-skin? Or is there a way to remove line-breaks in timeless-skin toc?

Skinning

I was wondering if anyone knew what files I need to edit to change the background and such. I have been reviewing the skin folder and I am stuck.--Stefen moss (talk) 00:28, 26 July 2019 (UTC)

@Stefen moss: What exactly are you trying to do? -— Isarra ༆ 19:37, 26 August 2019 (UTC)

NWE-CodeMirror-Timeless bug

Tracked in Phabricator
Task T230756
Resolved

Is there any chance of an investigation into the issue I've reported in Topic:V3ap9inic4lnhfim? --Idrisz19 (talk) 14:45, 26 August 2019 (UTC)

@Idrisz19: This was just fixed last week, so you should be seeing the problem go away sometime this week, assuming no deployment delays. If not, please yell at me and I'll take another look. -— Isarra ༆ 19:37, 26 August 2019 (UTC)

Thank you, it works fine now. --Idrisz19 (talk) 17:10, 28 August 2019 (UTC)

banner sidebar

Hello. how to put a banner in the right column, down "more". thanks

Replace site title with image logo

Hi all!

I'm trying to modify the great Timeless skin for my wiki and I would like to replace the site title appearing at the top left, next to the search bar, with an image. How would I go about it?

You can check $wgTimelessWordmark from Skin:Timeless#Configuration. The configuration replaces text title with wordmark.

$wgTimelessWordmark = [
  '1x' => "$wgServer$wgResourceBasePath/resources/assets/wordmark.png",
  'width' => "auto", # If omitted, php error occurs. (Undefined index: width in /path/to/wiki/skins/Timeless/includes/TimelessTemplate.php on line 1094)
  'height' => 38, # Recommended height for Timeless wordmark
];

You can also remove the logo area mw-site-navigation.p-logo on the sidebar for showing only one logo.

$wgHooks['BeforePageDisplay'][] = function (OutputPage &$out, Skin &$skin) {
  if ($skin->getSkinName() == 'timeless') {
    $out->addInlineStyle('#p-logo { display:none; }');
  }
};

— Preceding unsigned comment added by 166.104.144.95 (talk • contribs)

Wikitable backgrounds

On some wikitables, when using this skin, the background colour of the cells does not appear as it should. If you switch to Vector it shows, but for some reason it does not on Timeless. See below on the 'b' cell:

  a should be grey

  b should be green

X	Y
a	b

You can see it on articles such as en:List of the verified oldest people. --Voello (talk) 23:33, 10 January 2020 (UTC)

Oh, there seems to already be a bug report on this oops. --Voello (talk) 20:31, 12 January 2020 (UTC)

floating Toc

Is there a way/hack to get a floating toc that stays fixed on the side when scrolling?

Remove the tiger background

Hi, I would like to remove the tiger background for Timeless in my test wiki. How can I do that (through common.css?)? Thank you

Modify Mediawiki:Timeless.css

#mw-content-container { background-image: none; }

Thank you very much MavropaliasG (talk) 16:40, 17 February 2020 (UTC)

Alternatively,

1. place an empty svg in the .../Timeless/resources/images folder (e.g. upload.wikimedia.org/wikipedia/commons/1/1d/No_image.svg)
2. change TimelessBackdropImage configuration in the skin.json file to empty.svg instead of cat.svg.

I'm not sure which way is better... Themumblingprophet (talk) 23:51, 20 May 2020 (UTC)

Or, add below in LocalSettings.php. The empty image equals to above one.

$wgTimelessBackdropImage = 'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="1" height="1"/>';

— Preceding unsigned comment added by 166.104.144.95 (talk • contribs)

Footer has wrong colour

I changed from Vector to Timeless. Now all my my footers (Privacy, Impressum, Contact-Page) are missing.

I just noticed that the background colour at the end of each page is light grey which is the same as the font colour for the links. The footers are there but can't be seen. Only on the setup page the footer colour is dark grey and the links can be seen in light gray! Is there a possibility to correct the colour at the end (below the green line) of the page?

Kind regards Thomas

This is because you override the body background in MediaWiki:Common.css. It doesn’t even work (https://pollen.tstebler.ch/MediaWiki/index.php?title=Pollenatlas is an HTML page, not an image), but Timeless depends on its default setting of body background color. (Special:Preferences and a few other pages disable user and site CSS/JS for safety reasons, so your faulty CSS rule doesn’t apply there, thus is the background color okay there.) —Tacsipacsi (talk) 00:02, 22 December 2020 (UTC)

Editing colors of the skin via MediaWiki:Timeless.css

Hi, I'm trying to edit the colors of the skin. I've done this initially by editing the .less files that come with the skin, but from my understanding that is not the correct way to do this. So I tried adding the following to MediaWiki:Timeless:

.color-middle { background: @red-dark; }

But that has not worked. I'm not very experienced in working with CSS, so any help is appreciated. Also, is there anything built in to the skin that removes the default logo and allows you to change the text in the top left to an image? Thank you!

I figured out the css issue, I needed to use the hex value for colors. Also, I had to completely restart my browser, the "ctrl+shift+r" method wasn't working to show the changes. I'm still working on the logo question, so I'd very much appreciate suggestions for that.

Question

@Isarra: I was wondering if you could maybe add a globe icon to the "View on meta.wikimedia.org" button? At least for those wiki farms that have global user pages? Awesome Aasim 19:17, 27 March 2020 (UTC)

Collapsible sidebar

Hey there! Is it possible to make the sidebar on the left collapsible? I want the sidebar to be like in the Vector skin, but I don't want to use Vector, because Timeless looks way better. Help would be really appreciated! :) 2001:16B8:6659:8600:80FC:1E00:C24F:2FC 08:05, 29 April 2020 (UTC)

Add Google Tag Manager

I need to add Google Tag Manager GTM code in header and body. Any ideas?

Different Table Style in MediaWiki 1.35

I'm changing host for my wiki, so in the new hosting, I'll use MediaWiki 1.35 instead of MediaWiki 1.32.2 I used on the old site. I installed MediaWiki 1.35.0-wmf. 39 with Timeless 0.8.9 (ba7274f) but there are differences between the two versions of my site: it seems that the new MediaWiki can't show properly tables (view this Screenshot). Is there any way to solve it?

Aw, balls, that was a bad set of styles we quickly moved away from, and if it's in the 1.35 release that probably needs to be fixed... later versions definitely should not have that. -— Isarra ༆ 17:21, 5 December 2020 (UTC)

Display of wikidata's claims

Commons:File:Affichage de Wikidata sur téléphone .png

The Visual display of claims using Timeless on a mobile phone is now really difficult to read. PAC2 (talk) 06:37, 11 July 2020 (UTC)

Languages button shows up on mobile even when no other language is available

Hi, I upgraded to MW1.35 recently and noticed that languages button is persistent in the mobile view even where there aren't any other languages to choose from. My wiki is located here. It supports only English and as such no language button is visible in the desktop mode. But once you shift into the mobile view (850px and less), the button shows up and does nothing when clicked. I'm assuming it pulls up a list of other languages available which is none. Any help on how to disable this button would be appreciated. --HerrHulaHoop (talk) 17:28, 2 October 2020 (UTC)

Can this work for MediaWiki 1.27.7?

Thanks. Infinitepeace (talk) 10:58, 9 November 2020 (UTC)

Tables are non-adaptive

Wide tables are non-adaptive for mobile screens - they are overlapping the screen and it can'tbe fixex through clean CSS.

The only way to fix this is to wrap the table in div and apply width:100%; overflow: auto;

The same styles, when I try to apply them to existing CSS classes like .wikitable, do nothing. Арскригициониец (talk) 15:18, 27 November 2020 (UTC)

Picture Size

It would be nice, if the skin could automatically adjust "oversized" pictures to keep them within the skin frame.

Thomas 10:02, 8 December 2020 (UTC)

Title on right column (Anonymous) is disabled and does not link to login screen

Other MediaWiki skins work on my site. When I switch to Timeless, The right column on the title bar does not link to login screen. How do I fix. This worked with 1.31.4 version of MediaWiki, but is broken in 1.35.

I believe it is an issue with dropdown. When I hover over this area, I do not get the "normal" list of items to select from... "Log In". I have javascript enabled. What would I need to change to get this to work?

Adding top and bottom anchors

I use MW 1.31 and I want to add the following for a go to top/bottom css functionality like seen on the right here

<a id="top"></a>

(in other themes I can see it below mw-body class) and

<a id="bottom"></a>

Where/How could I do that? --Spiros71 (talk) 10:09, 25 January 2021 (UTC)

in combination with DarkMode the header loses fixed

The normal (-colored) version works fine. With the Dark-Mode-Extension (https://github.com/danneu/MediaWiki-DarkMode) the header scrolls like the rest of the page. Any idea why? --Gunnar.offel (talk) 13:13, 30 January 2021 (UTC)

Minimize width wikipage

Hello how minimize the width wikipage as french Wikipedia. The french Wikipeda use a gadget with sidebar. Is there the same gadget with skin timeless. Thanks 10:34, 3 February 2021 (UTC)

Add in your MediaWiki:Common.css

/*Reduce size of content as french Wikipedia*/
#content.mw-body {
	width:97%
	}

176.145.73.159 13:03, 3 February 2021 (UTC)

Background Footer

How can I remove the dark background of the footer, please. Gribouillot (talk) 19:11, 3 February 2021 (UTC)

I changed the colour of the background of the footer in Timeless.css to the below, 5384bf being the colour you want --Stampstudy (talk) 08:11, 23 February 2021 (UTC)

#mw-footer-container {
background: #5384bf;
}

Move categories to bottom

I have used the css on the main page to make the skin two column rather than right column.

Is there a way to remove the categories from the left column and place it under the body ?

You can try this to move the categories to bottom.Vulphere 05:37, 8 April 2021 (UTC)

#catlinks {
	display: block !important;
	/* from #mw-site-navigation .sidebar-chunk */
	background: #fcfcfc;
	border: solid #eeeeee;
	border-width: 1px 1px 0.2em;
	box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
	padding: 1.5em 1.5em 0;
	margin: 1em 0;
	line-height: 1.1;
	word-wrap: break-word;
}

#catlinks > div {
	margin-bottom: 1.5em;
}

#catlinks-sidebar {
	display:none;
}