discourse/app/assets/stylesheets/common/base/activation.scss
Kris 66663da584
UX: left-align account activation content (#39811)
We had some wonky mixed alignment here (in both Horizon and Foundation),
but generally all the invite stuff is left aligned... so this gets it
back to consistent

Before:
<img width="700" alt="image"
src="https://github.com/user-attachments/assets/19c47b40-8769-476a-823d-3230c0121fcd"
/>

After: 
<img width="550" alt="image"
src="https://github.com/user-attachments/assets/c3ef0a5f-30ce-480c-b989-04d68a2d15ee"
/>
2026-05-07 09:48:11 -04:00

71 lines
1.2 KiB
SCSS
Vendored

// Styles used before the user is logged into discourse. For example, activating their
// account or changing their email.
.account-created-page,
.activate-account-page {
background: var(--secondary);
#main-outlet {
padding: 0;
height: 100%;
}
.above-main-container-outlet {
display: none;
}
}
.activate-account-page .alert-error {
margin: 1em;
}
.account-created,
.activate-account {
max-width: 500px;
padding: 2rem 3rem;
background: var(--secondary);
margin: 10vh auto 1em auto;
@media screen and (height <= 700px) {
margin: 1em auto 1em auto;
}
}
.account-created {
.ac-message {
font-size: var(--font-up-1);
line-height: var(--line-height-large);
}
.activation-controls {
display: flex;
flex-wrap: wrap;
gap: 0.5em;
margin-top: 1em;
}
.edit-cancel {
text-transform: capitalize;
}
.success-info p:last-child {
margin-bottom: 0;
}
}
.activate-account {
.activate-account-button,
.continue-button {
margin-top: 1em;
display: block;
width: fit-content;
}
.login-welcome-header {
width: fit-content;
}
.tada-image {
width: 150px;
padding-bottom: 1em;
}
}