From 33c0f256e5c93bb55156d90913dba1ae5d3b980d Mon Sep 17 00:00:00 2001 From: kolaente Date: Sat, 24 Oct 2020 12:26:25 +0200 Subject: [PATCH 1/3] Start fixing Issue & PR title on mobile Signed-off-by: kolaente --- templates/repo/issue/view_title.tmpl | 22 +++++------ web_src/js/index.js | 1 + web_src/less/_repository.less | 57 +++++++++++++++++----------- 3 files changed, 46 insertions(+), 34 deletions(-) diff --git a/templates/repo/issue/view_title.tmpl b/templates/repo/issue/view_title.tmpl index a916f7ca173f7..11c93e5df37e9 100644 --- a/templates/repo/issue/view_title.tmpl +++ b/templates/repo/issue/view_title.tmpl @@ -1,20 +1,20 @@
-
-

+
+ {{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}} +
+
+
{{.i18n.Tr "repo.issues.edit"}}
+ + +
+
+ {{end}} +

#{{.Issue.Index}} {{RenderEmoji .Issue.Title}}

- {{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}} -
-
-
{{.i18n.Tr "repo.issues.edit"}}
- - -
-
- {{end}}
{{if .HasMerged}}
{{svg "octicon-git-merge"}} {{.i18n.Tr "repo.pulls.merged"}}
diff --git a/web_src/js/index.js b/web_src/js/index.js index 489651e3b1325..c25bce1d005ea 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 0c8939181f542..cfeea6e9f038d 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -632,36 +632,47 @@ .title { padding-bottom: 0 !important; - h1 { - font-weight: 300; - font-size: 2.3rem; - margin-bottom: 5px; + .issue-title { - .ui.input { - font-size: .5em; - vertical-align: top; - width: 50%; - min-width: 600px; + &.edit-active { + display: flex; + } + + h1 { + font-weight: 300; + font-size: 2.3rem; + margin-bottom: 5px; + + .ui.input { + font-size: .5em; + vertical-align: top; + width: 50%; + min-width: 600px; - input { - font-size: 1.5em; - padding: 6px 10px; + input { + font-size: 1.5em; + padding: 6px 10px; + } } } - } - .index { - font-weight: 300; - color: #aaaaaa; - letter-spacing: -1px; - } + .edit-buttons { + float: right; + } - .label { - margin-right: 10px; - } + .index { + font-weight: 300; + color: #aaaaaa; + letter-spacing: -1px; + } - .edit-zone { - margin-top: 10px; + .label { + margin-right: 10px; + } + + .edit-zone { + margin-top: 10px; + } } } From a00fb843348caf440d34b8541a1543305b7595bb Mon Sep 17 00:00:00 2001 From: kolaente Date: Sat, 24 Oct 2020 12:30:21 +0200 Subject: [PATCH 2/3] Make sure the save & cancel buttons float right Signed-off-by: kolaente --- templates/repo/issue/view_title.tmpl | 18 +++++++++++------- web_src/less/_repository.less | 2 +- 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/templates/repo/issue/view_title.tmpl b/templates/repo/issue/view_title.tmpl index 11c93e5df37e9..255be2013a094 100644 --- a/templates/repo/issue/view_title.tmpl +++ b/templates/repo/issue/view_title.tmpl @@ -1,13 +1,9 @@
{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}} -
-
-
{{.i18n.Tr "repo.issues.edit"}}
- - -
-
+
+
{{.i18n.Tr "repo.issues.edit"}}
+
{{end}}

#{{.Issue.Index}} {{RenderEmoji .Issue.Title}} @@ -15,6 +11,14 @@

+ {{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}} +
+
+ + +
+
+ {{end}}
{{if .HasMerged}}
{{svg "octicon-git-merge"}} {{.i18n.Tr "repo.pulls.merged"}}
diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index cfeea6e9f038d..ae47ef39423bb 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -656,7 +656,7 @@ } } - .edit-buttons { + .edit-button { float: right; } From f5553870db580f3b18615bd070f8e1b3483942fa Mon Sep 17 00:00:00 2001 From: kolaente Date: Sat, 24 Oct 2020 13:58:24 +0200 Subject: [PATCH 3/3] Fix edit buttons and title input on mobile --- templates/repo/issue/view_title.tmpl | 6 ++-- web_src/less/_repository.less | 49 +++++++++++++++++++++++++--- 2 files changed, 46 insertions(+), 9 deletions(-) diff --git a/templates/repo/issue/view_title.tmpl b/templates/repo/issue/view_title.tmpl index 255be2013a094..336b8850c2887 100644 --- a/templates/repo/issue/view_title.tmpl +++ b/templates/repo/issue/view_title.tmpl @@ -13,10 +13,8 @@ {{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}}
-
- - -
+ +
{{end}}
diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index ae47ef39423bb..46d8376c138c3 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -633,31 +633,70 @@ padding-bottom: 0 !important; .issue-title { + margin-bottom: .5rem; &.edit-active { display: flex; + align-items: center; + + 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; + } + } + } + } } h1 { font-weight: 300; font-size: 2.3rem; - margin-bottom: 5px; + margin: 0; + padding-right: .5rem; .ui.input { font-size: .5em; - vertical-align: top; - width: 50%; - min-width: 600px; + width: 100%; input { font-size: 1.5em; - padding: 6px 10px; + padding: 6px 1rem; } } } .edit-button { float: right; + padding-left: 1rem; + } + + .edit-buttons { + display: flex; } .index {