Global styles the story so far

Transcript

1. Global Styles: What’s in the Works Tammie Lister

2. 1. Why?

3. “I have this vision, but I don’t know CSS” So

   many people
4. None
5. None

6. “I want to allow block styling from my theme” Theme

   creators

7. 2. How?

8. Put screenshot here Starting with some flows

9. Put screenshot here What is the experience of the theme

   also?

10. C v v

11. yvz8y.csb.app/#/v2/post

12. yvz8y.csb.app/#/i2

13. None

14. What could this look like?

15. None
16. None

17. 3. The story so far

18. “It all starts with the block” A Gutenberg mantra

19. Line height github.com/WordPress/gutenberg/issues/20339

20. Exposing our need for better design tools Label ‘Design tools’

21. Theme exploration by Kjell themeshaper.com/2020/03/20/exploring-global-styles

22. Follow along github.com/WordPress/gutenberg/issues/20331 github.com/WordPress/gutenberg/projects/40

23. 3. Coming soon

24. v1: sidebar font/text families | base font/style | link styling

25. None

26. Heading and text families github.com/WordPress/gutenberg/issues/21028

27. None

28. Link styling github.com/WordPress/gutenberg/issues/21032

29. None

30. Base font size and scale github.com/WordPress/gutenberg/issues/21030

31. None

32. Let’s have a demo! github.com/WordPress/gutenberg/pull/20530

33. None

34. 4. The future

35. Custom CSS

36. View all global styling

37. Mosaic view for global styles github.com/WordPress/gutenberg/issues/20477

38. Personal thoughts, hopes and dreams… None of these are set

    or certain

39. Beyond the sidebar github.com/WordPress/gutenberg/issues/20212

40. Beyond the sidebar

41. None

42. Importing & exporting

43. “Everything starts with the block…” By improving blocks, we can

    see what should be global

44. Color picker github.com/WordPress/gutenberg/issues/19785

45. Iterate the block

46. Bring to the block, if right

47. What will you make? Collaborate, explore and share

48. Thank you speakerdeck.com/tammielis/global-styles-the-story-so-far