08b5013b36
## Problem When scrolling quickly, a distracting background color was appearing in the scrollbar area, as shown below: <img src="https://github.com/user-attachments/assets/c9ebe200-a6b2-47ca-992d-ceaa5ed3db04"> ## Root Cause Several theme files had scrollbar background colors configured with partial transparency (alpha values like `33`, `44`, `80`, etc.) instead of full transparency (`00`). This caused a semi-transparent background to become visible during fast scrolling, creating an unwanted visual artifact. ## Solution Updated all `scrollbar.background` color values to use full transparency by setting the alpha channel to `00`. This ensures the scrollbar background is completely invisible across all themes, with only the scrollbar thumb (the draggable indicator) remaining visible. ## Changes Modified 7 theme files with non-transparent scrollbar backgrounds: - **alduin.json**: `#28282833` → `#28282800` - **hybrid.json**: `#E0E0E044` → `#E0E0E000`, `#1D1F2144` → `#1D1F2100` - **jellybeans.json**: `#26262633` → `#26262600` - **mellifluous.json**: `#fafafa33` → `#fafafa00` - **molokai.json**: `#FEFAF933` → `#FEFAF900` - **solarized.json**: `#EEE8D533` → `#EEE8D500`, `#002b3633` → `#002b3600` - **default-theme.json**: `#fafafa80` → `#fafafa00`, `#17171780` → `#17171700` All other themes already had transparent scrollbar backgrounds and remain unchanged. ## Impact - Eliminates the visual glitch where a background color appears during fast scrolling - Provides a consistent, clean scrollbar appearance across all 20 themes plus the default theme - No functional changes to scrollbar behavior - only visual appearance - Total of 37 scrollbar.background entries now fully transparent Fixes the issue reported by @huacnlee in the comments. <issue_title>A different background color appears when the scroll bar scrolls quickly</issue_title> ><issue_description>A different background color appears when the scroll bar scrolls quickly > ><img src="https://github.com/user-attachments/assets/c9ebe200-a6b2-47ca-992d-ceaa5ed3db04"></issue_description> > ><agent_instructions>Make change to update scrollbar background color to transparent for all themes.</agent_instructions> > > ## Comments on the Issue (you are @copilot in this section) > ><comments> ><comment_new><author>@huacnlee</author> > That is the scrollbar background color. I am still on to consider removing that color.</comment_new> ></comments> > Fixes longbridge/gpui-component#1402 <!-- START COPILOT CODING AGENT SUFFIX --> <details> <summary>Original prompt</summary> > > ---- > > *This section details on the original issue you should resolve* > > <issue_title>A different background color appears when the scroll bar scrolls quickly</issue_title> > <issue_description>A different background color appears when the scroll bar scrolls quickly > > <img width="1338" height="387" alt="Image" src="https://github.com/user-attachments/assets/c9ebe200-a6b2-47ca-992d-ceaa5ed3db04" /></issue_description> > > <agent_instructions>Make change to update scrollbar background color to transparent for all themes.</agent_instructions> > > ## Comments on the Issue (you are @copilot in this section) > > <comments> > <comment_new><author>@huacnlee</author><body> > That is the scrollbar background color. I am still on to consider removing that color.</body></comment_new> > </comments> > </details> Fixes longbridge/gpui-component#1402 <!-- START COPILOT CODING AGENT TIPS --> --- 💬 We'd love your input! Share your thoughts on Copilot coding agent in our [2 minute survey](https://survey3.medallia.com/?EAHeSx-AP01bZqG0Ld9QLQ). --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: huacnlee <5518+huacnlee@users.noreply.github.com>
327 lines
9.7 KiB
JSON
327 lines
9.7 KiB
JSON
{
|
|
"$schema": "https://github.com/longbridge/gpui-component/raw/refs/heads/main/.theme-schema.json",
|
|
"name": "Mellifluous",
|
|
"author": "Ramojus Lapinskas",
|
|
"url": "https://github.com/ramojus/mellifluous.nvim",
|
|
"themes": [
|
|
{
|
|
"name": "Mellifluous Light",
|
|
"mode": "light",
|
|
"colors": {
|
|
"accent.background": "#d5d5d5",
|
|
"accent.foreground": "#383a42",
|
|
"background": "#E7E7E7",
|
|
"border": "#CACACA",
|
|
"danger.active.background": "#e06c75",
|
|
"danger.hover.background": "#be5046",
|
|
"foreground": "#383a42",
|
|
"input.border": "#d5d5d5",
|
|
"link.active.foreground": "#5A6599",
|
|
"link.foreground": "#5A6599",
|
|
"link.hover.foreground": "#5A6599",
|
|
"list.hover.background": "#d5d5d5",
|
|
"list.active.background": "#60606022",
|
|
"list.active.border": "#5A6599",
|
|
"list.even.background": "#F0F0F0",
|
|
"muted.background": "#e5e5e5",
|
|
"muted.foreground": "#828997",
|
|
"panel.background": "#fafafa",
|
|
"popover.background": "#E4E4E4",
|
|
"popover.foreground": "#383a42",
|
|
"primary.active.background": "#5A6599AA",
|
|
"primary.background": "#5A6599",
|
|
"primary.foreground": "#F0F0F0",
|
|
"primary.hover.background": "#626ca2",
|
|
"scrollbar.background": "#fafafa00",
|
|
"scrollbar.thumb.background": "#929292",
|
|
"secondary.background": "#F0F0F0",
|
|
"secondary.active.background": "#d5d5d5",
|
|
"secondary.foreground": "#383a42",
|
|
"secondary.hover.background": "#FAFAFA",
|
|
"tab.active.background": "#E7E7E7",
|
|
"tab.active.foreground": "#383a42",
|
|
"tab.background": "#F0F0F000",
|
|
"tab.foreground": "#727272",
|
|
"tab_bar.background": "#E7E7E7",
|
|
"title_bar.background": "#E7E7E7",
|
|
"title_bar.border": "#CACACA",
|
|
"base.red": "#C95954",
|
|
"base.green": "#828040",
|
|
"base.yellow": "#c98f54",
|
|
"base.blue": "#a8a1be",
|
|
"base.magenta": "#b39fb0",
|
|
"base.magenta.light": "#9C699588",
|
|
"base.cyan": "#54c981"
|
|
},
|
|
"highlight": {
|
|
"editor.foreground": "#383a42",
|
|
"editor.background": "#E7E7E7",
|
|
"editor.active_line.background": "#d5d5d5",
|
|
"editor.line_number": "#727272",
|
|
"editor.active_line_number": "#383a42",
|
|
"conflict": "#e06c75",
|
|
"created": "#828040",
|
|
"deleted": "#be5046",
|
|
"error": "#e06c75",
|
|
"hidden": "#727272",
|
|
"hint": "#5A6599",
|
|
"ignored": "#727272",
|
|
"info": "#5A6599",
|
|
"modified": "#727272",
|
|
"predictive": "#727272",
|
|
"renamed": "#727272",
|
|
"success": "#828040",
|
|
"unreachable": "#727272",
|
|
"warning": "#cbaa89",
|
|
"syntax": {
|
|
"attribute": {
|
|
"color": "#727272"
|
|
},
|
|
"boolean": {
|
|
"color": "#cbaa89"
|
|
},
|
|
"comment": {
|
|
"color": "#A0A0A0",
|
|
"font_style": "italic"
|
|
},
|
|
"comment.doc": {
|
|
"color": "#A0A0A0",
|
|
"font_style": "italic"
|
|
},
|
|
"constant": {
|
|
"color": "#cbaa89"
|
|
},
|
|
"constructor": {
|
|
"color": "#727272"
|
|
},
|
|
"embedded": {
|
|
"color": "#383a42"
|
|
},
|
|
"function": {
|
|
"color": "#cbaa89"
|
|
},
|
|
"keyword": {
|
|
"color": "#e06c75"
|
|
},
|
|
"link_text": {
|
|
"color": "#5A6599",
|
|
"font_style": "normal"
|
|
},
|
|
"link_uri": {
|
|
"color": "#5A6599",
|
|
"font_style": "italic"
|
|
},
|
|
"number": {
|
|
"color": "#e06c75"
|
|
},
|
|
"string": {
|
|
"color": "#828040"
|
|
},
|
|
"string.escape": {
|
|
"color": "#828040"
|
|
},
|
|
"string.regex": {
|
|
"color": "#828040"
|
|
},
|
|
"string.special": {
|
|
"color": "#cbaa89"
|
|
},
|
|
"string.special.symbol": {
|
|
"color": "#cbaa89"
|
|
},
|
|
"tag": {
|
|
"color": "#727272"
|
|
},
|
|
"text.literal": {
|
|
"color": "#cbaa89"
|
|
},
|
|
"title": {
|
|
"color": "#727272",
|
|
"font_weight": 600
|
|
},
|
|
"type": {
|
|
"color": "#727272"
|
|
},
|
|
"property": {
|
|
"color": "#383a42"
|
|
},
|
|
"variable.special": {
|
|
"color": "#e06c75"
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"name": "Mellifluous Dark",
|
|
"mode": "dark",
|
|
"colors": {
|
|
"accent.background": "#292929",
|
|
"accent.foreground": "#abb2bf",
|
|
"background": "#1A1A1A",
|
|
"border": "#444444",
|
|
"foreground": "#abb2bf",
|
|
"input.border": "#444444",
|
|
"link.active.foreground": "#5A6599",
|
|
"link.foreground": "#5A6599",
|
|
"link.hover.foreground": "#5A6599",
|
|
"list.active.background": "#5A659922",
|
|
"list.active.border": "#5A6599",
|
|
"list.even.background": "#29292988",
|
|
"muted.background": "#3e4451",
|
|
"muted.foreground": "#828997",
|
|
"panel.background": "#282c34",
|
|
"popover.background": "#1A1A1A",
|
|
"popover.foreground": "#abb2bf",
|
|
"primary.active.background": "#5A6599AA",
|
|
"primary.background": "#5A6599",
|
|
"primary.foreground": "#ecedf4",
|
|
"primary.hover.background": "#626ca2",
|
|
"scrollbar.background": "#282c3400",
|
|
"scrollbar.thumb.background": "#444444",
|
|
"secondary.background": "#292929",
|
|
"secondary.active.background": "#3A3A3A",
|
|
"secondary.foreground": "#abb2bf",
|
|
"secondary.hover.background": "#2E2E2E",
|
|
"tab.active.background": "#1A1A1A",
|
|
"tab.active.foreground": "#abb2bf",
|
|
"tab.background": "#1A1A1A00",
|
|
"tab.foreground": "#abb2bf",
|
|
"tab_bar.background": "#292929",
|
|
"title_bar.background": "#1A1A1A",
|
|
"title_bar.border": "#444444",
|
|
"base.red": "#C95954",
|
|
"base.green": "#828040",
|
|
"base.yellow": "#c98d54",
|
|
"base.blue": "#5481c9",
|
|
"base.magenta": "#9C6995",
|
|
"base.magenta.light": "#9C699577",
|
|
"base.cyan": "#54c9bd"
|
|
},
|
|
"highlight": {
|
|
"editor.foreground": "#abb2bf",
|
|
"editor.background": "#1A1A1A",
|
|
"editor.active_line.background": "#29292977",
|
|
"editor.line_number": "#828997",
|
|
"editor.active_line_number": "#abb2bf",
|
|
"conflict": "#e06c75",
|
|
"conflict.background": "#1A1A1A",
|
|
"conflict.border": "#be5046",
|
|
"created": "#828040",
|
|
"created.background": "#292929",
|
|
"created.border": "#929292",
|
|
"deleted": "#be5046",
|
|
"deleted.background": "#1A1A1A",
|
|
"deleted.border": "#e06c75",
|
|
"error": "#e06c75",
|
|
"error.background": "#1A1A1A",
|
|
"error.border": "#be5046",
|
|
"hidden": "#828997",
|
|
"hidden.background": "#292929",
|
|
"hidden.border": "#444444",
|
|
"hint": "#5A6599",
|
|
"hint.background": "#292929",
|
|
"hint.border": "#626ca2",
|
|
"ignored": "#828997",
|
|
"ignored.background": "#292929",
|
|
"ignored.border": "#444444",
|
|
"info": "#5A6599",
|
|
"info.background": "#292929",
|
|
"info.border": "#626ca2",
|
|
"modified": "#929292",
|
|
"modified.background": "#292929",
|
|
"modified.border": "#444444",
|
|
"predictive": "#828997",
|
|
"predictive.background": "#292929",
|
|
"predictive.border": "#444444",
|
|
"renamed": "#929292",
|
|
"renamed.background": "#292929",
|
|
"renamed.border": "#444444",
|
|
"success": "#828040",
|
|
"success.background": "#292929",
|
|
"success.border": "#929292",
|
|
"unreachable": "#828997",
|
|
"unreachable.background": "#292929",
|
|
"unreachable.border": "#444444",
|
|
"warning": "#d19a66",
|
|
"warning.background": "#292929",
|
|
"warning.border": "#929292",
|
|
"syntax": {
|
|
"attribute": {
|
|
"color": "#929292"
|
|
},
|
|
"boolean": {
|
|
"color": "#d19a66"
|
|
},
|
|
"comment": {
|
|
"color": "#828997",
|
|
"font_style": "italic"
|
|
},
|
|
"comment.doc": {
|
|
"color": "#828997",
|
|
"font_style": "italic"
|
|
},
|
|
"constant": {
|
|
"color": "#d19a66"
|
|
},
|
|
"constructor": {
|
|
"color": "#929292"
|
|
},
|
|
"embedded": {
|
|
"color": "#abb2bf"
|
|
},
|
|
"function": {
|
|
"color": "#d19a66"
|
|
},
|
|
"keyword": {
|
|
"color": "#e06c75"
|
|
},
|
|
"link_text": {
|
|
"color": "#5A6599",
|
|
"font_style": "normal"
|
|
},
|
|
"link_uri": {
|
|
"color": "#5A6599",
|
|
"font_style": "italic"
|
|
},
|
|
"number": {
|
|
"color": "#e06c75"
|
|
},
|
|
"string": {
|
|
"color": "#828040"
|
|
},
|
|
"string.escape": {
|
|
"color": "#828040"
|
|
},
|
|
"string.regex": {
|
|
"color": "#828040"
|
|
},
|
|
"string.special": {
|
|
"color": "#d19a66"
|
|
},
|
|
"string.special.symbol": {
|
|
"color": "#d19a66"
|
|
},
|
|
"tag": {
|
|
"color": "#929292"
|
|
},
|
|
"text.literal": {
|
|
"color": "#d19a66"
|
|
},
|
|
"title": {
|
|
"color": "#929292",
|
|
"font_weight": 600
|
|
},
|
|
"type": {
|
|
"color": "#929292"
|
|
},
|
|
"property": {
|
|
"color": "#abb2bf"
|
|
},
|
|
"variable.special": {
|
|
"color": "#e06c75"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
]
|
|
}
|