Skip to content

fix: brand cleanup #47

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Jun 3, 2025
Merged

fix: brand cleanup #47

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
4c20908
fix: theme toggle uses brand colours now
nickytonline Jun 3, 2025
cd54830
fix: cleaned up brand colours for user prompt
nickytonline Jun 3, 2025
7290f63
fix: updated colours for chat message/icon
nickytonline Jun 3, 2025
bc3d9f2
fix: logo no longer shifts on hover
nickytonline Jun 3, 2025
ed20e73
fix: fixed foreground for loading models
nickytonline Jun 3, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 3 additions & 6 deletions src/components/ChatMessage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export function ChatMessage({ message, isLoading }: ChatMessageProps) {
{!isUserMessage && (
<div
className={cn(
'flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md bg-indigo-100 text-indigo-600 dark:bg-indigo-900 dark:text-indigo-300',
'flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md bg-gray-100 text-gray-900 dark:bg-gray-800 dark:text-gray-100',
isLoading && 'animate-[pulse_1.5s_ease-in-out_infinite] opacity-80',
)}
>
Expand All @@ -45,10 +45,7 @@ export function ChatMessage({ message, isLoading }: ChatMessageProps) {
>
<div
className={cn(
'rounded-2xl px-4 py-2 text-sm w-full',
isUserMessage
? 'bg-indigo-600 text-white dark:bg-indigo-500'
: 'bg-gray-100 text-gray-900 dark:bg-gray-800 dark:text-gray-100',
'rounded-2xl px-4 py-2 text-sm w-full bg-gray-100 text-gray-900 dark:bg-gray-800 dark:text-gray-100',
)}
>
<div className="prose prose-sm dark:prose-invert max-w-none break-words break-all whitespace-pre-wrap">
Expand Down Expand Up @@ -91,7 +88,7 @@ export function ChatMessage({ message, isLoading }: ChatMessageProps) {
</div>

{isUserMessage && (
<div className="flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md bg-indigo-100 text-indigo-600 dark:bg-indigo-900 dark:text-indigo-300">
<div className="flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md bg-gray-100 text-gray-900 dark:bg-gray-800 dark:text-gray-100">
<User className="h-5 w-5" />
</div>
)}
Expand Down
2 changes: 1 addition & 1 deletion src/components/Header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ const Header: React.FC = () => {
<img
src={isDark ? '/pomerium-icon.svg' : '/pomerium-icon.png'}
alt="Pomerium Logo"
className="w-8 hover:-translate-y-0.5 transition-all"
className="w-8 transition-all"
/>
</a>
<Link to="/">
Expand Down
9 changes: 7 additions & 2 deletions src/components/ModelSelect.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,18 @@ export function ModelSelect({ value, onValueChange }: ModelSelectProps) {
const { data: models, isLoading } = useModels()

if (isLoading) {
return <div>Loading models...</div>
return (
<div className="text-sm text-primary-foreground">Loading models...</div>
)
}

return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" className="w-fit max-w-[100px] md:max-w-[240px] justify-between">
<Button
variant="outline"
className="w-fit max-w-[100px] md:max-w-[240px] justify-between"
>
<span className="truncate block max-w-[160px] overflow-hidden whitespace-nowrap">
{value || 'Select a model'}
</span>
Expand Down
2 changes: 1 addition & 1 deletion src/components/ThemeToggle.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ export function ThemeToggle() {
{isDarkMode ? (
<Sun className="size-5 text-amber-400" />
) : (
<Moon className="size-5 text-blue-500" />
<Moon className="size-5 text-primary" />
)}
</Button>
)
Expand Down