JSFiddle - React, Tailwind, and code Playground
by deathstalkersid
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
</head>
<body>
<div class='col-xs-12 col-md-4'>
<h3> ATP tennis </h3>
<hr />
<div id="accordion">
<div class="card">
<div class="card-header">
<h5 class="mb-0">
<button class="first1 btn btn-link collapsed newwrap" data-toggle="collapse" data-artid="{{obj.id}}" data-target="#tnis_{{ obj.id }}" aria-expanded="false" aria-controls="tnis_{{ obj.id }}">
Curabitur aliquet quam id dui posuere blandit. Donec rutrum congue leo eget malesuada. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Donec rutrum congue leo eget malesuada. Curabitur aliquet quam id dui posuere blandit.
</button>
</h5>
</div>
<div id="tnis_{{ obj.id }}" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
<div class="card-body body_pad"><a href='{{obj.url}}' target="_blank" class='body_col'>
A </a><br>
<div class="rght3">
<i id="{{obj.id}}" class="likes fa fa-thumbs-up" data-artid="{{obj.id}}" style="font-size:25px;color:#6666ff;"></i>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
<h5 class="mb-0">
<button class="first1 btn btn-link collapsed newwrap" data-toggle="collapse" data-artid="{{obj.id}}" data-target="#tnis_{{ obj.id }}" aria-expanded="false" aria-controls="tnis_{{ obj.id }}">
Curabitur aliquet quam id dui posuere blandit. Donec rutrum congue leo eget malesuada. Vivamus magna justo, lacinia eget consectetur sed, convallis...