content icon indicating copy to clipboard operation
content copied to clipboard

Published 20 hours ago • verified publisher icon mdn

Grouping scattered parts into proper sections

Open akaabdullahmateen opened this issue 3 years ago • 3 comments

Description

  • Fixed minor spelling, grammar, and formatting mistakes
  • Renamed sub-headings to be more appropriate
  • Grouped description of examples with source code
  • Moved live samples into a separate results section

Motivation

This pull request is an attempt to make the documentation consistent so that related articles share the same structure and vocabulary. The concerned guide in this pull request: Understanding CSS z-index, consisting of a landing page, four articles, and three examples are now structured as follows:

Landing page

  • Introduction (general introductory text without any heading)
  • Articles (links to articles in this guide)
  • Examples (links to examples in this guide)

Articles

  • Introduction (general introductory text without any heading)
  • Example
  • Result
  • See also

Examples

  • Introduction (general introductory text without any heading)
  • Description
  • Example
  • Result
  • See also

Other changes

  • For the same purpose, block and element were being used alternately. I replaced occurrences of block with element wherever appropriate.
  • There was a large note in The stacking context that contained most of the description of the example. Notes should be reserved for indirectly related information or non-crucial description not necessary descriptions. I moved the content inside note to be in description of the example.
  • z-index and div were sometimes marked up as code and other times as plain text. I marked up all occurrences of z-index and div as code fragments, wherever appropriate.
  • There was a list in Using z-index that I converted to table so that it looks more visually appealing.
  • There were fake breadcrumbs style navigation inside example pages. I removed them since there already is robust navigation implemented in all page headers.
  • The embedded live sample was missing for Stacking context example 3, which I added.
  • In some examples, HTML code included <html>, <head>, and <body> elements, with CSS code provided through <style> elements. I removed these invisible elements, and separated the CSS code into separate section.

Related issues and pull requests

#21373

akaabdullahmateen avatar Oct 22 '22 22:10 akaabdullahmateen

Preview URLs (8 pages)
Flaws (1)

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

URL: /en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context Title: The stacking context Flaw count: 1

  • broken_links:
    • Link points to the page it's already on
External URLs (2)

URL: /en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index Title: Understanding CSS z-index

URL: /en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_and_float Title: Stacking with floated blocks

(this comment was updated 2022-11-09 14:01:00.345257)

github-actions[bot] avatar Oct 22 '22 22:10 github-actions[bot]

@jpmedley I apologize from the bottom of my heart and I was not able to correct the mistakes which you suggested, and you had to resolve them yourself. I had some breathing problems and was admitted in hospital.

Sorry once again, and I opened the PR for review. I think everything is good to go, so please take a final look.

akaabdullahmateen avatar Nov 02 '22 00:11 akaabdullahmateen

I'm taking a look for another final set of eyes on this 👀

bsmth avatar Nov 08 '22 08:11 bsmth