Telegram Kaefer by riedler

Mirrored from https://github.com/RiedleroD/userstyles-riedler/raw/master/telegram_k%C3%A4fer.user.css

Telegram Kaefer screenshot
Homepage Install Get Stylus Write a review

Details

Authorriedler

LicenseCC BY-SA 4.0

Created atApril 9, 2021 08:34

Updated atMay 15, 2022 15:37

Applies tobugs.telegram.org

Statistics

Learn how we calculate statistics in the FAQ.

Total views321

Total installs50

Weekly installs0

Description

Dark Userstyle for bugs.telegram.org. With it, you can enable wide mode, and various colors of the default palette.

Notes

Version: 1.0.1

Changelog:
- styled highlighted text
- fixed some unstyled tags in search bar
- styled search form arrow’s background and selection border
- styled card stati “fixed” and “added”
- fixed background overflow in some card thumbnails

History

Daily snapshots of style statistics.

2021-07-072021-07-312021-08-232021-09-152021-10-082021-10-312021-11-232021-12-162022-01-082022-01-312022-02-232022-03-18Date0.000.881.752.633.504.385.256.137.00Daily countDaily installsDaily updatesDaily views
2021-07-072021-07-312021-08-232021-09-152021-10-082021-10-312021-11-232021-12-162022-01-082022-01-312022-02-232022-03-18Date0.0033.0065.0098.00130.00163.00195.00228.00260.00Total countTotal installsTotal views

Source code

/* ==UserStyle==
@name			Telegram Käfer
@namespace		https://github.com/RiedleroD/userstyles-riedler/
@version		1.0.1
@description	Black & wide style for bugs.telegram.org
@author			Riedler
@preprocessor	stylus
@var	color	bg0		"Background 0"	#151515
@var	color	bg1		"Background 1"	#242424
@var	color	bg2		"Background 2"	#333
@var	color	bg3		"Background 3"	#424242
@var	color	txtl	"Light Text"	#FFF
@var	color	txt		"Text"			#EEE
@var	color	txtd	"Dark Text"		#AAA
@var	color	grn		"Green"			#8F8
@var	color	yel		"Yellow"		#ff8
@var	color	org		"Orange"		#f82
@var	color	cyn		"Cyan"			#2ae
@var	select	wid		"Width"			{"Narrow":"narrow","Wide":"wide","Ultra-Wide":"uwide"}
==/UserStyle== */

shade(cl)
	background-color rgba(cl,0.3)
	color rgba(cl,0.9)
	border-color rgba(cl,0.5)
shade2(cl)
	background-color rgba(cl,0.4)
	color cl
	border-color rgba(cl,0.6)
shade3(cl)
	background-image linear-gradient(rgba(cl,0.3),rgba(cl,0.3))
	background-color bg0
	color rgba(cl,0.9)
	border-color rgba(cl,0.5)
@-moz-document domain("bugs.telegram.org"){
	body{
		background-color:bg0;
		color:txt;
	}
	if(wid==wide){
		.container{
			max-width:95%;
		}
		.bt-layer-content{
			width:90%;
		}
	}else if(wid==uwide){
		.container{
			max-width:100%;
		}
		.bt-layer-content{
			width:100%;
		}
	}
	header .header-wrap,
	header.sticky .sticky-box{
		background-color:bg0;
	}
	a.bt-card-row:hover{
		background-color:bg1;
	}
	.bt-card{
		&-action,
		&-row-body{
			& mark.highlight{
				shade(yel);
			}
		}
		&-title,
		&-preview{
			color:txt;
		}
	}
	.bt-card-thumb-status{
		shade3(grn);
		.thumb-feature &{
			shade3(cyn);
		}
	}
	.bt-card-thumb:not(.thumb-icon){
		background-color:#0000;
	}
	.form-control{
		color:txtd;
	}
	.bt-main-search-form{
		& .select{
			box-shadow:inset 0 0 0 1px bg2;
		}
		& .select-enter{
			background-color:cyn;
		}
		& .field-focused .select{
			box-shadow:inset 0 0 0 2px cyn;
		}
	}
	.select{
		background-color:bg0;
	}
	.select .items-list{
		background-color:bg0;
	}
	.bt-sort-item.selected{
		&,
		&:hover{
			color:txt;
		}
	}
	.bt-select-query .select .search-item{
		& .select-list-item{
			background-color:bg2;
			color:txtd;
			border:solid 1px txtd;
			box-sizing:border-box;
			&.private,
			&.c-green{
				shade(grn);
			}
			&.c-lightgreen{
				shade(yel);
			}
			&.c-orange{
				shade(org);
			}
			&.internal,
			&.c-cyan{
				shade(cyn);
			}
		}
		&.selected .select-list-item{
			background-color:bg3;
			color:txt;
			&.private,
			&.c-green{
				shade2(grn);
			}
			&.c-lightgreen{
				shade2(yel)
			}
			&.c-orange{
				shade2(org);
			}
			&.internal,
			&.c-cyan{
				shade2(cyn);
			}
		}
	}
	.dropdown-menu{
		background-color:bg0;
	}
	.bt-dropdown-wrap{
		& span.dropdown-menu{
			border-color:rgba(txt,0.06);
			box-shadow:0 1px 2px rgba(txt,0.07)
		}
		& ul.dropdown-menu>li>.bt-dropdown-item{
			color:txtd;
		}
		& ul.dropdown-menu>li>a.bt-dropdown-item{
			&:hover,
			&:focus{
				color:txtd;
				background-color:bg1;
			}
		}
	}
	.bt-layer-content{
		background-color:bg0;
		box-shadow:0 0 12px rgba(txt,.3);
	}
	.bt-issue-title .cd-author{
		color:txt;
	}
	.bt-issue-label{
		color:txtd;
	}
	.bt-comment-service-text,
	.bt-issue-tags .bt-status,
	.bt-subscription-tags .bt-status,
	.bt-card-action .bt-status,
	.bt-select-query .select .selected-item{
		border:solid 1px;
		box-sizing:border-box;
		shade(txtd);
		&.c-orange{
			shade(org);
		}
		&.c-cyan{
			shade(cyn);
		}
		&.c-green{
			shade(grn);
		}
		&.c-lightgreen{
			shade(yel);
		}
	}
	.bt-issue-tags .bt-tag,
	.bt-issue-tags .bt-status{
		border:solid 1px;
		box-sizing:border-box;
		shade(txt);
	}
	.bt-markdown{
		& blockquote::before{
			background-color:rgba(cyn,0.8);
		}
		& pre,
		& code{
			border:solid 1px;
			box-sizing:border-box;
			shade(txt);
		}
	}
	.bt-layer-block+.bt-layer-block::before{
		border-bottom:solid 2px bg1;
		box-sizing:border-box;
		background-color:bg0;
	}
	.bt-comments-more{
		background-color:bg1;
		color:txtd;
		&:hover{
			color:txt;
			background-color:bg2;
		}
	}
	.bt-action-btn{
		color:txtd;
		&.bt-reply-btn:hover,
		&.bt-action-menu-btn:hover{
			background-color:bg1;
		}
	}
	.bt-comment.highlight{
		background-color:bg2;
	}
	a.bt-comment-reply-content{
		color:txtd;
	}
	.bt-comment-author{
		color:txt;
	}
	.bt-layer-close:hover,
	.bt-menu-btn.dropdown-toggle:hover,
	.open .bt-menu-btn.dropdown-toggle{
		background-color:bg2;
	}
	.btn-primary{
		background-color:rgba(cyn,0.6);
		color:txt;
		&:hover,
		&:focus,
		&:active{
			background-color:rgba(cyn,0.8);
			color:txth;
		}
		&-green{
			&:hover,
			&:focus,
			&:active{
				background-color:rgba(grn,0.7);
			}
			&,
			&.disabled,
			&[disabled]{
				background-color:rgba(grn,0.6);
			}
		}
	}
	.radio-item .radio-input-icon,
	.checkbox-item .checkbox-input-icon{
		background-color:bg1;
		border-color:bg3;
		&::before{
			border-color:cyn;
		}
		&::after{
			background-color:cyn;
		}
	}
	.cd-dialog-options{
		&.disabled{
			& .radio-item .radio-input-icon{
				border-color:bg3;
			}
			& input.radio{
				&:disabled ~ .radio-label{
					color:txtd;
				}
				&:checked ~ .radio-label{
					color:txt;
				}
			}
		}
		& .radio-item .radio-input + .radio-label{
			color:txtd;
		}
	}
	.cd-comment-input-wrap .input.cd-comment-input{
		border-color:bg3;
	}
	.cd-btn{
		background-color:rgba(cyn,0.8);
		color:txt;
		&:hover,
		&:focus{
			background-color:rgba(cyn,0.9);
		}
	}
	.bot-feature .bt-comment{
		&-author-name.cd-bot{
			color:rgba(grn,0.6);
		}
		&-photo.cd-bot{
			background-color:rgba(grn,0.6);
		}
	}
	.popup{
		background-color:bg0;
		box-shadow:0 0 12px rgba(txt, .3);
	}
	input.cd-form-control,
	textarea.cd-form-control,
	.input.cd-form-control{
		box-shadow:inset 0 -1px 0 bg1;
	}
}

Reviews

No reviews yet.