Skip to content

Commit 7e0d876

Browse files
jankeromnesjankeromnes
committed
[dashboard] Minor UI fixes in Account, Variables, Teams, Workspaces, Start pages
1 parent 2ba533e commit 7e0d876

File tree

8 files changed

+13
-23
lines changed

8 files changed

+13
-23
lines changed

‎components/dashboard/src/settings/Account.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ export default function Account() {
4545

4646
<SettingsPage title='Account' subtitle='Manage account and git configuration.'>
4747
<h3>Profile</h3>
48-
<p className="text-base text-gray-500 pb-4">The following information will be used to set up git configuration. You can override git author name and email per project by using the default environment variables <span className="text-gray--300 bg-gray-100 px-1.5 py-1 rounded-md text-sm font-mono font-medium">GIT_AUTHOR_NAME</span> and <span className="text-gray--300 bg-gray-100 px-1.5 py-1 rounded-md text-sm font-mono font-medium">GIT_COMMITTER_EMAIL</span>.</p>
48+
<p className="text-base text-gray-500 pb-4 max-w-2xl">The following information will be used to set up git configuration. You can override git author name and email per project by using the default environment variables <span className="text-gray--300 bg-gray-100 px-1.5 py-1 rounded-md text-sm font-mono font-medium">GIT_AUTHOR_NAME</span> and <span className="text-gray--300 bg-gray-100 px-1.5 py-1 rounded-md text-sm font-mono font-medium">GIT_COMMITTER_EMAIL</span>.</p>
4949
<div className="flex flex-col lg:flex-row">
5050
<div>
5151
<div className="mt-4">

‎components/dashboard/src/settings/EnvironmentVariables.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ function AddEnvVarModal(p: EnvVarModalProps) {
5252
return <Modal visible={true} onClose={p.onClose} onEnter={save}>
5353
<h3 className="mb-4">{isNew ? 'New' : 'Edit'} Variable</h3>
5454
<div className="border-t border-b -mx-6 px-6 py-4 flex flex-col">
55-
{error ? <div className="bg-gitpod-kumquat-light rounded-md p-3 text-red-500 text-sm mb-2">
55+
{error ? <div className="bg-gitpod-kumquat-light rounded-md p-3 text-gitpod-red text-sm mb-2">
5656
{error}
5757
</div> : null}
5858
<div>

‎components/dashboard/src/settings/Teams.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -461,7 +461,7 @@ function AllTeams() {
461461
</div>
462462
)}
463463
</div>
464-
<div className="my-auto flex w-1/12 pl-8 opacity-0 group-hover:opacity-100">
464+
<div className="my-auto flex w-1/12 pl-8 mr-4 opacity-0 group-hover:opacity-100">
465465
<div className="self-center hover:bg-gray-200 rounded-md cursor-pointer w-8">
466466
<ContextMenu menuEntries={subscriptionMenu(sub)}>
467467
<img className="w-8 h-8 p-1" src={ThreeDots} alt="Actions" />

‎components/dashboard/src/start/CreateWorkspace.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ export default class CreateWorkspace extends React.Component<CreateWorkspaceProp
7777
break;
7878
case ErrorCodes.NOT_FOUND:
7979
statusMessage = <div className="text-center">
80-
<p className="text-base text-red-500">Not found: {contextUrl}</p>
80+
<p className="text-base text-gitpod-red">Not found: {contextUrl}</p>
8181
</div>;
8282
break;
8383
case ErrorCodes.PLAN_DOES_NOT_ALLOW_PRIVATE_REPOS:
@@ -105,7 +105,7 @@ export default class CreateWorkspace extends React.Component<CreateWorkspaceProp
105105
</LimitReachedModal>;
106106
break;
107107
default:
108-
statusMessage = <p className="text-base text-red-500 w-96">Unknown Error: {JSON.stringify(this.state?.error, null, 2)}</p>;
108+
statusMessage = <p className="text-base text-gitpod-red w-96">Unknown Error: {JSON.stringify(this.state?.error, null, 2)}</p>;
109109
break;
110110
}
111111
}

‎components/dashboard/src/start/StartPage.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -93,5 +93,5 @@ function StartError(props: { error: StartWorkspaceError }) {
9393
if (!error) {
9494
return null;
9595
}
96-
return <p className="text-base text-red-500">{error.message}</p>;
96+
return <p className="text-base text-gitpod-red">{error.message}</p>;
9797
}

‎components/dashboard/src/start/StartWorkspace.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -175,7 +175,7 @@ export default class StartWorkspace extends React.Component<StartWorkspaceProps,
175175
let title = !error ? undefined : 'Oh, no! Something went wrong!';
176176
let statusMessage = !error
177177
? <p className="text-base text-gray-400">Preparing workspace …</p>
178-
: <p className="text-base text-red-500 w-96">{error.message}</p>;
178+
: <p className="text-base text-gitpod-red w-96">{error.message}</p>;
179179

180180
switch (this.state?.workspaceInstance?.status.phase) {
181181
// unknown indicates an issue within the system in that it cannot determine the actual phase of
@@ -239,7 +239,7 @@ export default class StartWorkspace extends React.Component<StartWorkspaceProps,
239239
<div className="rounded-full w-3 h-3 text-sm bg-gitpod-kumquat">&nbsp;</div>
240240
<div>
241241
<p className="text-gray-700 font-semibold">{this.state.workspaceInstance.workspaceId}</p>
242-
<a target="_parent" href={this.state.workspace?.contextURL}><p className="w-56 truncate hover:underline" >{this.state.workspace?.contextURL}</p></a>
242+
<a target="_parent" href={this.state.workspace?.contextURL}><p className="w-56 truncate hover:text-blue-600" >{this.state.workspace?.contextURL}</p></a>
243243
</div>
244244
</div>
245245
<div className="mt-10 flex justify-center">
@@ -262,7 +262,7 @@ export default class StartWorkspace extends React.Component<StartWorkspaceProps,
262262
<div className="rounded-full w-3 h-3 text-sm bg-gray-300">&nbsp;</div>
263263
<div>
264264
<p className="text-gray-700 font-semibold">{this.state.workspaceInstance.workspaceId}</p>
265-
<a target="_parent" href={this.state.workspace?.contextURL}><p className="w-56 truncate hover:underline" >{this.state.workspace?.contextURL}</p></a>
265+
<a target="_parent" href={this.state.workspace?.contextURL}><p className="w-56 truncate hover:text-blue-600" >{this.state.workspace?.contextURL}</p></a>
266266
</div>
267267
</div>
268268
<PendingChangesDropdown workspaceInstance={this.state.workspaceInstance} />

‎components/dashboard/src/workspaces/WorkspaceEntry.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ export function WorkspaceEntry({ desc, model }: { desc: WorkspaceInfo, model: Wo
130130
numberOfChanges > 0 ?
131131
<div className={"text-sm text-red-600 truncate cursor-pointer bg-red-50 group-hover:bg-red-100 hover:text-red-800 px-1.5 py-0.5 relative rounded-md -top-0.5"} onClick={showChanges}>{changesLabel}</div>
132132
:
133-
<div className="text-sm text-gray-500 truncate ">No Changes</div>
133+
<div className="text-sm text-gray-400 truncate ">No Changes</div>
134134
}
135135
</div>
136136
</div>

‎components/dashboard/src/workspaces/Workspaces.tsx

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
import React from "react";
88
import { WhitelistedRepository, Workspace, WorkspaceInfo } from "@gitpod/gitpod-protocol";
99
import Header from "../components/Header";
10-
import DropDown from "../components/DropDown"
10+
import DropDown from "../components/DropDown";
11+
import exclamation from "../images/exclamation.svg";
1112
import { WorkspaceModel } from "./workspace-model";
1213
import { WorkspaceEntry } from "./WorkspaceEntry";
1314
import { getGitpodService, gitpodHostUrl } from "../service/service";
@@ -115,18 +116,7 @@ export default class Workspaces extends React.Component<WorkspacesProps, Workspa
115116
wsModel.active || wsModel.searchTerm ? null :
116117
<div className="whitespace-nowrap flex space-x-2 py-6 px-6 w-full justify-between bg-gitpod-kumquat-light rounded-xl">
117118
<div className="pr-3 self-center w-6">
118-
<div className="relative rounded-full w-3 h-3 bg-red">
119-
<div className="absolute text-xs text-gray-100"
120-
style={{
121-
left: "5px",
122-
top: "-2px"
123-
}}
124-
ref={(node) => {
125-
if (node) {
126-
node.style.setProperty("font-size", "10px", "important");
127-
}
128-
}}>!</div>
129-
</div>
119+
<img src={exclamation} />
130120
</div>
131121
<div className="flex-1 flex flex-col overflow-x-auto">
132122
<div className="text-red font-semibold">Garbage Collection</div>

0 commit comments

Comments
 (0)