Broken English label in language-popover

Bug #1522341 reported by Kyrylo Romanenko
6
This bug affects 1 person
Affects Status Importance Assigned to Milestone
Fuel for OpenStack
Fix Released
Medium
Vitaly Kramskikh

Bug Description

Login to Fuel UI asa admin.
Click on Language selector.
Look at popover menu.
"English" label there is broken and looks like:
"Englis
h"
Browser: Chrome.

With firefox it looks slightly better, with hyphenation:
"Eng-
lish"

Can we keep that label integral, just "English" in one row?

VERSION:
  feature_groups:
    - mirantis
  production: "docker"
  release: "8.0"
  openstack_version: "2015.1.0-8.0"
  api: "1.0"
  build_number: "212"
  build_id: "212"
  fuel-nailgun_sha: "13d1800be2452bd297555eedf051bda469b5663b"
  python-fuelclient_sha: "4f9a873b1ae68271bb848a1145b3cf912a176f4b"
  fuel-agent_sha: "f0e09fa7a30b5ab87e901601bfb6c1e339a6bdaa"
  fuel-nailgun-agent_sha: "b56f832abc18aee9a8c603fd6cc2055c5f4287bc"
  astute_sha: "d2c1b401816c6f0341902272f37018b9cec3c775"
  fuel-library_sha: "c892d2919620947225687ccde63d0e038784f0a2"
  fuel-ostf_sha: "5cf8c484a9a4f45f353468438cf98f1b5a5c5dfb"
  fuel-createmirror_sha: "9b335c8d551c87d788166947cb7ed519757881e8"
  fuelmenu_sha: "9627849843e84b7f01c44bd79898a8d62d96ce66"
  shotgun_sha: "34a081508b603723e14f9415a62373be39f3685f"
  network-checker_sha: "2c62cd52655ea6456ff6294fd63f18d6ea54fe38"
  fuel-upgrade_sha: "1e894e26d4e1423a9b0d66abd6a79505f4175ff6"
  fuelmain_sha: "daed38102b6074393821d675e3d7d866fcdb3da5"

Revision history for this message
Kyrylo Romanenko (kromanenko) wrote :
Revision history for this message
Kyrylo Romanenko (kromanenko) wrote :
Changed in fuel:
status: New → Confirmed
tags: added: low-hanging-fruit
Changed in fuel:
assignee: Fuel UI (fuel-ui-team) → Fuel UI Team (fuel-ui)
Revision history for this message
OpenStack Infra (hudson-openstack) wrote : Fix proposed to fuel-web (master)

Fix proposed to branch: master
Review: https://review.openstack.org/253393

Changed in fuel:
assignee: Fuel UI Team (fuel-ui) → Dmitry Bilunov (dbilunov)
status: Confirmed → In Progress
Revision history for this message
OpenStack Infra (hudson-openstack) wrote :

Fix proposed to branch: master
Review: https://review.openstack.org/253410

Revision history for this message
OpenStack Infra (hudson-openstack) wrote : Change abandoned on fuel-web (master)

Change abandoned by Dmitry Bilunov (<email address hidden>) on branch: master
Review: https://review.openstack.org/253410
Reason: Duplicate of https://review.openstack.org/#/c/253393/

Changed in fuel:
assignee: Dmitry Bilunov (dbilunov) → Vitaly Kramskikh (vkramskikh)
Revision history for this message
OpenStack Infra (hudson-openstack) wrote : Fix merged to fuel-web (master)

Reviewed: https://review.openstack.org/253393
Committed: https://git.openstack.org/cgit/openstack/fuel-web/commit/?id=2f9032015f95cbb3b171a72738bc9d56f4d486a7
Submitter: Jenkins
Branch: master

commit 2f9032015f95cbb3b171a72738bc9d56f4d486a7
Author: Dmitry Bilunov <email address hidden>
Date: Thu Dec 10 13:44:01 2015 +0300

    Fix broken "English" label in language-popover

    CSS layout uses .popover-layout mixin, which fits the contents in a
    pre-specified width (defaults to 260px). Popover classes include this
    mixin so children widths are calculated during compile-time using Less
    arithmetic expansions.

    If a text node overflows the container word-wrapping rules would emerge
    and cause this bug. Currently, offset calculations are implied by the
    triangle arrow positioning stuff, which moves the popover container to
    the right (using negative left offset) while moving the arrow (using
    positive right offset). To preserve the correct layout, popover block
    width should be known in prior.

    We can avoid these calculations (still retaining current look-and-feel)
    by re-aligning the arrow, setting the .language-popover left offset to
    zero and using CSS transformations to translate the whole block to the
    left by the half of its width. It would allow as not to rely on a fixed
    width, so the box model will expand the blocks as necessary to fit the
    text nodes - on my screen it allows language names up to 16 narrow
    chars (like 'a') or 10 wide chars ('A').

    However, much simplier solution is just changing the padding of the
    language name label. In case a longer word won't fit inside the
    container, we can always update the @width parameter.

    Closes-Bug: 1522341
    Change-Id: I182a37da42bd546e72a57ba117b7be15ee187c5f

Changed in fuel:
status: In Progress → Fix Committed
Revision history for this message
Anastasia Palkina (apalkina) wrote :

Verified on ISO #284

VERSION:
  feature_groups:
    - mirantis
  production: "docker"
  release: "8.0"
  api: "1.0"
  build_number: "284"
  build_id: "284"
  fuel-nailgun_sha: "eb187d0eed96226ca0d8c4513ffcafc4d09dee62"
  python-fuelclient_sha: "f96659066e522e28b389de3cc685f6f2aacca3da"
  fuel-agent_sha: "2f18b7596bc7da79d2f28c34f42620b2090d8a35"
  fuel-nailgun-agent_sha: "a33a58d378c117c0f509b0e7badc6f0910364154"
  astute_sha: "e8c753d6ce1405df78d032e88c0d5a1c6f3d17ce"
  fuel-library_sha: "15d966e164a8b8f7d94c70863bd1cc4990703ec8"
  fuel-ostf_sha: "632730169e8c01afe7fd5d78a898f00d4646358b"
  fuel-mirror_sha: "31b9df814960ec69b644ca9b689dacec0c7e10a1"
  fuelmenu_sha: "680b720291ff577f4c058cee25f85e563c96312e"
  shotgun_sha: "a0bd06508067935f2ae9be2523ed0d1717b995ce"
  network-checker_sha: "a3534f8885246afb15609c54f91d3b23d599a5b1"
  fuel-upgrade_sha: "1e894e26d4e1423a9b0d66abd6a79505f4175ff6"
  fuelmain_sha: "1577a306c2c9e7bd12f28c0e16cf3652997da004"

Changed in fuel:
status: Fix Committed → Fix Released
To post a comment you must log in.
This report contains Public information  
Everyone can see this information.

Other bug subscribers

Remote bug watches

Bug watches keep track of this bug in other bug trackers.