-
Notifications
You must be signed in to change notification settings - Fork 292
feat: add Button component and styles #2914
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.
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
Conversation
|
Size Change: +638 B (+0.22%) Total Size: 290 kB
ℹ️ View Unchanged
|
Co-authored-by: Oliver Lazoroski <[email protected]>
ea082d9 to
9ced247
Compare
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #2914 +/- ##
==========================================
+ Coverage 80.02% 80.13% +0.11%
==========================================
Files 506 511 +5
Lines 10777 10788 +11
Branches 2709 2709
==========================================
+ Hits 8624 8645 +21
+ Misses 1900 1890 -10
Partials 253 253 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
src/styling/base.scss
Outdated
| box-sizing: border-box; | ||
| font-family: var(--typography-font-family-sans), system-ui, -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, sans-serif; | ||
| font-size: var(--typography-font-size-md); | ||
|
|
||
| * { | ||
| box-sizing: border-box; | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
| box-sizing: border-box; | |
| font-family: var(--typography-font-family-sans), system-ui, -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, sans-serif; | |
| font-size: var(--typography-font-size-md); | |
| * { | |
| box-sizing: border-box; | |
| } | |
| font-family: var(--typography-font-family-sans), system-ui, -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, sans-serif; | |
| font-size: var(--typography-font-size-md); |
We shouldn't need these as these should be part of the modern-normalize package.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done: 0b3cbcd
🎯 Goal
Add new low-level
Buttoncomponent and corresponding styles.🛠 Implementation details
We can achieve different default button styles by combining the following groups of CSS classes:
Hierarchy (in some way)
str-chat__button--primary/str-chat__button--secondary/str-chat__button--destructiveLook
str-chat__button--solid/str-chat__button--outline/str-chat__button--ghostShadow
str-chat__button--floatingButtons also change upon:
:hover:active:focus-visible:disabled🎨 UI Changes
figma