1
0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-09-03 14:22:41 +02:00

Upgrade responsive UI

This commit is contained in:
Kamran Ahmed
2025-06-10 17:37:10 +01:00
parent 474dd14631
commit 74b203bb8f
3 changed files with 8 additions and 6 deletions

View File

@@ -53,7 +53,7 @@ function ChatHeaderButton(props: ChatHeaderButtonProps) {
return (
<span className={classNames}>
{icon}
{children && <span>{children}</span>}
{children && <span className="hidden sm:block">{children}</span>}
</span>
);
}
@@ -67,7 +67,7 @@ function ChatHeaderButton(props: ChatHeaderButtonProps) {
className={classNames}
>
{icon}
{children && <span>{children}</span>}
{children && <span className="hidden sm:block">{children}</span>}
</a>
);
}
@@ -75,7 +75,7 @@ function ChatHeaderButton(props: ChatHeaderButtonProps) {
return (
<button onClick={onClick} className={classNames}>
{icon}
{children && <span>{children}</span>}
{children && <span className="hidden sm:block">{children}</span>}
</button>
);
}
@@ -123,7 +123,7 @@ function UsageButton(props: UsageButtonProps) {
onClick={onUpgradeClick}
className="flex items-center gap-2 rounded-md px-3 py-1.5 text-xs font-medium transition-all hover:bg-yellow-200"
>
<div className="flex items-center gap-1.5">
<div className="hidden items-center gap-1.5 sm:flex">
<div className="h-1.5 w-6 overflow-hidden rounded-full bg-gray-200">
<div
className={cn(

View File

@@ -67,7 +67,7 @@ export function RoadmapTopicList(props: RoadmapTopicListProps) {
return (
<div className="relative my-6 flex flex-wrap gap-1 first:mt-0 last:mb-0">
{progressItemWithText.map((item) => {
const labelParts = item.text.split(' > ');
const labelParts = item.text.split(' > ').slice(-2);
const labelPartCount = labelParts.length;
return (

View File

@@ -114,7 +114,9 @@ export function useRoadmapAIChat(options: Options) {
roadmapId={roadmapId}
onTopicClick={(topicId, text) => {
const title = text.split(' > ').pop();
if (title) onSelectTopic(topicId, title);
if (title) {
onSelectTopic(topicId, title);
}
}}
{...opts}
/>