web/timeline: move horizontal padding to variable

This commit is contained in:
Tulir Asokan 2024-12-10 23:42:42 +02:00
parent 8052c29955
commit a31b309e2e
6 changed files with 13 additions and 8 deletions

View file

@ -81,6 +81,11 @@
--timeline-message-gap-small-event: 0;
--timeline-sender-name-timestamp-gap: .25rem;
--timeline-sender-name-content-gap: 0;
--timeline-horizontal-padding: 1.5rem;
@media screen and (max-width: 45rem) {
--timeline-horizontal-padding: .5rem;
}
@media (prefers-color-scheme: dark) {
color-scheme: dark;

View file

@ -16,7 +16,7 @@ main.matrix-main {
/ var(--room-list-width) 0 1fr 0 var(--right-panel-width);
}
@media screen and (max-width: 750px) {
@media screen and (max-width: 45rem) {
&.right-panel-open {
grid-template: "rightpanel" 1fr / 1fr;
> div.room-list-wrapper {

View file

@ -5,8 +5,8 @@ div.autocompletions-wrapper {
div.autocompletions {
position: absolute;
bottom: 1.2rem;
left: 1.6rem;
bottom: 1.25rem;
left: var(--timeline-horizontal-padding);
border: 1px solid var(--border-color);
border-radius: 0.5rem;
box-shadow: 0 0 1rem var(--modal-box-shadow-color);

View file

@ -1,5 +1,5 @@
div.message-composer {
margin: -1rem 1.6rem 0 1.6rem;
margin: -1rem var(--timeline-horizontal-padding) 0;
background-color: var(--composer-background-color);
border: 1px solid var(--border-color);
border-radius: 0.5rem;

View file

@ -1,7 +1,7 @@
div.typing-notifications {
grid-area: typing;
height: 1.6rem;
margin: 0 1.6rem;
margin: 0 var(--timeline-horizontal-padding);
display: flex;
gap: 0.5rem;
align-items: center;

View file

@ -1,7 +1,7 @@
div.timeline-event {
width: calc(100% - 2 * 1.6rem);
max-width: calc(100% - 2 * 1.6rem);
padding: 0 1.6rem;
width: calc(100% - 2 * var(--timeline-horizontal-padding));
max-width: calc(100% - 2 * var(--timeline-horizontal-padding));
padding: 0 var(--timeline-horizontal-padding);
display: grid;
grid-template:
"cmc cmc cmc cmc" 0