JSFiddle - React, Tailwind, and code Playground

by dima_k

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css">
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<div data-role="page" data-add-back-btn="true">
    <div data-role="header" data-position="fixed">
        <h1>Thumbnails</h1>
    </div>
    <div data-role="content">
        <ul data-role="listview" data-split-icon="gear" data-split-theme="d" data-filter="true">
            <li data-filtertext="Acer good">
                <a href="#"><img src="http://phandroid.s3.amazonaws.com/wp-content/uploads/2009/06/acer_logo.gif"/><h3>Acer</h3></a>
                <a href="#like" data-rel="popup" data-position-to="window" data-transition="pop">Like</a></li>
            <li data-filtertext="Asus good">
                <a href="#"><img src="http://purpleflytrading.co.za/shopping/images/Laptops/asus-logo.jpg"/><h3>Asus</h3></a>
                <a href="#like" data-rel="popup" data-position-to="window" data-transition="pop">Like</a></li>
            <li data-filtertext="Dell good">
                <a href="#"><img src="http://tonemagazine.s3.amazonaws.com/wp-content/uploads/2012/05/dell-logo.jpg"/><h3>Dell</h3></a>
                <a href="#like" data-rel="popup" data-position-to="window" data-transition="pop">Like</a></li>
            <li data-filtertext="LG bad">
                <a href="#"><img src="http://afriqueitnews.com/wp-content/uploads/2012/09/lg-logo.jpg"/><h3>LG</h3></a>
                <a href="#like" data-rel="popup" data-position-to="window" data-transition="pop">Like</a></li>
            <li data-filtertext="Logitech bad">
                <a href="#"><img src="http://www.logoeps.com/wp-content/uploads/2012/05/logitech-logo-vector-01.png"/><h3>Logitech</h3></a>
                <a href="#like" data-rel="popup" data-position-to="window" data-transition="pop">Like</a></li>
            <li data-filtertext="Panasonic bad">
                <a href="#"><img...