Skip to content

Display title as status by myfonj

Screenshot of Display title as status

Details

Authormyfonj

LicenseNo License

Categorybrowser-chrome, title, statusbar

Created

Updated

Size3.2 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Page title visible in bottom right corner. You can read it here more likely than in your clogged tab-bar, don't you?

Notes

Source code

/* ==UserStyle==
@name           Display title as status
@namespace      myfonj
@version        1.2.5
@description    Page title visible in bottom right corner. You can read it here more likely than in your clogged tab-bar, don't you?
@author         myf
@license        CC0
==/UserStyle== */
/*
https://userstyles.world/style/5119
Changelog
1.2.5 (2023-12-01) Fix for cases where plaintext is inserted into head (webforms.pipedrive.com).
1.2.4 (2022-11-17) Fix pointer event mistake (breaking telegram.org/k/).
1.2.2 (2022-11-12) :active; attempt to make it workd with userscript that makes title editable.
1.2.1 (2022-09-16) fix rare scenario when page displays head somehow and it may obstruct page (codepen.io).
1.2.0 (2022-07-22) "shy period" longer (2 minutes), collapses to 1 px bar on the bottom, can be reset with click.
1.1.0 (2022-07-01) "shy": hover for 1s makes it go away for 2s, unless being selected.
*/
@-moz-document regexp(".*") {
:root > head {
 display: block !important;
 position: fixed !important;
 z-index: 2147483647 !important;
 overflow: visible !important;
 /* Hope this won't spoil anything: */
 pointer-events: none !important; 
}
/*
There are sites with iframes in the head [1].
 Hide them, but keep the specificity as low as possible.
 [1] https://codepen.io/
*/
:where(:root > head > :not(title)) {
 display: none;
}
/*
 There are sites with stray textual content added to head
 e.g. copyright notices for fonts loaded at [2]
 [2] https://webforms.pipedrive.com/f/6OtNEXt2hwY4dZ9e1pOlF51EvSPgBInTVfED62eCgoJYERK7TgL4Gnu8RcTGkRA4rF?embeded=1&uuid=cde-report
*/
:where(:root > head) {
 font-size: 0
} 
:where(:root > head > *) {
 font-size: 1rem
} 

/*
 Main title styling
*/
:root > * > title {
 pointer-events: all !important;
 display: block !important;
 width: auto !important;
 height: auto !important;
 position: fixed !important;
 bottom: 0 !important;
 right: 0 !important;
 color: #999 !important;
 background-color: #000c !important;
 border: 1px solid #7778 !important;
 border-bottom: none !important;
 border-right: none !important;
 padding: 0 .95ch 0 .95ch !important;
 font-family: system-ui !important;
 font-size: 12px !important;
 font-weight: normal !important;
 line-height: 1.8em !important;
 transition-property: transform !important;
 transform: translatey(0%) !important;
}
:root > * > title:hover {
 color: #ccc !important;
 background-color: #333 !important;
}
/*
 HIDE when hovered for some time
*/
:root > * > title:not(:active):not(:focus):hover {
 transform: translatey(calc(100% - 1px)) !important;
 transition-delay: 1s !important;
 transition-duration: .5s !important;
}
/*
 keep hidden for ~~ever~~  __some time__
*/
:root > * > title:not(:hover) {
 transition-delay: 120s !important;
 transition-duration: 2s !important;
}
/*
 but restore when clicked
*/
:root > * > title:focus,
:root > * > title:active {
 transform: translatey(0%) !important;
 transition: none !important;
}
/*
 canonical?
* OFF /
:root > * > link[rel="canonical" i][href] {
 display: block;
 position: fixed;
 top: 0;
 left: 0;
 
}
:root > * > link[rel="canonical" i][href]::before {
 content: 'Canonical:' attr(href);
}
/* */


}

Reviews

No reviews yet.