fix(VAppBar): border should set bottom border only

[jay-zahiri]

Description

When the attribute border is set to VAppBar, its border style ($app-bar-border) is not applied.

Added @include tools.border($app-bar-border...) to .v-app-bar.v-toolbar

.v-app-bar

  ...

  &.v-toolbar

    ...

    @include tools.border($app-bar-border...)

    ...

Markup:

<v-app-bar border></v-app-bar>

[johnleider]

This doesn't account for position="bottom". Also, I think if we are going to make any changes to this, we should consider removing elevation when .v-toolbar--border.

[jay-zahiri]

@johnleider

This doesn't account for position="bottom".

This can only be achieved using an attribute selector since no specific class exists for the location property. If the user does anything beyond top: 0px or bottom: 0px, then it is probably a "floating" bar and probably wants a border all around. Either way, you would be on your own to apply any custom visuals beyond that.

...we should consider removing elevation when .v-toolbar--border

Shouldn't this be up to the user? Isn't there a case where someone would want a border with elevation? And either way, box-shadow: none is applied by the tools.border function, so that should cover it, right?

// VAppBar/_variables.scss

...

$app-bar-border-thin-width: thin !default;

...

// VAppBar/VAppBar.sass

.v-app-bar

  ...

  &.v-toolbar

    ...

    @include tools.border($app-bar-border...)

    &--border
      &[style^="top: 0"],
      &[style*="; top: 0"],
      &[style*=";top: 0"],
      &[style^="top:0"],
      &[style*="; top:0"],
      &[style*=";top:0"]
        border-width: 0 0 $app-bar-border-thin-width

      &[style^="bottom: 0"],
      &[style*="; bottom: 0"],
      &[style*=";bottom: 0"],
      &[style^="bottom:0"],
      &[style*="; bottom:0"],
      &[style*=";bottom:0"]
        border-width: $app-bar-border-thin-width 0 0

    ...

[johnleider]

What about adding a new variable, layoutItemClasses and just apply a custom class, v-position--top | v-position--bottom.

Some pseudo code: