JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<table class='table sw-table'>
    <thead>
        <tr>
            <th>Brand</th>
            <th>Campaigns</th>
            <th>Actions</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <div>Brand name</div>
            </td>
            <td>2</td>
            <td>
                <div> <a class='btn btn-purple btn-xs sw-btn' href='#'>MANAGE CAMPAIGNS</a>
 <a class='btn btn-grey btn-xs sw-btn' href='#'>EDIT</a>

                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div>Brand name</div>
            </td>
            <td>2</td>
            <td>
                <div> <a class='btn btn-purple btn-xs sw-btn' href='#'>MANAGE CAMPAIGNS</a>
 <a class='btn btn-grey btn-xs sw-btn' href='#'>EDIT</a>

                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div>Brand name</div>
            </td>
            <td>2</td>
            <td>
                <div> <a class='btn btn-purple btn-xs sw-btn' href='#'>MANAGE CAMPAIGNS</a>
 <a class='btn btn-grey btn-xs sw-btn' href='#'>EDIT</a>

                </div>
            </td>
        </tr>
    </tbody>
</table>

SCSS

// colors
$grey: rgb(139, 139, 139);
$greyish: rgb(197, 197, 197);
$orange: rgb(244, 119, 53);
$white: rgb(255, 255, 255);
$purple: rgb(93, 52, 110);
$black: rgb(0, 0, 0);
$green: rgb(0, 79, 39);
$yellow: rgb(246, 255, 0);

body {
    padding: 25px;
}

// table
.sw-table {
  border-collapse: separate;

  thead {
    background-color: $orange;
    color: $white;
    font-size: 15px;

    th {
      border: none !important;
      font-weight: 600;

      &:first-child {
        border-top-left-radius: 10px;
        padding-left: 25px;
      }

      &:last-child {
        border-top-right-radius: 10px;
      }
    }
  }

  tbody {
    color: $black;

    tr {
      td {
        border-color: $greyish;
        padding-top: 10px;
        padding-bottom: 10px !important;
      }
            
            &:first-child {
                    td div {
                        border-top: 0 !important;
                    }
            }

      td:first-child {
        border-left: 1px solid $greyish;
        padding-left: 25px;
        padding-top: 0;
        padding-right: 0;
        border-top: none;
                    div {
                        border-top: 1px solid $greyish; 
                        padding-top: 10px; 
                        padding-right: 8px;
                    }            
      }

      td:last-child {
        border-right: 1px solid $greyish;
                    padding-top: 0;
                    padding-left: 0;
                    border-top: 0;
                    padding-right: 25px;
                    div {
                        border-top: 1px solid $greyish; 
                        padding-top: 10px; 
                        padding-left: 8px;
                        text-align: right;
                    }     
      }

      &:first-child td {
        border-top: none;
      }

      &:last-child td {
        border-bottom: 1px solid $greyish;

        &:first-child {
           border-bottom-left-radius: 10px;
        }

    ...