Docker/portainer
Docker/portainer
1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-07-23 07:19:41 +02:00
Code Issues Releases Activity

Fix(UI) Update UI of docker dashboard EE-3845 (#7422)

Browse source 
* EE-3846 fix alignment of left-hand side of fields
This commit is contained in:
Rex Wang 2022-08-05 10:17:31 +08:00 • committed by GitHub
parent 8d733ccc8c
commit 69a824c25b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 50 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

44
app/react/docker/DashboardView/ContainerStatus.tsx
View file

@ -1,3 +1,7 @@
import clsx from 'clsx';
import { Icon } from '@/react/components/Icon';
import { DockerContainer } from '../containers/types';
interface Props {
@ -10,28 +14,44 @@ export function useContainerStatusComponent(containers: DockerContainer[]) {
export function ContainerStatus({ containers }: Props) {
return (
<>
<div className="pull-right pl-1">
<div>
<i className="fa fa-power-off space-right green-icon" />
<div className="pull-right">
<div>
<div className="vertical-center space-right pr-5">
<Icon
icon="power"
className={clsx('icon icon-sm icon-success')}
feather
/>
{runningContainersFilter(containers)} running
</div>
<div>
<i className="fa fa-power-off space-right red-icon" />
<div className="vertical-center space-right">
<Icon
icon="power"
className={clsx('icon icon-sm icon-danger')}
feather
/>
{stoppedContainersFilter(containers)} stopped
</div>
</div>
<div className="pull-right pr-5">
<div>
<i className="fa fa-heartbeat space-right green-icon" />
<div>
<div className="vertical-center space-right pr-5">
<Icon
icon="heart"
className={clsx('icon icon-sm icon-success')}
feather
/>
{healthyContainersFilter(containers)} healthy
</div>
<div>
<i className="fa fa-heartbeat space-right orange-icon" />
<div className="vertical-center space-right">
<Icon
icon="heart"
className={clsx('icon icon-sm icon-danger')}
feather
/>
{unhealthyContainersFilter(containers)} unhealthy
</div>
</div>
</>
</div>
);
}