ChatGPT UI Enhancer

Enhance ChatGPT.com UI with modern elements, headers, footers, and icons

  1. // ==UserScript==
  2. // @name ChatGPT UI Enhancer
  3. // @namespace http://tampermonkey.net/
  4. // @version 0.1
  5. // @description Enhance ChatGPT.com UI with modern elements, headers, footers, and icons
  6. // @author Your Name
  7. // @match https://chatgpt.com/*
  8. // @grant GM_addStyle
  9. // ==/UserScript==
  10.  
  11. (function() {
  12. 'use strict';
  13.  
  14. // Add custom CSS styles
  15. GM_addStyle(`
  16. /* Header Style */
  17. #custom-header {
  18. background-color: #4A4A4A;
  19. color: #ffffff;
  20. padding: 15px;
  21. text-align: center;
  22. font-size: 24px;
  23. position: sticky;
  24. top: 0;
  25. z-index: 1000;
  26. }
  27.  
  28. /* Footer Style */
  29. #custom-footer {
  30. background-color: #4A4A4A;
  31. color: #ffffff;
  32. padding: 15px;
  33. text-align: center;
  34. font-size: 14px;
  35. position: relative;
  36. z-index: 1000;
  37. }
  38.  
  39. /* Sidebar Icons */
  40. .sidebar-icon {
  41. width: 20px;
  42. height: 20px;
  43. margin: 0 8px;
  44. vertical-align: middle;
  45. }
  46.  
  47. /* Chat Container */
  48. .chat-container {
  49. max-height: none !important; /* Remove height restriction */
  50. height: auto !important; /* Ensure chat can expand */
  51. padding: 15px;
  52. background-color: #ffffff;
  53. border-radius: 10px;
  54. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  55. }
  56.  
  57. /* Update chat bubbles */
  58. .chat-bubble {
  59. max-width: 90% !important;
  60. padding: 15px !important;
  61. border-radius: 12px !important;
  62. margin: 10px 0 !important;
  63. }
  64.  
  65. /* Modernize Input Field */
  66. .input-field {
  67. border-radius: 20px !important;
  68. padding: 10px !important;
  69. border: 1px solid #ccc;
  70. }
  71.  
  72. /* General UI Modernization */
  73. body {
  74. font-family: Arial, sans-serif;
  75. background-color: #f0f0f0;
  76. }
  77.  
  78. /* Main chat window */
  79. .main-chat-window {
  80. margin: 20px auto;
  81. max-width: 800px;
  82. padding: 10px;
  83. background: white;
  84. border-radius: 10px;
  85. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  86. }
  87. `);
  88.  
  89. // Create Header
  90. const header = document.createElement('div');
  91. header.id = 'custom-header';
  92. header.innerHTML = '<h1>ChatGPT Enhanced</h1>';
  93. document.body.prepend(header);
  94.  
  95. // Create Footer
  96. const footer = document.createElement('div');
  97. footer.id = 'custom-footer';
  98. footer.innerHTML = '<p>ChatGPT Enhancement Script - 2024</p>';
  99. document.body.appendChild(footer);
  100.  
  101. // Function to add icons to the sidebar
  102. function addIconsToSidebar() {
  103. const sidebar = document.querySelector('.sidebar'); // Adjust selector based on actual sidebar class
  104. if (sidebar) {
  105. const icons = ['🔍', '💬', '⚙️']; // Sample icons
  106. sidebar.innerHTML += icons.map(icon => `<span class="sidebar-icon">${icon}</span>`).join('');
  107. }
  108. }
  109.  
  110. // Call the function to add icons
  111. addIconsToSidebar();
  112.  
  113. })();

QingJ © 2025

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