ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Forums: Various fixes for topic preview (#2523)

Browse Source
This commit is contained in:
Alexander Zinchuk 2023-02-08 00:48:02 +01:00
parent 18ce05d7fe
commit 4ca6bf0952
1 changed files with 28 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/components/common/ChatForumLastMessage.module.scss
View File

@ -1,12 +1,15 @@
$radius: 0.5rem;
.root {
--radius: 0.5rem;
--first-column-background-color: var(--color-item-active);
:global(.is-ios) & {
--radius: 0.75rem;
}
display: flex;
min-width: 0;
overflow: hidden;
margin-inline-end: 0.25rem;
margin-inline-end: 0.5rem;
flex-direction: column;
align-items: flex-start;
@ -42,6 +45,10 @@ $radius: 0.5rem;
&.main-column, &.last-message {
padding: 0 0.25rem;
:global(.is-ios) & {
padding: 0 0.375rem;
}
}
&.main-column, &.last-message, .after-wrapper {
@ -57,8 +64,9 @@ $radius: 0.5rem;
}
.main-column {
border-start-start-radius: $radius;
border-start-end-radius: $radius;
border-start-start-radius: var(--radius);
border-start-end-radius: var(--radius);
border-end-end-radius: var(--radius);
max-width: 100%;
@ -66,18 +74,16 @@ $radius: 0.5rem;
pointer-events: initial;
border-end-end-radius: $radius;
.after-wrapper {
width: $radius;
height: $radius;
width: var(--radius);
height: var(--radius);
bottom: 0;
position: absolute;
inset-inline-end: -$radius;
inset-inline-end: calc(var(--radius) * -1);
}
.after {
border-end-start-radius: $radius;
border-end-start-radius: var(--radius);
background: var(--background-color);
width: 100%;
height: 100%;
@ -107,8 +113,8 @@ $radius: 0.5rem;
}
.last-message {
border-end-start-radius: $radius;
border-end-end-radius: $radius;
border-end-start-radius: var(--radius);
border-end-end-radius: var(--radius);
max-width: 100%;
@ -117,15 +123,15 @@ $radius: 0.5rem;
position: relative;
.after-wrapper {
width: $radius;
height: $radius;
width: var(--radius);
height: var(--radius);
top: 0;
position: absolute;
inset-inline-end: -$radius;
inset-inline-end: calc(var(--radius) * -1);
}
.after {
border-start-start-radius: $radius;
border-start-start-radius: var(--radius);
background: var(--background-color);
width: 100%;
height: 100%;
@ -138,7 +144,11 @@ $radius: 0.5rem;
}
.last-message {
border-start-end-radius: $radius;
border-start-end-radius: var(--radius);
:global(.is-ios) & {
border-start-end-radius: var(--radius);
}
}
}