github/inji-wallet
1
1
Fork 0
mirror of https://github.com/mosip/inji-wallet.git synced 2026-01-09 13:38:01 -05:00
Code Issues Packages Projects Releases Wiki Activity

Inji 453 restricted uin error message misaligned (#1139)

Browse Source 
* [INJI-453] fix Idinput error message alignment issue

Signed-off-by: Sri Kanth Kola <srikanthsri7447@gmail.com>

* [INJI-453] fix input field width in folded device

Signed-off-by: Sri Kanth Kola <srikanthsri7447@gmail.com>

---------

Signed-off-by: Sri Kanth Kola <srikanthsri7447@gmail.com>
This commit is contained in:
srikanth716
2024-01-05 16:08:21 +05:30
committed by GitHub
parent 4296e57c00
commit 074ae549bc
4 changed files with 60 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.talismanrc
View File

@@ -100,4 +100,7 @@ fileignoreconfig:
- filename: .github/workflows/internal-build.yml
checksum: e9b85cf0405d777faee9345269f6f9eb861ed205728dca63cf27a5db79c876a7
- filename: assets/Issuer_search_clearing_button.svg
checksum: f4e8a054fc4168e08bc9e9fe3e644cebabacdfc31ef0cbe36dd281766f47df5e
checksum: f4e8a054fc4168e08bc9e9fe3e644cebabacdfc31ef0cbe36dd281766f47df5e
- filename: screens/Home/MyVcs/IdInputModal.tsx
checksum: 7ee46d8ef4761c0e9b59f3e602e6e30be5f47221817c819e91ab10ca2203089f
version: ""

15
components/ui/themes/DefaultTheme.ts
View File

@@ -531,14 +531,21 @@ export const DefaultTheme = {
idInputPicker: {
width: Dimensions.get('window').width * 0.32,
borderBottomWidth: 1,
marginBottom: 2,
borderColor: isIOS() ? 'transparent' : Colors.Grey,
bottom: isIOS() ? 50 : 24,
bottom: isIOS() ? 50 : 20,
height: isIOS() ? 100 : 'auto',
},
idInputBottom: {
position: 'relative',
bottom: 14,
borderBottomColor: Colors.Orange,
borderBottomWidth: 1,
minWidth: 180,
},
idInput: {
position: 'relative',
bottom: 14,
minWidth: 180,
},
getId: {
justifyContent: 'center',
@@ -693,9 +700,13 @@ export const DefaultTheme = {
lineHeight: 18,
},
error: {
position: 'absolute',
top: 24,
left: 5,
color: Colors.Red,
fontFamily: 'Inter_600SemiBold',
fontSize: 12,
minWidth: 200,
},
base: {
color: Colors.Black,

15
components/ui/themes/PurpleTheme.ts
View File

@@ -534,14 +534,21 @@ export const PurpleTheme = {
idInputPicker: {
width: Dimensions.get('window').width * 0.32,
borderBottomWidth: 1,
marginBottom: 2,
borderColor: isIOS() ? 'transparent' : Colors.Grey,
bottom: isIOS() ? 50 : 24,
bottom: isIOS() ? 50 : 20,
height: isIOS() ? 100 : 'auto',
},
idInputBottom: {
position: 'relative',
bottom: 14,
borderBottomColor: Colors.Purple,
borderBottomWidth: 1,
minWidth: 200,
},
idInput: {
position: 'relative',
bottom: 14,
minWidth: 200,
},
getId: {
justifyContent: 'center',
@@ -696,9 +703,13 @@ export const PurpleTheme = {
lineHeight: 18,
},
error: {
position: 'absolute',
top: 24,
left: 5,
color: Colors.Red,
fontFamily: 'Inter_600SemiBold',
fontSize: 12,
minWidth: 200,
},
base: {
color: Colors.Black,

58
screens/Home/MyVcs/IdInputModal.tsx
View File

@@ -1,18 +1,12 @@
import React from 'react';
import {Icon, Input} from 'react-native-elements';
import {Input} from 'react-native-elements';
import {Picker} from '@react-native-picker/picker';
import {Button, Column, Row, Text} from '../../../components/ui';
import {Modal} from '../../../components/ui/Modal';
import {Theme} from '../../../components/ui/styleUtils';
import {IdInputModalProps, useIdInputModal} from './IdInputModalController';
import {useTranslation} from 'react-i18next';
import {
Dimensions,
I18nManager,
KeyboardAvoidingView,
Platform,
TextInput,
} from 'react-native';
import {I18nManager, KeyboardAvoidingView, TextInput} from 'react-native';
import {TouchableOpacity} from 'react-native';
import {individualId, isIOS} from '../../../shared/constants';
import {GET_INDIVIDUAL_ID} from '../../../shared/constants';
@@ -40,7 +34,7 @@ export const IdInputModal: React.FC<IdInputModalProps> = props => {
return (
<Modal
onDismiss={dismissInput}
testID="retreiveIdHeader"
testID="retrieveIdHeader"
isVisible={props.isVisible}
onShow={setIndividualID}
headerTitle={t('header')}
@@ -56,7 +50,7 @@ export const IdInputModal: React.FC<IdInputModalProps> = props => {
style={Theme.TextStyles.retrieveIdLabel}>
{t('guideLabel')}
</Text>
<Row crossAlign="flex-end" style={Theme.Styles.idInputContainer}>
<Row crossAlign="center" style={Theme.Styles.idInputContainer}>
<Column style={Theme.Styles.idInputPicker}>
<Picker
{...testIDProps('selectIdTypePicker')}
@@ -66,24 +60,32 @@ export const IdInputModal: React.FC<IdInputModalProps> = props => {
<Picker.Item label="VID" value="VID" />
</Picker>
</Column>
<Input
{...testIDProps('idInputModalIndividualId')}
placeholder={!controller.id ? inputLabel : ''}
inputContainerStyle={
controller.id ? Theme.Styles.idInputBottom : null
}
inputStyle={{
textAlign: I18nManager.isRTL ? 'right' : 'left',
fontWeight: '700',
}}
selectionColor={Theme.Colors.Cursor}
value={controller.id}
keyboardType="number-pad"
errorStyle={Theme.TextStyles.error}
errorMessage={controller.idError}
onChangeText={controller.INPUT_ID}
ref={setIdInputRef}
/>
<Column
align="center"
style={{
height: 150,
}}>
<Input
{...testIDProps('idInputModalIndividualId')}
placeholder={!controller.id ? inputLabel : ''}
inputContainerStyle={
controller.id
? Theme.Styles.idInputBottom
: Theme.Styles.idInput
}
inputStyle={{
textAlign: I18nManager.isRTL ? 'right' : 'left',
fontWeight: '700',
}}
selectionColor={Theme.Colors.Cursor}
value={controller.id}
keyboardType="number-pad"
errorStyle={Theme.TextStyles.error}
errorMessage={controller.idError}
onChangeText={controller.INPUT_ID}
ref={setIdInputRef}
/>
</Column>
</Row>
</Column>
<Column>