frontend layout improvements

first of all, thanks lot for making the store to what it is now!

here are some suggestions for layout improvements:

use fewer lines and waste fewer space. in general, a rule of thumb in design (esp. if you are not a designer :) is to use fewer lines :)
the "arrow down" for expanding is not self explaining.
more common icons for such things are "plus/minus" or a "triange that rotates by 90 degrees". (the "arrow down" icon is also a not-so-good choice as "arrow down" is also used for "download", making things unnecessary hard eg. to explain).
however, i would not go for a symbol that need explanations at all, instead, just call it what it is - "Details" (and if expanded, "Hide Details")
~~the title looks cluttered. there are three different left-alignment-postions (title, search, items). a centered title looks better here (as already suggested in some chats)~~ EDIT: thinking it over, the title is not needed at all. it is just a repetition of what is shown in the window title and we also usually do not show big titles elsewhere in comparable tools. i adapted the screenshot and also slightly changed the placeholder
for the "i": the version is mostly debug information and the "reload" is hard to discover, so i assume, this is usually not a primary function anyways. therefore, i would move the whole dialog content as simple text to the footer, centered.
if the "update" is really important, move it as a text-only string as "Last Update ... Update now" with a smaller font between search field and items
add a placeholder to the search text

here is a rough mockup. at the same size, the new layout contains quite some more characters per line and 1.5 more app items while still looking similar airy:

before / after:

Abandoned layouts

(the title is not needed at all. it is just a repetition of what is shown in the window title and we also do not show big titles elsewhere in webxdc's)

(as i had no good idea how to play around with html and real data, i did that in gimp, but i think, you get the idea. a bit of space is missing between the download/share buttons and the text. "Details" should have the same font size as the description and of course, things should be aligned properly :)

for the "share button", which is more a "forward button": i suggest to use the "swooth variation" ( ) that is also used in whatsapp/telegram/signal at similar places and is known by users. there is no need to "invent" a new icon by adding a 90-degrees chipped-line-arrow.

maybe also make the icons ~10% smaller in width/height, so that there is a better visual balance to the buttons on the right. but that is nitpicking and should be tested (i could not really do that due to lack of html access with test data)

image vs. text buttons was already discussed, i think, with the correct icons, we can give image buttons a try - also as moving to text buttons would require more re-layouting, and this issue is meant for easy improvements.

webxdc / store

frontend layout improvements #163