BigBlueButton/bigbluebutton-tablet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #39 from gustavo-em/inline_text

Browse Source 
Leaving the text on just one line
This commit is contained in:
Tiago Jacobs 2022-04-29 15:07:34 -03:00 committed by GitHub
commit d9f182e9c6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 99 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
react-native/app/pages/list_portals/component.tsx
View File

@ -1,6 +1,7 @@
import AsyncStorage from '@react-native-async-storage/async-storage'; import AsyncStorage from '@react-native-async-storage/async-storage';
import React from 'react'; import React from 'react';
import { import {
BlockTextWithoutPortal,
ButtonDelete, ButtonDelete,
ButtonOpen, ButtonOpen,
DivButtonDelete, DivButtonDelete,
@ -160,16 +161,18 @@ export const ListPortals = ({navigation}: IListPortalsDTO) => {
/> />
) : ( ) : (
<> <>
<BlockTextWithoutPortal>
<TextWithoutPortal> <TextWithoutPortal>
{i18next.t('mobileApp.portals.list.empty.addFirstPortal.label')} {i18next.t('mobileApp.portals.list.empty.addFirstPortal.label')+' '}
</TextWithoutPortal> <TextWithoutPortal onPress={() => onPressTextCreateDemoServer()} color={true}>
<TouchableOpacity onPress={() => onPressTextCreateDemoServer()}>
<TextWithoutPortal color={true}>
{i18next.t( {i18next.t(
'mobileApp.portals.list.empty.orUseOurDemoServer.label', 'mobileApp.portals.list.empty.orUseOurDemoServer.label',
)} )}
</TextWithoutPortal> </TextWithoutPortal>
</TouchableOpacity>
</TextWithoutPortal>
</BlockTextWithoutPortal>
</> </>
)} )}
</WrapperListContainer> </WrapperListContainer>

59
react-native/app/pages/list_portals/styles.ts
View File

@ -1,12 +1,9 @@
import styled from 'styled-components/native' import styled from 'styled-components/native';
import { colors } from '../../styles/colors'; import {colors} from '../../styles/colors';
import { TouchableOpacity } from 'react-native-gesture-handler';
import { SwipeListView } from 'react-native-swipe-list-view';
export const WrapperListContainer = styled.SafeAreaView` export const WrapperListContainer = styled.SafeAreaView`
background-color: ${colors.secundary}; background-color: ${colors.secundary};
flex: 1 ; flex: 1;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
`; `;
@ -16,12 +13,11 @@ export const WrapperList = styled.FlatList`
width: 95%; width: 95%;
border-radius: 10px; border-radius: 10px;
` `;
export const WrapperItemListText = styled.TouchableOpacity.attrs(props=>({ export const WrapperItemListText = styled.TouchableOpacity.attrs(props => ({
activeOpacity: 1 activeOpacity: 1,
}))` }))`
width: 300px; width: 300px;
padding: 5px; padding: 5px;
margin: 3% auto; margin: 3% auto;
@ -31,7 +27,7 @@ export const WrapperItemListText = styled.TouchableOpacity.attrs(props=>({
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
` `;
export const WrapperItemListView = styled.View` export const WrapperItemListView = styled.View`
display: flex; display: flex;
flex: 1; flex: 1;
@ -43,28 +39,24 @@ export const WrapperItemListView = styled.View`
text-align: center; text-align: center;
height: 100px; height: 100px;
width: 200px; width: 200px;
`;
`
export const ItemList = styled.Text` export const ItemList = styled.Text`
color: #fff; color: #fff;
padding: 2px; padding: 2px;
font-size: 16px; font-size: 16px;
font-weight: ${(props)=>(props.bold ? 'bold': 'normal')}; font-weight: ${props => (props.bold ? 'bold' : 'normal')};
`;
`
export const TextItem = styled.Text` export const TextItem = styled.Text`
font-size: 18px; font-size: 18px;
` `;
export const WrapperViewAdd = styled.View` export const WrapperViewAdd = styled.View`
background-color: ${colors.primary}; background-color: ${colors.primary};
margin: 70px 0px 0px 0px; margin: 70px 0px 0px 0px;
`;
`
export const ButtonOpen = styled.TouchableOpacity` export const ButtonOpen = styled.TouchableOpacity`
padding: 10px; padding: 10px;
@ -75,22 +67,26 @@ export const ButtonOpen = styled.TouchableOpacity`
align-items: center; align-items: center;
justify-content: center; justify-content: center;
`;
`
export const TextButtonOpen = styled.Text` export const TextButtonOpen = styled.Text`
color: #fff; color: #fff;
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
` `;
export const TextWithoutPortal = styled.Text` export const TextWithoutPortal = styled.Text`
color: ${(props)=> (props.color ? colors.primary_light: colors.primary)}; color: ${props => (props.color ? colors.primary_light : colors.primary)};
font-size: 20px; font-size: 20px;
text-align: center; text-align: center;
` display: flex;
`;
export const BlockTextWithoutPortal = styled.View`
flex-direction: row;
padding: 20px;
max-width: 100%;
`;
export const ButtonDelete = styled.TouchableOpacity` export const ButtonDelete = styled.TouchableOpacity`
background-color: ${colors.white}; background-color: ${colors.white};
@ -103,8 +99,7 @@ export const ButtonDelete = styled.TouchableOpacity`
align-items: center; align-items: center;
flex-direction: row; flex-direction: row;
`;
`
export const DivButtonDelete = styled.View` export const DivButtonDelete = styled.View`
width: 100px; width: 100px;
@ -113,12 +108,10 @@ export const DivButtonDelete = styled.View`
margin: 3% 0px; margin: 3% 0px;
align-content: center; align-content: center;
justify-items: center; justify-items: center;
`;
`
export const DivDelete = styled.View` export const DivDelete = styled.View`
width: 300px; width: 300px;
justify-content: flex-end; justify-content: flex-end;
align-items: flex-end; align-items: flex-end;
` `;