Make repository file list useable on mobile (#19515)
* Make repository file list useable on mobile - When you're browsing a repository on mobile, you're met by a giant block called the "repository file list". The current design is not useable for mobile and is a big annoyance while browsing a repo on mobile. This PR removes that annoyance by making it more suitable design when on mobile. - Adds HTML for the commit/file time to align it vertically(noticeable on mobile, not on PC). - Show all information horizontally and not vertically. - Remove the last commit message of the file, there isn't enough space on mobile to place this anywhere, so we're not trying to make a best-effort here and instead just not display it. * Remove unnecessary `!important` * Fix broken HTML * Simplify code
This commit is contained in:
parent
3e8aa42a1b
commit
ca4b920bbc
1 changed files with 24 additions and 0 deletions
|
@ -3237,3 +3237,27 @@ td.blob-excerpt {
|
|||
transform: scale(105%);
|
||||
box-shadow: 0 .5rem 1rem var(--color-shadow) !important;
|
||||
}
|
||||
|
||||
@media @mediaSm {
|
||||
.repository.file.list {
|
||||
#repo-files-table {
|
||||
.entry,
|
||||
.commit-list {
|
||||
align-items: center;
|
||||
display: flex !important;
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
|
||||
td.age,
|
||||
th.age {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
td.message,
|
||||
span.commit-summary {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Reference in a new issue