diff options
Diffstat (limited to 'apps/website/src')
-rw-r--r-- | apps/website/src/components/page/branding/BrandingImage.astro | 3 | ||||
-rw-r--r-- | apps/website/src/pages/branding.astro | 8 |
2 files changed, 9 insertions, 2 deletions
diff --git a/apps/website/src/components/page/branding/BrandingImage.astro b/apps/website/src/components/page/branding/BrandingImage.astro index f85364d..e112691 100644 --- a/apps/website/src/components/page/branding/BrandingImage.astro +++ b/apps/website/src/components/page/branding/BrandingImage.astro @@ -2,6 +2,7 @@ interface Props { type: 'badges' | 'logos' | 'mods' name: string + nameFormatted?: string altText?: string extensions?: ('png' | 'svg')[] maxWidth?: number @@ -12,6 +13,7 @@ const { name, type, altText, + nameFormatted, background = 'white', maxWidth = 300, extensions = ['png', 'svg'], @@ -27,4 +29,5 @@ const path = `/media/branding/${type}/${name}`; ))} </div> <img style={`max-width: ${maxWidth}px;`} src={`${path}.svg`} alt={altText}> + {nameFormatted && <span class="absolute bottom-0 left-1/2 -translate-x-1/2 opacity-50 text-xxs">{nameFormatted}</span>} </div> diff --git a/apps/website/src/pages/branding.astro b/apps/website/src/pages/branding.astro index d1e05b4..e367f3b 100644 --- a/apps/website/src/pages/branding.astro +++ b/apps/website/src/pages/branding.astro @@ -5,7 +5,11 @@ import Section from '@components/base/Section.astro'; import BrandingImage from '@components/page/branding/BrandingImage.astro'; import Layout from '@layouts/Layout.astro'; -const mods = ['behindyou', 'chatting', 'crashpatch', 'damagetint', 'evergreenhud', 'glintcolorizer', 'keystrokes', 'overflowanimations', 'polyblur', 'polynametag', 'polysprint', 'polytime', 'polyweather', 'vanillahud']; +const mods = ['behind_you', 'chatting', 'crash_patch', 'damage_tint', 'evergreen_h_u_d', 'glint_colorizer', 'keystrokes', 'overflow_animations', 'poly_blur', 'poly_nametag', 'poly_sprint', 'poly_time', 'poly_weather', 'vanilla_h_u_d']; + +function formatModName(name: string): string { + return name.split('_').map(word => word.charAt(0).toUpperCase() + word.slice(1)).join(''); +} --- <Layout> @@ -105,7 +109,7 @@ const mods = ['behindyou', 'chatting', 'crashpatch', 'damagetint', 'evergreenhud </Paragraph> <div class="my-4 flex flex-row flex-wrap gap-2 text-white"> {mods.map(mod => ( - <BrandingImage background="transparent" name={mod} type="mods" /> + <BrandingImage nameFormatted={formatModName(mod)} background="transparent" name={mod} type="mods" /> ))} </div> </div> |