mixi.jp Mobile version is using the old-old CSS webkit flexbox syntax

RESOLVED FIXED

Status

Tech Evangelism
Mobile
RESOLVED FIXED
3 years ago
2 years ago

People

(Reporter: karlcow, Assigned: karlcow)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [country-jp] [webkitcss] [contactready], URL)

Attachments

(2 attachments)

(Assignee)

Description

3 years ago
+++ This bug was initially created as a clone of Bug #957043 +++

After fixing the UA mobile redirection, see Bug #957043

Site: http://mixi.jp/
When faking the UA to receive the mobile version of mixi. The CSS is not too bad, except for the usual issue of using the old old (deprecated) syntax of flexbox for WebKit only. You can see it in:
https://img.mixi.net/static/ssl/css/public/sp/portal.css?1405663228

For example
.listStyle01 div.img{
   display:-webkit-box;
   margin:0 auto;
   -webkit-box-align:center;
   -webkit-box-pack:center;
}


Please use the new syntax which is supported everywhere.
http://caniuse.com/#feat=flexbox
see http://css-tricks.com/using-flexbox/

You will reach out more customers and it's a very easy fix.

Also: 

* A couple of border radius, transform, background-size
* Meta viewport forbids user to rescale. Do not use
    "maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"
(Assignee)

Comment 1

3 years ago
Created attachment 8477224 [details]
mixi-flexbox-firefox.png

The current mixi webkit old syntax on Firefox OS.
The CSS this bug was about seems fixed now. I see the performance leaves something to be desired - quite possibly we should report another bug on slow CSS animations on play.google.com
Status: NEW → RESOLVED
Last Resolved: 3 years ago
Resolution: --- → FIXED
Wrong bug. Ignore me. :-/
Status: RESOLVED → REOPENED
Resolution: FIXED → ---
Simply adding 

.listStyle01 li, .listStyle02 li, .listService li{
    box-sizing:border-box;
}

would sort out most of the problems on the front page. Much of the layout actually uses floats, not flexbox (although there is flexbox usage for small stuff like aligning images better, it seems).
Status: REOPENED → NEW
(Assignee)

Comment 5

2 years ago
Created attachment 8582178 [details]
mixi-fixed-css.tar.gz

These are the main CSS files of Mixi fixed.
I added the patch and the fixed version. So they could test locally.

These files are making the mobile version of Mixi compatible with more browsers.

→ tar zcvf mixi-fixed-css.tar.gz mixi/

a mixi
a mixi/home-stream
a mixi/login-home
a mixi/login-home/common-fixed.css
a mixi/login-home/common.css
a mixi/login-home/common.patch
a mixi/login-home/portal-fixed.css
a mixi/login-home/portal.css
a mixi/login-home/portal.patch
a mixi/home-stream/common-fixed.css
a mixi/home-stream/common.css
a mixi/home-stream/common.patch
a mixi/home-stream/emoticon_color.css
a mixi/home-stream/emoticon_palette-fixed.css
a mixi/home-stream/emoticon_palette.css
a mixi/home-stream/emoticon_palette.patch
a mixi/home-stream/home2011-fixed.css
a mixi/home-stream/home2011.css
a mixi/home-stream/home2011.patch
a mixi/home-stream/home2015.production-fixed.css
a mixi/home-stream/home2015.production.css
a mixi/home-stream/home2015.production.patch
a mixi/home-stream/popuplayer-fixed.css
a mixi/home-stream/popuplayer.css
a mixi/home-stream/popuplayer.patch
(Assignee)

Comment 6

2 years ago
Follow the progress on contact with this bug on Bug 957043

Comment 7

2 years ago
Mozilla Japan has contact, will contact them.
Also, discuss on https://bugzilla.mozilla.org/show_bug.cgi?id=957043.
(Assignee)

Comment 8

2 years ago
Recontacted the person working at mixi today to get a status update. 
I proposed also to this person to open a bug on webcompat.com so it might be easier for them to follow up.
Let's see the answer.
Assignee: nobody → kdubost
Status: NEW → ASSIGNED
(Assignee)

Comment 9

2 years ago
Our current contact can't work on it. We are trying to find a contact higher up.

Comment 10

2 years ago
Hi, I am an employee of mixi.

We are planning to release new CSS with no-prefixed properties and let FirefoxOS users see our mobile site, sometime between July and August.

Thank you for your patience.
(Assignee)

Comment 11

2 years ago
Yuki, 

Thanks a lot for helping. That's very good news. 
Anything you need from us to understand and analyze the issues, tell us, we will gladly help.
Flags: needinfo?(orga.chem.job)
Karl, didn't Mixi fix this already? Close bug? :)
Flags: needinfo?(kdubost)
(Assignee)

Comment 13

2 years ago
@Hallvord, Mixi (through Yuki Kobubun above) said they will fix it during this summer.
I need to check the status. ^_^
Flags: needinfo?(kdubost)

Comment 14

2 years ago
We're still working on the issue.
We have removed -webkit- prefixes from 50% of our core css.

Remaining tasks:

1. Fix the remaining css.
2. FirefoxOS users will be able to see our mobile-friendly pages in September (it is one month behind the first schedule).
Flags: needinfo?(orga.chem.job)
(Assignee)

Comment 15

2 years ago
Thanks a lot for the status Yuki.
If you need any help, running into any issues, tell us.
(Assignee)

Comment 16

2 years ago
This is fixed. \o/
Thanks to Mixi team and their hard work.

With a lot of love from Mozilla.
(Assignee)

Updated

2 years ago
Status: ASSIGNED → RESOLVED
Last Resolved: 3 years ago2 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.