Added Wrapped banner to discover page

Purdue-CS307-tsundoku · Mar 18, 2024 · e7e847c · e7e847c
1 parent 0d3ee5c
commit e7e847c
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 0 deletions.
diff --git a/mobile/Screens/Discover.tsx b/mobile/Screens/Discover.tsx
@@ -217,6 +217,17 @@ export const Discover = (props) => {
             GENRES={GENRES}
           />
         </View>
+        <View>
+          <Image source={require("../assets/wrapped-banner.png")} style={{width: '100%', height: 150}} />
+          <View style={{position: 'absolute', top: "15%", width: 300, justifyContent: 'center', alignSelf: 'center',}}>
+            <Text style={{color: 'white', fontSize: 20, textAlign: 'center', fontWeight: '500'}}>
+              Your [insert year] Tsundoku Wrapped is here!
+            </Text>
+            <TouchableOpacity style={{backgroundColor: 'white', padding: 0, margin: 0, height: 36, width: '36%', top: 10, justifyContent: 'center', alignSelf: 'center', borderRadius: 15}}>
+              <Text style={{textAlign: 'center', color: '#5E3FC5', fontSize: 15}}>Open</Text>
+            </TouchableOpacity>
+          </View>
+        </View>
         <CarouselTabs navigation={navigation} />
 
         {search.length > 0 && (

diff --git a/mobile/assets/wrapped-banner.png b/mobile/assets/wrapped-banner.png