Remove fixed positioning of HTML UI elements.

Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Choose the boundaries based on the extremities of the elements
  (including border and padding), rather than their inner width/height.

Also, fix the new omnibox security icon in non-UI-development builds.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation

Committed: https://crrev.com/5799b40595a08411e54c9a2ee205a524c04568ad
Cr-Commit-Position: refs/heads/master@{#432013}

[cjgrant, 2016-11-10 21:50:44]

Description was changed from

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Chose the bounaries based on the extremeties of the elements
  (including border and padding), rather than their inner width/height.

BUG=641508
==========

to

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Chose the bounaries based on the extremeties of the elements
  (including border and padding), rather than their inner width/height.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation
==========

[cjgrant, 2016-11-10 21:53:38]

cjgrant@chromium.org changed reviewers:
+ bshe@chromium.org, joshcarpenter@chromium.org, mthiesse@chromium.org

[cjgrant, 2016-11-10 21:53:38]

Guys, I'm still testing and refining small bits of this, but it's 99% ready. 
Please rip into it mercilessly.  :)

[cjgrant, 2016-11-11 15:47:25]

Description was changed from

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Chose the bounaries based on the extremeties of the elements
  (including border and padding), rather than their inner width/height.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation
==========

to

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Choose the boundaries based on the extremities of the elements
  (including border and padding), rather than their inner width/height.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation
==========

[mthiesse, 2016-11-11 16:01:55]

lgtm, but my js/css reviews shouldn't count for much ;)

https://codereview.chromium.org/2490313002/diff/20001/chrome/browser/resource...
File chrome/browser/resources/vr_shell/vr_shell_ui.css (right):

https://codereview.chromium.org/2490313002/diff/20001/chrome/browser/resource...
chrome/browser/resources/vr_shell/vr_shell_ui.css:22: border: 1px sold red;
s/sold/solid? why red? Don't we want a transparent border?

[cjgrant, 2016-11-11 16:13:14]

https://codereview.chromium.org/2490313002/diff/20001/chrome/browser/resource...
File chrome/browser/resources/vr_shell/vr_shell_ui.css (right):

https://codereview.chromium.org/2490313002/diff/20001/chrome/browser/resource...
chrome/browser/resources/vr_shell/vr_shell_ui.css:22: border: 1px sold red;
On 2016/11/11 16:01:55, mthiesse wrote:
> s/sold/solid? why red? Don't we want a transparent border?

My mistake.  This was for debugging (to visualize margins), and it doesn't show
up because of the typo.  Two wrongs make a right!

[cjgrant, 2016-11-11 16:14:28]

https://codereview.chromium.org/2490313002/diff/20001/chrome/browser/resource...
File chrome/browser/resources/vr_shell/vr_shell_ui.css (right):

https://codereview.chromium.org/2490313002/diff/20001/chrome/browser/resource...
chrome/browser/resources/vr_shell/vr_shell_ui.css:22: border: 1px sold red;
On 2016/11/11 16:13:14, cjgrant wrote:
> On 2016/11/11 16:01:55, mthiesse wrote:
> > s/sold/solid? why red? Don't we want a transparent border?
> 
> My mistake.  This was for debugging (to visualize margins), and it doesn't
show
> up because of the typo.  Two wrongs make a right!

Done.

[bshe, 2016-11-14 16:04:53]

lgtm with nits

https://codereview.chromium.org/2490313002/diff/40001/chrome/browser/resource...
File chrome/browser/resources/vr_shell/vr_shell_ui.html (right):

https://codereview.chromium.org/2490313002/diff/40001/chrome/browser/resource...
chrome/browser/resources/vr_shell/vr_shell_ui.html:40:
src="../../../../ui/webui/resources/images/lock.svg">
looks like you also added secure icon to omnibox. Add this to CL description.

https://codereview.chromium.org/2490313002/diff/40001/chrome/browser/resource...
chrome/browser/resources/vr_shell/vr_shell_ui.html:42: <span
id="domain">www.url.com</span><span id="path">/path</span>
why do you need placeholder texts?

[cjgrant, 2016-11-14 16:57:47]

Description was changed from

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Choose the boundaries based on the extremities of the elements
  (including border and padding), rather than their inner width/height.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation
==========

to

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Choose the boundaries based on the extremities of the elements
  (including border and padding), rather than their inner width/height.

Also, fix the new omnibox security icon in non-UI-development builds.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation
==========

[cjgrant, 2016-11-14 16:58:29]

https://codereview.chromium.org/2490313002/diff/40001/chrome/browser/resource...
File chrome/browser/resources/vr_shell/vr_shell_ui.html (right):

https://codereview.chromium.org/2490313002/diff/40001/chrome/browser/resource...
chrome/browser/resources/vr_shell/vr_shell_ui.html:40:
src="../../../../ui/webui/resources/images/lock.svg">
On 2016/11/14 16:04:53, bshe wrote:
> looks like you also added secure icon to omnibox. Add this to CL description.

Done.

https://codereview.chromium.org/2490313002/diff/40001/chrome/browser/resource...
chrome/browser/resources/vr_shell/vr_shell_ui.html:42: <span
id="domain">www.url.com</span><span id="path">/path</span>
On 2016/11/14 16:04:53, bshe wrote:
> why do you need placeholder texts?

Done.  Good catch, this was only for testing.

[cjgrant, 2016-11-14 17:24:22]

The CQ bit was checked by cjgrant@chromium.org

[cjgrant, 2016-11-14 17:24:22]

The patchset sent to the CQ was uploaded after l-g-t-m from
mthiesse@chromium.org, bshe@chromium.org
Link to the patchset: https://codereview.chromium.org/2490313002/#ps60001
(title: "Address nits.")

[commit-bot: I haz the power, 2016-11-14 17:24:49]

CQ is trying da patch. Follow status at
 
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[commit-bot: I haz the power, 2016-11-15 00:24:08]

Description was changed from

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Choose the boundaries based on the extremities of the elements
  (including border and padding), rather than their inner width/height.

Also, fix the new omnibox security icon in non-UI-development builds.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation
==========

to

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Choose the boundaries based on the extremities of the elements
  (including border and padding), rather than their inner width/height.

Also, fix the new omnibox security icon in non-UI-development builds.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation
==========

[commit-bot: I haz the power, 2016-11-15 00:24:09]

Committed patchset #4 (id:60001)

[commit-bot: I haz the power, 2016-11-15 00:34:55]

Description was changed from

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Choose the boundaries based on the extremities of the elements
  (including border and padding), rather than their inner width/height.

Also, fix the new omnibox security icon in non-UI-development builds.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation
==========

to

==========
Remove fixed positioning of HTML UI elements.

This change lets the UI elements float wherever the browser positions
them.  In summary:

- Use css 'float' to position elements; we can refine this as needed.
- Add a margin around all elements (gets rid of artifacts where edges of
  neighbouring elements appear in the scene).
- Correct the rounding of element "pixel" boundaries, to avoid (for
  example) flattened edges on round buttons.
- Choose the boundaries based on the extremities of the elements
  (including border and padding), rather than their inner width/height.

Also, fix the new omnibox security icon in non-UI-development builds.

BUG=641508
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation

Committed: https://crrev.com/5799b40595a08411e54c9a2ee205a524c04568ad
Cr-Commit-Position: refs/heads/master@{#432013}
==========

[commit-bot: I haz the power, 2016-11-15 00:34:56]

Patchset 4 (id:??) landed as
https://crrev.com/5799b40595a08411e54c9a2ee205a524c04568ad
Cr-Commit-Position: refs/heads/master@{#432013}