UX: Mobile consistency for topic status messages (#12828)

This commit is contained in:
Kris 2021-04-26 18:55:50 -04:00 committed by GitHub
parent c0bd7db799
commit b3cf483813
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 35 additions and 38 deletions

View File

@ -861,6 +861,10 @@ blockquote > *:last-child {
color: var(--primary-medium); color: var(--primary-medium);
min-width: 0; // Allows flex container to shrink min-width: 0; // Allows flex container to shrink
button {
align-self: flex-start;
}
.custom-message { .custom-message {
flex: 1 1 100%; flex: 1 1 100%;
text-transform: none; text-transform: none;
@ -883,6 +887,7 @@ blockquote > *:last-child {
> p { > p {
margin: 0; margin: 0;
padding-right: 0.5em;
line-height: $line-height-medium; line-height: $line-height-medium;
flex: 1 1; flex: 1 1;
} }

View File

@ -117,6 +117,36 @@
} }
} }
.topic-status-info,
.topic-timer-info {
border-top: 1px solid var(--primary-low);
margin: 0;
max-width: 758px;
&:empty {
padding: 0;
}
span .d-icon {
font-size: $font-down-1;
}
.topic-timer-heading,
.slow-mode-heading {
display: flex;
align-items: center;
margin: 0;
padding: var(--below-topic-margin) 0;
}
.slow-mode-remove,
.topic-timer-modify {
display: flex;
margin-left: auto;
align-self: flex-start;
}
button {
font-size: $font-down-2;
background: transparent;
}
}
.title-wrapper { .title-wrapper {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;

View File

@ -59,31 +59,6 @@
} }
} }
.topic-status-info,
.topic-timer-info {
border-top: 1px solid var(--primary-low);
margin: 0;
&:empty {
padding: 0;
}
max-width: 758px;
.topic-timer-heading,
.slow-mode-heading {
display: flex;
align-items: center;
margin: 0;
padding: var(--below-topic-margin) 0;
}
.slow-mode-remove,
.topic-timer-modify {
margin-left: auto;
}
button {
font-size: $font-down-2;
background: transparent;
}
}
#topic-progress-wrapper { #topic-progress-wrapper {
position: fixed; position: fixed;
bottom: 0; bottom: 0;

View File

@ -28,19 +28,6 @@
} }
} }
.topic-timer-info {
padding-left: 10px;
border-top: 1px solid var(--primary-low);
padding-top: 10px;
h3 {
margin: 0;
display: flex;
button {
align-self: flex-start;
}
}
}
#topic-progress-wrapper { #topic-progress-wrapper {
position: fixed; position: fixed;
right: 10px; // match 10px padding on .wrap right: 10px; // match 10px padding on .wrap