title: Highlight selected button when clicked in Vue
body: <p>I have a button that shows a table when clicked on. That's done with bootstrap vue. I made some :hover in the css that highlights it, but i want to keep it highlighted while the table is shown.</p>
  
  <p>the button and table look like this:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;b-btn v-b-toggle.collapse1 class="toggle-table-btn"&gt;Cardboard size&lt;/b-btn&gt;
  
   &lt;b-collapse id="collapse1" class="mt-2"&gt;
  
     &lt;b-table striped hover :items="(( table ))"&gt;&lt;/b-table&gt;
  
   &lt;/b-collapse&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>and the css</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.container .table-box .toggle-table-btn:hover {
      background-color: rgb(63, 63, 63);
      color: white;
  }</code></pre>
  </div>
  </div>
  </p>