<commit_before><article id="element_sample">
    <style>
        .show-grid {
            margin-bottom: 15px;
        }

        .show-grid [class^="col-"] {
            padding-top: 10px;
            padding-bottom: 10px;
            background-color: #eee;
            background-color: rgba(86, 61, 124, .15);
            border: 0px solid #ddd;
            border: 1px solid rgba(86, 61, 124, .2);
        }
    </style>
    <section class="container">
        <h3>Supported Browser</h3>

        <div class="row">
            <div class="col-sm-12">
                <ul style="list-style-type:circle;padding-left:20px;">
                    <li>Internet Explorer 8+</li>
                    <li>Firefox 4+</li>
                    <li>Google Chrome</li>
                    <li>Opera 14+</li>
                    <li>Maxthon 3+</li>
                    <li>Apple Safari 5+</li>
                    <li>or more...</li>
                </ul>
                <hr/>
                <h3>Plugin and Cascading Style Sheets Framework</h3>
                <ul style="list-style-type:circle;padding-left:20px;">
                    <li><a href="http://getbootstrap.com/" target="_blank">Bootstrap 3.3.5</a></li>
                    <li><a href="http://fontawesome.io/" target="_blank">Font Awesome 4.4.0</a></li>
                    <li><a href="http://jquery.com/" target="_blank">jQuery v1.11.3</a></li>
                    <li><a href="https://github.com/aFarkas/html5shiv" target="_blank">HTML5 Shiv 3.7.2</a></li>
                    <li><a href="https://github.com/scottjehl/Respond" target="_blank">Respond.js</a> - Provide
                        responsive CSS to IE 8 or lower.
                    </li>
                    <li><strong>jExtender 1.6</strong> - Provide more power to JavaScript & jQuery.</li>
                    <li><strong>Bootstrap+ 1.0.0</strong> - Give better develop ways & user experience from bootstrap.
                    </li>
                </ul>
            </div>
        </div>
        <hr>
        <div class="row">
            <div class="col-sm-6">
                <h4><i class="fa fa-flag"></i> One Font, 585 Icons</h4>
                In a single collection, Font Awesome is a pictographic language of web-related actions.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-ban"></i> No JavaScript Required</h4>
                Fewer compatibility concerns because Font Awesome doesn't require JavaScript.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-arrows-alt"></i> Infinite Scalability</h4>
                Scalable vector graphics means every icon looks awesome at any size.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-microphone"></i> Free, as in Speech</h4>
                Font Awesome is completely free for commercial use.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-pencil"></i> CSS Control</h4>
                Easily style icon color, size, shadow, and anything that's possible with CSS.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-eye"></i> Perfect on Retina Displays</h4>
                Font Awesome icons are vectors, which mean they're gorgeous on high-resolution displays.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-thumbs-o-up"></i> Made for Bootstrap</h4>
                Designed from scratch to be fully compatible with <a href="http://getbootstrap.com">Bootstrap 3.2.0</a>.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-desktop"></i> Desktop Friendly</h4>
                To use on the desktop or for a complete set of vectors.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-search"></i> Screen Reader Compatible</h4>
                Font Awesome won't trip up screen readers, unlike other icon fonts.
            </div>
        </div>
    </section>
    <hr>
    <section class="container">
        <h3>Responsive Grid System</h3>

        <div class="row show-grid">
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
        </div>
        <div class="row show-grid">
            <div class="col-md-8">.col-md-8</div>
            <div class="col-md-4">.col-md-4</div>
        </div>
        <div class="row show-grid">
            <div class="col-sm-4">.col-sm-4</div>
            <div class="col-sm-4">.col-sm-4</div>
            <div class="col-sm-4">.col-sm-4</div>
        </div>
        <div class="row show-grid">
            <div class="col-sm-4 col-lg-6">.col-sm-4 .col-lg-6</div>
            <div class="col-sm-4 col-lg-3">.col-sm-4 .col-lg-3</div>
            <div class="col-sm-4 col-lg-3">.col-sm-4 .col-lg-3</div>
        </div>
        <div class="row show-grid">
            <div class="col-sm-6">.col-sm-6</div>
            <div class="col-sm-6">.col-sm-6</div>
        </div>
        <div class="row show-grid">
            <div class="col-xs-6">.col-xs-6</div>
            <div class="col-xs-6">.col-xs-6</div>
        </div>
    </section>
    <section class="container">
        <h3>Pre-Styled Button </h3>

        <div class="row">
            <div class="col-sm-12">
                <button class="btn btn-google-play">
                    <img src="<?php echo $URL_REPOS; ?>bootstrap-plus/1.0.0/google_play_ldip.png"/>
                </button>
                <button class="btn btn-appstore">
                    <img src="<?php echo $URL_REPOS; ?>bootstrap-plus/1.0.0/app_store_ldip.png"/>
                </button>
                <button class="btn btn-wpstore">
                    <img src="<?php echo $URL_REPOS; ?>bootstrap-plus/1.0.0/wps_badge_ldip.png"/>
                </button>
                <button class="btn btn-bb-world">
                    <img src="<?php echo $URL_REPOS; ?>bootstrap-plus/1.0.0/bbw_badge_ldip.png"/>
                </button>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
                <button type="button" class="btn btn-default">Default</button>
                <button type="button" class="btn btn-primary">Primary</button>
                <button type="button" class="btn btn-success">Success</button>
                <button type="button" class="btn btn-info">Info</button>
                <button type="button" class="btn btn-warning">Warning</button>
                <button type="button" class="btn btn-danger">Danger</button>
                <button type="button" class="btn btn-link">Link</button>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Alert content</h3>

        <div class="row">
            <div class="col-sm-12">
                <div class="alert alert-success">
                    <strong>Well done!</strong> You successfully read this important alert message.
                </div>
            </div>
            <div class="col-sm-12">
                <div class="alert alert-info">
                    <strong>Heads up!</strong> This alert needs your attention, but it's not super important.
                </div>
            </div>
            <div class="col-sm-12">
                <div class="alert alert-warning">
                    <strong>Warning!</strong> Best check yo self, you're not looking too good.
                </div>
            </div>
            <div class="col-sm-12">
                <div class="alert alert-danger">
                    <strong>Oh snap!</strong> Change a few things up and try submitting again.
                </div>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Form control</h3>

        <form class="form-horizontal" role="form">
            <div class="form-group">
                <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

                <div class="col-sm-10">
                    <input type="email" class="form-control" id="inputEmail3" placeholder="<EMAIL>">
                </div>
            </div>
            <div class="form-group">
                <label for="inputPassword3" class="col-sm-2 control-label">Password</label>

                <div class="col-sm-10">
                    <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <div class="checkbox">
                        <label>
                            <input type="checkbox"> Remember me
                        </label>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default">Sign in</button>
                </div>
            </div>
        </form>
    </section>
    <section class="container">
        <h3>Listing</h3>

        <div class="row">
            <div class="col-sm-4">
                <ul class="list-group">
                    <li class="list-group-item"><span>Cras justo odio</span></li>
                    <li class="list-group-item"><span>Dapibus ac facilisis in</span></li>
                    <li class="list-group-item"><span>Morbi leo risus</span></li>
                    <li class="list-group-item"><span>Porta ac consectetur ac</span></li>
                    <li class="list-group-item"><span>Vestibulum at eros</span></li>
                </ul>
            </div>
            <div class="col-sm-4">
                <div class="list-group">
                    <a href="#" class="list-group-item"><span>Cras justo odio</span></a>
                    <a href="#" class="list-group-item active"><span>Dapibus ac facilisis in</span></a>
                    <a href="#" class="list-group-item"><span>Morbi leo risus</span></a>
                    <a href="#" class="list-group-item"><span>Porta ac consectetur ac</span></a>
                    <a href="#" class="list-group-item"><span>Vestibulum at eros</span></a>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="list-group">
                    <a href="#" class="list-group-item">
                        <h4 class="list-group-item-heading">List group item heading</h4>

                        <p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed
                            diam eget risus varius blandit.</p>
                    </a>
                    <a href="#" class="list-group-item">
                        <h4 class="list-group-item-heading">List group item heading</h4>

                        <p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed
                            diam eget risus varius blandit.</p>
                    </a>
                    <a href="#" class="list-group-item active">
                        <h4 class="list-group-item-heading">List group item heading</h4>

                        <p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed
                            diam eget risus varius blandit.</p>
                    </a>
                </div>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Panel Block</h3>

        <div class="row">
            <div class="col-sm-4">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
                <div class="panel panel-primary">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="panel panel-success">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
                <div class="panel panel-info">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="panel panel-warning">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
                <div class="panel panel-danger">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Well Block</h3>

        <div class="row">
            <div class="well col-sm-12">
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit
                    sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus
                    magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum. Duis
                    mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Aenean
                    lacinia bibendum nulla sed consectetur.
                </p>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Javascript</h3>

        <div class="row">
            <div class="col-sm-3">
                <button class="btn btn-primary" data-action="alert">Show Alert Box</button>
            </div>
            <div class="col-sm-3">
                <button class="btn btn-primary" data-action="confirm">Show Confirm Box</button>
            </div>
            <div class="col-sm-3">
                <button class="btn btn-primary" data-action="show_browser">Show Browser Agent</button>
            </div>
        </div>
    </section>
    <script>
        $(function () {
            $('button[data-action=alert]').click(function () {
                $.alert('Alert is clicked.');
            });
            $('button[data-action=confirm]').click(function () {
                $.confirm('Confirm is clicked.', {
                    confirm: function () {
                        console.log('Positive clicked');
                    },
                    cancel: function () {
                        console.log('Negative clicked');
                    }
                });
            });
            $('button[data-action=show_browser]').click(function () {
                var html = '';
                for (var name in $.browser) {
                    html += name + ': ' + $.browser[name] + '<br/>';
                }
                $.alert(html);
            });
        });
    </script>
</article><commit_msg>update javascript /css version in view<commit_after><article id="element_sample">
    <style>
        .show-grid {
            margin-bottom: 15px;
        }

        .show-grid [class^="col-"] {
            padding-top: 10px;
            padding-bottom: 10px;
            background-color: #eee;
            background-color: rgba(86, 61, 124, .15);
            border: 0px solid #ddd;
            border: 1px solid rgba(86, 61, 124, .2);
        }
    </style>
    <section class="container">
        <h3>Supported Browser</h3>

        <div class="row">
            <div class="col-sm-12">
                <ul style="list-style-type:circle;padding-left:20px;">
                    <li>Internet Explorer 8+</li>
                    <li>Firefox 4+</li>
                    <li>Google Chrome</li>
                    <li>Opera 14+</li>
                    <li>Maxthon 3+</li>
                    <li>Apple Safari 5+</li>
                    <li>or more...</li>
                </ul>
                <hr/>
                <h3>Plugin and Cascading Style Sheets Framework</h3>
                <ul style="list-style-type:circle;padding-left:20px;">
                    <li><a href="http://getbootstrap.com/" target="_blank">Bootstrap 3.3.7</a></li>
                    <li><a href="http://fontawesome.io/" target="_blank">Font Awesome 4.7.0</a></li>
                    <li><a href="http://jquery.com/" target="_blank">jQuery v1.12.4</a></li>
                    <li><a href="https://github.com/aFarkas/html5shiv" target="_blank">HTML5 Shiv 3.7.2</a></li>
                    <li><a href="https://github.com/scottjehl/Respond" target="_blank">Respond.js</a> - Provide
                        responsive CSS to IE 8 or lower.
                    </li>
                    <li><strong>jExtender 1.8</strong> - Provide more power to JavaScript & jQuery.</li>
                    <li><strong>Bootstrap+ 1.0.0</strong> - Give better develop ways & user experience from bootstrap.
                    </li>
                </ul>
            </div>
        </div>
        <hr>
        <div class="row">
            <div class="col-sm-6">
                <h4><i class="fa fa-flag"></i> One Font, 585 Icons</h4>
                In a single collection, Font Awesome is a pictographic language of web-related actions.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-ban"></i> No JavaScript Required</h4>
                Fewer compatibility concerns because Font Awesome doesn't require JavaScript.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-arrows-alt"></i> Infinite Scalability</h4>
                Scalable vector graphics means every icon looks awesome at any size.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-microphone"></i> Free, as in Speech</h4>
                Font Awesome is completely free for commercial use.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-pencil"></i> CSS Control</h4>
                Easily style icon color, size, shadow, and anything that's possible with CSS.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-eye"></i> Perfect on Retina Displays</h4>
                Font Awesome icons are vectors, which mean they're gorgeous on high-resolution displays.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-thumbs-o-up"></i> Made for Bootstrap</h4>
                Designed from scratch to be fully compatible with <a href="http://getbootstrap.com">Bootstrap 3.2.0</a>.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-desktop"></i> Desktop Friendly</h4>
                To use on the desktop or for a complete set of vectors.
            </div>
            <div class="col-sm-6">
                <h4><i class="fa fa-search"></i> Screen Reader Compatible</h4>
                Font Awesome won't trip up screen readers, unlike other icon fonts.
            </div>
        </div>
    </section>
    <hr>
    <section class="container">
        <h3>Responsive Grid System</h3>

        <div class="row show-grid">
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
            <div class="col-sm-1">.col-sm-1</div>
        </div>
        <div class="row show-grid">
            <div class="col-md-8">.col-md-8</div>
            <div class="col-md-4">.col-md-4</div>
        </div>
        <div class="row show-grid">
            <div class="col-sm-4">.col-sm-4</div>
            <div class="col-sm-4">.col-sm-4</div>
            <div class="col-sm-4">.col-sm-4</div>
        </div>
        <div class="row show-grid">
            <div class="col-sm-4 col-lg-6">.col-sm-4 .col-lg-6</div>
            <div class="col-sm-4 col-lg-3">.col-sm-4 .col-lg-3</div>
            <div class="col-sm-4 col-lg-3">.col-sm-4 .col-lg-3</div>
        </div>
        <div class="row show-grid">
            <div class="col-sm-6">.col-sm-6</div>
            <div class="col-sm-6">.col-sm-6</div>
        </div>
        <div class="row show-grid">
            <div class="col-xs-6">.col-xs-6</div>
            <div class="col-xs-6">.col-xs-6</div>
        </div>
    </section>
    <section class="container">
        <h3>Pre-Styled Button </h3>

        <div class="row">
            <div class="col-sm-12">
                <button class="btn btn-google-play">
                    <img src="<?php echo $URL_REPOS; ?>bootstrap-plus/1.0.0/google_play_ldip.png"/>
                </button>
                <button class="btn btn-appstore">
                    <img src="<?php echo $URL_REPOS; ?>bootstrap-plus/1.0.0/app_store_ldip.png"/>
                </button>
                <button class="btn btn-wpstore">
                    <img src="<?php echo $URL_REPOS; ?>bootstrap-plus/1.0.0/wps_badge_ldip.png"/>
                </button>
                <button class="btn btn-bb-world">
                    <img src="<?php echo $URL_REPOS; ?>bootstrap-plus/1.0.0/bbw_badge_ldip.png"/>
                </button>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
                <button type="button" class="btn btn-default">Default</button>
                <button type="button" class="btn btn-primary">Primary</button>
                <button type="button" class="btn btn-success">Success</button>
                <button type="button" class="btn btn-info">Info</button>
                <button type="button" class="btn btn-warning">Warning</button>
                <button type="button" class="btn btn-danger">Danger</button>
                <button type="button" class="btn btn-link">Link</button>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Alert content</h3>

        <div class="row">
            <div class="col-sm-12">
                <div class="alert alert-success">
                    <strong>Well done!</strong> You successfully read this important alert message.
                </div>
            </div>
            <div class="col-sm-12">
                <div class="alert alert-info">
                    <strong>Heads up!</strong> This alert needs your attention, but it's not super important.
                </div>
            </div>
            <div class="col-sm-12">
                <div class="alert alert-warning">
                    <strong>Warning!</strong> Best check yo self, you're not looking too good.
                </div>
            </div>
            <div class="col-sm-12">
                <div class="alert alert-danger">
                    <strong>Oh snap!</strong> Change a few things up and try submitting again.
                </div>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Form control</h3>

        <form class="form-horizontal" role="form">
            <div class="form-group">
                <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

                <div class="col-sm-10">
                    <input type="email" class="form-control" id="inputEmail3" placeholder="<EMAIL>">
                </div>
            </div>
            <div class="form-group">
                <label for="inputPassword3" class="col-sm-2 control-label">Password</label>

                <div class="col-sm-10">
                    <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <div class="checkbox">
                        <label>
                            <input type="checkbox"> Remember me
                        </label>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default">Sign in</button>
                </div>
            </div>
        </form>
    </section>
    <section class="container">
        <h3>Listing</h3>

        <div class="row">
            <div class="col-sm-4">
                <ul class="list-group">
                    <li class="list-group-item"><span>Cras justo odio</span></li>
                    <li class="list-group-item"><span>Dapibus ac facilisis in</span></li>
                    <li class="list-group-item"><span>Morbi leo risus</span></li>
                    <li class="list-group-item"><span>Porta ac consectetur ac</span></li>
                    <li class="list-group-item"><span>Vestibulum at eros</span></li>
                </ul>
            </div>
            <div class="col-sm-4">
                <div class="list-group">
                    <a href="#" class="list-group-item"><span>Cras justo odio</span></a>
                    <a href="#" class="list-group-item active"><span>Dapibus ac facilisis in</span></a>
                    <a href="#" class="list-group-item"><span>Morbi leo risus</span></a>
                    <a href="#" class="list-group-item"><span>Porta ac consectetur ac</span></a>
                    <a href="#" class="list-group-item"><span>Vestibulum at eros</span></a>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="list-group">
                    <a href="#" class="list-group-item">
                        <h4 class="list-group-item-heading">List group item heading</h4>

                        <p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed
                            diam eget risus varius blandit.</p>
                    </a>
                    <a href="#" class="list-group-item">
                        <h4 class="list-group-item-heading">List group item heading</h4>

                        <p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed
                            diam eget risus varius blandit.</p>
                    </a>
                    <a href="#" class="list-group-item active">
                        <h4 class="list-group-item-heading">List group item heading</h4>

                        <p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed
                            diam eget risus varius blandit.</p>
                    </a>
                </div>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Panel Block</h3>

        <div class="row">
            <div class="col-sm-4">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
                <div class="panel panel-primary">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="panel panel-success">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
                <div class="panel panel-info">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="panel panel-warning">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
                <div class="panel panel-danger">
                    <div class="panel-heading">
                        <h3 class="panel-title">Panel title</h3>
                    </div>
                    <div class="panel-body">
                        Panel content
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Well Block</h3>

        <div class="row">
            <div class="well col-sm-12">
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit
                    sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus
                    magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum. Duis
                    mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Aenean
                    lacinia bibendum nulla sed consectetur.
                </p>
            </div>
        </div>
    </section>
    <section class="container">
        <h3>Javascript</h3>

        <div class="row">
            <div class="col-sm-3">
                <button class="btn btn-primary" data-action="alert">Show Alert Box</button>
            </div>
            <div class="col-sm-3">
                <button class="btn btn-primary" data-action="confirm">Show Confirm Box</button>
            </div>
            <div class="col-sm-3">
                <button class="btn btn-primary" data-action="show_browser">Show Browser Agent</button>
            </div>
        </div>
    </section>
    <script>
        $(function () {
            $('button[data-action=alert]').click(function () {
                $.alert('Alert is clicked.');
            });
            $('button[data-action=confirm]').click(function () {
                $.confirm('Confirm is clicked.', {
                    confirm: function () {
                        console.log('Positive clicked');
                    },
                    cancel: function () {
                        console.log('Negative clicked');
                    }
                });
            });
            $('button[data-action=show_browser]').click(function () {
                var html = '';
                for (var name in $.browser) {
                    html += name + ': ' + $.browser[name] + '<br/>';
                }
                $.alert(html);
            });
        });
    </script>
</article>

{'fraction_non_alphanumeric': 0.1494842233009709, 'fraction_numerical': 0.014199029126213592, 'mean_word_length': 1.338322928490352, 'pattern_counts': {'":': 0, '<': 923, '<?xml version=': 0, '>': 923, 'https://': 4, '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': '3285309', 'n_tokens_mistral': 9869, 'n_tokens_neox': 9244, 'n_words': 2056}