Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Stroke alignment #36

Closed
TravisSpomer opened this issue Feb 17, 2021 · 1 comment
Closed

Stroke alignment #36

TravisSpomer opened this issue Feb 17, 2021 · 1 comment
Assignees
@TravisSpomer
Labels
css CSS-specific issues export Platform-specific export concerns winui WinUI-specific issues
Projects
What's going on

Comments

@TravisSpomer
Copy link
Member

Tokens for stroke alignment:

Inner

  • The most common alignment, for solid and transparent borders
  • The stroke is drawn inside the edge of the control on top of the control's fill
  • Figma: Inner stroke alignment
  • XAML: BackgroundSizing="OuterBorderEdge"
  • CSS: background-clip: border-box (default)

Outer

  • The stroke is drawn outside the control's fill on top of the content behind the control
  • Figma: Outer stroke alignment
  • XAML: BackgroundSizing="InnerBorderEdge" (default)
  • CSS: background-clip: padding-box (default)

(Neither property actually affects sizing of the element, either in layout or just visually—that would be border-box in CSS, with no WinUI equivalent.)

Something like:

ButtonPrimary-Box-Stroke-Alignment = Outer or Inner (default)
@TravisSpomer TravisSpomer added export Platform-specific export concerns question Further information is requested winui WinUI-specific issues css CSS-specific issues labels Feb 17, 2021
@TravisSpomer TravisSpomer added this to Soon in What's going on Feb 17, 2021
@TravisSpomer TravisSpomer removed this from Soon in What's going on Feb 17, 2021
@TravisSpomer TravisSpomer added this to Soon in What's going on Feb 18, 2021
@TravisSpomer TravisSpomer self-assigned this Feb 18, 2021
@TravisSpomer
Copy link
Member Author

This was implemented for both CSS and WinUI with this commit.

What's going on automation moved this from Soon to Recently finished Feb 18, 2021
@TravisSpomer TravisSpomer removed the question Further information is requested label Feb 18, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@TravisSpomer TravisSpomer

Labels
css CSS-specific issues export Platform-specific export concerns winui WinUI-specific issues
Projects
No open projects
What's going on
Recently finished
Milestone
No milestone
Development

No branches or pull requests
1 participant
@TravisSpomer