From f4c5843e509398425d615930caaf9a16ed0bcb06 Mon Sep 17 00:00:00 2001 From: xSamiVS Date: Thu, 29 Feb 2024 17:13:32 +0100 Subject: [PATCH] Bottom Centered - TextUI --- package/client/resource/interface/textui.ts | 2 +- resource/interface/client/textui.lua | 2 +- web/src/features/textui/TextUI.tsx | 9 ++++++--- web/src/typings/textui.ts | 2 +- 4 files changed, 9 insertions(+), 6 deletions(-) diff --git a/package/client/resource/interface/textui.ts b/package/client/resource/interface/textui.ts index a82a94ab..063419c1 100644 --- a/package/client/resource/interface/textui.ts +++ b/package/client/resource/interface/textui.ts @@ -4,7 +4,7 @@ import { CSSProperties } from 'react'; type IconAnimation = 'spin' | 'spinPulse' | 'spinReverse' | 'pulse' | 'beat' | 'fade' | 'beatFade' | 'bounce' | 'shake'; interface OptionsProps { - position?: 'right-center' | 'left-center' | 'top-center'; + position?: 'right-center' | 'left-center' | 'top-center' | 'bottom-center'; icon?: IconName | [IconPrefix, IconName]; iconColor?: string; iconAnimation?: IconAnimation; diff --git a/resource/interface/client/textui.lua b/resource/interface/client/textui.lua index fccda1ef..26ab240d 100644 --- a/resource/interface/client/textui.lua +++ b/resource/interface/client/textui.lua @@ -1,5 +1,5 @@ ---@class TextUIOptions ----@field position? 'right-center' | 'left-center' | 'top-center'; +---@field position? 'right-center' | 'left-center' | 'top-center' | 'bottom-center'; ---@field icon? string | {[1]: IconProp, [2]: string}; ---@field iconColor? string; ---@field style? string | table; diff --git a/web/src/features/textui/TextUI.tsx b/web/src/features/textui/TextUI.tsx index 5da9882f..6bf937c4 100644 --- a/web/src/features/textui/TextUI.tsx +++ b/web/src/features/textui/TextUI.tsx @@ -14,9 +14,12 @@ const useStyles = createStyles((theme, params: { position?: TextUiPosition }) => width: '100%', position: 'absolute', display: 'flex', - alignItems: params.position === 'top-center' ? 'baseline' : 'center', - justifyContent: - params.position === 'right-center' ? 'flex-end' : params.position === 'left-center' ? 'flex-start' : 'center', + alignItems: + params.position === 'top-center' ? 'baseline' : + params.position === 'bottom-center' ? 'flex-end' : 'center', + justifyContent: + params.position === 'right-center' ? 'flex-end' : + params.position === 'left-center' ? 'flex-start' : 'center', }, container: { fontSize: 16, diff --git a/web/src/typings/textui.ts b/web/src/typings/textui.ts index 54348f1e..ae45e841 100644 --- a/web/src/typings/textui.ts +++ b/web/src/typings/textui.ts @@ -2,7 +2,7 @@ import { IconProp } from '@fortawesome/fontawesome-svg-core'; import React from 'react'; import { IconAnimation } from '../components/LibIcon'; -export type TextUiPosition = 'right-center' | 'left-center' | 'top-center'; +export type TextUiPosition = 'right-center' | 'left-center' | 'top-center' | 'bottom-center'; export interface TextUiProps { text: string;