style(TopBar): fit two-lines with normal line-height #12851
Conversation
|
Can you have rooms and descriptions with q, p and y ? :P |
They're not clipped at my machine anyway 🙈 |
Antreesy
force-pushed
the
fix/12800/two-lines-topbar
branch
from
da5fc1a
to
a9a3c00
Compare
src/components/TopBar/TopBar.vue
Outdated
| @@ -358,6 +359,7 @@ export default { | |||
| text-overflow: ellipsis; | |||
| } | |||
| .description { | |||
| font-size: var(--font-size-small, 13px); | |||
There was a problem hiding this comment.
Shouldn't the fallback here be the --default-font-size?
There was a problem hiding this comment.
You're right. adjusted. Here's the diff from stable29:
Header is thinner now by 7px, but still looks decent (and only desktop with older versions will be affected)
Antreesy
force-pushed
the
fix/12800/two-lines-topbar
branch
from
a9a3c00
to
52428e9
Compare
…tion font size Signed-off-by: Maksim Sukharev <[email protected]>
Antreesy
force-pushed
the
fix/12800/two-lines-topbar
branch
from
52428e9
to
fc30a70
Compare
| @@ -303,17 +303,21 @@ export default { | |||
|
|
|||
| <style lang="scss" scoped> | |||
| .top-bar { | |||
| --border-width: 1px; | |||
| // hardcoded 1.5 value of line-height for compatibility with older versions | |||
| --text-height: calc(1.5 * (var(--default-font-size) + var(--font-size-small, 15px))); | |||
There was a problem hiding this comment.
Why default small size to 15px? Do we want to backport it to 29?
There was a problem hiding this comment.
Font size shouldn't change for Desktop client against 29, am I right?
There was a problem hiding this comment.
It will use server styles required for the current Talk version.
Otherwise it's more painful and we would need support not only different backend versions but also styles on frontend
There was a problem hiding this comment.
Please adjust in your follow up, when possible. I'm not getting it fully still 🤔
There was a problem hiding this comment.
Was 15px added here only for the Desktop client?
There was a problem hiding this comment.
We adjusted in libraries like @nextcloud/vue because it is used on multiple versions.
Did we do it on Talk?
There was a problem hiding this comment.
This PR is not backported and adapts to new styles and variables, which is necessary for Talk web on 30 🤔
There was a problem hiding this comment.
I meant he iconSize, which depends on server styles and not the Talk version
42e9191#diff-841f2c9a1004d8fafe1e1f6fe44412b062860ea277a4ddc071068f7f2a162e7dR156-R157
There was a problem hiding this comment.
It's better to get it from variable anyway. Same as with other constant values in styles.
☑️ Resolves
🖌️ UI Checklist
🖼️ Screenshots / Screencasts
🏁 Checklist