<commit_before>import React from 'react';
import SceneNavigator from './SceneNavigator.js';
import spring from './spring.js'

export default ({stateNavigator}) => (
    <div style={styles.phone}>
        <div style={styles.twitter}>
            <SceneNavigator
                unmountedStyle={{translate: spring(100), scale: spring(1)}}
                mountedStyle={{translate: spring(0), scale: spring(1)}}
                mountedBackStyle={{translate: spring(5), scale: spring(0.9)}}
                stateNavigator={stateNavigator}>
                    {({translate, scale}, scene) => <div style={{...styles.scene,
                        transform: `translate(${translate}%) scale(${scale}, ${scale})`}}>{scene}</div>}
            </SceneNavigator>
        </div>
    </div>    
);

var styles = {
    phone: {
        width: '324px',
        height: '588px',
        backgroundSize: '324px 588px',
        backgroundImage: 'url(phone.png)',
        margin: '0 auto'
    },
    twitter: {
        fontFamily: 'Segoe UI,sans-serif',
        fontSize: '80%',
        overflow: 'hidden',
        cursor: 'default',
        backgroundColor: '#000',
        position: 'absolute',
        marginTop: '89px',
        marginLeft: '49px',
        width: '225px',
        height: '402px'
    },
    scene: {
        position: 'absolute',
        top: 0,
        backgroundColor: '#fff',
        height: '402px'
    }
}<commit_msg>Prevented quick clicking highlighting text<commit_after>import React from 'react';
import SceneNavigator from './SceneNavigator.js';
import spring from './spring.js'

export default ({stateNavigator}) => (
    <div style={styles.phone}>
        <div style={styles.twitter}>
            <SceneNavigator
                unmountedStyle={{translate: spring(100), scale: spring(1)}}
                mountedStyle={{translate: spring(0), scale: spring(1)}}
                mountedBackStyle={{translate: spring(5), scale: spring(0.9)}}
                stateNavigator={stateNavigator}>
                    {({translate, scale}, scene) => <div style={{...styles.scene,
                        transform: `translate(${translate}%) scale(${scale}, ${scale})`}}>{scene}</div>}
            </SceneNavigator>
        </div>
    </div>    
);

var styles = {
    phone: {
        width: '324px',
        height: '588px',
        backgroundSize: '324px 588px',
        backgroundImage: 'url(phone.png)',
        margin: '0 auto'
    },
    twitter: {
        fontFamily: 'Segoe UI,sans-serif',
        fontSize: '80%',
        overflow: 'hidden',
        cursor: 'default',
        backgroundColor: '#000',
        position: 'absolute',
        marginTop: '89px',
        marginLeft: '49px',
        width: '225px',
        height: '402px'
    },
    scene: {
        position: 'absolute',
        top: 0,
        backgroundColor: '#fff',
        height: '402px',
        userSelect: 'none'
    }
}
{'fraction_non_alphanumeric': 0.1576592082616179, 'fraction_numerical': 0.028227194492254734, 'mean_word_length': 2.1080213903743314, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 23, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5704226', 'n_tokens_mistral': 882, 'n_tokens_neox': 823, 'n_words': 188}