JSFiddle - React, Tailwind, and code Playground

by Bahman ParsaManesh

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css">
</head>
<body>
<div class="row">
<div class="col m4 l4">
                <div class="card hoverable">
                <div class="row">
                      <div class="col s12">
                      <div class="card-image">
                        <a href="/uploads/{{imageName}}" data-lightbox="mygallery" data-title="This is a test">
                            <img class="materialboxed" src="/uploads/{{imageName}}" width="250">
                        </a>
                    </div>
                      </div>
                </div>
                 

                    <div class="card-action2">
                    <div class="row">
                      <div class="col s6">
                        <form action="/user/{{id}}?_method=DELETE" method="POST">
                            <button type="submit" class="btn-floating btn waves-effect waves-light red">
                                <i class="material-icons">delete</i>
                            </button>
                        </form>
                      </div>
                      <div class="col s6">
                        <form action="/user/{{id}}?_method=DELETE" method="POST">
                            <button type="submit" class="btn-floating btn waves-effect waves-light blue">
                                <i class="material-icons">edit</i>
                            </button>
                        </form>
                      </div>
                    </div>
             
                    </div>
                </div>
            </div>  
</div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/js/materialize.min.js"></script>
</body>
</html>