Replace logo with custom ASCII (#958)

This commit is contained in:
Miguel Solorio
2025-06-13 00:59:45 -07:00
committed by GitHub
parent 95e4a60a83
commit f8a31f29aa
4 changed files with 79 additions and 25 deletions

View File

@@ -0,0 +1,27 @@
/**
* @license
* Copyright 2025 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
export const shortAsciiLogo = `
█████████ ██████████ ██████ ██████ █████ ██████ █████ █████
███░░░░░███░░███░░░░░█░░██████ ██████ ░░███ ░░██████ ░░███ ░░███
███ ░░░ ░███ █ ░ ░███░█████░███ ░███ ░███░███ ░███ ░███
░███ ░██████ ░███░░███ ░███ ░███ ░███░░███░███ ░███
░███ █████ ░███░░█ ░███ ░░░ ░███ ░███ ░███ ░░██████ ░███
░░███ ░░███ ░███ ░ █ ░███ ░███ ░███ ░███ ░░█████ ░███
░░█████████ ██████████ █████ █████ █████ █████ ░░█████ █████
░░░░░░░░░ ░░░░░░░░░░ ░░░░░ ░░░░░ ░░░░░ ░░░░░ ░░░░░ ░░░░░
`;
export const longAsciiLogo = `
███ █████████ ██████████ ██████ ██████ █████ ██████ █████ █████
░░░███ ███░░░░░███░░███░░░░░█░░██████ ██████ ░░███ ░░██████ ░░███ ░░███
░░░███ ███ ░░░ ░███ █ ░ ░███░█████░███ ░███ ░███░███ ░███ ░███
░░░███ ░███ ░██████ ░███░░███ ░███ ░███ ░███░░███░███ ░███
███░ ░███ █████ ░███░░█ ░███ ░░░ ░███ ░███ ░███ ░░██████ ░███
███░ ░░███ ░░███ ░███ ░ █ ░███ ░███ ░███ ░███ ░░█████ ░███
███░ ░░█████████ ██████████ █████ █████ █████ █████ ░░█████ █████
░░░ ░░░░░░░░░ ░░░░░░░░░░ ░░░░░ ░░░░░ ░░░░░ ░░░░░ ░░░░░ ░░░░░
`;

View File

@@ -8,30 +8,39 @@ import React from 'react';
import { Box, Text } from 'ink';
import Gradient from 'ink-gradient';
import { Colors } from '../colors.js';
const asciiArtLogo = `
██████╗ ███████╗███╗ ███╗██╗███╗ ██╗██╗
██╔════╝ ██╔════╝████╗ ████║██║████╗ ██║██║
██║ ███╗█████╗ ██╔████╔██║██║██╔██╗ ██║██║
██║ ██║██╔══╝ ██║╚██╔╝██║██║██║╚██╗██║██║
╚██████╔╝███████╗██║ ╚═╝ ██║██║██║ ╚████║██║
╚═════╝ ╚══════╝╚═╝ ╚═╝╚═╝╚═╝ ╚═══╝╚═╝
`;
import { shortAsciiLogo, longAsciiLogo } from './AsciiArt.js';
import { getAsciiArtWidth } from '../utils/textUtils.js';
interface HeaderProps {
title?: string;
customAsciiArt?: string; // For user-defined ASCII art
terminalWidth: number; // For responsive logo
}
export const Header: React.FC<HeaderProps> = ({ title = asciiArtLogo }) => (
<>
<Box marginBottom={1} alignItems="flex-start">
{Colors.GradientColors ? (
<Gradient colors={Colors.GradientColors}>
<Text>{title}</Text>
</Gradient>
) : (
<Text>{title}</Text>
)}
</Box>
</>
);
export const Header: React.FC<HeaderProps> = ({
customAsciiArt,
terminalWidth,
}) => {
let displayTitle;
const widthOfLongLogo = getAsciiArtWidth(longAsciiLogo);
if (customAsciiArt) {
displayTitle = customAsciiArt;
} else {
displayTitle =
terminalWidth >= widthOfLongLogo ? longAsciiLogo : shortAsciiLogo;
}
return (
<>
<Box marginBottom={1} alignItems="flex-start">
{Colors.GradientColors ? (
<Gradient colors={Colors.GradientColors}>
<Text>{displayTitle}</Text>
</Gradient>
) : (
<Text>{displayTitle}</Text>
)}
</Box>
</>
);
};