Adds a frosted glass and background image effect to ChatGPT UI for a cleaner, modern look
目前為
// ==UserScript==
// @name Glassmorphism ChatGPT Theme
// @namespace https://github.com/oleh-prukhnytskyi
// @version 1.0
// @description Adds a frosted glass and background image effect to ChatGPT UI for a cleaner, modern look
// @author Oleh Prukhnytskyi
// @match https://chatgpt.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=chatgpt.com
// @grant GM_addStyle
// @license MIT
// ==/UserScript==
(function() {
'use strict';
GM_addStyle(`
.relative.flex.h-full.max-w-full.flex-1.flex-col.overflow-hidden {
background-image: url('https://images.unsplash.com/photo-1620207418302-439b387441b0?q=80&w=2767&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
background-size: cover;
}
.border-token-border-default.flex.w-full.cursor-text.flex-col.items-center {
background-color: rgba(255,255,255,.1);
backdrop-filter: blur(16px);
border: 1px solid rgba(255,255,255,.3);
}
.border-token-border-medium.relative.bg-token-sidebar-surface-primary {
border-radius: 16px;
}
.justify-between.h-9.bg-token-sidebar-surface-primary {
border-top-left-radius: 16px;
border-top-right-radius: 16px;
}
.absolute.start-0.end-0.bottom-full.z-20,
.flex.w-full.items-start.gap-4.rounded-3xl.border.py-4.ps-5.pe-3.text-sm,
nav.flex.h-full.w-full.flex-col.ps-3 > div:last-child,
.group.absolute.end-2.bottom-2.z-20.flex.flex-col.gap-1 {
display:none;
}
.text-token-text-secondary.relative.mt-auto.flex.min-h-8.w-full.items-center.justify-center.p-2.text-center.text-xs {
opacity: 0;
}
.bg-token-message-surface, p > code {
background-color: rgb(0 0 0 / 50%);
backdrop-filter: blur(16px);
}
`);
})();