Closed Bug 1057221 Opened 10 years ago Closed 9 years ago

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

Categories

(Web Compatibility :: Site Reports, defect)

ARM
Gonk (Firefox OS)
defect
Not set
normal

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: karlcow, Assigned: karlcow)

References

()

Details

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

Attachments

(2 files)

+++ 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"
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
Closed: 10 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
Attached file 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
Follow the progress on contact with this bug on Bug 957043
Mozilla Japan has contact, will contact them.
Also, discuss on https://bugzilla.mozilla.org/show_bug.cgi?id=957043.
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
Our current contact can't work on it. We are trying to find a contact higher up.
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.
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)
@Hallvord, Mixi (through Yuki Kobubun above) said they will fix it during this summer.
I need to check the status. ^_^
Flags: needinfo?(kdubost)
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)
Thanks a lot for the status Yuki.
If you need any help, running into any issues, tell us.
This is fixed. \o/
Thanks to Mixi team and their hard work.

With a lot of love from Mozilla.
Status: ASSIGNED → RESOLVED
Closed: 10 years ago9 years ago
Resolution: --- → FIXED
Product: Tech Evangelism → Web Compatibility
Component: Mobile → Site Reports
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: