## Themes for this milestone :clipboard: 1. Continue fixing structural issues in GitLab CSS that are preventing widespread adoption of design tokens 2. Start working with cross-stage teams to roll out dark mode See our [direction](https://about.gitlab.com/direction/manage/foundations/design_system/) page for our long-term plans. ## Quick Reference :reminder_ribbon: - :calendar: Important dates: - This milestone runs from **2024-11-16 - 2024-12-13** - :reminder_ribbon: Issue Boards - [Issues by Workflow label](https://gitlab.com/groups/gitlab-org/-/boards/7550297?milestone_title=Started&label_name%5B%5D=group::design%20system) - [Issues by Milestone](https://gitlab.com/groups/gitlab-org/-/boards/7295775?label_name%5B%5D=group::design%20system) - :gitlab-hero: Want to contribute? - See our [issues seeking community contributions](https://gitlab.com/groups/gitlab-org/-/issues/?sort=updated_asc&state=opened&label_name%5B%5D=group::design%20system&label_name%5B%5D=Seeking%20community%20contributions&first_page_size=100) - :video_camera: [kickoff video](https://youtu.be/vH6UE3sFSJw) ## Validation & Design Track :mag_right: When we transition dark mode to Beta, we will need to provide formal support according to our [feature maturity guidelines](https://docs.gitlab.com/ee/policy/experiment-beta-support.html). We can minimize our support burden by polishing dark mode on high-traffic pages while we're still in Experimental. We're starting with a methodical approach to rolling out design tokens by stage group in %"17.7" to ensure a few things: 1. That we're able to validate our design vision against more areas of the product and iterate as needed 2. That we're able to validate our design token inventory and iterate as needed 3. That we learn what kind of support / documentation teams need so they can start self-serving We will work directly with the designers of these groups to ensure their pages provide a satisfactory dark mode experience. We will also finalize our work to bring the dark mode design vision to Pajamas components and the UI kit. - [ ] https://gitlab.com/groups/gitlab-org/-/epics/15660+s - [ ] https://gitlab.com/gitlab-org/gitlab-services/design.gitlab.com/-/issues/1886+s - [ ] https://gitlab.com/groups/gitlab-org/-/epics/14227+s ## Documentation track :writing_hand: - [ ] https://gitlab.com/gitlab-org/gitlab-services/design.gitlab.com/-/issues/1965+s ## Build Track :tools: We started applying design tokens to the GitLab codebase in %"17.4". We found some significant structural issues with the GitLab CSS that are preventing many elements in GitLab from actually using the design tokens defined in Pajamas / gitlab-ui. We need to fix these issues to ensure all key styling decisions come from the Pajamas Design System via design tokens in gitlab-ui. - [ ] https://gitlab.com/groups/gitlab-org/-/epics/15844+ - [ ] https://gitlab.com/gitlab-org/gitlab-ui/-/issues/2821+s - [ ] https://gitlab.com/gitlab-org/foundations/design-system/pajamas-figma-plugin/-/issues/7+s - [ ] https://gitlab.com/gitlab-org/gitlab/-/issues/502704+s ## Deliverables :ship: ```glql --- display: table fields: title, state, labels("workflow::*"), assignees, epic, weight --- milestone = "17.7" and project = "gitlab-org/gitlab" and label = ("group::design system", "Deliverable") ``` ```glql --- display: table fields: title, state, labels("workflow::*"), assignees, epic, weight --- milestone = "17.7" and project = "gitlab-org/gitlab-ui" and label = ("group::design system", "Deliverable") ``` ```glql --- display: table fields: title, state, labels("workflow::*"), assignees, epic, weight --- milestone = "17.7" and project = "gitlab-org/gitlab-services/design.gitlab.com" and label = ("group::design system", "Deliverable") ``` ## Planned Time Off :palm_tree: Hey team! :wave: Please add your planned time off below for this release period. _\*Note, you do not need to update this table if you take unplanned time off, this is meant to be a quick snapshot of capacity for those who don't have access to capacity planning._ | Team Member | Time Off | |-------------|----------| | @chrismicek | Nov 15 – Dec 1 | | @danmh | | | @igloude | | | @jeldergl | Dec. 9–13 | | @jtucker_gl | `2024-11-20`, `2024-11-27 – 2024-11-29` | | @samdbeckham | | | @sdejonge | | | @thaina.t | | | @vanessaotto | on Maternity Leave |