minecraft-tools/app/index.tsx

71 lines
2.8 KiB
TypeScript
Raw Normal View History

import { Link } from "expo-router";
import { ImageBackground, Text, TouchableOpacity, View } from "react-native";
import { styles } from "./styles";
// Placeholder images
const netherImage = require("../assets/images/netherportalcalculator.png");
const todoImage = require("../assets/images/todo-list.png");
const coordinatesImage = require("../assets/images/coordinates.png");
const motdImage = require("../assets/images/motd-creator.png");
export default function Index() {
return (
<View style={styles.appContainer}>
<Text style={styles.mainTitle}>Minecraft Tools</Text>
<View style={styles.gridContainer}>
{/* Nether Portal Calculator */}
<View style={styles.gridItem}>
<Link href="/nether-portal-calculator" asChild style={styles.touchableWrapper}>
<TouchableOpacity style={styles.touchableWrapper}>
<ImageBackground source={netherImage} style={styles.imageBackground} resizeMode="cover">
<View style={styles.overlay}>
<Text style={styles.linkButtonText}>Nether Portal Calculator</Text>
</View>
</ImageBackground>
</TouchableOpacity>
</Link>
</View>
{/* Todo List */}
<View style={styles.gridItem}>
<Link href="/todo" asChild style={styles.touchableWrapper}>
<TouchableOpacity style={styles.touchableWrapper}>
<ImageBackground source={todoImage} style={styles.imageBackground} resizeMode="cover">
<View style={styles.overlay}>
<Text style={styles.linkButtonText}>Todo List</Text>
</View>
</ImageBackground>
</TouchableOpacity>
</Link>
</View>
{/* Saved Coordinates */}
<View style={styles.gridItem}>
<Link href="/saved-coordinates" asChild style={styles.touchableWrapper}>
<TouchableOpacity style={styles.touchableWrapper}>
<ImageBackground source={coordinatesImage} style={styles.imageBackground} resizeMode="cover">
<View style={styles.overlay}>
<Text style={styles.linkButtonText}>Saved Coordinates</Text>
</View>
</ImageBackground>
</TouchableOpacity>
</Link>
</View>
{/* MOTD Creator */}
<View style={styles.gridItem}>
<Link href="/motd" asChild style={styles.touchableWrapper}>
<TouchableOpacity style={styles.touchableWrapper}>
<ImageBackground source={motdImage} style={styles.imageBackground} resizeMode="cover">
<View style={styles.overlay}>
<Text style={styles.linkButtonText}>MOTD Creator</Text>
</View>
</ImageBackground>
</TouchableOpacity>
</Link>
</View>
</View>
</View>
);
}