feat(v2): autoprefix css #1605

shakcho · 2019-06-13T20:29:13Z

Motivation

Automatically add vendor prefix for CSS

Have you read the Contributing Guidelines on pull requests?

Yes

Test Plan

In the root directory execute the following command

yarn 
yarn start

go to http://localhost:3000/docs/introduction
Open chrome devtools, we should see the position sticky should get vendor prefixed with
-webkit-sticky to work on Safari Browser as shown in the image below.

Try the URL in Safari browser, now the left sidebar should not scroll while scrolling.

Related PRs

I'm not aware of any

* misc(v2): clean up work * misc(v2): rename components

* feat(v2): implement component overriding * siteDir theme overriding should work for > 1 level directory * fallback for essential component like Loading * rename default -> classic

* feat(v2): easier plugin theme components override * add context * refactor again * rename eject -> swizzle * nits

* feat(v2): Algolia search plugin * patch PR facebook#1440 (facebook#1441) * alternative implementation * typo * refactor noop * rename SearchAlgolia -> SearchBar * changes.md

…k#1442) * refactor(v2): move headerLinks -> themeConfig & rm dead code * rm -rf dead code

* chore(v2): add flow setup * nits * fix * add flow-typed * ignore compiled library * fix error * fix typing * fix module name mapper * setup for @docusaurus/core * dont try remove type without @flow * fix can't find @docusaurus/utils * fix test * remove obscure relative paths * more refactoring * add typing for server/load/theme.js * no need to ship .flow source

…t code

* feat(v2): meta description * add description for blog as well * fix non-descriptive text link * remove font awesome * switch front-matter -> gray-matter

* refactor(v2): blog data revamp * fix(v2): fix incorrect blog total count * misc: remove console.log * feat(v2): export frontMatter as an object within MDX file (facebook#1451) * refactor. Don't confuse metadata & frontmatter * export frontMatter in content itself * nits * nits name * dont truncate first four lines in blog

* feat(v2): blog tags * feat(v2): blog tags

* fix: right TOC should not strip special chars * nits

* fix(v2): handle non existent blog, docs, pages * nits

* feat(v2): list blog tags on posts * fix date handling on blog header * fix console log error due to non unique key

docusaurus-bot · 2019-06-13T20:31:24Z

Deploy preview for docusaurus-2 ready!

Built with commit b708cb7

https://deploy-preview-1605--docusaurus-2.netlify.com

docusaurus-bot · 2019-06-13T20:33:46Z

Deploy preview for docusaurus-preview ready!

Built with commit 5763760

https://deploy-preview-1605--docusaurus-preview.netlify.com

docusaurus-bot · 2019-06-13T20:38:47Z

Deploy preview for docusaurus-preview ready!

Built with commit b708cb7

https://deploy-preview-1605--docusaurus-preview.netlify.com

endiliey

Thanks for the attempt :)

When using postcss-loader in webpack with css-loader, u need to set importLoader in css-loader. Try to read more on css-loader as well
for browserslist, user doesnt always have the configuration. Sometimes everyone want to compile to all browser, did you make sure it works and has a default ?
Please provide a test plan that makes sure it fixes the problem, what kind of difference adding this postcss loader add. “Run automated test cases” as a test plan isn’t a good practice.
While CRA config can be taken as inspiration, CRA is not server side rendered. Did you make sure it works on SSR. ?

CRA also doesnt allow customizing postcss options (which made people had to create CRA-rewired and all hacky tools out there) or they had to eject.

Can we do this for docusaurus without ejecting ?
5. Do we really need stage 3 feature and postcss-flexbugs-fixes ?

This is a good start, thank you

Please provide a strong test plan,

shakcho · 2019-06-14T04:50:48Z

@endiliey Thanks for your support. I will read about all the things you mentioned. And do the necessary changes. If needed I will ask you for help. Thanks

shakcho · 2019-06-18T20:48:51Z

@endiliey Updated the pull request
But I still have doubt about how to solve the below mentioned issue.

Allow users to update browserslist

My idea is to, let the project use browserslist conf from the package.json itself. If someone wants to update the browserslist, they can use browserslist-config-mycompany . Let me know if you have something else in mind.

I don't know how to setup SSR, so unable to test this, please help me to test this.

shakcho · 2019-06-26T19:44:58Z

@endiliey @yangshun please check this

endiliey · 2019-07-13T16:55:01Z

dont have a safari to test it out. overall lgtm but not sure if we want to compile postcss just for autoprefixer

cc @yangshun @wgao19

wgao19 · 2019-07-19T02:30:45Z

i'd go for it because autoprefixing css counts as a chore that people will most likely have to deal with or may not even be aware that their projects already have it set up

endiliey

pls rebase or merge conflict

endiliey

@yangshun @wgao19 lgtm lgtyall ? :p

yangshun

LGTM.

endiliey · 2019-07-20T02:12:18Z

Thanks a lot @shakcho

Sorry for the delay, was sick

shakcho · 2019-07-20T05:06:37Z

@endiliey @yangshun @wgao19 Thanks for the opportunity to allow me to work on this issue.

yangshun and others added 30 commits May 17, 2019 23:58

docs: make navbar less cluttered

ca340b4

misc(v2): rename components (facebook#1434)

8c04491

* misc(v2): clean up work * misc(v2): rename components

misc(v2): rename Blog components

421b09e

refactor(v2): remove page plugin component

74fdc5c

chore(v2): optimize webpack config

a2cf3af

feat(v2): implement theme component overriding (facebook#1435)

a635610

* feat(v2): implement component overriding * siteDir theme overriding should work for > 1 level directory * fallback for essential component like Loading * rename default -> classic

fix(v2): add missing layout alias on theme-classic plugin

e94df5e

feat(v2): easier plugin theme components swizzling (facebook#1436)

fa3d64d

* feat(v2): easier plugin theme components override * add context * refactor again * rename eject -> swizzle * nits

fix(v2-cli): passes the missing host option to start (facebook#1439)

abb8433

feat(v2): Algolia search theme (facebook#1440)

57a017d

* feat(v2): Algolia search plugin * patch PR facebook#1440 (facebook#1441) * alternative implementation * typo * refactor noop * rename SearchAlgolia -> SearchBar * changes.md

refactor(v2): move headerLinks -> themeConfig & rm dead code (faceboo…

6696489

…k#1442) * refactor(v2): move headerLinks -> themeConfig & rm dead code * rm -rf dead code

chore(v2): better chunk naming

ccc5143

chore(v2): rm flowtype (facebook#1444)

bb0ebdd

chore(v2): tweak eslint config (facebook#1445)

4eae287

chore: point website-1.x to correct version so that it can pick lates…

84a8e23

…t code

feat(v2): meta description (facebook#1447)

c49b5e5

* feat(v2): meta description * add description for blog as well * fix non-descriptive text link * remove font awesome * switch front-matter -> gray-matter

fix(v2): docsearch a11y issue (facebook#1449)

9060e0b

fix(v2): transpiling, window scroll and console error (facebook#1452)

8c2b94e

chore(v2): better error message style (facebook#1454)

5580a02

chore(v2): remove docsearch a11y workaround

0ec47f3

feat(v2): blog tags (facebook#1453)

12a9ba5

* feat(v2): blog tags * feat(v2): blog tags

fix(v2): slugify tags

36aacc8

chore(v2): use remark-slug so that rightToc can benefit from it

e1a7fc5

fix: right TOC should not strip special chars (facebook#1458)

04c0ed0

* fix: right TOC should not strip special chars * nits

fix(v2): handle non existent blog, docs, pages (facebook#1459)

614966f

* fix(v2): handle non existent blog, docs, pages * nits

feat(v2): list blog tags on posts (facebook#1456)

f51a653

* feat(v2): list blog tags on posts * fix date handling on blog header * fix console log error due to non unique key

test(v2): test different type of sidebar item

0f358ad

chore(v2): fix typo

6d7582a

shakcho requested review from endiliey and yangshun as code owners June 13, 2019 20:29

facebook-github-bot added the CLA Signed Signed Facebook CLA label Jun 13, 2019

removed unused changes

31deb08

shakcho changed the title ~~Css autoprefix~~ fix: Sticky sidebars don’t stick in desktop safari Jun 13, 2019

endiliey suggested changes Jun 14, 2019

View reviewed changes

shakcho changed the title ~~fix: Sticky sidebars don’t stick in desktop safari~~ wip: Sticky sidebars don’t stick in desktop safari Jun 14, 2019

added correct importloader and removed unused packages and conf

2c338ab

shakcho changed the title ~~wip: Sticky sidebars don’t stick in desktop safari~~ fix: Sticky sidebars don’t stick in desktop safari Jul 2, 2019

endiliey requested a review from wgao19 July 13, 2019 16:53

endiliey changed the title ~~fix: Sticky sidebars don’t stick in desktop safari~~ fix(v2): Sticky sidebars don’t stick in desktop safari Jul 14, 2019

endiliey assigned yangshun and wgao19 Jul 18, 2019

endiliey changed the title ~~fix(v2): Sticky sidebars don’t stick in desktop safari~~ feat(v2): autoprefix css Jul 19, 2019

endiliey suggested changes Jul 19, 2019

View reviewed changes

resolved conflicts

b708cb7

endiliey approved these changes Jul 20, 2019

View reviewed changes

yangshun approved these changes Jul 20, 2019

View reviewed changes

yangshun merged commit 1a5aed4 into facebook:master Jul 20, 2019

endiliey mentioned this pull request Jul 20, 2019

Sticky sidebars don’t stick in desktop safari #1597

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(v2): autoprefix css #1605

feat(v2): autoprefix css #1605

shakcho commented Jun 13, 2019 •

edited

Loading

docusaurus-bot commented Jun 13, 2019 •

edited

Loading

docusaurus-bot commented Jun 13, 2019

docusaurus-bot commented Jun 13, 2019 •

edited

Loading

endiliey left a comment

shakcho commented Jun 14, 2019

shakcho commented Jun 18, 2019 •

edited

Loading

shakcho commented Jun 26, 2019

endiliey commented Jul 13, 2019

wgao19 commented Jul 19, 2019

endiliey left a comment •

edited

Loading

endiliey left a comment

yangshun left a comment

endiliey commented Jul 20, 2019

shakcho commented Jul 20, 2019

feat(v2): autoprefix css #1605

feat(v2): autoprefix css #1605

Conversation

shakcho commented Jun 13, 2019 • edited Loading

Motivation

Have you read the Contributing Guidelines on pull requests?

Test Plan

Related PRs

docusaurus-bot commented Jun 13, 2019 • edited Loading

docusaurus-bot commented Jun 13, 2019

docusaurus-bot commented Jun 13, 2019 • edited Loading

endiliey left a comment

Choose a reason for hiding this comment

shakcho commented Jun 14, 2019

shakcho commented Jun 18, 2019 • edited Loading

shakcho commented Jun 26, 2019

endiliey commented Jul 13, 2019

wgao19 commented Jul 19, 2019

endiliey left a comment • edited Loading

Choose a reason for hiding this comment

endiliey left a comment

Choose a reason for hiding this comment

yangshun left a comment

Choose a reason for hiding this comment

endiliey commented Jul 20, 2019

shakcho commented Jul 20, 2019

shakcho commented Jun 13, 2019 •

edited

Loading

docusaurus-bot commented Jun 13, 2019 •

edited

Loading

docusaurus-bot commented Jun 13, 2019 •

edited

Loading

shakcho commented Jun 18, 2019 •

edited

Loading

endiliey left a comment •

edited

Loading