Update elevation strokes

[beervoley]

Description

This change will update visuals for TextControlElevationBorderBrush, ControlElevationBorderBrush and AccentControlElevationBorderBrush to match the colors of the design.

Motivation and Context

At this time color interpolation starts at the wrong coordinates (in the brushes listed above) in the elevation border brushes what causes the color of the border's bottom stroke be incorrect. This PR fixes it.

I've also made some changes to TextControlElevationBorderFocusedBrush, however this change doesn't change visual (only a very little bit) but makes the start and end points of the gradient whole numbers.

How Has This Been Tested?

Manually

Screenshots (if appropriate):

Neutral Component (ComboBox):

TextBox:

Focused TextBox:

Accent Button:

[beervoley]

/azp run

[azure-pipelines]

Azure Pipelines successfully started running 1 pipeline(s).

[jevansaks]

Two stops at the same coordinate seems odd, especially when there's not a stop at 0. What does this mean?

[beervoley]

@jevansaks @tashatitova

StartPoint="0,0" EndPoint="0,2"
<GradientStop Offset="1.0" Color="{ThemeResource SystemAccentColorDark1}"/>
<GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorDefault}"/>

As I understand it: here we have StartPoint=0,0 and EndPoint=0,2; by setting both stops to 1 we get the bottom stroke of the border to be one solid color (in this case SystemAccentColorDark1) and not interpolate between SystemAccentColorDark1 and ControlStrokeColorDefault at all until we reach end point 0,2. After we reach that point (0,2) we'll switch the color to SystemAccentColorDark1. By doing this, we'll make sure that bottom stroke is one solid color and is not interpolated along the way until we reach the stop.

To see the difference:

StartPoint="0,0" EndPoint="0,2"
<GradientStop Offset="0.5" Color="Red"/>
<GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorDefault}"/>

In this case we'll draw the bottom stroke (1px height: Ofsset=0.5 out of height=2 yields 1px) with Red and interpolation will start right after that on the rounded corner and eventually reach ControlStrokeColorDefault: