small improvements throughout app
|
@ -32,6 +32,7 @@ const Event = ({item}) => {
|
||||||
const [visible, setVisible] = useState(false)
|
const [visible, setVisible] = useState(false)
|
||||||
const date = item.item.date.split('-')
|
const date = item.item.date.split('-')
|
||||||
const today = new Date(getCurrentDate())
|
const today = new Date(getCurrentDate())
|
||||||
|
const week = new Date().setDate(new Date().getDate() - 8)
|
||||||
const itemDate = new Date(item.item.date)
|
const itemDate = new Date(item.item.date)
|
||||||
|
|
||||||
const extra = (
|
const extra = (
|
||||||
|
@ -56,7 +57,7 @@ const Event = ({item}) => {
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
else {
|
else if (itemDate >= week){
|
||||||
return (
|
return (
|
||||||
<TouchableOpacity style={{backgroundColor: '#e3e3e3', padding: 15, borderBottomWidth: 1, borderColor: 'black', width: '100%',}} onPress={()=>setVisible(!visible)} activeOpacity={0.8}>
|
<TouchableOpacity style={{backgroundColor: '#e3e3e3', padding: 15, borderBottomWidth: 1, borderColor: 'black', width: '100%',}} onPress={()=>setVisible(!visible)} activeOpacity={0.8}>
|
||||||
<View style = {{display: 'flex', flexDirection: 'row', alignContent: 'center', justifyContent: 'space-between'}}>
|
<View style = {{display: 'flex', flexDirection: 'row', alignContent: 'center', justifyContent: 'space-between'}}>
|
||||||
|
@ -72,7 +73,11 @@ const Event = ({item}) => {
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
else {
|
||||||
|
return (
|
||||||
|
null
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class Calendar extends React.Component {
|
class Calendar extends React.Component {
|
||||||
|
|
33
app/Images.js
Normal file
|
@ -0,0 +1,33 @@
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
import {
|
||||||
|
SafeAreaView,
|
||||||
|
StyleSheet,
|
||||||
|
ScrollView,
|
||||||
|
View,
|
||||||
|
Text,
|
||||||
|
StatusBar,
|
||||||
|
Modal,
|
||||||
|
TouchableHighlight,
|
||||||
|
Image,
|
||||||
|
} from 'react-native';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Header,
|
||||||
|
LearnMoreLinks,
|
||||||
|
Colors,
|
||||||
|
DebugInstructions,
|
||||||
|
ReloadInstructions,
|
||||||
|
} from 'react-native/Libraries/NewAppScreen';
|
||||||
|
import styles from './styles/morestyles'
|
||||||
|
|
||||||
|
const Images = {
|
||||||
|
sslopps: require('./assets/sslopps.png'),
|
||||||
|
lunch: require('./assets/lunch.png'),
|
||||||
|
settings:require('./assets/settings.png'),
|
||||||
|
challenge:require('./assets/challenge.png'),
|
||||||
|
student:require('./assets/student.png'),
|
||||||
|
announcements:require('./assets/announcements.png'),
|
||||||
|
resources:require('./assets/resources.png'),
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Images;
|
32
app/More.js
|
@ -7,7 +7,8 @@ import {
|
||||||
Text,
|
Text,
|
||||||
StatusBar,
|
StatusBar,
|
||||||
FlatList,
|
FlatList,
|
||||||
TouchableOpacity
|
TouchableOpacity,
|
||||||
|
Image,
|
||||||
} from 'react-native';
|
} from 'react-native';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
@ -28,6 +29,8 @@ import StudentWeek from './StudentWeek'
|
||||||
import SSLOps, {SSLInfo} from './SSLOps'
|
import SSLOps, {SSLInfo} from './SSLOps'
|
||||||
import LunchEvents, {LunchInfo} from './LunchEvents'
|
import LunchEvents, {LunchInfo} from './LunchEvents'
|
||||||
import ChallengeWeek from './ChallengeWeek'
|
import ChallengeWeek from './ChallengeWeek'
|
||||||
|
import Settings from './Settings'
|
||||||
|
import Images from './Images'
|
||||||
import LinearGradient from 'react-native-linear-gradient'
|
import LinearGradient from 'react-native-linear-gradient'
|
||||||
|
|
||||||
const Stack = createStackNavigator()
|
const Stack = createStackNavigator()
|
||||||
|
@ -43,15 +46,18 @@ class MoreSwitch extends React.Component {
|
||||||
<View style={{flex:1,backgroundColor:'red'}}>
|
<View style={{flex:1,backgroundColor:'red'}}>
|
||||||
<FlatList
|
<FlatList
|
||||||
data={[
|
data={[
|
||||||
{name:"Announcements",key:"announce"},
|
{name:"Announcements",key:"announce", img:Images.announcements},
|
||||||
{name:"Resources",key:"resources"},
|
{name:"Resources",key:"resources", img:Images.resources},
|
||||||
{name:"Student of the Week",key:"studentweek"},
|
{name:"Student of the Week",key:"studentweek", img:Images.student},
|
||||||
{name:"Lunch Events",key:"lunchevent"},
|
{name:"Lunch Events",key:"lunchevent", img:Images.lunch},
|
||||||
{name:"SSL Opportunities",key:"sslops"},
|
{name:"SSL Opportunities",key:"sslopps", img:Images.sslopps},
|
||||||
{name:"Challenge of the Week",key:"challengeweek"},
|
{name:"Challenge of the Week",key:"challengeweek", img:Images.challenge},
|
||||||
|
{name:"Settings", key:"settings", img: Images.settings},
|
||||||
]}
|
]}
|
||||||
renderItem={({item})=>
|
renderItem={({item})=>
|
||||||
|
|
||||||
<TouchableOpacity style={styles.moreitem} onPress={()=>this.props.navigation.navigate(item.key)}>
|
<TouchableOpacity style={styles.moreitem} onPress={()=>this.props.navigation.navigate(item.key)}>
|
||||||
|
<Image source = {item.img} style = {{height: 40, width: 40, marginRight: 10}}/>
|
||||||
<Text style={styles.moretext}>{item.name}</Text>
|
<Text style={styles.moretext}>{item.name}</Text>
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
}
|
}
|
||||||
|
@ -121,7 +127,7 @@ class More extends React.Component {
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
name="sslops"
|
name="sslopps"
|
||||||
component={SSLOps}
|
component={SSLOps}
|
||||||
options={{
|
options={{
|
||||||
title:'SSL Opportunities',
|
title:'SSL Opportunities',
|
||||||
|
@ -140,6 +146,16 @@ class More extends React.Component {
|
||||||
headerBackground: ()=>background
|
headerBackground: ()=>background
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
<Stack.Screen
|
||||||
|
name="settings"
|
||||||
|
component={Settings}
|
||||||
|
options={{
|
||||||
|
title:'Settings',
|
||||||
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
||||||
|
headerLeft:null,
|
||||||
|
headerBackground: ()=>background
|
||||||
|
}}
|
||||||
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
name="TeacherList"
|
name="TeacherList"
|
||||||
component={TeacherList}
|
component={TeacherList}
|
||||||
|
|
41
app/Settings.js
Normal file
|
@ -0,0 +1,41 @@
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
import {
|
||||||
|
SafeAreaView,
|
||||||
|
StyleSheet,
|
||||||
|
ScrollView,
|
||||||
|
View,
|
||||||
|
Text,
|
||||||
|
StatusBar,
|
||||||
|
Modal,
|
||||||
|
TouchableHighlight,
|
||||||
|
Image,
|
||||||
|
} from 'react-native';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Header,
|
||||||
|
LearnMoreLinks,
|
||||||
|
Colors,
|
||||||
|
DebugInstructions,
|
||||||
|
ReloadInstructions,
|
||||||
|
} from 'react-native/Libraries/NewAppScreen';
|
||||||
|
import styles from './styles/morestyles'
|
||||||
|
|
||||||
|
|
||||||
|
class Settings extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props)
|
||||||
|
this.state = {
|
||||||
|
data: [],
|
||||||
|
isLoading:true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<View>
|
||||||
|
|
||||||
|
</View>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
export default Settings;
|
BIN
app/assets/announcements.png
Normal file
After Width: | Height: | Size: 5.3 KiB |
BIN
app/assets/challenge.png
Normal file
After Width: | Height: | Size: 5.1 KiB |
Before Width: | Height: | Size: 6.2 KiB After Width: | Height: | Size: 5.8 KiB |
BIN
app/assets/resources.png
Normal file
After Width: | Height: | Size: 5.2 KiB |
BIN
app/assets/settings.png
Normal file
After Width: | Height: | Size: 6.2 KiB |
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 5.8 KiB |
BIN
app/assets/student.png
Normal file
After Width: | Height: | Size: 6.5 KiB |
|
@ -9,13 +9,15 @@ const styles=StyleSheet.create({
|
||||||
borderBottomColor:'white',
|
borderBottomColor:'white',
|
||||||
borderBottomWidth:0.5,
|
borderBottomWidth:0.5,
|
||||||
height: Dimensions.get('window').height*0.075,
|
height: Dimensions.get('window').height*0.075,
|
||||||
justifyContent:'center',
|
|
||||||
paddingLeft: '3%',
|
paddingLeft: '3%',
|
||||||
fontSize: 32,
|
fontSize: 32,
|
||||||
|
display: 'flex',
|
||||||
|
flexDirection: 'row',
|
||||||
|
alignItems: 'center',
|
||||||
},
|
},
|
||||||
moretext: {
|
moretext: {
|
||||||
color:'#eee',
|
color:'#e3e3e3',
|
||||||
fontSize:20,
|
fontSize:22,
|
||||||
},
|
},
|
||||||
headerTitle: {
|
headerTitle: {
|
||||||
fontWeight: 'bold',
|
fontWeight: 'bold',
|
||||||
|
|