fliegendewurst.eu/tree-style-tabs-new-tab-button-bottom.html

<!DOCTYPE html>
<html>
<head>
<title>Fixing the position of TST's new tab button</title>
<meta charset="utf8">
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" href="main.css">
</head>

<body>
<main>
<h1 id="header"><img src="favicon.ico" id="favicon"/><a href="/">FliegendeWurst's corner of the WWW</a></h1>

<h2>Fixing the position of TST's new tab button</h2>

<article>

<p>
Here you can learn how to change the position of the new tab button for the <a href="https://addons.mozilla.org/firefox/addon/tree-style-tab/">Tree Style Tab</a> browser extension.
With this change, the new tab button is always at the bottom of the tab tree.
Opening a new tab with the mouse is then as simple as clicking at the bottom left of the screen.
No more aiming at a 20 pixels high region below the last opened tab!
</p>

<p>
Simply add the CSS code below to TST's custom style option ("Advanced" > "Extra style rules for contents provided by Tree Style Tab").
</p>
<pre>
#tabbar .after-tabs {
  display: none;
}

#tabbar ~ .after-tabs {
  display: flex !important;
}

:root {
  --after-tabs-area-size: 20px !important;
}
</pre>

</article>
</main>
</body>
</html>
New page 2023-07-30 08:09:36 +00:00			`<!DOCTYPE html>`
			`<html>`
			`<head>`
			`<title>Fixing the position of TST's new tab button</title>`
			`<meta charset="utf8">`
			`<meta name="viewport" content="width=device-width,initial-scale=1"/>`
			`<link rel="shortcut icon" href="favicon.ico">`
			`<link rel="stylesheet" href="main.css">`
			`</head>`

			`<body>`
Dark mode 2023-09-08 11:37:36 +00:00			`<main>`
New page 2023-07-30 08:09:36 +00:00			`<h1 id="header"><img src="favicon.ico" id="favicon"/><a href="/">FliegendeWurst's corner of the WWW</a></h1>`

			`<h2>Fixing the position of TST's new tab button</h2>`

			`<article>`

			`<p>`
			`Here you can learn how to change the position of the new tab button for the <a href="https://addons.mozilla.org/firefox/addon/tree-style-tab/">Tree Style Tab</a> browser extension.`
			`With this change, the new tab button is always at the bottom of the tab tree.`
			`Opening a new tab with the mouse is then as simple as clicking at the bottom left of the screen.`
			`No more aiming at a 20 pixels high region below the last opened tab!`
			`</p>`

			`<p>`
			`Simply add the CSS code below to TST's custom style option ("Advanced" > "Extra style rules for contents provided by Tree Style Tab").`
			`</p>`
			`<pre>`
			`#tabbar .after-tabs {`
			`display: none;`
			`}`

			`#tabbar ~ .after-tabs {`
			`display: flex !important;`
			`}`
Hotfix 2023-07-30 08:14:37 +00:00
			`:root {`
Hotfix 2 2023-07-30 08:21:04 +00:00			`--after-tabs-area-size: 20px !important;`
Hotfix 2023-07-30 08:14:37 +00:00			`}`
New page 2023-07-30 08:09:36 +00:00			`</pre>`

			`</article>`
Dark mode 2023-09-08 11:37:36 +00:00			`</main>`
New page 2023-07-30 08:09:36 +00:00			`</body>`
			`</html>`