diff options
| author | kolaente <k@knt.li> | 2020-10-24 18:48:08 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2020-10-24 19:48:08 +0300 |
| commit | f24392391eaaa19bb42cb59772a03d2dace3b77c (patch) | |
| tree | edb5bb5f763e91f9c7ecb89882d6c8a70a75f3c3 /web_src | |
| parent | 4099e4f1b6eba1722f1e5d4f0b411f0a4a9970c2 (diff) | |
| download | gitea-f24392391eaaa19bb42cb59772a03d2dace3b77c.tar.gz gitea-f24392391eaaa19bb42cb59772a03d2dace3b77c.zip | |
Fix PR/Issue titles on mobile (#13292)
* Start fixing Issue & PR title on mobile
Signed-off-by: kolaente <k@knt.li>
* Make sure the save & cancel buttons float right
Signed-off-by: kolaente <k@knt.li>
* Fix edit buttons and title input on mobile
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Diffstat (limited to 'web_src')
| -rw-r--r-- | web_src/js/index.js | 1 | ||||
| -rw-r--r-- | web_src/less/_repository.less | 96 |
2 files changed, 74 insertions, 23 deletions
diff --git a/web_src/js/index.js b/web_src/js/index.js index 489651e3b1..c25bce1d00 100644 --- a/web_src/js/index.js +++ b/web_src/js/index.js @@ -792,6 +792,7 @@ async function initRepository() { $('#pull-desc').toggle(); $('#pull-desc-edit').toggle(); $('.in-edit').toggle(); + $('#issue-title-wrapper').toggleClass('edit-active'); $editInput.focus(); return false; }; diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index 0c8939181f..46d8376c13 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -632,36 +632,86 @@ .title { padding-bottom: 0 !important; - h1 { - font-weight: 300; - font-size: 2.3rem; - margin-bottom: 5px; + .issue-title { + margin-bottom: .5rem; - .ui.input { - font-size: .5em; - vertical-align: top; - width: 50%; - min-width: 600px; + &.edit-active { + display: flex; + align-items: center; - input { - font-size: 1.5em; - padding: 6px 10px; + h1 { + display: flex; + width: 100%; + } + + @media only screen and (max-width: 768px) { + flex-direction: column; + + h1 { + margin-right: 0; + margin-bottom: 1rem; + padding-right: 0; + + .ui.input input { + width: calc(100% - 2rem); + } + } + + .edit-buttons { + padding-bottom: 1rem; + width: 100%; + + .button { + width: 100%; + margin-right: .5rem; + + &:last-child { + margin-right: 0; + } + } + } } } - } - .index { - font-weight: 300; - color: #aaaaaa; - letter-spacing: -1px; - } + h1 { + font-weight: 300; + font-size: 2.3rem; + margin: 0; + padding-right: .5rem; - .label { - margin-right: 10px; - } + .ui.input { + font-size: .5em; + width: 100%; - .edit-zone { - margin-top: 10px; + input { + font-size: 1.5em; + padding: 6px 1rem; + } + } + } + + .edit-button { + float: right; + padding-left: 1rem; + } + + .edit-buttons { + display: flex; + } + + .index { + font-weight: 300; + color: #aaaaaa; + letter-spacing: -1px; + } + + .label { + margin-right: 10px; + } + + .edit-zone { + margin-top: 10px; + } } } |