Detail styling for account lists in reply dialog

* Use flex to lay out account lists
  * Stretch account entry to fill to end of row
  * Give account entry minimum width
  * Update margins and paddings accordingly

Change-Id: Id24f7cb67bb08816f9358098db8e538c4826052a
This commit is contained in:
Logan Hanks
2016-08-04 14:54:34 -07:00
parent 9e60c3771b
commit e247def043
4 changed files with 11 additions and 0 deletions

View File

@@ -23,6 +23,7 @@ limitations under the License.
<style> <style>
gr-autocomplete { gr-autocomplete {
display: inline-block; display: inline-block;
flex: 1;
overflow: hidden; overflow: hidden;
} }
</style> </style>

View File

@@ -23,6 +23,12 @@ limitations under the License.
<style> <style>
gr-account-chip { gr-account-chip {
display: inline-block; display: inline-block;
margin: 0 .2em .2em 0;
}
gr-account-entry {
display: flex;
flex: 1;
min-width: 10em;
} }
.group { .group {
--account-label-suffix: ' (group)'; --account-label-suffix: ' (group)';

View File

@@ -58,6 +58,7 @@ limitations under the License.
} }
.peopleList { .peopleList {
display: flex; display: flex;
padding-top: .1em;
} }
.peopleListLabel { .peopleListLabel {
color: #666; color: #666;
@@ -65,7 +66,9 @@ limitations under the License.
padding-right: .5em; padding-right: .5em;
} }
gr-account-list { gr-account-list {
display: flex;
flex: 1; flex: 1;
flex-wrap: wrap;
} }
#reviewerConfirmationOverlay { #reviewerConfirmationOverlay {
padding: 1em; padding: 1em;

View File

@@ -22,6 +22,7 @@ limitations under the License.
<style> <style>
input { input {
font-size: 1em; font-size: 1em;
width: 100%;
} }
input.borderless, input.borderless,
input.borderless:focus { input.borderless:focus {