diff --git a/app/assets/css/app.css b/app/assets/css/app.css
index 713d9b3c2..f56036ede 100644
--- a/app/assets/css/app.css
+++ b/app/assets/css/app.css
@@ -245,7 +245,6 @@ a[ng-click] {
cursor: pointer;
border: 1px solid var(--border-blocklist);
border-radius: 8px;
- box-shadow: var(--shadow-box-color);
margin-right: 10px;
}
diff --git a/app/assets/css/bootstrap-override.css b/app/assets/css/bootstrap-override.css
index 973ea1248..34da9b868 100644
--- a/app/assets/css/bootstrap-override.css
+++ b/app/assets/css/bootstrap-override.css
@@ -1,4 +1,15 @@
/* Label, Section Title */
+.label {
+ border-radius: 5px;
+}
+
+.label-success {
+ background-color: var(--ui-success-7);
+}
+
+.label-danger {
+ background-color: var(--ui-error-6);
+}
.control-label {
color: var(--ui-gray-7);
diff --git a/app/assets/ico/memory.svg b/app/assets/ico/memory.svg
index 02239685a..18ec35887 100644
--- a/app/assets/ico/memory.svg
+++ b/app/assets/ico/memory.svg
@@ -1,3 +1 @@
-
+
\ No newline at end of file
diff --git a/app/assets/ico/object-group.svg b/app/assets/ico/object-group.svg
index 31d6ab27a..7cdd8081a 100644
--- a/app/assets/ico/object-group.svg
+++ b/app/assets/ico/object-group.svg
@@ -1,3 +1 @@
-
+
\ No newline at end of file
diff --git a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentIcon.tsx b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentIcon.tsx
index d55dcc223..d301f3d93 100644
--- a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentIcon.tsx
+++ b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentIcon.tsx
@@ -5,6 +5,8 @@ import dockerEdge from '@/assets/images/edge_endpoint.png';
import kube from '@/assets/images/kubernetes_endpoint.png';
import kubeEdge from '@/assets/images/kubernetes_edge_endpoint.png';
import { EnvironmentType } from '@/portainer/environments/types';
+import azure from '@/assets/ico/vendor/azure.svg';
+import docker from '@/assets/ico/vendor/docker.svg';
interface Props {
type: EnvironmentType;
@@ -12,6 +14,15 @@ interface Props {
export function EnvironmentIcon({ type }: Props) {
switch (type) {
+ case EnvironmentType.AgentOnDocker:
+ case EnvironmentType.Docker:
+ return (
+
+ );
+ case EnvironmentType.Azure:
+ return (
+
+ );
case EnvironmentType.EdgeAgentOnDocker:
return (
diff --git a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentItem.tsx b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentItem.tsx
index 569d681b6..cb608f438 100644
--- a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentItem.tsx
+++ b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentItem.tsx
@@ -1,5 +1,6 @@
import clsx from 'clsx';
import _ from 'lodash';
+import { Edit2, Tag, Cpu } from 'react-feather';
import {
isoDateFromTimestamp,
@@ -16,8 +17,9 @@ import type { TagId } from '@/portainer/tags/types';
import { useIsAdmin } from '@/portainer/hooks/useUser';
import { useTags } from '@/portainer/tags/queries';
-import { Button } from '@@/buttons';
+import { Icon } from '@@/Icon';
import { Link } from '@@/Link';
+import { Button } from '@@/buttons';
import { EnvironmentIcon } from './EnvironmentIcon';
import { EdgeIndicator } from './EdgeIndicator';
@@ -91,24 +93,35 @@ export function EnvironmentItem({ environment, onClick, groupName }: Props) {
-
+
{isDockerEnvironment(environment.Type) && (
{environment.Snapshots.length > 0 && (
-
-
- {environment.Snapshots[0].TotalCPU}
-
- {humanize(environment.Snapshots[0].TotalMemory)}
-
- {environment.Gpus?.length}
+
+
+ {environment.Snapshots[0].TotalCPU} CPU
+
+ {humanize(environment.Snapshots[0].TotalMemory)} RAM
+
+ {environment.Gpus?.length} GPU
)}
- -
)}
-
-
+
+
{tags}
@@ -129,7 +142,7 @@ export function EnvironmentItem({ environment, onClick, groupName }: Props) {
className={styles.editButton}
>
)}
diff --git a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsDocker.tsx b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsDocker.tsx
index dc1f99329..34e68e910 100644
--- a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsDocker.tsx
+++ b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsDocker.tsx
@@ -1,3 +1,5 @@
+import { Zap } from 'react-feather';
+
import {
DockerSnapshot,
EnvironmentType,
@@ -24,16 +26,18 @@ export function EnvironmentStatsDocker({ snapshots = [], type }: Props) {
return (
-
+
{!!snapshot.Swarm && (
)}
@@ -43,21 +47,34 @@ export function EnvironmentStatsDocker({ snapshots = [], type }: Props) {
healthy={snapshot.HealthyContainerCount}
unhealthy={snapshot.UnhealthyContainerCount}
/>
-
-
-
+
+
-
+
{snapshot.Swarm ? 'Swarm' : 'Standalone'}
{snapshot.DockerVersion}
{type === EnvironmentType.AgentOnDocker && (
- + Agent
+ +{' '}
+ {' '}
+ Agent
)}
{snapshot.Swarm && (
-
+
)}
@@ -80,15 +97,37 @@ function ContainerStats({
const containersCount = running + stopped;
return (
-
+
{containersCount > 0 && (
-
- -
-
-
- /
-
-
+
+
+
+
+
)}
diff --git a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsItem.tsx b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsItem.tsx
index fba65790d..62cc3aeae 100644
--- a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsItem.tsx
+++ b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsItem.tsx
@@ -1,3 +1,4 @@
+import clsx from 'clsx';
import { PropsWithChildren } from 'react';
import { Icon, IconProps } from '@/react/components/Icon';
@@ -5,6 +6,7 @@ import { Icon, IconProps } from '@/react/components/Icon';
interface Props extends IconProps {
value: string | number;
icon: string;
+ iconClass?: string;
}
export function Stat({
@@ -12,10 +14,15 @@ export function Stat({
icon,
children,
featherIcon,
+ iconClass,
}: PropsWithChildren) {
return (
-
-
+
+
{value}
{children && {children}}
diff --git a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsKubernetes.tsx b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsKubernetes.tsx
index 4ff6ea003..88f2ae1c3 100644
--- a/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsKubernetes.tsx
+++ b/app/portainer/home/EnvironmentList/EnvironmentItem/EnvironmentStatsKubernetes.tsx
@@ -21,17 +21,23 @@ export function EnvironmentStatsKubernetes({ snapshots = [] }: Props) {
return (
-
-
+
+
+
-
+
Kubernetes {snapshot.KubernetesVersion}
-
+
);
diff --git a/app/portainer/home/EnvironmentList/EnvironmentList.tsx b/app/portainer/home/EnvironmentList/EnvironmentList.tsx
index 2cf6e9856..4ef8e02d6 100644
--- a/app/portainer/home/EnvironmentList/EnvironmentList.tsx
+++ b/app/portainer/home/EnvironmentList/EnvironmentList.tsx
@@ -277,7 +277,7 @@ export function EnvironmentList({ onClickItem, onRefresh }: Props) {