mirror of
https://github.com/Blair-SGA-Dev-Team/blazerapp.git
synced 2024-11-08 14:51:17 -05:00
Added gradient headers
This commit is contained in:
parent
36a64a25b5
commit
a4770d9fa0
|
@ -69,8 +69,7 @@ class Announcements extends React.Component {
|
||||||
this.state = {
|
this.state = {
|
||||||
data: [],
|
data: [],
|
||||||
teacherNames: [],
|
teacherNames: [],
|
||||||
favoriteNames: [],
|
favoriteNames: []
|
||||||
isLoading:true
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -117,7 +116,6 @@ class Announcements extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
if (this.state.isLoading) return <></>
|
|
||||||
return (
|
return (
|
||||||
<View style={[styles.container]}>
|
<View style={[styles.container]}>
|
||||||
<TeacherButton data={this.state.data.filter(x=>x.teacher==null||x.teacher.trim()==='')} name="No Teacher" navigation={this.props.navigation} />
|
<TeacherButton data={this.state.data.filter(x=>x.teacher==null||x.teacher.trim()==='')} name="No Teacher" navigation={this.props.navigation} />
|
||||||
|
|
|
@ -76,7 +76,7 @@ class Calendar extends React.Component {
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<View>
|
<View style={styles.container}>
|
||||||
<FlatList
|
<FlatList
|
||||||
data={this.state.data}
|
data={this.state.data}
|
||||||
renderItem={item=><Event item={item}/>}
|
renderItem={item=><Event item={item}/>}
|
||||||
|
|
38
app/More.js
38
app/More.js
|
@ -28,7 +28,7 @@ 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 { LinearGradient } from 'react-native-linear-gradient'
|
import LinearGradient from 'react-native-linear-gradient'
|
||||||
|
|
||||||
const Stack = createStackNavigator()
|
const Stack = createStackNavigator()
|
||||||
|
|
||||||
|
@ -61,6 +61,11 @@ class MoreSwitch extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const background = (<LinearGradient
|
||||||
|
colors={['#f99', 'white']}
|
||||||
|
style = {{flex:1,borderBottomColor:'black',borderBottomWidth:0.5}}
|
||||||
|
/>)
|
||||||
|
|
||||||
class More extends React.Component {
|
class More extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
|
@ -72,7 +77,7 @@ class More extends React.Component {
|
||||||
options={{
|
options={{
|
||||||
title:'More',
|
title:'More',
|
||||||
headerTitleStyle:styles.headerTitle,
|
headerTitleStyle:styles.headerTitle,
|
||||||
headerStyle:{borderBottomWidth:0.5,borderBottomColor:'black'},
|
headerBackground: ()=>background
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
|
@ -82,6 +87,7 @@ class More extends React.Component {
|
||||||
title:'Announcements',
|
title:'Announcements',
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
||||||
headerLeft:null,
|
headerLeft:null,
|
||||||
|
headerBackground: ()=>background
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
|
@ -90,7 +96,8 @@ class More extends React.Component {
|
||||||
options={{
|
options={{
|
||||||
title:'Resources',
|
title:'Resources',
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
||||||
headerLeft:null
|
headerLeft:null,
|
||||||
|
headerBackground: ()=>background
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
|
@ -99,7 +106,8 @@ class More extends React.Component {
|
||||||
options={{
|
options={{
|
||||||
title:'Student of the Week',
|
title:'Student of the Week',
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
||||||
headerLeft:null
|
headerLeft:null,
|
||||||
|
headerBackground: ()=>background
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
|
@ -108,7 +116,8 @@ class More extends React.Component {
|
||||||
options={{
|
options={{
|
||||||
title:'Lunch Events',
|
title:'Lunch Events',
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
||||||
headerLeft:null
|
headerLeft:null,
|
||||||
|
headerBackground: ()=>background
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
|
@ -117,7 +126,8 @@ class More extends React.Component {
|
||||||
options={{
|
options={{
|
||||||
title:'SSL Opportunities',
|
title:'SSL Opportunities',
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
||||||
headerLeft:null
|
headerLeft:null,
|
||||||
|
headerBackground: ()=>background
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
|
@ -126,33 +136,37 @@ class More extends React.Component {
|
||||||
options={{
|
options={{
|
||||||
title:'Challenge of the Week',
|
title:'Challenge of the Week',
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
||||||
headerLeft:null
|
headerLeft:null,
|
||||||
|
headerBackground: ()=>background
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
name="TeacherList"
|
name="TeacherList"
|
||||||
component={TeacherList}
|
component={TeacherList}
|
||||||
options={({route})=>({
|
options={({route})=>({
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center',fontSize:Math.min(24,24*23/route.params.name.length)}],
|
||||||
title:route.params.name,
|
title:route.params.name,
|
||||||
headerRight:()=>(<></>)
|
headerRight:()=>(<></>),
|
||||||
|
headerBackground: ()=>background
|
||||||
})}
|
})}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
name="LunchInfo"
|
name="LunchInfo"
|
||||||
component={LunchInfo}
|
component={LunchInfo}
|
||||||
options={({route})=>({
|
options={({route})=>({
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center',fontSize:Math.min(24,24*23/route.params.name.length)}],
|
||||||
title:route.params.name,
|
title:route.params.name,
|
||||||
headerRight:()=>(<></>)
|
headerRight:()=>(<></>),
|
||||||
|
headerBackground: ()=>background
|
||||||
})}
|
})}
|
||||||
/>
|
/>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
name="SSLInfo"
|
name="SSLInfo"
|
||||||
component={SSLInfo}
|
component={SSLInfo}
|
||||||
options={({route})=>({
|
options={({route})=>({
|
||||||
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center',fontSize:Math.min(24,24*23/route.params.name.length)}],
|
||||||
title:route.params.name,
|
title:route.params.name,
|
||||||
|
headerBackground: ()=>background,
|
||||||
headerRight:()=>(<></>)
|
headerRight:()=>(<></>)
|
||||||
})}
|
})}
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -3,7 +3,7 @@ import {StyleSheet, StatusBar} from 'react-native';
|
||||||
const styles = StyleSheet.create({
|
const styles = StyleSheet.create({
|
||||||
container: {
|
container: {
|
||||||
flex: 1,
|
flex: 1,
|
||||||
marginTop: StatusBar.currentHeight || 0,
|
marginTop: StatusBar.currentHeight || 0
|
||||||
},
|
},
|
||||||
item: {
|
item: {
|
||||||
backgroundColor: 'white',
|
backgroundColor: 'white',
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
import {StyleSheet, Dimensions} from 'react-native';
|
import {StyleSheet, Dimensions} from 'react-native';
|
||||||
import LinearGradient from 'react-native-linear-gradient';
|
import LinearGradient from 'react-native-linear-gradient';
|
||||||
|
|
||||||
|
console.log(Dimensions.get('window'))
|
||||||
|
|
||||||
const styles=StyleSheet.create({
|
const styles=StyleSheet.create({
|
||||||
moreitem: {
|
moreitem: {
|
||||||
backgroundColor:'red',
|
backgroundColor:'red',
|
||||||
|
|
Loading…
Reference in New Issue
Block a user