UX: Mobile consistency for topic status messages (#12828)
This commit is contained in:
parent
c0bd7db799
commit
b3cf483813
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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
|
||||||
|
|
Loading…
Reference in New Issue