Drop color tints from glass effects — rendering as solid blocks, not glass
Rune caught this live too: content is now visible (last commit fixed that), but the tinted glass (.regular.tint(.blue) etc.) rendered as a solid, opaque, saturated color block instead of translucent frosted glass — looked like a plain filled button, not Liquid Glass. Dropped .tint() from all four Phase 1 conversions (tabButton, mcpSidebarRow, and ModelSelectorView's filter/category/favorites/sort chips) — the selection/active signal already comes from the icon/text foreground color turning blue (or yellow, or the category color), which was untouched by any of this. The glass itself is now always .regular with no tint. tabButton's unselected state also switched from .buttonStyle(.glass) to .buttonStyle(.plain) — restores the original "only the selected tab shows any background" look, since with the tint gone a plain .glass button style for every tab would visually flatten the selected/unselected distinction back down to icon color alone.
This commit is contained in:
@@ -121,10 +121,7 @@ struct ModelSelectorView: View {
|
|||||||
.font(.caption)
|
.font(.caption)
|
||||||
.padding(.horizontal, 10)
|
.padding(.horizontal, 10)
|
||||||
.padding(.vertical, 6)
|
.padding(.vertical, 6)
|
||||||
.glassEffect(
|
.glassEffect(.regular, in: .rect(cornerRadius: 6))
|
||||||
selectedCategory != nil ? .regular.tint(selectedCategory!.color) : .regular,
|
|
||||||
in: .rect(cornerRadius: 6)
|
|
||||||
)
|
|
||||||
.foregroundColor(selectedCategory != nil ? selectedCategory!.color : .secondary)
|
.foregroundColor(selectedCategory != nil ? selectedCategory!.color : .secondary)
|
||||||
}
|
}
|
||||||
.buttonStyle(.plain)
|
.buttonStyle(.plain)
|
||||||
@@ -144,7 +141,7 @@ struct ModelSelectorView: View {
|
|||||||
.font(.caption)
|
.font(.caption)
|
||||||
.padding(.horizontal, 10)
|
.padding(.horizontal, 10)
|
||||||
.padding(.vertical, 6)
|
.padding(.vertical, 6)
|
||||||
.glassEffect(filterFavorites ? .regular.tint(.yellow) : .regular, in: .rect(cornerRadius: 6))
|
.glassEffect(.regular, in: .rect(cornerRadius: 6))
|
||||||
.foregroundColor(filterFavorites ? .yellow : .secondary)
|
.foregroundColor(filterFavorites ? .yellow : .secondary)
|
||||||
}
|
}
|
||||||
.buttonStyle(.plain)
|
.buttonStyle(.plain)
|
||||||
@@ -172,7 +169,7 @@ struct ModelSelectorView: View {
|
|||||||
.font(.caption)
|
.font(.caption)
|
||||||
.padding(.horizontal, 10)
|
.padding(.horizontal, 10)
|
||||||
.padding(.vertical, 6)
|
.padding(.vertical, 6)
|
||||||
.glassEffect(sortOrder != .default ? .regular.tint(.blue) : .regular, in: .rect(cornerRadius: 6))
|
.glassEffect(.regular, in: .rect(cornerRadius: 6))
|
||||||
.foregroundColor(sortOrder != .default ? .blue : .secondary)
|
.foregroundColor(sortOrder != .default ? .blue : .secondary)
|
||||||
}
|
}
|
||||||
.menuStyle(.borderlessButton)
|
.menuStyle(.borderlessButton)
|
||||||
@@ -297,7 +294,7 @@ struct FilterToggle: View {
|
|||||||
.font(.caption)
|
.font(.caption)
|
||||||
.padding(.horizontal, 10)
|
.padding(.horizontal, 10)
|
||||||
.padding(.vertical, 6)
|
.padding(.vertical, 6)
|
||||||
.glassEffect(isOn ? .regular.tint(.blue) : .regular, in: .rect(cornerRadius: 6))
|
.glassEffect(.regular, in: .rect(cornerRadius: 6))
|
||||||
.foregroundColor(isOn ? .blue : .secondary)
|
.foregroundColor(isOn ? .blue : .secondary)
|
||||||
}
|
}
|
||||||
.buttonStyle(.plain)
|
.buttonStyle(.plain)
|
||||||
|
|||||||
@@ -639,7 +639,9 @@ It's better to admit "I need more information" or "I cannot do that" than to fak
|
|||||||
Button(action: { selectedMCPSubsection = section }) {
|
Button(action: { selectedMCPSubsection = section }) {
|
||||||
Group {
|
Group {
|
||||||
if selectedMCPSubsection == section {
|
if selectedMCPSubsection == section {
|
||||||
mcpSidebarRowLabel(section).glassEffect(.regular.tint(.blue), in: .rect(cornerRadius: 8))
|
// Untinted — see tabButton's comment on why a colored tint here renders
|
||||||
|
// as a near-opaque block instead of translucent glass.
|
||||||
|
mcpSidebarRowLabel(section).glassEffect(.regular, in: .rect(cornerRadius: 8))
|
||||||
} else {
|
} else {
|
||||||
mcpSidebarRowLabel(section)
|
mcpSidebarRowLabel(section)
|
||||||
}
|
}
|
||||||
@@ -3322,16 +3324,18 @@ It's better to admit "I need more information" or "I cannot do that" than to fak
|
|||||||
let selected = selectedTab == tag
|
let selected = selectedTab == tag
|
||||||
Group {
|
Group {
|
||||||
if selected {
|
if selected {
|
||||||
|
// Untinted glass — the blue comes from the icon/text foreground color below,
|
||||||
|
// not the glass itself. A colored tint here renders as a near-opaque solid
|
||||||
|
// block rather than translucent glass (found live, see CLAUDE.md's gotcha).
|
||||||
Button(action: { selectedTab = tag }) {
|
Button(action: { selectedTab = tag }) {
|
||||||
tabButtonLabel(icon: icon, label: label, beta: beta, selected: true)
|
tabButtonLabel(icon: icon, label: label, beta: beta, selected: true)
|
||||||
}
|
}
|
||||||
.buttonStyle(.glassProminent)
|
.buttonStyle(.glass)
|
||||||
.tint(.blue)
|
|
||||||
} else {
|
} else {
|
||||||
Button(action: { selectedTab = tag }) {
|
Button(action: { selectedTab = tag }) {
|
||||||
tabButtonLabel(icon: icon, label: label, beta: beta, selected: false)
|
tabButtonLabel(icon: icon, label: label, beta: beta, selected: false)
|
||||||
}
|
}
|
||||||
.buttonStyle(.glass)
|
.buttonStyle(.plain)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.buttonBorderShape(.roundedRectangle(radius: 8))
|
.buttonBorderShape(.roundedRectangle(radius: 8))
|
||||||
|
|||||||
Reference in New Issue
Block a user