Telegram Dark Theme
当前为
// ==UserScript==
// @name Telegram Dark
// @namespace http://tampermonkey.net/
// @version 0.3
// @description Telegram Dark Theme
// @author BeknAlyb
// @match https://web.telegram.org/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
var animStopFlag = 0;
function stopTextAnim() {
if(animStopFlag >= 1){
animStopFlag = 2;
sendBtnColorAnim();
}
else{
animStopFlag = 1;
}
}
function addCss(css) {
var head, style, linkF1, linkF2, linkF3, divTopPanel;
var button;
head = document.getElementsByTagName('head')[0];
if (!head) { return; }
divTopPanel = document.getElementsByClassName('tg_head_split');
if (!divTopPanel[0]) { return; }
style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = css;
head.appendChild(style);
button = document.createElement('div');
button.className = 'stopAnimButton';
button.addEventListener("click", stopTextAnim);
divTopPanel[0].appendChild(button);
linkF1 = document.createElement('link');
linkF1.href = 'https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@500&display=swap';
linkF1.rel = 'stylesheet';
head.appendChild(linkF1);
linkF2 = document.createElement('link');
linkF2.href = 'https://fonts.googleapis.com/css2?family=Neucha&display=swap';
linkF2.rel = 'stylesheet';
head.appendChild(linkF2);
linkF3 = document.createElement('link');
linkF3.href = 'https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap';
linkF3.rel = 'stylesheet';
head.appendChild(linkF3);
}
var sendBtnText = null;
var int2 = 150;
var int3 = 255;
var addInt2, addInt3 = null;
var multiplier = 0;
var animate;
function getRandom (min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min; //The maximum is inclusive and the minimum is inclusive
}
function init() {
sendBtnText = document.getElementsByClassName('im_submit');
sendBtnText[0].style.color = 'rgb(0, 150, 255)';
sendBtnText[0].style.textShadow = '0 0 2px rgb(0, 190, 255)';
sendBtnColorAnim();
}
function mouseut(){
sendBtnText[0].style.color = 'rgb(0, 150, 255)';
sendBtnText[0].style.textShadow = '0 0 2px rgb(0, 50, 60)';
};
function mousever(){
sendBtnText[0].style.color = 'rgb(133, 205, 255)';
sendBtnText[0].style.textShadow = '0 0 2px rgb(0, 190, 255)';
}
function sendBtnColorAnim() {
multiplier += 0.5;
if(int2 <= 60 && int3 <= 102){
multiplier = 0.5;
addInt2 = 1;
addInt3 = 2;
}
else if(int2 >= 150 && int3 >= 255){
multiplier = 0.5;
addInt2 = -1;
addInt3 = -2;
}
else{
}
int2 += addInt2 * multiplier;
int3 += addInt3 * multiplier;
sendBtnText[0].style.color = 'rgb(' + 0 + ', ' + parseInt(int2) + ', ' + parseInt(int3) + ')';
sendBtnText[0].style.textShadow = '0 0 2px rgb(0, ' + parseInt(int2) + ', ' + parseInt(int3)*0.9 + ')';
animate = setTimeout(sendBtnColorAnim,50);
if(animStopFlag == 1) {
sendBtnText[0].style.color = 'rgb(0, 150, 255)';
sendBtnText[0].style.textShadow = '0 0 2px rgb(0, 50, 60)';
sendBtnText[0].addEventListener("mouseover", mousever);
sendBtnText[0].addEventListener("mouseout", mouseut);
int2 = 150;
int3 = 255;
multiplier = 0;
clearTimeout(animate);
}
else if(animStopFlag == 2){
sendBtnText[0].removeEventListener("mouseover", mousever);
sendBtnText[0].removeEventListener("mouseout", mouseut);
animStopFlag = 0;
}
}
window.onload = init;
addCss (`
body
{
background: #333;
}
body.non_osx
{
/* font: 11px/18px 'Press Start 2P', sans-serif, Actor, Helvetica;
letter-spacing: 0.5px; */
/* font: 13px/18px 'Neucha', cursive, Actor, Helvetica;
letter-spacing: 0.5px; */
font: 12px/18px 'Montserrat Alternates', sans-serif, Actor, Helvetica;
}
.stopAnimButton {
margin-top: -48px;
margin-right: 104px;
position: relative;
float: right;
width: 53px;
height: inherit;
background: #1d1d1d;
background-image: url("https://img.icons8.com/office/40/000000/whole-fish.png");
background-repeat: no-repeat;
background-position: center;
color: white;
display: block;
}
.stopAnimButton:hover {
background: #141617;
color: white;
cursor: pointer;
background-image: url("https://img.icons8.com/office/40/000000/no-fish.png");
background-repeat: no-repeat;
background-position: center;
}
a {
color: #7eaad1;
text-decoration: none;
}
.im_dialogs_scrollable_wrap a.im_dialog:hover,.im_dialogs_scrollable_wrap a.im_dialog_selected
{
border-radius:0;
background:#27292b
}
.im_dialogs_scrollable_wrap .active a.im_dialog
{
border-radius:0;
background-color:#41525f
}
.im_dialogs_scrollable_wrap .active a.im_dialog:hover,.im_dialogs_scrollable_wrap .active a.im_dialog_selected
{
background-color:#41525f
}
a.im_dialog:hover .im_short_message_text, a.im_dialog_selected .im_short_message_text{
color: #999;
}
.im_dialogs_col .nano > .nano-pane > .nano-slider {
background: rgb(60, 60, 60);
}
a.tg_checkbox, p.tg_checkbox {
color: white;
}
.composer_rich_textarea, .composer_textarea
{
box-shadow: 0 1px 0 0 #afafaf;
}
.composer_rich_textarea:focus, .composer_textarea:focus
{
box-shadow: 0 2px 0 0 #afafaf;
}
a.im_dialog .im_dialog_chat_from_wrap,a.im_dialog .im_short_message_media, a.im_dialog .im_short_message_service
{
color: #808080;
}
.im_history_col .nano > .nano-pane > .nano-slider,
.contacts_modal_col .nano > .nano-pane > .nano-slider,
.sessions_modal_col .nano > .nano-pane > .nano-slider,
.stickerset_modal_col .nano > .nano-pane > .nano-slider,
.im_dialogs_modal_col .nano > .nano-pane > .nano-slider {
background: #484848;
}
.im_history_col .nano > .nano-pane,
.contacts_modal_col .nano > .nano-pane,
.sessions_modal_col .nano > .nano-pane,
.stickerset_modal_col .nano > .nano-pane,
.im_dialogs_modal_col .nano > .nano-pane {
background: #333;
}
.stickerset_modal_sticker_wrap:hover {
background: #333;
}
.im_send_panel_wrap {
max-width: 640px;
padding-bottom: 40px;
}
.im_send_form {
max-width: 470px;
left: 70px;
right: 72px;
}
.btn-primary {
color: #fff;
background-color: #2e404e;
border-radius: 3px;
}
.btn-md-primary, .btn-md-primary:focus, .btn-md-primary:hover {
color: #b5ddff;
}
.btn-md:hover {
background: #52606f;
}
/*.im_submit {
color: rgb(0, 149, 255);
text-shadow: 0 0 2px #00c0ff;
} */
.im_submit:hover {
color: #8ed0ff;
background: #3589c500;
}
.im_edit_panel_wrap {
padding: 0px 0 60px;
margin: 0 24px 0 12px;
}
.im_message_selected .im_message_outer_wrap, .md_modal_head, .md_modal_head_simple,
.stickerset_actions_wrap, .im_message_unread_split
{
background: #1d1d1d;
opacity: 1;
}
.dropdown.open .tg_head_btn,
.tg_head_btn:hover {
color: #fff;
text-decoration: none;
background: #141617;
}
.im_history_select_active .im_message_outer_wrap:hover {
background: #1d1d1d;
}
.im_message_author
{
color: #499dd9;
}
.im_message_reply
{
padding-left: 12px;
padding-top: 2px;
padding-bottom: 2px;
padding-right: 0;
}
.im_message_reply_border {
background: #7eaad1;
height: 38px;
width: 2px;
position: absolute;
margin-left: -12px;
margin-top: -1px;
}
.im_message_reply_author {
font-weight: 700;
color: #7eaad1;
line-height: 16px;
margin-bottom: 3px;
}
.im_message_wrap {
max-width: 660px;
padding: 0 0px 0 0px;
margin: 0 20px;
margin-top: 0px;
margin-right: 60px;
margin-bottom: 0px;
margin-left: 40px;
position: static;
}
@media (min-width: 900px) {
.im_message_wrap {
position: relative;
}
.im_message_selected .icon-select-tick,
.im_history_selectable .im_message_outer_wrap:hover .icon-select-tick {
position: absolute;
width: 26px;
height: 26px;
margin: 9px 0 0 590px;
display: block;
background-image: url(../img/icons/IconsetW.png);
background-repeat: no-repeat;
background-position: -9px -481px;
opacity: 0.5;
}
.is_2x .im_message_selected .icon-select-tick,
.is_2x .im_history_selectable .im_message_outer_wrap:hover .icon-select-tick {
background-image: url(../img/icons/IconsetW_2x.png);
background-size: 42px 1171px;
}
.im_message_selected .icon-select-tick {
opacity: 1 !important;
}
.im_grouped_short .icon-select-tick,
.im_grouped_short .im_message_outer_wrap:hover .icon-select-tick {
margin-top: -2px;
}
.im_message_fwd .icon-select-tick,
.im_message_outer_wrap:hover .im_message_fwd .icon-select-tick {
margin-top: 10px;
}
.im_grouped_fwd .icon-select-tick,
.im_grouped_fwd .im_message_outer_wrap:hover .icon-select-tick {
margin-top: 7px;
}
.im_grouped .icon-select-tick,
.im_grouped .im_message_outer_wrap:hover .icon-select-tick {
margin-top: 7px;
}
.im_grouped_fwd_short .icon-select-tick,
.im_grouped_fwd_short .im_message_outer_wrap:hover .icon-select-tick {
margin-top: -5px;
}
}
.audio_player_seek_slider .tg_slider_track {
margin: 7px 0;
background: rgba(65, 73, 78, 0.5);
height: 4px;
border-radius: 0;
}
.audio_player_volume_slider .tg_slider_track {
margin: 7px 0;
background: rgba(79, 86, 90, 0.5);
height: 4px;
}
.im_dialogs_search_field {
font-size: 12px;
line-height: normal;
border: 1px solid #333333;
border-radius: 5px;
padding: 6px 26px 6px 30px;
margin: 0;
background-color: #333333;
background-image: url(../img/icons/IconsetW.png);
background-repeat: no-repeat;
background-position: -6px -205px;
}
.im_dialogs_scrollable_wrap a.im_dialog_searchpeer,
.im_dialogs_scrollable_wrap a.im_dialog_searchpeer:hover,
.im_dialogs_scrollable_wrap a.im_dialog_searchpeer_selected {
background: #306288;
}
.modal-content {
position: relative;
background-color: #22292d;
background-clip: padding-box;
border-radius: 5px;
outline: 0;
}
.confirm_modal_description {
text-align: center;
padding: 20px 0;
font-size: 14px;
line-height: 160%;
color: aliceblue;
}
.tg_head_split, .im_send_panel_wrap, .im_page_wrap,Femo
.im_send_form, .stickerset_modal_stickers_list,
.md_modal_body
{
background-color: #222;
color: #f1efeb; !important;
border: none;
box-shadow: none;
}
.im_history_pinned_wrap {
padding: 7px 10px 7px 20px;
border-bottom: 1px solid #7d7d7d;
}
.reply_markup_button {
color: #e6e6e6;
display: block;
width: 100%;
background: #47545f;
height: 30px;
font-size: 13px;
margin: 0;
padding: 6px;
overflow: hidden;
text-overflow: ellipsis;
}
.reply_markup_button:focus, .reply_markup_button:hover {
color: #ffffff;
background: #637b90;
}
.im_record_bg {
background-color: #222;
width: 40px;
height: 40px;
border-radius: 40px;
}
a.composer_emoji_btn:hover {
background-color: #2b2f31;
}
.tg_head_peer_title_wrap, .tg_head_btn
{
background-color: #1d1d1d;
}
.im_dialog_peer
{
color: white !important;
}
.badge
{
color: #ddd !important;
background-color: #444 !important;
}
.im_dialogs_col_wrap
{
border-right: 2px solid #111 !important;
}
`);
})();