Add a vertical rule helper class

[coliff]

Prerequisites

• I have searched for duplicate or closed feature requests
• I have read the contributing guidelines

Proposal

We sometimes need to use vertical rules in web apps and navbars. It'd be helpful to have a .vr vertical rule class in Modus Bootstrap. Bootstrap v5 has one so I propose that we port that over. The CSS for it is very small:

.vr {
  display: inline-block;
  align-self: stretch;
  width: 1px;
  min-height: 1em;
  background-color: currentColor;
  opacity: 0.25;
}

Motivation and context

I've used this on RouteReporter for some content in panels and the navbar to separate the Trimble logo and the app name. I'd like to use the same CSS/HTML on other webapps so I think it might make sense to add to Modus Bootstrap.

REF: https://github.com/twbs/bootstrap/blob/main/scss/helpers/_vr.scss
https://getbootstrap.com/docs/5.3/helpers/vertical-rule/