Slack Full Theme plugin

Applies the side bar colors for slack to the entire application

  1. // ==UserScript==
  2. // @name Slack Full Theme plugin
  3. // @namespace http://mrkannah.com/
  4. // @version 1.0.2
  5. // @description Applies the side bar colors for slack to the entire application
  6. // @author Fadee Kannah
  7. // @match https://*.slack.com/*
  8. // @grant GM_setValue
  9. // @grant GM_getValue
  10. // @run-at document-end
  11. // ==/UserScript==
  12.  
  13. $(document).ready(function(){
  14. var checkInterval = setInterval(function(){
  15. if(Ready()){
  16. var colors = GM_getValue('ST_Colors').toString().split(',');
  17. clearInterval(checkInterval);
  18. if(colors){
  19. setUp(colors);
  20. }
  21. else{
  22. setTimeout(function(){
  23. colors = getColors();
  24. setTimeout(setUp(colors),300);
  25. },100);
  26. }
  27. }
  28. },200);
  29. });
  30.  
  31. function setUp(colors){
  32. applyColors(colors);
  33. addListner();
  34. }
  35.  
  36. function Ready(){
  37. return parseInt($('#loading_welcome').css('opacity')) ? 0 : 1;
  38. }
  39.  
  40. function getColors(){
  41. $('#team_menu')[0].click();
  42. $('#member_prefs_item > a')[0].click();
  43. var colors = $('#sidebar_theme_custom').val().toString().split(',');
  44. $('.dialog_go ')[0].click();
  45. return colors;
  46. /* Array Index
  47. 0 Col BG
  48. 1 Menu BG
  49. 2 Active Item
  50. 3 Active Text
  51. 4 Hover Item
  52. 5 Text Color
  53. 6 Active precesne
  54. 7 mention Badge
  55. */
  56. }
  57.  
  58. function applyColors(colors){
  59. GM_setValue('ST_Colors',colors);
  60. console.log(colors);
  61. var head = document.getElementsByTagName('head')[0];
  62. var style = document.createElement('style');
  63. style.type = 'text/css';
  64. style.id = 'fullThemePlugin';
  65.  
  66. //header & footer styles
  67. style.innerHTML = '#header{ background:'+colors[1]+'}' +
  68. '#end_div{background:'+colors[1]+'}' +
  69. '#channel_members_toggle{ background:'+colors[1]+'!important}'+
  70. '#footer{background:'+colors[0]+'}'+
  71. '#primary_file_button:hover {background:'+colors[4]+';color: '+colors[5]+';border-color:'+colors[4]+'}';
  72.  
  73. //divier styles
  74. style.innerHTML +='.day_divider{background:'+colors[0]+' !important}' +
  75. '.day_divider_label{background:'+colors[0] +'!important;color:'+colors[3]+'}';
  76.  
  77. //messages styles
  78. style.innerHTML += '.msgs_holder{background:'+colors[0]+'}'+
  79. '.mention{color:'+colors[1]+';background:'+colors[7]+'!important}' +
  80. '.light_theme .message_sender {color:'+colors[3]+' !important}' +
  81. '.message_content{color:'+colors[5]+'}';
  82.  
  83. //Global Styles
  84. style.innerHTML += 'a{color:'+colors[2]+'!important}'+
  85. '.msg_inline_file_preview_title{color:'+colors[2]+'!important}'+
  86. 'body{background:'+colors[0]+'}';
  87.  
  88. //scroll bar styles
  89. style.innerHTML += '.monkey_scroll_handle_inner{background:'+colors[2]+'!important;border:0!important}' +
  90. '.monkey_scroll_handle{position:relative;left:-1px!important;width:10px!important}';
  91.  
  92. head.appendChild(style);
  93.  
  94. return $(style);
  95.  
  96. }
  97.  
  98. function addListner(){
  99. $('#team_menu').on('click',function(){
  100. $('#member_prefs_item > a').on('click',function(){
  101. setTimeout(function(){
  102. $('.color_hex').on('input',function(){
  103. changeColors();
  104. });
  105. $('input[name="sidebar_theme_rd"]').on('change',function(){
  106. changeColors();
  107. });
  108. $('#sidebar_theme_custom').on('input change',function() {
  109. changeColors();
  110. });
  111. $('.color_swatch').on('click', function(){
  112. setTimeout(function(){
  113. changeColors();
  114. },700);
  115. });
  116. },500);
  117. });
  118. });
  119. }
  120.  
  121. function changeColors(){
  122. var colors = $('#sidebar_theme_custom').val().split(',');
  123. $('#fullThemePlugin').remove();
  124. applyColors(colors);
  125. }

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址