FumeNodes/ox_lib
1
0
Fork 0
mirror of https://github.com/CommunityOx/ox_lib.git synced 2026-08-18 23:46:03 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(web/textui) bottom center position(#507)

Browse Source
This commit is contained in:
xSamiVS
2024-03-09 11:04:18 +01:00
committed by GitHub
parent 0c470f249a
commit d8578281ee
4 changed files with 9 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package/client/resource/interface/textui.ts
View File

@@ -4,7 +4,7 @@ import { CSSProperties } from 'react';
type IconAnimation = 'spin' | 'spinPulse' | 'spinReverse' | 'pulse' | 'beat' | 'fade' | 'beatFade' | 'bounce' | 'shake'; type IconAnimation = 'spin' | 'spinPulse' | 'spinReverse' | 'pulse' | 'beat' | 'fade' | 'beatFade' | 'bounce' | 'shake';
interface OptionsProps { interface OptionsProps {
position?: 'right-center' | 'left-center' | 'top-center'; position?: 'right-center' | 'left-center' | 'top-center' | 'bottom-center';
icon?: IconName | [IconPrefix, IconName]; icon?: IconName | [IconPrefix, IconName];
iconColor?: string; iconColor?: string;
iconAnimation?: IconAnimation; iconAnimation?: IconAnimation;

2
resource/interface/client/textui.lua
View File

@@ -1,5 +1,5 @@
---@class TextUIOptions ---@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 icon? string | {[1]: IconProp, [2]: string};
---@field iconColor? string; ---@field iconColor? string;
---@field style? string | table; ---@field style? string | table;

9
web/src/features/textui/TextUI.tsx
View File

@@ -14,9 +14,12 @@ const useStyles = createStyles((theme, params: { position?: TextUiPosition }) =>
width: '100%', width: '100%',
position: 'absolute', position: 'absolute',
display: 'flex', display: 'flex',
alignItems: params.position === 'top-center' ? 'baseline' : 'center', alignItems:
justifyContent: params.position === 'top-center' ? 'baseline' :
params.position === 'right-center' ? 'flex-end' : params.position === 'left-center' ? 'flex-start' : 'center', params.position === 'bottom-center' ? 'flex-end' : 'center',
justifyContent:
params.position === 'right-center' ? 'flex-end' :
params.position === 'left-center' ? 'flex-start' : 'center',
}, },
container: { container: {
fontSize: 16, fontSize: 16,

2
web/src/typings/textui.ts
View File

@@ -2,7 +2,7 @@ import { IconProp } from '@fortawesome/fontawesome-svg-core';
import React from 'react'; import React from 'react';
import { IconAnimation } from '../components/LibIcon'; 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 { export interface TextUiProps {
text: string; text: string;