github-starred/komodo
2
0
Fork 1
mirror of https://github.com/moghtech/komodo.git synced 2026-03-11 17:44:19 -05:00
Code Issues 258 Packages Projects Releases 10 Wiki Activity

responsive tweaks

Browse Source
This commit is contained in:
mbecker20
2025-10-19 20:07:30 -07:00
parent 0c6276c677
commit a707028277
4 changed files with 87 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/resources/action/config.tsx
View File

@@ -296,7 +296,7 @@ export const ActionConfig = ({ id }: { id: string }) => {
<div className="text-nowrap text-muted-foreground text-sm">
Listen on branch:
</div>
<div className="flex items-center gap-3">
<div className="flex items-center gap-3 flex-wrap">
<Input
placeholder="Branch"
value={branch}

159
frontend/src/components/resources/procedure/config.tsx
View File

@@ -170,83 +170,82 @@ export const ProcedureConfig = ({ id }: { id: string }) => {
components: {
stages: (stages, set) => (
<div className="flex flex-col gap-4">
{stages &&
stages.map((stage, index) => (
<Stage
key={index}
stage={stage}
setStage={(stage) =>
set({
stages: stages.map((s, i) =>
index === i ? stage : s
),
})
}
removeStage={() =>
set({
stages: stages.filter((_, i) => index !== i),
})
}
moveUp={
index === 0
? undefined
: () =>
set({
stages: stages.map((stage, i) => {
// Make sure its not the first row
if (i === index && index !== 0) {
return stages[index - 1];
} else if (i === index - 1) {
// Reverse the entry, moving this row "Up"
return stages[index];
} else {
return stage;
}
}),
})
}
moveDown={
index === stages.length - 1
? undefined
: () =>
set({
stages: stages.map((stage, i) => {
// The index also cannot be the last index, which cannot be moved down
if (
i === index &&
index !== stages.length - 1
) {
return stages[index + 1];
} else if (i === index + 1) {
// Move the row "Down"
return stages[index];
} else {
return stage;
}
}),
})
}
insertAbove={() =>
set({
stages: [
...stages.slice(0, index),
new_stage(index + 1),
...stages.slice(index),
],
})
}
insertBelow={() =>
set({
stages: [
...stages.slice(0, index + 1),
new_stage(index + 2),
...stages.slice(index + 1),
],
})
}
disabled={disabled}
/>
))}
{stages?.map((stage, index) => (
<Stage
key={index}
stage={stage}
setStage={(stage) =>
set({
stages: stages.map((s, i) =>
index === i ? stage : s
),
})
}
removeStage={() =>
set({
stages: stages.filter((_, i) => index !== i),
})
}
moveUp={
index === 0
? undefined
: () =>
set({
stages: stages.map((stage, i) => {
// Make sure its not the first row
if (i === index && index !== 0) {
return stages[index - 1];
} else if (i === index - 1) {
// Reverse the entry, moving this row "Up"
return stages[index];
} else {
return stage;
}
}),
})
}
moveDown={
index === stages.length - 1
? undefined
: () =>
set({
stages: stages.map((stage, i) => {
// The index also cannot be the last index, which cannot be moved down
if (
i === index &&
index !== stages.length - 1
) {
return stages[index + 1];
} else if (i === index + 1) {
// Move the row "Down"
return stages[index];
} else {
return stage;
}
}),
})
}
insertAbove={() =>
set({
stages: [
...stages.slice(0, index),
new_stage(index + 1),
...stages.slice(index),
],
})
}
insertBelow={() =>
set({
stages: [
...stages.slice(0, index + 1),
new_stage(index + 2),
...stages.slice(index + 1),
],
})
}
disabled={disabled}
/>
))}
<Button
variant="secondary"
onClick={add_stage}
@@ -373,7 +372,7 @@ export const ProcedureConfig = ({ id }: { id: string }) => {
<div className="text-nowrap text-muted-foreground text-sm">
Listen on branch:
</div>
<div className="flex items-center gap-3">
<div className="flex items-center gap-3 flex-wrap">
<Input
placeholder="Branch"
value={branch}
@@ -442,11 +441,11 @@ const Stage = ({
}) => {
return (
<Card className="p-4 flex flex-col gap-4">
<div className="flex justify-between items-center">
<div className="flex justify-between items-center gap-2 flex-wrap">
<Input
value={stage.name}
onChange={(e) => setStage({ ...stage, name: e.target.value })}
className="w-[300px] text-md"
className="w-[250px] text-md"
/>
<div className="flex gap-4 items-center">
<div>Enabled:</div>

4
frontend/src/components/topbar/components.tsx
View File

@@ -42,7 +42,7 @@ import { Button } from "@ui/button";
import { Link } from "react-router-dom";
import {
cn,
RESOURCE_TARGETS,
SIDEBAR_RESOURCES,
usableResourcePath,
version_is_none,
} from "@lib/utils";
@@ -130,7 +130,7 @@ export const MobileDropdown = () => {
<DropdownMenuSeparator />
{RESOURCE_TARGETS.map((type) => {
{SIDEBAR_RESOURCES.map((type) => {
const RTIcon = ResourceComponents[type].Icon;
const name = type === "ResourceSync" ? "Sync" : type;
return (

14
frontend/src/pages/settings/core-info.tsx
View File

@@ -17,10 +17,12 @@ export const CoreInfo = () => {
const info = useRead("GetCoreInfo", {}).data;
return (
<div className="flex gap-4 items-center flex-wrap w-fit pb-4 border-b-2">
<div className="font-mono bg-secondary px-2 py-1 rounded-md">
<div className="font-mono bg-secondary px-2.5 py-1.5 rounded-md">
{info?.title}
</div>
|
<div className="text-muted-foreground">|</div>
<AllInfo />
<div className="text-muted-foreground">|</div>
<div className="flex gap-3 items-center flex-wrap">
<div className="text-muted-foreground">Public Key</div>
<Input
@@ -30,8 +32,6 @@ export const CoreInfo = () => {
/>
<CopyButton content={info?.public_key} />
</div>
<div className="gap-3 items-center">|</div>
<AllInfo />
</div>
);
};
@@ -42,11 +42,7 @@ const AllInfo = () => {
return (
<Dialog open={open} onOpenChange={setOpen}>
<DialogTrigger asChild>
<Button
variant="secondary"
size="icon"
className="gap-2 items-center"
>
<Button variant="secondary" size="icon" className="gap-2 items-center">
<Info className="w-4 h-4" />
</Button>
</DialogTrigger>