kolibri-design-system icon indicating copy to clipboard operation
kolibri-design-system copied to clipboard

Add dark prop support to DocsExample component

Open mukulpythondev opened this issue 7 months ago • 3 comments

Product

Kolibri Design System (KDS) – Documentation rendering components.

Desired behavior

The DocsExample component should accept a dark prop (default: false) and pass it to the underlying DocsShow component, allowing the rendered example to display with a dark background when needed.

Current behavior

Currently, DocsExample does not support a dark prop. This causes UI inconsistencies in certain documentation pages where DocsShow was previously used directly with the dark attribute.

Example:
In one case, the background did not align visually because I initially attempted to handle the dark theme via CSS, which conflicted with existing styles and structure.

(Optional) The Value Add

  • Restores consistency in the documentation UI by enabling dark-themed examples where required.
  • Simplifies the developer experience by consolidating support into DocsExample instead of relying on direct usage of DocsShow.
  • Reduces workaround needs (like manual CSS overrides) and improves maintainability.

(Optional) Possible Tradeoffs

  • Very minimal: Just introduces a new prop with a default value, so should be a safe and isolated enhancement.

Add labels

  • Type: Enhancement
  • Component: DocsExample
  • Priority: Low (or Medium, based on team preference)

mukulpythondev avatar Apr 15 '25 18:04 mukulpythondev

@EshaanAgg and @MisRob needs your permission to start work on this after ktabslist is merged.

mukulpythondev avatar Apr 15 '25 18:04 mukulpythondev

Yes, you're welcome to address this @mukulpythondev, thank you!

MisRob avatar Apr 17 '25 15:04 MisRob

Automatically unassigning @mukulpythondev due to no comments here, or updates on the associated pull request for 1 month. @mukulpythondev, if you're still interested in this issue or already have work in progress, please message us here, and we'll assign you again. Thank you!

Hi @mukulpythondev, I re-assigned you here because the aforementioned PR is close to be merged and you seem to be active. However, let me know if you didn't plan to come back to this one and we can remove assignment.

MisRob avatar May 22 '25 03:05 MisRob

Yeah thanks i will make sure to work on this , just after the merge of the my final last pr.

mukulpythondev avatar May 22 '25 13:05 mukulpythondev

Automatically unassigning @mukulpythondev due to no comments here, or updates on the associated pull request for 1 month. @mukulpythondev, if you're still interested in this issue or already have work in progress, please message us here, and we'll assign you again. Thank you!