Closed Bug 944382 Opened 11 years ago Closed 7 years ago

Update "select" default icon

Categories

(Firefox OS Graveyard :: General, defect)

x86
macOS
defect
Not set
normal

Tracking

(Not tracked)

RESOLVED WONTFIX

People

(Reporter: arnau, Unassigned)

References

Details

Attachments

(11 files, 8 obsolete files)

(deleted), image/png
Details
(deleted), patch
Details | Diff | Splinter Review
(deleted), image/png
vingtetun
: feedback+
Details
(deleted), patch
vingtetun
: review-
Details | Diff | Splinter Review
(deleted), image/png
Details
(deleted), image/png
vingtetun
: review-
Details
(deleted), image/png
Details
(deleted), image/png
Details
(deleted), image/png
vingtetun
: review-
Details
(deleted), image/png
Details
(deleted), image/png
Details
No description provided.
Assignee: nobody → joan.leon
Attached patch Fix for new icon (obsolete) (deleted) — Splinter Review
Attachment #8339931 - Flags: review?(21)
Hey Vivien, could you please review that? Joan has created a patch for the changes in the select icon we talked about. Thanks!
Comment on attachment 8339931 [details] [diff] [review] Fix for new icon >diff --git a/b2g/chrome/content/arrow.svg b/b2g/chrome/content/arrow.svg >--- a/b2g/chrome/content/arrow.svg >+++ b/b2g/chrome/content/arrow.svg >@@ -1,5 +1,7 @@ >-<?xml version="1.0" encoding="UTF-8" standalone="no"?> >- >-<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" version="1.1" width="11px" style="position: absolute; top: -moz-calc(50% - 2px);"> >- <polyline points="1 1 5 6 9 1" stroke="#414141" stroke-width="2" stroke-linecap="round" fill="transparent" stroke-linejoin="round"/> >-</svg> >+<?xml version="1.0" encoding="utf-8"?> >+<!-- Generator: Adobe Illustrator 17.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> >+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> Let's make this as minimal as possible and use the simpler version from the previous file. But please see next comments about svg. >+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" >+ width="10px" height="10px" viewBox="-1.5 -1.5 10 10" enable-background="new -1.5 -1.5 10 10" xml:space="preserve"> Same here there is a few thing that can be removed. >+<polyline fill="#333333" points="8.508,-1.492 8.508,8.508 -1.492,8.508 "/> >+</svg> >diff --git a/b2g/chrome/content/content.css b/b2g/chrome/content/content.css >--- a/b2g/chrome/content/content.css >+++ b/b2g/chrome/content/content.css >@@ -165,32 +165,39 @@ button { > input[type="radio"], > input[type="checkbox"] { > max-width: 14px; > max-height: 14px; > border: 1px solid #a7a7a7 !important; > padding: 2px 1px 2px 1px; > } > >+select { >+ padding-right: 0 !important; >+ padding-bottom: 0 !important; >+ position: relative !important; >+ height: 1em; >+ min-height: 1.5em; >+} >+ One of the thing you can not do in this file is: - Use !important rule. Web authors won't be able to overidde any style with an important rule from this file (this rule does not apply to thing that web authors can not change usually, like the select > button) - Change the default height. Since this file is used to rendered web content, it may break some web sites. > select > button { > border-width: 0px !important; > margin: 0px !important; > padding: 0px !important; >- border-radius: 0; >- color: #414141; >- >- background-image: radial-gradient(at bottom left, #bbbbbb 40%, #f5f5f5), url(arrow.svg) !important; >- background-color: transparent; >- background-position: -15px center, 4px center !important; >- background-repeat: no-repeat, no-repeat !important; >- background-size: 100% 90%, auto auto; >- >+ border-radius: 0px; nit: no need for px, I know it is done in other parts of this file, but ignore that. >+ font-size: inherit; >+ position: relative !important; >+ width: 1em !important; >+ height: 100%; >+ background: none !important; >+ background-image: url(arrow.svg) !important; Will it be possible to style the element to be a #333 box with some border rules that change it to make it looks like the half-square ? That would let us get rid of SVG here. >+ background-repeat: no-repeat !important; >+ background-position: right 4px bottom 4px !important; >+ background-size: calc(100% - 4px) !important; > -moz-binding: none !important; >- position: relative !important; >- font-size: inherit; > } r- mostly because of the size changes, and also because I would like to see if we can get rid of SVG entirely.
Attachment #8339931 - Flags: review?(21) → review-
Attachment #8339931 - Attachment is obsolete: true
Attachment #8344562 - Flags: review?(21)
Fixed your comments and just using important when I need to overwrite forms.css
Comment on attachment 8344562 [details] [diff] [review] Update select default icon with border, without SVG Review of attachment 8344562 [details] [diff] [review]: ----------------------------------------------------------------- Closer! I would like to have a small page that shown the select at different width/height thought in order to compare it with the previous impl. We need to make sure the width/height by default has not changed in order to not break the web. ::: b2g/chrome/content/arrow.svg @@ +1,5 @@ > +<?xml version="1.0" encoding="UTF-8" standalone="no"?> > + > +<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" version="1.1" width="11px" style="position: absolute; top: -moz-calc(50% - 2px);"> > + <polyline points="1 1 5 6 9 1" stroke="#414141" stroke-width="2" stroke-linecap="round" fill="transparent" stroke-linejoin="round"/> > +</svg> \ No newline at end of file I think we can just remove this file now. If that's the case then don't forget to remove it at http://mxr.mozilla.org/mozilla-central/source/b2g/chrome/jar.mn#11 ::: b2g/chrome/content/content.css @@ +173,5 @@ > select > button { > + border-width: 0px; > + margin: 0px; > + padding: 0px; > + border-radius: 0px; no need for 'px' after the 0. Old code can be misleading. @@ +177,5 @@ > + border-radius: 0px; > + font-size: inherit; > + position: relative !important; > + height: 1.2em !important; > + width: 30px !important; Can you make a small test page with the select at different size ? I would like to see how it looks with various different size. @@ +180,5 @@ > + height: 1.2em !important; > + width: 30px !important; > + background: none !important; > + left: -16px; > +} Please keep the |-moz-binding: none !important;| rule. It prevents the platform to load some dependencies that are unneeded on the device.
Attachment #8344562 - Flags: review?(21)
Attachment #8349285 - Flags: review?(21)
Attachment #8349285 - Flags: review?(21) → feedback?(21)
Attachment #8344562 - Attachment is obsolete: true
Attachment #8349303 - Flags: review?(21)
Attached image New Select Arrow on UI Test App (deleted) —
Attachment #8349304 - Flags: feedback?(21)
Hi Vivien, I applied your comments on the new patch and I uploaded a screenshots for your feedback.
Attachment #8349303 - Attachment is patch: true
Attachment #8349303 - Attachment mime type: text/x-patch → text/plain
The code looks fine to me. I'm just a bit worried about some sizing stuff. Can you produce a small testpage that generates a few select buttons with different sizes starting from a small size ? If the test page looks good, then I will r+ the patch but I want to understand the effects on small selects. Thanks for your patience and your efforts :)
Comment on attachment 8349303 [details] [diff] [review] Update select default icon with border, without SVG Removing r? until I have this test page.
Attachment #8349303 - Flags: review?(21)
Attached image Base font-size: 10px without BB (obsolete) (deleted) —
Attachment #8351231 - Flags: feedback?(21)
Attached image Base font-size: 15px without BB (obsolete) (deleted) —
Attachment #8351232 - Flags: feedback?(21)
Attached image Base font-size: 16px without BB (obsolete) (deleted) —
Attachment #8351233 - Flags: feedback?(21)
Attached image Base font-size: 20px without BB (obsolete) (deleted) —
Attachment #8351234 - Flags: feedback?(21)
Attached image Base font-size: 25px without BB (obsolete) (deleted) —
Attachment #8351235 - Flags: feedback?(21)
Hi Vivien, I uploaded five screenshots with select element, with new arrow.
Comment on attachment 8351231 [details] Base font-size: 10px without BB I like how it looks sadly I pushed the patch on our try server and it seems like it breaks 4 reftest. https://tbpl.mozilla.org/php/getParsedLog.php?id=33637668&tree=Try The first one is because the arrow is misplaced in some case. Please see data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAPoCAYAAAAmy5qxAAAeA0lEQVR4nO3da4+cBd2A8ec77SewggQIxCoeaAEPUWhiFdEqVLIhgBAsNsr51CovQGyhLYhisoRUtAoNVCiKNsVQLVBRsaZGMdbq/bxyskt3dqfwPFc74fdL/m+6/7nnnmZe3Ffm9D8DAABA5H9O9gkAAADvHgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACCzbIAcPXp02LJly3D99dcPs7Oz5hSb66+/ftiyZctw9OjR4vkCAADvyLIBMjc3N3zrW98aDh48WJwPJ+jgwYPD5s2bh8cff/xknwoAACxr2QDZsGHD8Nprrw3/+c9/zCk6r7766rBhw4bi+QIAAO/IsgEyOzt70i+wzfIzOztbPF8AAOAdmShA/v3vf5tTfAQIAADTYKIAOXbsmDnFR4AAADANJgqQf/3rX+YUmpmZmeP+TYAAADANJgqQo0ePmlNkZmZmhpmZmeP+XYAAADANBMgUzX/jQ4AAADCtJgqQf/7zn+Ykz/z4mJmZOe7vAgQAgGkwUYD84x//OKF58803h+eee2647bbbhiuuuGK4+OKLh7Vr1w6zs7PDAw88MBw4cOCEj/lunrfGx8zMzHE7AgQAgGkwUYC8+eabE8/evXuHiy++eHjPe96z5Fx33XXDa6+9dkLHfjfOYvExMzNz3J4AAQBgGkwUIH//+98nmscee2x473vfuyA0zjzzzOGCCy4YPvzhDx/3t/POO2/Yt2/fxMd/t824+JiZmTluV4AAADANJgqQv/3tb8vOzp07hxUrVozi4tOf/vSwa9eu4ciRI6Od119/fdi6detwzjnnjPbe//73D6+88spE9/FumqXiY2Zm5rh9AQIAwDSYKED++te/LjmHDh0aPvjBD46iYt26dcPhw4fH7u/bt29YuXLlaH/9+vXDkSNHlr2fd8ssFx8zMzPH3UaAAAAwDSYKkCNHjiw5t99++ygmzj333OHQoUPL3mZubm7B27GeffbZZW+z2Ozfv3/48Y9/PDz11FPDK6+88raO8fvf/3545plnhscff/wdHedkjgABAGAaTBQgf/nLX8bOn/70pwWvZmzatGnJ/f/O4cOHh09+8pOj21177bVjd6+99trh3HPPHcXN4cOHh0ceeWT4+Mc/ftyH2z/72c8O+/fvn+gc9u3bN1x55ZXD6aefvuAYK1asGC699NLhmWeemeg4p8IIEAAApsFEAfLnP/957PzoRz9acPH+4osvLrk/fzZt2jS63dlnnz288cYbi+6tX79+tPfzn/98uPzyy5f8hq3zzjtveP3115e87yeeeGI444wzljzOihUrhu3bt0/8eE7mCBAAAKbBRAHyxhtvjJ277rprdMG+cuXKJXffOrt27Vpwwf/8888vujc/QFatWjW6r3vvvXfYvXv38PTTTw+33Xbbgm/Zuu+++8be7549e4b3ve99o91LLrlkeOihh4ann3562LFjx7Bu3boFEbJ79+4TelwnYwQIAADTYKIA+eMf/zh2vvSlLy14+9NSu2+dl19+eUGAbNu2bdG9K664YsHeZz7zmeHAgQPH7V1zzTWjnXHn/Yc//GHB75Rcfvnlw6FDh47bufHGG0c7a9asOaHHdTJGgAAAMA0mCpDXX3997My/mL/qqquW3F1s5n/+YvPmzYvuzA+Qj33sY8Pvfve7Rfe2bNmy4FWNxXbmv2Xs9NNPH1588cVF9w4cODCcddZZo909e/ac8GMrR4AAADANJgqQQ4cOjZ3Vq1cv+HXzpXYXm3PPPXd0+5tuumnRnfmf+bj77rvHHusHP/jBaO/CCy9cdOe666477tWPcXPVVVeNdu+9994TfmzlCBAAAKbBRAHy6quvjp0PfehDo4v0G264YcndxeYDH/jA6PY33njjojtf/vKXFwTIuGM9+uijo70LLrhg0Z3535x12223LXlut95664JXd070sZUjQAAAmAYTBcjBgwfHzkUXXTS6SL/66quX3F1s5r/N6dZbb110Z36A3HXXXWOP9b3vfW9BgCy2M/+br+64447hySefHDs33XTTaPeyyy474cdWjgABAGAaTBQgv/3tb8fOJZdcsuAtTUvtvnUOHDiw4JurNm/evOje/A+633nnnWOP9/DDDy8IkLf+/aWXXlrya3eXmjVr1pzQY6tHgAAAMA0mCpCXX3557Mz/itxPfOITS+6+dXbv3r3gIv+RRx5ZdG/+1+LecccdY4+3Y8eO0d7q1auP+/u+ffvedoB87nOfO6HHVo8AAQBgGkwUIL/5zW/Gzj333DO6SD/jjDOG/fv3L7k/f7Zt27bgIn/v3r2L7s0PkNtvv32i461evfq4v7/00kvDaaedNtq55557hmeeeWaief755yd+XCdjBAgAANNgogDZv3//2HniiSeOexVjqf35Mzs7u+AtU+P2vvjFLy744Pi4vYceemhBgCy285GPfGS087WvfW3icz3VR4AAADANJgqQffv2jZ1f//rXw4UXXji6qF+3bt2S+/+d5557bjj77LMXvLIxbvcLX/jCgg+qj9t78MEHR3urVq1adGf+b4qsWbNmonOdhhEgAABMg4kC5Fe/+tWSs2nTpgWvgjz88MPL3ubqq68e7Z911lnDs88+O3Z3foDccsstY/fm/xDhqlWrFt357ne/u+BcH3vssWXPdRpGgAAAMA0mCpBf/vKXS84vfvGL4VOf+tToov7MM88cHn744bG7X//61xdEwKZNm5Y8/mWXXTbavfnmm8fuzY+LVatWLbrzwgsvLPjtkosuumh46qmnFt2dm5sbZmdnh7179y77f3CyR4AAADANJgqQF154YdnZuXPnsHLlygVhsXbt2uHOO+8ctmzZMtx///3Dxo0bh1WrVi3YWb9+/bB3794lj/35z39+tP/Nb35z7N53vvOd0d75558/dm/79u3DihUrRrvnnHPOcPPNNw/bt28fvv/97w+bN28evvKVr4x2NmzYMNH/wckcAQIAwDSYKED27t070ezcuXM4//zzJ/pa2xUrVgzXXHPN8Pzzzy973LcGyLi9twbIUsf89re/veA3SJaaK6+8cqLzPJkjQAAAmAYTBchzzz038Tz77LPDLbfcMnz0ox9d9GL+tNNOG9auXTs8+uijEx/z0ksvHd3+G9/4xti9++67b0GALHfcH/7wh8PatWsXDZEVK1YMa9asGR588METevwnawQIAADTYKIA2bNnz9uaubm54f777x/uvPPOYdOmTcPWrVuHn/3sZ2/7eP9fs2vXruGBBx4Y7r777uGuu+4aHnjggWHXrl0n/bxOZAQIAADTYKIAmfTH+szJGwECAMA0mChAdu/ebU7xESAAAEyDiQLkqaeeMqf4CBAAAKbBRAHy05/+1JziI0AAAJgGEwXIT37yE3OKjwABAGAaTBQgTz75pDnFR4AAADANJgqQnTt3mlN8BAgAANNgogB54oknzCk+AgQAgGmwbIB89atfHbZv3z48/vjj5hSdbdu2Ddddd13xfAEAgHdk2QDZsmXLsHHjxmHHjh3D3NycOcVmx44dw8aNG4etW7cWzxcAAHhHlg2QY8eODXNzc8MNN9wwzM7OmlNsbrjhhmFubm44duxY8XwBAIB3ZNkAAQAA+L8iQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgIwAAQAAMgIEAADICBAAACAjQAAAgMz/Ao/WKnJQE6ttAAAAAElFTkSuQmCC The related testcase is http://mxr.mozilla.org/mozilla-central/source/layout/reftests/font-inflation/select-combobox-1.html?force=1 2 other testcases fails the same way. I'm not sure about the issue for the last one. All those tests are related to font-inflation. You can probably try to play in FF desktop with font-inflation to see if you can reproduce the issue. See http://dbaron.org/log/20111126-font-inflation
Attachment #8351231 - Flags: feedback?(21) → feedback+
A simple way to reproduce the issue is to go to: http://vingtetun.org/tmp/forms.html The issue does not reproduce on the UI test app because it has a viewport and font-inflation is disabled if an app has a viewport, but it is not for regular website.
I played a bit with the patch to see if we can get around the font-inflation issue. Seems hard. Let's keep svg for now then. I rebased a bit the patch, let me know what you think (needinfo'ed) and I sent it on the try-server to see how it goes. https://tbpl.mozilla.org/?tree=Try&rev=25cbd5e5a749
Flags: needinfo?(joan.leon)
Attached patch bug-944382.patch (obsolete) (deleted) — Splinter Review
Here the updated patch.
Arnau, do you know if Joan is still looking at that ?
Flags: needinfo?(arnau)
Hi Vivien, this week I work on that.
Flags: needinfo?(joan.leon)
(In reply to Joan Leon from comment #24) > Hi Vivien, this week I work on that. Cool. thanks :)
Flags: needinfo?(arnau)
Attached patch Bug-944382_v2.patch (deleted) — Splinter Review
Attachment #8367064 - Attachment is obsolete: true
Attachment #8381991 - Flags: review?(21)
Attached image Screenshot Hamachi BB Select (deleted) —
Attachment #8351231 - Attachment is obsolete: true
Attachment #8351232 - Attachment is obsolete: true
Attachment #8351233 - Attachment is obsolete: true
Attachment #8351234 - Attachment is obsolete: true
Attachment #8351235 - Attachment is obsolete: true
Attachment #8381993 - Flags: review?(21)
Attached image Screenshot Hamachi forms web (deleted) —
Attachment #8381997 - Flags: review?(21)
Attached image Screenshot Hamachi UI Select (deleted) —
Attachment #8381998 - Flags: review?(21)
Attached image Screenshot Peak BB Select (deleted) —
Attachment #8381999 - Flags: review?(21)
Attached image Screenshot Peak forms web (deleted) —
Attachment #8382000 - Flags: review?(21)
Attached image Screenshot Peak UI Select (deleted) —
Attachment #8382002 - Flags: review?(21)
Comment on attachment 8381991 [details] [diff] [review] Bug-944382_v2.patch Review of attachment 8381991 [details] [diff] [review]: ----------------------------------------------------------------- ::: b2g/chrome/content/content.css @@ +177,5 @@ > +select { > + padding-right: 0 !important; > + padding-bottom: 0 !important; > + position: relative !important; > +} You can't do that as it will affect web content.
Attachment #8381991 - Flags: review?(21) → review-
Comment on attachment 8382000 [details] Screenshot Peak forms web Do you know why it looks so small on this screenshot ?
Attachment #8382000 - Flags: review?(21) → review-
Comment on attachment 8381997 [details] Screenshot Hamachi forms web Same comment as on the Peek. Do you know why it looks so small ?
Attachment #8381997 - Flags: review?(21) → review-
Oops, sorry. With the last changes we don't need this rule. I update the patch...
Attached image Screenshot with default select arrow (deleted) —
Hi, with the default arrow, also show very small.
Attachment #8382184 - Flags: review?(21)
(In reply to Joan Leon from comment #37) > Created attachment 8382184 [details] > Screenshot with default select arrow > > Hi, > > with the default arrow, also show very small. I wonder if this is because of the height directive. Can you check if it is too small as well with the rebased version of your patch I made at: https://bug944382.bugzilla.mozilla.org/attachment.cgi?id=8367064 ?
After several tests, I have not found a way to get the browser to display the arrow to select another size. If I'm not mistaken, that's one thing that is defined in the browser.
Flags: needinfo?(21)
(In reply to Joan Leon [:joan] from comment #39) > After several tests, I have not found a way to get the browser to display > the arrow to select another size. If I'm not mistaken, that's one thing that > is defined in the browser. The width and the height of the button are defined here: http://mxr.mozilla.org/mozilla-central/source/layout/style/forms.css#240 But there is also a moz-appearance rule at http://mxr.mozilla.org/mozilla-central/source/layout/style/forms.css#248 And I wonder if it forces some style by the platform. Would be nice to try to override it by |select > button { -moz-appearance: none; }| in content.css
Flags: needinfo?(21)
Status: NEW → ASSIGNED
Assignee: joan.leon → arnau
Leaving this one by now
Assignee: rnowmrch → nobody
Status: ASSIGNED → NEW
Firefox OS is not being worked on
Status: NEW → RESOLVED
Closed: 7 years ago
Resolution: --- → WONTFIX
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: