github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-20 14:39:48 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: Fix excess line breaks in login modal alerts (#12104)

Browse Source
This commit is contained in:
Kris 2021-02-16 21:22:49 -05:00 committed by GitHub
parent fb83757edb
commit 355b8f69af
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
app/assets/stylesheets/common/base/login.scss
View File

@ -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
.d-modal.create-account,
.d-modal.login-modal {
@ -56,6 +44,19 @@
right: 1em;
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 {
z-index: z("modal", "content");
display: grid;

10
app/assets/stylesheets/desktop/login.scss
View File

@ -13,9 +13,6 @@
}
}
}
#modal-alert {
padding: 15px 16px;
}
.btn-flat.btn.modal-close svg {
color: rgba(var(--primary-rgb), 0.5);
&:hover {
@ -52,13 +49,6 @@
}
}
#modal-alert {
max-width: 100%;
margin-bottom: 0;
padding: 8px 50px 8px 16px;
min-height: 35px;
}
.tip {
display: block;
overflow: hidden;