mirror of
https://github.com/discourse/discourse.git
synced 2025-03-09 14:34:35 +00:00
UX: Fix excess line breaks in login modal alerts (#12104)
This commit is contained in:
parent
fb83757edb
commit
355b8f69af
@ -27,18 +27,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.d-modal.login-modal {
|
|
||||||
#modal-alert:empty {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal-alert:not(:empty) {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Create Account + Login
|
// Create Account + Login
|
||||||
.d-modal.create-account,
|
.d-modal.create-account,
|
||||||
.d-modal.login-modal {
|
.d-modal.login-modal {
|
||||||
@ -56,6 +44,19 @@
|
|||||||
right: 1em;
|
right: 1em;
|
||||||
z-index: z("max");
|
z-index: z("max");
|
||||||
}
|
}
|
||||||
|
#modal-alert {
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: inline-block;
|
||||||
|
// if you want to use flexbox here make sure child elements like <b> don't cause line breaks
|
||||||
|
padding: 1em 3.5em 1em 1em; // large right padding to make sure long text isn't under the close button
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
margin-bottom: 0;
|
||||||
|
min-height: 35px;
|
||||||
|
}
|
||||||
|
#modal-alert:empty {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
.login-welcome-header {
|
.login-welcome-header {
|
||||||
z-index: z("modal", "content");
|
z-index: z("modal", "content");
|
||||||
display: grid;
|
display: grid;
|
||||||
|
@ -13,9 +13,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
#modal-alert {
|
|
||||||
padding: 15px 16px;
|
|
||||||
}
|
|
||||||
.btn-flat.btn.modal-close svg {
|
.btn-flat.btn.modal-close svg {
|
||||||
color: rgba(var(--primary-rgb), 0.5);
|
color: rgba(var(--primary-rgb), 0.5);
|
||||||
&:hover {
|
&:hover {
|
||||||
@ -52,13 +49,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#modal-alert {
|
|
||||||
max-width: 100%;
|
|
||||||
margin-bottom: 0;
|
|
||||||
padding: 8px 50px 8px 16px;
|
|
||||||
min-height: 35px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tip {
|
.tip {
|
||||||
display: block;
|
display: block;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user