JSFiddle - React, Tailwind, and code Playground

by Sebastian Kay

HTML

<link rel="stylesheet" href="https://colorpicker.ueberflie.ga/css/app-dark.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.3/css/dataTables.bootstrap4.min.css">
<script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.11.3/js/dataTables.bootstrap4.min.js"></script>
<div class="container">
<div class="table-responsive">
<table id="example" class="table table-borderless my-3" style="width:90%">
     <thead class="table-light">
         <tr>
             <th>deutsch</th>
             <th>english</th>
         </tr>
     </thead>
     <tbody>
         <tr>
			<td>1 Pixel Kontur, 0 % Deckkraft</td>
			<td>1 Px Stroke, 0 % Fill Opacity</td>
		</tr>
		<tr>
			<td>1 Pixel Kontur, 100 % Deckkraft</td>
			<td>1 Px Stroke, 100 % Fill Opacity</td>
		</tr>
		<tr>
			<td>16 Bit pro Kanal</td>
			<td>16 Bits/Channel</td>
		</tr>
		<tr>
			<td>180°</td>
			<td>180°</td>
		</tr>
		<tr>
			<td>180° drehen</td>
			<td>Rotate 180°</td>
		</tr>
		<tr>
			<td>2 Uhr Spot</td>
			<td>2 O’Clock Spotlight</td>
		</tr>
		<tr>
			<td>3 fach Spot</td>
			<td>Triple Spot Light</td>
		</tr>
		<tr>
			<td>3 Spots von oben</td>
			<td>Three Down</td>
		</tr>
		<tr>
			<td>3D-Transformieren</td>
			<td>3D Transform</td>
		</tr>
		<tr>
			<td>45 Grad von oben</td>
			<td>Crossing down</td>
		</tr>
		<tr>
			<td>45 Grad von unten</td>
			<td>Crossing</td>
		</tr>
		<tr>
			<td>5 Spots von oben</td>
			<td>Five Lights down</td>
		</tr>
		<tr>
			<td>5 Spots von unten</td>
			<td>Five Lights up</td>
		</tr>
		<tr>
			<td>8 Bit pro Kanal</td>
			<td>8Bits/Channel</td>
		</tr>
		<tr>
			<td>90° gegen UZS</td>
			<td>90° CCW</td>
		</tr>
		<tr>
			<td>90° gegen UZS drehen</td>
			<td>Rotate 90° CCW</td>
		</tr>
		<tr>
			<td>90° im UZS</td>
			<td>90° CW</td>
		</tr>
		<tr>
			<td>90° im UZS drehen</td>
			<td>Rotate 90°...

JavaScript

$(document).ready(function() {
    var table = $('#example').DataTable( {
        lengthChange: false,
        buttons: [ 'copy', 'excel', 'pdf', 'colvis' ]
    } );
 
    table.buttons().container()
        .appendTo( '#example_wrapper .col-md-6:eq(0)' );
} );