diff options
author | Paladox none <thomasmulhall410@yahoo.com> | 2019-02-16 00:45:15 +0000 |
---|---|---|
committer | Paladox none <thomasmulhall410@yahoo.com> | 2019-03-08 15:32:52 +0000 |
commit | bfb77801ed74df8de45d1b29ba2b0991e7bea7f8 (patch) | |
tree | a219aec1868ef0cd6b720fd73aa988284faddd71 | |
parent | 002c7931e2265a54c3890348f9f6ee16d7f67765 (diff) |
Fix mobile display on gr-create-change-dialog
This fixes a issue where things did not look correctly on mobile.
Bug: Issue 10494
Change-Id: Ia152e17c9b132cb78845a5c1974cefc1e3a733a2
-rw-r--r-- | polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog.html | 133 |
1 files changed, 63 insertions, 70 deletions
diff --git a/polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog.html b/polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog.html index 987b63dab6..da1c871a9f 100644 --- a/polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog.html +++ b/polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog.html @@ -32,9 +32,6 @@ limitations under the License. <template> <style include="shared-styles"></style> <style include="gr-form-styles"> - :host { - display: inline-block; - } input:not([type="checkbox"]), gr-autocomplete, iron-autogrow-textarea { @@ -43,13 +40,6 @@ limitations under the License. .value { width: 32em; } - section { - align-items: center; - display: flex; - } - #description { - align-items: initial; - } gr-autocomplete { --gr-autocomplete: { padding: 0 .15em; @@ -58,68 +48,71 @@ limitations under the License. .hide { display: none; } + @media only screen and (max-width: 40em) { + .value { + width: 29em; + } + } </style> <div class="gr-form-styles"> - <div id="form"> - <section class$="[[_computeBranchClass(baseChange)]]"> - <span class="title">Select branch for new change</span> - <span class="value"> - <gr-autocomplete - id="branchInput" - text="{{branch}}" - query="[[_query]]" - placeholder="Destination branch"> - </gr-autocomplete> - </span> - </section> - <section class$="[[_computeBranchClass(baseChange)]]"> - <span class="title">Provide base commit sha1 for change</span> - <span class="value"> - <input - is="iron-input" - id="baseCommitInput" - maxlength="40" - placeholder="(optional)" - bind-value="{{baseCommit}}"> - </span> - </section> - <section> - <span class="title">Enter topic for new change</span> - <span class="value"> - <input - is="iron-input" - id="tagNameInput" - maxlength="1024" - placeholder="(optional)" - bind-value="{{topic}}"> - </span> - </section> - <section id="description"> - <span class="title">Description</span> - <span class="value"> - <iron-autogrow-textarea - id="messageInput" - class="message" - autocomplete="on" - rows="4" - max-rows="15" - bind-value="{{subject}}" - placeholder="Insert the description of the change."> - </iron-autogrow-textarea> - </span> - </section> - <section class$="[[_computePrivateSectionClass(_privateChangesEnabled)]]"> - <label - class="title" - for="privateChangeCheckBox">Private change</label> - <span class="value"> - <input - type="checkbox" - id="privateChangeCheckBox" - checked$="[[_formatBooleanString(privateByDefault)]]"> - </span> - </section> - </div> + <section class$="[[_computeBranchClass(baseChange)]]"> + <span class="title">Select branch for new change</span> + <span class="value"> + <gr-autocomplete + id="branchInput" + text="{{branch}}" + query="[[_query]]" + placeholder="Destination branch"> + </gr-autocomplete> + </span> + </section> + <section class$="[[_computeBranchClass(baseChange)]]"> + <span class="title">Provide base commit sha1 for change</span> + <span class="value"> + <input + is="iron-input" + id="baseCommitInput" + maxlength="40" + placeholder="(optional)" + bind-value="{{baseCommit}}"> + </span> + </section> + <section> + <span class="title">Enter topic for new change</span> + <span class="value"> + <input + is="iron-input" + id="tagNameInput" + maxlength="1024" + placeholder="(optional)" + bind-value="{{topic}}"> + </span> + </section> + <section id="description"> + <span class="title">Description</span> + <span class="value"> + <iron-autogrow-textarea + id="messageInput" + class="message" + autocomplete="on" + rows="4" + max-rows="15" + bind-value="{{subject}}" + placeholder="Insert the description of the change."> + </iron-autogrow-textarea> + </span> + </section> + <section class$="[[_computePrivateSectionClass(_privateChangesEnabled)]]"> + <label + class="title" + for="privateChangeCheckBox">Private change</label> + <span class="value"> + <input + type="checkbox" + id="privateChangeCheckBox" + checked$="[[_formatBooleanString(privateByDefault)]]"> + </span> + </section> </div> <gr-rest-api-interface id="restAPI"></gr-rest-api-interface> </template> |