menu
Tatoeba
language
Register Log in
language English
menu
Tatoeba

chevron_right Register

chevron_right Log in

Browse

chevron_right Show random sentence

chevron_right Browse by language

chevron_right Browse by list

chevron_right Browse by tag

chevron_right Browse audio

Community

chevron_right Wall

chevron_right List of all members

chevron_right Languages of members

chevron_right Native speakers

search
clear
swap_horiz
search
TRANG TRANG July 16, 2020 July 16, 2020 at 8:30:03 PM UTC link Permalink

**Responsive search results**

I have deployed on the dev website an attempt at making the search results responsive and will need some feedback. If you have time, please visit the dev website from your smartphone/tablet and do some search. Also do check from your desktop that everything is still displayed properly.

https://dev.tatoeba.org

Note that the responsive version is only applied on the search results for non-authenticated users. If you are logged in, you will still see the search results in as a miniature of the desktop version.

Thank you for testing!

{{vm.hiddenReplies[35638] ? 'expand_more' : 'expand_less'}} hide replies show replies
CK CK July 17, 2020 July 17, 2020 at 4:05:53 AM UTC link Permalink

Usually with responsive webpages, what's on the right goes underneath what's on the left on smaller screens.

The way you have it, what's on the right seems to totally disappear.

Here are some screenshots.


New Responsive Search Results on an iPod Touch
https://imgur.com/a/1UNnGnu

New Responsive Search Results on a DeskTop (MacOS Chrome)
https://imgur.com/a/J4ElyF5

{{vm.hiddenReplies[35640] ? 'expand_more' : 'expand_less'}} hide replies show replies
TRANG TRANG July 20, 2020 July 20, 2020 at 9:23:05 PM UTC link Permalink

> The way you have it, what's on the right seems to totally disappear.

The sidebar is indeed hidden by default but it can be displayed by clicking the "more" icon (the three dots) on the right side of the search input.

From your iPod Touch screenshot, I can see that if the language name is too long (or if the width of the screen is too small), part of the UI will be cut off from the visible part of the screen. This becomes more obvious if you switch to a language that has a very long label, like "Português (Brazil)". The fact that the right side of the page part was not shown may have made you miss the button that opens the advanced search options. Or perhaps the icon is not obvious enough.

In any case, I deployed some additional changes to make the menu fit completely in small screens.

{{vm.hiddenReplies[35659] ? 'expand_more' : 'expand_less'}} hide replies show replies
CK CK July 21, 2020 July 21, 2020 at 1:32:49 AM UTC link Permalink

I didn't notice those 3 dots. I wonder if others will.

1. https://imgur.com/a/1UNnGnu
They don't show on my iPod screen.

2. They didn't show on my desktop screen either. Of course, that's my fault, since I use Stylish to change colors so that tatoeba.org is easily readable for me.

I wish tatoeba.org would consider following some accessibility guidelines to help those who have trouble with low contrast colors.
https://github.com/Tatoeba/tatoeba2/issues/1164

I know it's hard for those who don't have this kind of vision problem to notice things like this.

{{vm.hiddenReplies[35660] ? 'expand_more' : 'expand_less'}} hide replies show replies
TRANG TRANG July 21, 2020 July 21, 2020 at 3:32:43 PM UTC link Permalink

> 1. https://imgur.com/a/1UNnGnu
> They don't show on my iPod screen.

But do they show now? Your screenshots were taken before I deployed the additional changes.

> 2. They didn't show on my desktop screen either.

They are not supposed to be shown on desktop screen size.

> I wish tatoeba.org would consider following some accessibility guidelines
> to help those who have trouble with low contrast colors.

Please see my comment:
https://github.com/Tatoeba/tato...ment-408597172

MisterTrouser MisterTrouser July 22, 2020 July 22, 2020 at 4:01:02 AM UTC link Permalink

Thank you Trang, for all your work!

{{vm.hiddenReplies[35662] ? 'expand_more' : 'expand_less'}} hide replies show replies
TRANG TRANG July 22, 2020 July 22, 2020 at 9:09:42 PM UTC link Permalink

Thank you for your encouragement :)

TRANG TRANG August 1, 2020 August 1, 2020 at 8:33:10 PM UTC link Permalink

There has been some new changes, most notably to make the access to the advanced search form on mobile more intuitive.

The changes have been deployed on the dev website:
https://dev.tatoeba.org/

If you have time, please test again and let me know if you are facing any other issue.

Thank you!

{{vm.hiddenReplies[35707] ? 'expand_more' : 'expand_less'}} hide replies show replies
driini driini August 3, 2020 August 3, 2020 at 8:48:50 PM UTC link Permalink

I tried to check my private messages via my mobile. But I couldn't see any mail at the right side. It was cut off.

{{vm.hiddenReplies[35709] ? 'expand_more' : 'expand_less'}} hide replies show replies
TRANG TRANG August 4, 2020 August 4, 2020 at 6:49:18 PM UTC link Permalink

Could you upload a screenshot of what it looks like?

{{vm.hiddenReplies[35712] ? 'expand_more' : 'expand_less'}} hide replies show replies
driini driini August 4, 2020 August 4, 2020 at 8:53:25 PM UTC link Permalink

Sorry, I don't know where to upload it. I never did here.
Via dropbox? Should I create an URL? How?

{{vm.hiddenReplies[35713] ? 'expand_more' : 'expand_less'}} hide replies show replies
TRANG TRANG August 4, 2020 August 4, 2020 at 8:58:04 PM UTC link Permalink

There's no feature on Tatoeba to upload pictures, but there are many websites where you can upload.

As far as I'm concerned, I usually use imgur:
https://imgur.com/upload

{{vm.hiddenReplies[35714] ? 'expand_more' : 'expand_less'}} hide replies show replies
driini driini August 4, 2020 August 4, 2020 at 10:01:00 PM UTC link Permalink

https://imgur.com/a/9nyTx4s

{{vm.hiddenReplies[35715] ? 'expand_more' : 'expand_less'}} hide replies show replies
TRANG TRANG August 4, 2020 August 4, 2020 at 10:28:28 PM UTC link Permalink

What is your browser?

{{vm.hiddenReplies[35717] ? 'expand_more' : 'expand_less'}} hide replies show replies
driini driini August 4, 2020 August 4, 2020 at 11:16:55 PM UTC link Permalink

FirefoxLite

{{vm.hiddenReplies[35718] ? 'expand_more' : 'expand_less'}} hide replies show replies
TRANG TRANG August 5, 2020 August 5, 2020 at 7:26:58 PM UTC link Permalink

I'm unfortunately not able to install it on my phone but perhaps you could check if there's a way to view the page in "desktop mode". That could be a workaround for the time being. The problem will eventually be fixed when the private messages section is made responsive.