Browse Source

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
tags/v1.18.0-dev
Gusted 2 years ago
parent
commit
ca4b920bbc
No account linked to committer's email address
1 changed files with 24 additions and 0 deletions
  1. 24
    0
      web_src/less/_repository.less

+ 24
- 0
web_src/less/_repository.less View File

@@ -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;
}
}
}
}
}

Loading…
Cancel
Save