Reformat Success Stories

[Odzen]

This PR refactors the "Success Stories" page, converting the list of projects into a table to make the information more consistent and scannable.
The new table includes columns for screenshots, platforms, and BeeWare components, providing a clearer and more informative overview of what can be built with Toga.
Fixes #3596

PR Checklist:
[x] All new features have been tested
[x] All new features have been documented
[x] I have read the CONTRIBUTING.md file
[x] I will abide by the code of conduct

[freakboy3742]

Thanks for the PR. This is definitely a step in the right direction. However, I'm not convinced the screenshots work at this size. I found myself wanting to click on the image to get more detail - and that clearly doesn't do anything.

My thought: Drop the current "screenshot" column; add a small (32x32?) icon to the name column where we have a clear icon (e.g., the icon from App Store registrations), and replace the "components" column with a new "screenshots" column that, instead of being a thumbnail, is a list of hyperlinks to an images (the tanapro apps, for example, provide multiple screenshots, demonstrating that they work on different platforms; the same is true of Travel Tips, which has iOS, iPad and Android screenshots.

[freakboy3742]

Suggested change

	- iOS
	- Toga
	- An app in the iOS App Store that describes its user interface.
	- Android, iOS,
	- Briefcase, Toga
	- A currency conversion tool that can also calculate tips.

[freakboy3742]

The URL this image is being served from is... interesting. It looks like it might be a proxy for a Czech Apple app store... but it's definitely not a domain that I recognize

Also, if we're going to be serving images, we should be serving them from our own infrastructure - if only to prevent against the remove server disappearing the image.

[Odzen]

@freakboy3742

Can you please guide me on how to add hyperlinks to the server using RST?
When I try to use a path like this /images/success_stories/travel_tips/travel_tips_ipad_screenshot.webp
It returns "Not Found".

[HalfWhitt]

The only way I've been able to find to link to a static file is the :download: text role, but it's not exactly ideal... At least for me, in Firefox, clicking on this link both opens the image in a new tab and downloads a copy to my downloads folder:

:download:`iPad </images/success_stories/travel_tips/travel_tips_ipad_screenshot.webp>`

It seems like there should be a better way, but I don't know what it is.

Also, I wouldn't use relative links for all those icons. They'll break if this page ever, for whatever reason, gets moved one directory lower. Sphinx considers absolute file paths to start at the document root (toga/docs); /images/... should always be the images folder directly under docs.

[Odzen]

Thanks for the PR. This is definitely a step in the right direction. However, I'm not convinced the screenshots work at this size. I found myself wanting to click on the image to get more detail - and that clearly doesn't do anything.

My thought: Drop the current "screenshot" column; add a small (32x32?) icon to the name column where we have a clear icon (e.g., the icon from App Store registrations), and replace the "components" column with a new "screenshots" column that, instead of being a thumbnail, is a list of hyperlinks to an images (the tanapro apps, for example, provide multiple screenshots, demonstrating that they work on different platforms; the same is true of Travel Tips, which has iOS, iPad and Android screenshots.

Thank you for the suggestions. I tried to implement some of them. I still have the hyperlink part for the screenshots missing.

[HalfWhitt]

While we're sprucing this up, we might as well fix the subject-verb agreement: "Here are some:"

[freakboy3742]

One option: it's possible to do a lightbox popup in pure CSS. We might need to do a little work to clean up the styling in that example, and to template it in a way so we can add screenshots easily - but it would be a nicer option than popping out to a separate page.

[Odzen]

I will have a look at this next weekend, thank you for the patiente here @freakboy3742 , @HalfWhitt