Home Reference Source

src/views/diary/components/PageTitle.js

import React from 'react';
import {StyleSheet, Text, View} from 'react-native';

import {iOSxxxLargeTypo} from '../../../styles/Typography';
import {ColorPalette} from '../../../utils/ColorConstants';

/**
 * Component displaying the title of a diary page.
 * @param {Object} props - Properties
 * @param {string} props.title - Title of the page
 * @returns {Object} Styled title
 */
export default function PageTitle(props) {
    // Retrieve props
    const title = props.title;

    return (
        <View style={styles.container}>
            <Text style={[iOSxxxLargeTypo.title2, styles.text]}>{title}</Text>
        </View>
    );
}

/** Local styles */
const styles = StyleSheet.create({
    container: {
        position: 'absolute',
        top: 15,
        right: '10%',
        paddingVertical: 10,
        paddingHorizontal: 25,
        backgroundColor: ColorPalette.MINDARO,
        opacity: 0.75,
    },
    text: {
        fontWeight: '600',
    },
});