martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-03-13 00:50:03 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

updated sort icon

Browse Source
This commit is contained in:
Roland Osborne 2022-10-28 10:03:57 -07:00
parent 1bc883aa58
commit 8484b4212e
2 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
app/mobile/src/session/cards/Cards.jsx
View File

@ -3,7 +3,8 @@ import { FlatList, ScrollView, View, TextInput, TouchableOpacity, Text } from 'r
import { styles } from './Cards.styled'; import { styles } from './Cards.styled';
import { useCards } from './useCards.hook'; import { useCards } from './useCards.hook';
import { SafeAreaView } from 'react-native-safe-area-context'; import { SafeAreaView } from 'react-native-safe-area-context';
import Ionicons from '@expo/vector-icons/AntDesign'; import AntIcons from '@expo/vector-icons/AntDesign';
import MatIcons from '@expo/vector-icons/MaterialCommunityIcons';
import { CardItem } from './cardItem/CardItem'; import { CardItem } from './cardItem/CardItem';
import Colors from 'constants/Colors'; import Colors from 'constants/Colors';
import { useNavigation } from '@react-navigation/native'; import { useNavigation } from '@react-navigation/native';
@ -15,22 +16,22 @@ export function CardsTitle({ state, actions, openRegistry }) {
<View style={styles.title}> <View style={styles.title}>
{ state.sorting && ( { state.sorting && (
<TouchableOpacity style={styles.sort} onPress={actions.unsort}> <TouchableOpacity style={styles.sort} onPress={actions.unsort}>
<Ionicons style={styles.icon} name="menufold" size={18} color={Colors.text} /> <MatIcons style={styles.icon} name="sort-alphabetical-ascending" size={18} color={Colors.text} />
</TouchableOpacity> </TouchableOpacity>
)} )}
{ !state.sorting && ( { !state.sorting && (
<TouchableOpacity style={styles.sort} onPress={actions.sort}> <TouchableOpacity style={styles.sort} onPress={actions.sort}>
<Ionicons style={styles.icon} name="menufold" size={18} color={Colors.disabled} /> <MatIcons style={styles.icon} name="sort-alphabetical-ascending" size={18} color={Colors.disabled} />
</TouchableOpacity> </TouchableOpacity>
)} )}
<View style={styles.inputwrapper}> <View style={styles.inputwrapper}>
<Ionicons style={styles.icon} name="search1" size={16} color={Colors.disabled} /> <AntIcons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
<TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter} <TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter}
autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" /> autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" />
<View style={styles.space} /> <View style={styles.space} />
</View> </View>
<TouchableOpacity style={styles.add} onPress={() => openRegistry(navigation)}> <TouchableOpacity style={styles.add} onPress={() => openRegistry(navigation)}>
<Ionicons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/> <AntIcons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
<Text style={styles.newtext}>New</Text> <Text style={styles.newtext}>New</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
@ -66,22 +67,22 @@ export function Cards({ openRegistry, openContact }) {
<View style={styles.topbar}> <View style={styles.topbar}>
{ state.sorting && ( { state.sorting && (
<TouchableOpacity style={styles.sort} onPress={actions.unsort}> <TouchableOpacity style={styles.sort} onPress={actions.unsort}>
<Ionicons style={styles.icon} name="menufold" size={18} color={Colors.text} /> <AntIcons style={styles.icon} name="menufold" size={18} color={Colors.text} />
</TouchableOpacity> </TouchableOpacity>
)} )}
{ !state.sorting && ( { !state.sorting && (
<TouchableOpacity style={styles.sort} onPress={actions.sort}> <TouchableOpacity style={styles.sort} onPress={actions.sort}>
<Ionicons style={styles.icon} name="menufold" size={18} color={Colors.disabled} /> <AntIcons style={styles.icon} name="menufold" size={18} color={Colors.disabled} />
</TouchableOpacity> </TouchableOpacity>
)} )}
<View style={styles.inputwrapper}> <View style={styles.inputwrapper}>
<Ionicons style={styles.icon} name="search1" size={16} color={Colors.disabled} /> <AntIcons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
<TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter} <TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter}
autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" /> autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" />
<View style={styles.space} /> <View style={styles.space} />
</View> </View>
<TouchableOpacity style={styles.add} onPress={openRegistry}> <TouchableOpacity style={styles.add} onPress={openRegistry}>
<Ionicons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/> <AntIcons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
<Text style={styles.newtext}>New</Text> <Text style={styles.newtext}>New</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
@ -106,21 +107,21 @@ export function Cards({ openRegistry, openContact }) {
<SafeAreaView edges={['top', 'right']} style={styles.searchbar}> <SafeAreaView edges={['top', 'right']} style={styles.searchbar}>
{ state.sorting && ( { state.sorting && (
<TouchableOpacity style={styles.sort} onPress={actions.unsort}> <TouchableOpacity style={styles.sort} onPress={actions.unsort}>
<Ionicons style={styles.icon} name="menufold" size={18} color={Colors.text} /> <AntIcons style={styles.icon} name="menufold" size={18} color={Colors.text} />
</TouchableOpacity> </TouchableOpacity>
)} )}
{ !state.sorting && ( { !state.sorting && (
<TouchableOpacity style={styles.sort} onPress={actions.sort}> <TouchableOpacity style={styles.sort} onPress={actions.sort}>
<Ionicons style={styles.icon} name="menufold" size={18} color={Colors.disabled} /> <AntIcons style={styles.icon} name="menufold" size={18} color={Colors.disabled} />
</TouchableOpacity> </TouchableOpacity>
)} )}
<View style={styles.inputwrapper}> <View style={styles.inputwrapper}>
<Ionicons style={styles.icon} name="search1" size={16} color={Colors.disabled} /> <AntIcons style={styles.icon} name="search1" size={16} color={Colors.disabled} />
<TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter} <TextInput style={styles.inputfield} value={state.filter} onChangeText={actions.setFilter}
autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" /> autoCapitalize="none" placeholderTextColor={Colors.disabled} placeholder="Contacts" />
</View> </View>
<TouchableOpacity style={styles.add} onPress={openRegistry}> <TouchableOpacity style={styles.add} onPress={openRegistry}>
<Ionicons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/> <AntIcons name={'adduser'} size={16} color={Colors.white} style={[styles.box, { transform: [ { rotateY: "180deg" }, ]} ]}/>
</TouchableOpacity> </TouchableOpacity>
</SafeAreaView> </SafeAreaView>
</View> </View>

1
app/mobile/src/session/cards/Cards.styled.js
View File

@ -99,7 +99,6 @@ export const styles = StyleSheet.create({
}, },
sort: { sort: {
paddingRight: 12, paddingRight: 12,
transform: [ { rotate: "270deg" }, ]
}, },
findarea: { findarea: {
borderTopWidth: 1, borderTopWidth: 1,