github.com/argoproj/argo-cd/v2@v2.10.9/ui/src/app/applications/components/resource-icon.tsx (about)

     1  import * as React from 'react';
     2  import {resourceIcons} from './resources';
     3  
     4  export const ResourceIcon = ({kind, customStyle}: {kind: string; customStyle?: React.CSSProperties}) => {
     5      if (kind === 'node') {
     6          return <img src={'assets/images/infrastructure_components/' + kind + '.svg'} alt={kind} style={{padding: '2px', width: '40px', height: '32px', ...customStyle}} />;
     7      }
     8      const i = resourceIcons.get(kind);
     9      if (i !== undefined) {
    10          return <img src={'assets/images/resources/' + i + '.svg'} alt={kind} style={{padding: '2px', width: '40px', height: '32px', ...customStyle}} />;
    11      }
    12      if (kind === 'Application') {
    13          return <i title={kind} className={`icon argo-icon-application`} style={customStyle} />;
    14      }
    15      const initials = kind.replace(/[a-z]/g, '');
    16      const n = initials.length;
    17      const style: React.CSSProperties = {
    18          display: 'inline-block',
    19          verticalAlign: 'middle',
    20          padding: `${n <= 2 ? 2 : 0}px 4px`,
    21          width: '32px',
    22          height: '32px',
    23          borderRadius: '50%',
    24          backgroundColor: '#8FA4B1',
    25          textAlign: 'center',
    26          lineHeight: '30px',
    27          ...customStyle
    28      };
    29      return (
    30          <div style={style}>
    31              <span style={{color: 'white', fontSize: `${n <= 2 ? 1 : 0.6}em`}}>{initials}</span>
    32          </div>
    33      );
    34  };