feat: Implement typing indicator theme-v2 #95 #130
Conversation
szuperaz
requested review from
arnautov-anton,
MartinCupela,
petyosi and
oliverlaz
| | `--str-chat__typing-indicator-border-block-start` | Top border of the component | | ||
| | `--str-chat__typing-indicator-border-block-end` | Bottom border of the component | | ||
| | `--str-chat__typing-indicator-border-inline-start` | Left (right in RTL layout) border of the component | | ||
| | `--str-chat__typing-indicator-border-inline-start` | Right (lrft in RTL layout) border of the component | |
There was a problem hiding this comment.
| | `--str-chat__typing-indicator-border-inline-start` | Right (lrft in RTL layout) border of the component | | |
| | `--str-chat__typing-indicator-border-inline-end` | Right (left in RTL layout) border of the component | |
There was a problem hiding this comment.
Thanks, that is a copy-paste mistake copied a lot of times 😀, will take care of this everywhere
There was a problem hiding this comment.
Will fix this after the ongoing PRs merged into theming-v2
| --str-chat__typing-indicator-border-inline-start: none; | ||
| --str-chat__typing-indicator-border-inline-end: none; | ||
| --str-chat__typing-indicator-box-shadow: none; | ||
| --str-chat__typing-indicator-dot-background-color: var(--str-chat__text-color); |
There was a problem hiding this comment.
| --str-chat__typing-indicator-dot-background-color: var(--str-chat__text-color); | |
| --str-chat__typing-indicator__dot-background-color: var(--str-chat__text-color); |
Nitpick: I'm not sure how closely BEM is followed across other files but, I think dot represents an element. This just caught my eye :)
There was a problem hiding this comment.
In theme-v2 for CSS variables we use camel-case after the str-chat__ prefix
There was a problem hiding this comment.
I think BEM is just for class names, but I'm happy to be corrected. Let's stick to snake-case for CSS variables.
There was a problem hiding this comment.
Unfortunately, our CSS class names are not 100% consistent, it's mostly BEM, but there are exceptions, the only consistent part is the str-chat__ prefix.
There was a problem hiding this comment.
#135 created an issue to create some lint rules to check class and variable names
|
🎉 This PR is included in version 3.0.0-theming2.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 3.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
🎯 Goal
Describe why we are making this change
🛠 Implementation details
Provide a description of the implementation
🎨 UI Changes
GetStream/stream-chat-angular#315
closes #95