Skip to content

fix(tutorial): use theme colors for start button - #740

Merged
andrewtavis merged 2 commits into
scribe-org:mainfrom
Samuel-Francisco-AS:fix/tutorial-dark-mode-button
Oct 22, 2026
Merged

andrewtavis merged 2 commits into
scribe-org:mainfrom
Samuel-Francisco-AS:fix/tutorial-dark-mode-button

Conversation

@Samuel-Francisco-AS

@Samuel-Francisco-AS Samuel-Francisco-AS commented Oct 21, 2026 •

Copy link
Copy Markdown
Contributor

Contributor checklist

  • This pull request is on a separate branch and not the main branch.
  • I tested the changes with "./gradlew lintKotlin detekt" and "./gradlew test".

Description

This PR fixes the dark mode styling of the "Start full tutorial" button in "TutorialHomeScreen.kt".

Previously, the button used "MaterialTheme.colorScheme.primary" for its background and selected black or white text based on the Android system theme.

The button now uses the application's existing theme colors:

  • "surfaceContainer" for the background.
  • "onPrimary" for the text.

This ensures consistent styling with other Scribe buttons in both light and dark modes, while respecting the application's selected theme independently of the system theme.

Unused imports and the unnecessary system-theme check were also removed.

Testing

  • Kotlin lint and Detekt passed.
  • 442 unit tests passed (0 failures, 0 errors).
  • Android debug APK built successfully.
  • Visually tested light and dark themes on Moto G06.
  • Verified that the button opens the tutorial correctly.

Screenshots

Dark mode

Screenshot_20261021-222901

Light mode

Screenshot_20261020-223046

Related issue

Closes #739

@Samuel-Francisco-AS
Samuel-Francisco-AS marked this pull request as ready for review October 21, 2026 03:11
@andrewtavis
andrewtavis self-requested a review October 21, 2026 18:36
@andrewtavis

Copy link
Copy Markdown
Member

Thanks so much for the contribution, @Samuel-Francisco-AS! Could you also add a border around the button in dark mode that's the same color as the text? See the designs on Figma :) From there we can bring this in! 🚀

@andrewtavis

Copy link
Copy Markdown
Member

Really appreciate the screenshots and the care you put into the PR!

@Samuel-Francisco-AS

Copy link
Copy Markdown
Contributor Author

Hi @andrewtavis! Thanks for the feedback and the kind words! :)

I've added the border using "MaterialTheme.colorScheme.outline" with a width of 1.dp, matching the text color in dark mode.

I compared the result with the Figma design and tested it on my Android device. The Gradle checks and debug build completed successfully.

I've also updated the dark mode screenshot to show the final result.

Thanks again for reviewing my contribution! 🚀

@Samuel-Francisco-AS

Copy link
Copy Markdown
Contributor Author

Sorry for accidentally closing and reopening the PR! This is my first open-source contribution, and I'm still learning the GitHub workflow.

Thanks again for your patience, guidance, and encouragement! I really appreciate it! 😊

@andrewtavis andrewtavis added the no-changelog No changelog entry is needed for this pull request label Oct 22, 2026

@andrewtavis andrewtavis left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

praise: Thanks so much for a great first contribution and a nice review process, @Samuel-Francisco-AS! Hope we can work with you again :)

@andrewtavis
andrewtavis merged commit b514b88 into scribe-org:main Oct 22, 2026
7 of 8 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

no-changelog No changelog entry is needed for this pull request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Fix tutorial dark mode button coloration

2 participants