e4990b8c08
Resolve "Admin/Overview/Users mobile view"
## What does this MR do?
Fixes mobile layout issues on `/admin/users` page.
* Fixes control element placement when long usernames or email addresses overflow their container
* Fixes condensed dropdown menu (issue caused by acde2e30
)
Before:
![Screen_Shot_2016-09-28_at_3.29.11_PM](/uploads/82cd27c367653beb29425065685274dd/Screen_Shot_2016-09-28_at_3.29.11_PM.png)
![Screen_Shot_2016-09-29_at_23.36.40](/uploads/e739638506388be9c5a0709e5f22b298/Screen_Shot_2016-09-29_at_23.36.40.png)
After:
![Screen_Shot_2016-10-24_at_11.55.32_PM](/uploads/ab6e49da85688d9fd2abc49de238a5bf/Screen_Shot_2016-10-24_at_11.55.32_PM.png)
## Are there points in the code the reviewer needs to double check?
Ensure css changes don't have any side effects elsewhere in GitLab. (I don't think they would...)
## Does this MR meet the acceptance criteria?
- [x] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG.md) entry added
- Tests
- [x] All builds are passing
- [x] Conform by the [merge request performance guides](http://docs.gitlab.com/ce/development/merge_request_performance_guidelines.html)
- [x] Conform by the [style guides](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CONTRIBUTING.md#style-guides)
- [x] Branch has no merge conflicts with `master` (if it does - rebase it please)
- [x] [Squashed related commits together](https://git-scm.com/book/en/Git-Tools-Rewriting-History#Squashing-Commits)
## What are the relevant issue numbers?
Closes #22746
See merge request !7087
162 lines
2 KiB
SCSS
162 lines
2 KiB
SCSS
/**
|
|
* Admin area
|
|
*
|
|
*/
|
|
.admin-dashboard {
|
|
.data {
|
|
a {
|
|
h1 {
|
|
line-height: 48px;
|
|
font-size: 48px;
|
|
padding: 20px;
|
|
text-align: center;
|
|
font-weight: normal;
|
|
}
|
|
}
|
|
}
|
|
|
|
.str-truncated {
|
|
max-width: 60%;
|
|
}
|
|
}
|
|
|
|
.admin-filter form {
|
|
.select2-container {
|
|
width: 100%;
|
|
}
|
|
|
|
.controls {
|
|
margin-left: 130px;
|
|
}
|
|
|
|
.form-actions {
|
|
padding-left: 130px;
|
|
background: #fff;
|
|
}
|
|
|
|
.visibility-levels {
|
|
.controls {
|
|
margin-bottom: 9px;
|
|
}
|
|
|
|
i {
|
|
color: inherit;
|
|
}
|
|
}
|
|
}
|
|
|
|
.broadcast-messages {
|
|
.message {
|
|
line-height: 2;
|
|
}
|
|
}
|
|
|
|
.broadcast-message {
|
|
@extend .alert-warning;
|
|
padding: 10px;
|
|
text-align: center;
|
|
|
|
> div,
|
|
p {
|
|
display: inline;
|
|
margin: 0;
|
|
|
|
a {
|
|
color: inherit;
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
|
|
.broadcast-message-preview {
|
|
@extend .broadcast-message;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
// Users List
|
|
|
|
.users-list {
|
|
.user-row {
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.user-details {
|
|
flex: 1 1 auto;
|
|
overflow: hidden;
|
|
padding-right: 8px;
|
|
}
|
|
|
|
.user-name {
|
|
display: inline-block;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.user-name,
|
|
.user-email {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.dropdown {
|
|
.btn-block {
|
|
margin-bottom: 0;
|
|
line-height: inherit;
|
|
}
|
|
}
|
|
|
|
.label-default {
|
|
color: $btn-transparent-color;
|
|
}
|
|
}
|
|
|
|
.abuse-reports {
|
|
.table {
|
|
table-layout: fixed;
|
|
}
|
|
|
|
.subheading {
|
|
padding-bottom: $gl-padding;
|
|
}
|
|
|
|
.message {
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.btn {
|
|
white-space: normal;
|
|
padding: $gl-btn-padding;
|
|
}
|
|
|
|
th {
|
|
width: 15%;
|
|
|
|
&.wide {
|
|
width: 55%;
|
|
}
|
|
}
|
|
|
|
@media (max-width: $screen-sm-max) {
|
|
th {
|
|
width: 100%;
|
|
}
|
|
|
|
td {
|
|
width: 100%;
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
.no-reports {
|
|
.emoji-icon {
|
|
margin-left: $btn-side-margin;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
span {
|
|
font-size: 19px;
|
|
}
|
|
}
|
|
}
|