threadify/index.html at master · miguelms95/threadify · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>Threadify | Prepare your stories</title>
    <meta name="description" content="Threadify, helps you to prepare Twitter threads dividing your full text into tweets.">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/material-design-icons/3.0.1/iconfont/material-icons.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Bitter:400,700">
    <link rel="stylesheet" href="assets/css/Features-Clean.css">
    <link rel="stylesheet" href="assets/css/Footer-Dark.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.1.1/aos.css">
    <link rel="stylesheet" href="assets/css/Navigation-Clean1.css">
    <link rel="stylesheet" href="assets/css/styles.css">
</head>

<body>
    <div class="container-fluid">
        <nav class="navbar navbar-light navbar-expand-md navigation-clean">
            <div class="container"><a class="navbar-brand" href="#"><i class="material-icons" style="vertical-align:middle;">description</i> Threadify </a><button class="navbar-toggler" data-toggle="collapse" data-target="#navcol-1"><span class="sr-only">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
                <div
                    class="collapse navbar-collapse" id="navcol-1">
                    <ul class="nav navbar-nav ml-auto">
                        <li class="nav-item" role="presentation"><a class="nav-link active" href="index.html">Index </a></li>
                        <!--<li class="nav-item" role="presentation"><a class="nav-link" href="http://miguelms.es" target="_blank">About</a></li>-->
                        <li class="nav-item" role="presentation"><a class="nav-link" href="http://miguelms.es" target="_blank">Contact </a></li>
                    </ul>
            </div>
    </div>
    </nav>
    </div>
    <div class="container-fluid bg-top">
        <div class="container-fluid hover">
            <div class="header-title">
                <h1 class="text-center" style="font-family:Bitter, serif;"><strong>Threadify</strong>, prepare your stories.</h1>
            </div>
        </div>
    </div>
    <div class="features-clean">
            <div class="container">
                <!--<div class="intro">
                    <h2 class="text-center">What is Threadify?</h2>
                    <p class="text-center" style="font-size: 19px;">This is a web application for planning your Twitter threads, take a look!</p>
                </div>-->
                <div class="separator_header"></div>
                <div class="row features">
                    <div class="col-sm-6 col-lg-4 item" data-aos="fade-left" data-aos-duration="400" data-aos-delay="200" data-aos-once="true">
                        <i class="fa fa-hand-scissors-o icon"></i>
                        <h3 class="name">Split large texts</h3>
                        <p class="description">The application process the text, and split it into 280 character tweets.</p>
                    </div>
                    <div class="col-sm-6 col-lg-4 item" data-aos="fade-left" data-aos-duration="650" data-aos-delay="400" data-aos-once="true">
                        <i class="fa fa-flash icon"></i>
                        <h3 class="name">Fast</h3>
                        <p class="description">It's done instantly, coud it be any faster?</p>
                    </div>
                    <div class="col-sm-6 col-lg-4 item" data-aos="fade-left" data-aos-duration="650" data-aos-delay="800" data-aos-once="true">
                        <i class="fa fa-list-ul icon"></i>
                        <h3 class="name">Customizable</h3>
                        <p class="description">Choose if you want enumeration in the tweets like: 1) ... 2) ...</p>
                    </div>
                </div>
            </div>
        </div>
    <div>
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h5 class="text-center" style="margin:37px 0px;">Write / paste here the complete text:</h5>
                    <div class="form-group">
                        <textarea rows="4" placeholder="Write here or past the complete text to convert..." id="full-text" class="form-control"></textarea>
                        <div class="submit-section">
                            <span><i class="fa fa-get-pocket green"></i> <span id="num_characters"> </span> characters&nbsp;&nbsp;</span>
                            <button class="btn btn-dark" type="submit" id="bt-submit-text"> Process text <i class="fa fa-play-circle"></i></button>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="row result" id="result-wrapper">
                        <div class="col-md-3">
                            <h3>Settings</h3>
                            <label><input type="checkbox" value="enumeration"> Enumerate tweets</label>
                        </div>
                        <div class="col-md-9">
                                <div class="top_separator">
                                    <h4>Split result:</h4>
                                </div>
                                <div id="text-area-results">
                                    <div class="result_textarea"></div>

                                </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="footer-dark">
        <footer>
            <div class="container">
                <div class="row">
                    <div class="col-sm-6 col-md-3 item">
                        <h3>Services</h3>
                        <ul>
                            <li><a href="http://miguelms.es">Web design</a></li>
                            <li><a href="http://miguelms.es">Development</a></li>
                        </ul>
                    </div>
                    <div class="col-sm-6 col-md-3 item">
                        <h3>About</h3>
                        <ul>
                            <li><a href="http://miguelms.es">About me</a></li>
                        </ul>
                    </div>
                    <div class="col-md-6 item text">
                        <h3>Contact </h3>
                        <p>Mail me at <a href="mailto:miguel@miguelms.es">miguel@miguelms.es</a></p>
                    </div>
                    <div class="col item social"><a href="https://www.linkedin.com/in/miguel-mart%C3%ADnez-serrano-51164b94" target="_blank"><i class="icon ion-social-linkedin"></i></a><a href="https://github.com/miguelms95/" target="_blank"><i class="icon ion-social-github"></i></a>
                        <a
                            href="https://www.facebook.com/MiguelMsWeb/" target="_blank"><i class="icon ion-social-facebook"></i></a><a href="https://twitter.com/miguelms_es" target="_blank"><i class="icon ion-social-twitter"></i></a></div>
                </div>
                <p class="copyright">Developed with <i class="fa fa-heart" style="color:rgb(4,105,255) !important;"></i> by Miguel M. Serrano </p>
            </div>
        </footer>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script>
    <script src="assets/js/bs-animation.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/aos/2.1.1/aos.js"></script>
    <script src="assets/js/threadify.js"></script>
</body>

</html>