Skip to content

chore(ia): Reorganize CSS pages - part 6 (moving keywords, types, functions under reference/values) #41810

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
dipikabh merged 9 commits into from
Nov 6, 2025
Merged

chore(ia): Reorganize CSS pages - part 6 (moving keywords, types, functions under reference/values) #41810

dipikabh merged 9 commits into from
Nov 6, 2025

Conversation

@dipikabh
Copy link
Contributor

@dipikabh dipikabh commented Nov 5, 2025

See the proposed structure at css-tree-proposed.json.

Steps performed

  1. Created the css/reference/values directory and a listing page for "Values". (files/en-us/web/css/reference/values/index.md).

  2. Moved these pages into css/reference/values:

    • Pages with page-type: css-keyword
    • Pages with page-type: css-type and their child directories (e.g., basic-shape/circle)
    • Pages with page-type: css-functions (not already inside values, properties, or at-rules)

  3. Moved the existing css_values_and_units/css_value_functions directory under and as css/reference/values/functions.

  4. Moved the existing css_values_and_units/css_data_types directory under and as css/reference/values/data_types.

  5. Updated the sidebar (files/sidebars/cssref.yaml):

    • Added an entry for a link to "Values" with a listing of all keywords.
    • Swapped the position of Functions and Types in the sidebar, moving Types before Functions.

File structure before and after

Current structure: 
files/en-us/web/css/
.
.
├── important
├── inherit
.
.
├── atan2
├── attr
.
├── blend-mode
├── box-edge
.
├── basic-shape
│   ├── circle
│   ├── ellipse
.
.
After the move: 
files/en-us/web/css/reference/values
.
.
├── important
├── inherit
.
.
├── atan2
├── attr
.
├── blend-mode
├── box-edge
.
├── basic-shape
│   ├── circle
│   ├── ellipse
.
.

Related pull requests

Related issues

Discussion: https://github.com/orgs/mdn/discussions/256
Tracker issue: mdn/mdn#662

@dipikabh dipikabh requested review from a team as code owners November 5, 2025 13:10
@dipikabh dipikabh requested review from Josh-Cena, estelle, pepelsbey, wbamberg and willdurand and removed request for a team November 5, 2025 13:10
@github-actions github-actions bot added Content:CSS Cascading Style Sheets docs Content:HTML Hypertext Markup Language docs Content:WebExt WebExtensions docs labels Nov 5, 2025
@github-actions github-actions bot added Content:WebAPI Web API docs Content:JS JavaScript docs Content:Learn Learning area docs Content:Accessibility Accessibility docs Content:SVG SVG docs Content:Media Media docs Content:MathML MathML docs Content:Glossary Glossary entries Content:Firefox Content in the Mozilla/Firefox subtree Content:Meta Content in the meta docs Content:PWA Progressive Web Apps content size/m [PR only] 51-500 LoC changed labels Nov 5, 2025
@github-actions
Copy link
Contributor

github-actions bot commented Nov 5, 2025

Preview URLs (290 pages)
Flaws (5016)

Note! 42 documents with no flaws that don't need to be listed. 🎉

URL: /en-US/docs/Glossary/Color_space
Title: Color space
Flaw count: 12

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/hex-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/named-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/color_value/rgb which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/color_value/hsl which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/color_value/hwb which is a redirect
    • and 7 more flaws omitted

URL: /en-US/docs/Glossary/Flex
Title: Flex
Flaw count: 20

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/display which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/flex which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/flex-grow which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/flex-shrink which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/flex-basis which is a redirect
    • and 15 more flaws omitted

URL: /en-US/docs/Glossary/Interpolation
Title: Interpolation
Flaw count: 6

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/color-interpolation-method which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/hue-interpolation-method which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/color-interpolation which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/color-interpolation-method which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/hue-interpolation-method which is a redirect
    • and 1 more flaws omitted

URL: /en-US/docs/Learn_web_development/Core/CSS_layout/Grids
Title: CSS grid layout
Flaw count: 18

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/display which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/column-gap which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/row-gap which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/gap which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/grid-auto-rows which is a redirect
    • and 13 more flaws omitted

URL: /en-US/docs/Learn_web_development/Core/CSS_layout/Responsive_Design
Title: Responsive web design
Flaw count: 1

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/columns which is a redirect

URL: /en-US/docs/Learn_web_development/Core/Styling_basics/Backgrounds_and_borders
Title: Backgrounds and borders
Flaw count: 23

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/background-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-image which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-repeat which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-size which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/length which is a redirect
    • and 18 more flaws omitted

URL: /en-US/docs/Learn_web_development/Core/Styling_basics/Overflow
Title: Overflowing content
Flaw count: 7

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/width which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/height which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/overflow which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/overflow-y which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/overflow-x which is a redirect
    • and 2 more flaws omitted

URL: /en-US/docs/Learn_web_development/Core/Styling_basics/Values_and_units
Title: CSS values and units
Flaw count: 13

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/border-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/length which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/length which is a redirect
    • and 8 more flaws omitted

URL: /en-US/docs/Learn_web_development/Core/Text_styling/Fundamentals
Title: Fundamental text and font styling
Flaw count: 56

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/text-decoration which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/font-family which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/custom-ident which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/string which is a redirect
    • and 51 more flaws omitted

URL: /en-US/docs/Learn_web_development/Extensions/Performance/CSS
Title: CSS performance optimization
Flaw count: 9

  • broken_links:
    • /en-US/docs/Learn_web_development/Extensions/Performance/html is ill cased
    • /en-US/docs/Learn_web_development/Extensions/Performance/html is ill cased
  • macros:
    • Macro produces link /en-US/docs/Web/CSS/font-size which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-position which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/contain which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/content-visibility which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/contain-intrinsic-size which is a redirect
    • and 2 more flaws omitted

URL: /en-US/docs/Learn_web_development/Extensions/Testing/HTML_and_CSS
Title: Handling common HTML and CSS problems
Flaw count: 2

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/background-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/box-shadow which is a redirect

URL: /en-US/docs/Learn_web_development/Howto/Solve_CSS_problems/Make_box_transparent
Title: How to make a box semi-transparent
Flaw count: 1

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/opacity which is a redirect

URL: /en-US/docs/Learn_web_development/Howto/Web_mechanics/File_browser_bugs
Title: When and how to file bugs with browsers
Flaw count: 1

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/:autofill which is a redirect

URL: /en-US/docs/MDN/Kitchensink
Title: The MDN Content Kitchensink
Flaw count: 5

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/width which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/height which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/image-rendering which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/:dir which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/direction which is a redirect

URL: /en-US/docs/MDN/Writing_guidelines/Code_style_guide/CSS
Title: Guidelines for writing CSS code examples
Flaw count: 4

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/text-rendering which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/shape-rendering which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/pointer-events which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/color-interpolation-filters which is a redirect

URL: /en-US/docs/MDN/Writing_guidelines/Page_structures/Page_types/Page_type_key
Title: The page-type front matter key
Flaw count: 7

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/@media which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/max which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/inherit which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/:enabled which is a redirect
    • and 2 more flaws omitted

URL: /en-US/docs/MDN/Writing_guidelines/Writing_style_guide
Title: Writing style guide
Flaw count: 11

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/:checked which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/:indeterminate which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/border-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/color which is a redirect
    • and 6 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Experimental_features
Title: Experimental features in Firefox
Flaw count: 28

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/initial-letter which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/fit-content_function which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/width which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/scroll-timeline-name which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/scroll-timeline-axis which is a redirect
    • and 23 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/3.5
Title: Firefox 3.5 for developers
Flaw count: 16

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/@font-face which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/::before which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/::after which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/opacity which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/text-shadow which is a redirect
    • and 11 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/3.6
Title: Firefox 3.6 for developers
Flaw count: 15

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/background which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-image which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-position which is a redirect
    • and 10 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/4
Title: Firefox 4 release notes for developers
Flaw count: 25

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/resize which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/length which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/-moz-image-rect which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-image which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/resize which is a redirect
    • and 20 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/23
Title: Firefox 23 release notes for developers
Flaw count: 2

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/::after which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/::before which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/49
Title: Firefox 49 release notes for developers
Flaw count: 23

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/background-position-x which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-position-y which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-position which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-repeat which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/background-clip which is a redirect
    • and 18 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/52
Title: Firefox 52 release notes for developers
Flaw count: 16

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/:focus-within which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/justify-content which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/align-content which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/mask which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/clip-path which is a redirect
    • and 11 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/54
Title: Firefox 54 release notes for developers
Flaw count: 10

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/clip-path which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/align-items which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/align-self which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/justify-items which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/justify-self which is a redirect
    • and 5 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/65
Title: Firefox 65 release notes for developers
Flaw count: 16

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/image-rendering which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/scrollbar-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/break-before which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/page-break-before which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/break-after which is a redirect
    • and 11 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/83
Title: Firefox 83 release notes for developers
Flaw count: 1

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/:is which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/96
Title: Firefox 96 release notes for developers
Flaw count: 2

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/color-scheme which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/counter-reset which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/97
Title: Firefox 97 release notes for developers
Flaw count: 5

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/length which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/length-percentage which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/print-color-adjust which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/revert-layer which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/all which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/112
Title: Firefox 112 release notes for developers
Flaw count: 1

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/overflow which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/114
Title: Firefox 114 release notes for developers
Flaw count: 1

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/@import which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/116
Title: Firefox 116 release notes for developers
Flaw count: 1

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/offset-path which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/118
Title: Firefox 118 release notes for developers
Flaw count: 3

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/font-synthesis-position which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/font-synthesis which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/font-variant-position which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/119
Title: Firefox 119 release notes for developers
Flaw count: 2

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/attr which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/length which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/120
Title: Firefox 120 release notes for developers
Flaw count: 2

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/color_value/light-dark which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/-moz-image-rect which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/122
Title: Firefox 122 release notes for developers
Flaw count: 9

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/list-style-type which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/offset-position which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/offset-path which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/ray which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/offset-path which is a redirect
    • and 4 more flaws omitted

URL: /en-US/docs/Mozilla/Firefox/Releases/127
Title: Firefox 127 release notes for developers
Flaw count: 1

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/letter-spacing which is a redirect

URL: /en-US/docs/Mozilla/Firefox/Releases/143
Title: Firefox 143 release notes for developers
Flaw count: 4

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/::details-content which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/::marker which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/::before which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/::after which is a redirect

URL: /en-US/docs/Web/Accessibility/Guides/Colors_and_Luminance
Title: Web Accessibility: Understanding Colors and Luminance
Flaw count: 2

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/font-weight which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/filter which is a redirect

URL: /en-US/docs/Web/Accessibility/Guides/Seizure_disorders
Title: Web accessibility for seizures and physical reactions
Flaw count: 5

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/animation-play-state which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/transition which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/transform which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/@import which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/@import which is a redirect

URL: /en-US/docs/Web/API/CanvasRenderingContext2D/filter
Title: CanvasRenderingContext2D: filter property
Flaw count: 16

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/filter which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/url_function which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/length which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/percentage which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/percentage which is a redirect
    • and 11 more flaws omitted

URL: /en-US/docs/Web/API/CSS_Typed_OM_API/Guide
Title: Using the CSS Typed Object Model
Flaw count: 24

  • macros:
    • Macro produces link /en-US/docs/Web/CSS/border-left-color which is a redirect
    • Macro produces link /en-US/docs/Web/CSS/caret-color which is a redirect
    • `…

TRUNCATED!

Josh-Cena
Josh-Cena reviewed Nov 5, 2025
View reviewed changes
files/en-us/web/css/reference/values/color_value/index.md
---
title: <color>
slug: Web/CSS/color_value
slug: Web/CSS/Reference/Values/color_value
Copy link
Member

@Josh-Cena Josh-Cena Nov 5, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I thought you would want to remove _value here?

@Josh-Cena
Copy link
Member

Josh-Cena commented Nov 5, 2025 •
edited
Loading

I know we already reached "agreement" on this so not a blocker (though it's because I didn't really put much thought into it at first), but is there a reason to put functions, keywords, and types in the same folder? Types are not code entities in CSS but functions and keywords are, and to me the difference is extremely unambiguous, so I would have separated types/ and values/. If you think this doesn't work for things like <color> which has subpages, I would suggest lifting the subpages out of <color> just like url_function is not nested under url_value.

@dipikabh
Copy link
Contributor Author

dipikabh commented Nov 6, 2025 •
edited
Loading

I am in favor of keeping the relationships intact in the filesystem. So we're keeping:

  • animation-timeline (property) / scroll()
  • @import (at-rule) / layer()

And similarly, <basic-shape> (data type) / ellipse() and <color> (data type) / lab().
The nesting helps keep the context intact instead of scattering entities across directories. Moving types and functions to their respective directories will break the inherent connection between them - and it would then also be tricky to represent the relationship on the site (we're able to leverage the breadcrumbs to display the correct context for image(): CSS > Reference > Values > <image> > image(); image() outside of <image> and plainly under Values will seem untethered). Additionally, data types provide a nice parent grouping in the directory structure for all the related functions, so all functions under basic-shape are grouped together and all functions under easing-function stay together.

The relationship between url_function and url_value is very different from say <color>/rgb() or <transform-function>/matrix(). Since url() is also a general purpose function that can be used in different contexts apart from being used as <url> type, they're kept as sibling directories rather than nested.

About dropping the _value identifier, I agree - we can drop it from color_value, flex_value, position_value, position-area_value, and overflow_value now that the same-named properties and values are in separate directories.
However, our cssxref macro will first need to be updated to handle the distinction or perhaps we need a new macro for values that can take the new slug css/reference/values (without the _value, {{cssxref("position", "&lt;position&gt;")}} or even {{cssxref("&lt;position&gt;")}} is currently linking to the position property instead of the data type).
I'll flag this to the engineering team. (see cssxref in rari and mdn/rari#361).

pepelsbey
pepelsbey approved these changes Nov 6, 2025
View reviewed changes
Copy link
Member

@pepelsbey pepelsbey left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good! Thank you :)

I think this sidebar will be a good compromise until we have a better system.

@dipikabh
Copy link
Contributor Author

dipikabh commented Nov 6, 2025

Thanks for reviewing 🙌

@dipikabh dipikabh merged commit f69b669 into mdn:main Nov 6, 2025
8 checks passed
This was referenced Nov 7, 2025
Merged
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@Josh-Cena Josh-Cena Josh-Cena left review comments

@pepelsbey pepelsbey pepelsbey approved these changes

Assignees

No one assigned

Labels

Content:Accessibility Accessibility docs Content:CSS Cascading Style Sheets docs Content:Firefox Content in the Mozilla/Firefox subtree Content:Glossary Glossary entries Content:HTML Hypertext Markup Language docs Content:JS JavaScript docs Content:Learn Learning area docs Content:MathML MathML docs Content:Media Media docs Content:Meta Content in the meta docs Content:PWA Progressive Web Apps content Content:SVG SVG docs Content:WebAPI Web API docs Content:WebExt WebExtensions docs size/m [PR only] 51-500 LoC changed

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@dipikabh @Josh-Cena @pepelsbey