<commit_before><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Arraify</title>
    <style>
        body{
            background-color: #2196F3;
            text-align: center
        }

        button{
            margin-top: -25em;
            vertical-align: middle;
        }
    </style>
</head>
<body>
    <textarea id="input" rows="20" cols="50">
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <link rel="stylesheet" href="">
    </head>
    <body>
        <h1>Header</h1>
        <ul>
            <li>First</li>
            <li>Second</li>
            <li>Third</li>
            <li>
                <ul>
                    <li>Other</li>
                    <li>Bla</li>
                </ul>
            </li>
        </ul>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
            tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
        </p>
    </body>
</html>
    </textarea>

    <button id="go">Arraify</button>
    <textarea id="output" rows="20" cols="50"></textarea>



    <script src="./app.js"></script>
    
</body>
</html><commit_msg>style: add basic stylyng & flex lib<commit_after><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Arraify</title>
    <style>
        body{
            background-color: #2196F3;
            text-align: center
        }
        section.action-button-container button{
            border: none;
            background: #0C69B2;
            color: #eee;
            padding: 1em;
            border-radius: 0.2em;
            cursor: pointer;
            font-size: 2.5em;
            margin-top: 0.5em;
            margin-bottom: 0.5em;
        }
        section.action-button-container button:hover{
            background: #239DFF;
            color: #fff;
            box-shadow: -1px 1px 2px 0 #0C69B2;
        }
        section.action-button-container button:active{
            background: #0C69B2;
            color: #ddd;
            box-shadow: 1px -1px 2px 0 #0B68B1;
        }

    </style>
    <link rel="stylesheet" href="https://cdn.rawgit.com/UnJavaScripter/flex-css-lib/master/dist/main.min.css">
</head>
<body>
    <main flex layout="row" layout-sm="column" align="center">
        <section class="input-section" flex="40" align="center">
            <textarea id="input" rows="20" cols="50">
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <link rel="stylesheet" href="">
    </head>
    <body>
        <h1>Header</h1>
        <ul>
            <li>First</li>
            <li>Second</li>
            <li>Third</li>
            <li>
                <ul>
                    <li>Other</li>
                    <li>Bla</li>
                </ul>
            </li>
        </ul>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
            tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
        </p>
    </body>
</html>
            </textarea>
        </section>

        <section class="action-button-container" flex="20" align="center">
            <button id="go">Arraify</button>
        </section>

        <section class="input-section" flex="40" align="center">
            <textarea id="output" rows="20" cols="50"></textarea>
        </section>



    </main>
    

    <script src="./app.js"></script>
    
</body>
</html>
{'fraction_non_alphanumeric': 0.14578774617067833, 'fraction_numerical': 0.021334792122538294, 'mean_word_length': 1.4186507936507937, 'pattern_counts': {'":': 0, '<': 114, '<?xml version=': 0, '>': 114, 'https://': 1, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7092739', 'n_tokens_mistral': 1233, 'n_tokens_neox': 1150, 'n_words': 245}