Mobile website - Responsive Design
6 years ago
Posts: 2802
For those of you wondering why the site looks different today, don't clean your glasses or throw out this month's contacts. Yes, amazing as it might seem, we had a site update today!
This one is a long time coming, and caps off the final changes that were started in 2018 for MangaUpdates, including the adoption of Docker, our UTF-8 conversion (seriously), switching our search to Elasticsearch, and finally this responsive web design. There are several things planned and in the works for 2019, so stay tuned.
Please let us know if you find any bugs with this new site template in the [sitelink=topics.php?fid=3837]Suggestions and Bugs[/sitelink] forum. I'm sure there's something we missed. Thank you for helping us test it over the last week!
6 years ago
Posts: 51
Great news! Are you going to implement a proper rest/graphql API now? It's been long due.
6 years ago
Posts: 2802
That is high on the list.
6 years ago
Posts: 69
So that's why search results have been a bit wonky. "Stemming" is in play.
Has every search been ported to elastic search?
6 years ago
Posts: 2802
Quote from bhui
So that's why search results have been a bit wonky. "Stemming" is in play.
Has every search been ported to elastic search?
Yes, all sections have been converted, except categories. I need to finish that when I get some time.
Let me know if something isn't working exactly right with search, and I'll try to fix it.
6 years ago
Posts: 1143
Warn: Banned
Pulling up the site on my computer makes the site look like it's you're zoomed in by 10%.
6 years ago
Posts: 69
Can you change the font-size back from 14 (1rem) to 12 (1em)?
It looks strange somehow.
**rem values are relative to the root html element, not to the parent element. That is, If font-size of the root element is 16px then 1 rem = 16px for all elements. **
https://medium.com/code-better/css-units-for-font-size-px-em-rem-79f7e592bb97
Maybe the design relied previously on having the font size of the parent element set correctly.
For series titles 1.77rem (~24 new) to 1.77em (~21)?
(Previously html had no set font-size (default 16px) and everything seemed relative to body-font-size (12px) which got inherited by the table cell the text was in).
A similar width of manga series entries (and everything else) would be nice too. Now the design fills a 1920x1080 screen at 175% zoom. A #centered div had a width of 919px before, now there seems no width limit on the top element.
6 years ago
Posts: 69
So even this one https://www.mangaupdates.com/series.html?act=genresearch?
Does it still recognize categories exactly by name?
Strange that you got & in the url. How does this url get built? Javascript? I think if you set it with Javascript you don't need to consider encoding the href-Atribute (or similar ones). This only applies directly in source code.
https://www.mangaupdates.com/series.html?category=Test_Test2&perpage=50
https://www.mangaupdates.com/series.html?genre=Comedy
This inteface looks different. Wasn't this a list before?
6 years ago
Posts: 69
https://www.mangaupdates.com/series.html?genre=Comedy&category=4-koma
Glad that adding categories here still works.
So does this interface still allow the same parameters https://www.mangaupdates.com/series.html?act=genresearch allows?
6 years ago
Posts: 2802
Yes, it still allows all the same parameters. I thought this looked more mobile friendly, which is why I'm changed the design.
6 years ago
Posts: 2802
Search should still work the way it always has. The Elastic conversion was a few months ago.
The URL is generated in the server side code (which is over a decade old by the way). Goal is to convert it all to a front end framework like Angular.
It was a list before, but this seems more mobile friendly.
6 years ago
Posts: 2802
It's using Bootstrap 4's container fluid, which has an upper max of around 1000px. It will not expand higher than that.
The font honestly looks fine to me on Chrome. What browser are you using? It's definitely a little bigger than it was before, but I'm just using Bootstrap's default font sizing, and using rem was recommended over em across the board, which is why it's now used universally across the site.
6 years ago
Posts: 51
Agree with @Transdude1996 regarding font size, 90% looks just right to me.
If you are going to convert everything to a frontend framework, please consider server-side rendering (Angular Universal, Next.js) or other techniques like lazy loading components/modules/routes. The pages don't change often (as in every several days for most popular ones, almost never for most) and I really enjoy how snappy everything is, making it a monolith of SPA would be a disappointment.
6 years ago
Posts: 2
When I search by categories in advanced search, it won't let me filter out any genres. Those genres still show up in the results. It also won't let me limit my category search by list type.
6 years ago
Posts: 69
EDIT: Double post due to wrong comment chain.