discourse/app/assets/stylesheets/desktop/user.scss
Dan Ungureanu c047640ad4
FEATURE: Various improvements to invite system (#12023)
The user interface has been reorganized to show email and link invites
in the same screen. Staff has more control over creating and updating
invites. Bulk invite has also been improved with better explanations.

On the server side, many code paths for email and link invites have
been merged to avoid duplicated logic. The API returns better responses
with more appropriate HTTP status codes.
2021-03-03 11:45:29 +02:00

258 lines
3.8 KiB
SCSS

// Desktop styles for "/user" section
.user-content-wrapper {
&,
> .user-stream {
> .alert:first-child {
margin-top: 10px;
}
}
.show-mores {
position: absolute;
}
}
.form-horizontal .control-group.category {
margin-top: 18px;
}
.user-profile-hidden {
font-size: 1.5em;
text-align: center;
}
.user-secondary-navigation {
min-width: 150px;
.nav-stacked {
background-color: transparent;
li {
border-bottom: none;
&.archive {
padding-left: 1.4em;
}
}
a {
color: var(--primary-medium);
&.active {
color: var(--primary);
font-weight: bold;
background-color: transparent;
&:after {
display: none;
}
}
}
}
}
.user-content {
padding-bottom: 12px;
margin-bottom: 12px;
background-color: var(--secondary);
box-sizing: border-box;
&.user-badges-list {
display: flex;
flex-wrap: wrap;
}
.btn.right {
float: right;
}
h2 {
margin-bottom: 10px;
}
}
.pref-avatar {
.avatar {
max-width: 90px;
max-height: 90px;
}
}
.pref-second-factor {
margin-top: 10px;
}
.invite-controls .btn {
margin-right: 0px;
}
.user-invite-list {
width: 100%;
margin-top: 15px;
tr {
td {
padding: 0.667em;
&.actions {
white-space: nowrap;
width: 100px;
}
}
}
}
.user-invite-search {
clear: both;
margin: 15px 0px -15px 0px;
}
.user-invite-none {
padding: 15px 0;
}
.user-main {
margin-bottom: 50px;
.about {
&.group {
.details {
padding: 15px 0;
margin: 0;
color: var(--secondary);
}
}
.details {
img.avatar {
margin: 0 20px 10px 0;
}
.primary {
.primary-textual {
padding: 0 4px 4px;
a[href] {
text-decoration: underline;
}
h1 {
max-width: 100%;
@include ellipsis;
}
.location-and-website {
display: flex;
max-width: 100%;
@include ellipsis;
.user-profile-location {
margin-right: 1em;
}
}
}
.bio {
max-width: 750px;
a.mention {
text-decoration: none;
}
}
}
.secondary {
margin-top: 16px;
}
}
&.has-background {
.user-profile-image {
height: 300px;
}
.details {
box-sizing: border-box;
width: 100%;
padding: 15px 0 0 0;
bottom: 0;
}
}
.controls {
padding: 0 0 12px 0;
float: right;
text-align: right;
.btn {
min-width: 140px;
}
}
&.collapsed-info {
.user-profile-image {
display: none;
}
.controls {
width: auto;
> ul {
display: inline-flex;
> li {
display: inline-flex;
margin-left: 0.75em;
}
a {
width: auto;
}
}
}
.details {
position: relative;
padding: 0;
margin-top: 0;
border-bottom: 1px solid var(--primary-low);
}
}
}
.user-field {
input[type="text"] {
width: 530px;
}
.controls {
.instructions {
display: block;
}
}
}
.public-user-fields {
overflow: hidden;
}
}
.user-preferences {
padding-top: 10px;
padding-left: 30px;
.form-vertical {
width: 500px;
max-width: 100%;
}
h3 {
color: var(--primary);
margin: 20px 0 10px 0;
}
.category-selector,
.tag-chooser,
textarea,
input.user-selector,
.user-chooser {
width: 100%;
}
}
.user-crawler {
.username {
margin-left: 5px;
display: inline-block;
}
}