Working with styling Bootstrap Buttons

Button theming:

Re-styling the actual button classes is super easy, just add in the class and class:hover into your css, add colors and bing-bang-boom! So awesome!

Example - Change the btn-primary colors

.btn-primary {
  background-color:#09367a;
  color: #fff;
}
.btn-primary:hover {
  color: #fff;
  background-color: #0b5ed7;
  border-color: #0a58ca;
}

Bootstrap 5 Buttons: https://getbootstrap.com/docs/5.0/components/buttons/

---

Other useful tidbit regarding this theme and how it sets up button classes in the template.php file: I had to override the button code on how Bootstrap 5 Lite(theme) assigns css classes to certain buttons. I have some custom forms that also include Cancel buttons, and I was trying to set those to the btn-secondary class, but the Bootstrap 5 Lite(theme)->template.php code would override it with a btn-default class. I had to turn that off but thank goodness that is a possibility. Also, the weird thing is that Bootstrap(css framework) does not have an actual btn-default class so there is no button actually rendered when that class gets added which was throwing me off when I first encountered it. So, I had to, in my custom theme folder, create a template.php file, and in that file I copied the code from the Bootstrap 5 Lite(theme)->template file that pertained to buttons, and commented out a line to stop the unwanted overriding of my class decleration in my custom form. See here:

Copied from Bootstrap 5 Lite(theme)->template.php

function bootstrap5_lite_button($variables) {
  if (isset($variables['element']['#attributes']['class'])) {
    $default = TRUE;
    foreach ($variables['element']['#attributes']['class'] as $key => $class) {
      if (FALSE !== strpos($class, 'secondary')) {
        if ($variables['element']['#id'] == 'edit-delete') {
          $variables['element']['#attributes']['class'][$key] = 'btn-danger';
          $default = FALSE;
        }
        else {
          $class = $variables['element']['#attributes']['class'][$key] = str_replace('secondary', 'default', $class);
        }
      }
      if (FALSE !== strpos($class, 'button')) {
        $variables['element']['#attributes']['class'][$key] = str_replace('button', 'btn', $class);
        $default = FALSE;
      }
    }
    if ($default) {
      $variables['element']['#attributes']['class'][] = 'btn-default';
    }
  }
  else {
    $variables['element']['#attributes']['class'][] = 'btn-primary';
  }

  $variables['element']['#attributes']['class'][] = 'btn';
  return theme_button($variables);
}

TO mycustomtheme->template.php and commented out the following line:

//$class = $variables['element']['#attributes']['class'][$key] = str_replace('secondary', 'default', $class);