Skip to content

Removed bootstrap in favor of module css#209

Merged
Cellule merged 13 commits intomasterfrom
remove-bootstrap
Apr 13, 2025
Merged

Removed bootstrap in favor of module css#209
Cellule merged 13 commits intomasterfrom
remove-bootstrap

Conversation

@Cellule
Copy link
Owner

@Cellule Cellule commented Apr 12, 2025

Summary

Bootstrap has been a pain to maintain with all the breaking changes left and right.
I used AI assisted coding to get rid of it as much as possible.
The end result is not exactly the same, but I think it solves a few annoyances I've had over time in terms of consistency & readability

Changes

  • Removed Bootstrap in favor of css modules
  • Use consistent buttons in the sidebar with improved visibility
  • Improved layout for PDF printing
  • Improved footer readability
  • Change webpage title to show npc name. This should help identify tabs and default filename for printing
  • Used a scrollable container for the history tab
  • The options and secondary buttons are now hidden by default on mobile and small viewports and can be expanded on demand
  • Reduced bundle size

Screenshot/Examples

The following screenshot cut the background because of the way I took the screenshot, it scrolls properly on the website

Bryce Glorybluff - NPC Generator.pdf
image
image


This change is Reviewable

@Cellule Cellule requested review from Copilot and etiens April 12, 2025 20:38
@Cellule Cellule self-assigned this Apr 12, 2025
Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

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

Copilot reviewed 19 out of 31 changed files in this pull request and generated no comments.

Files not reviewed (12)
  • .vscode/settings.json: Language not supported
  • package.json: Language not supported
  • src/App.module.css: Language not supported
  • src/DisplayNpc.module.css: Language not supported
  • src/Footer.module.css: Language not supported
  • src/NpcData.module.css: Language not supported
  • src/NpcHistory.module.css: Language not supported
  • src/UserInput.module.css: Language not supported
  • src/styles/DisplayNpc.scss: Language not supported
  • src/styles/Footer.scss: Language not supported
  • src/styles/NpcData.scss: Language not supported
  • src/styles/NpcHistory.scss: Language not supported
Comments suppressed due to low confidence (3)

src/main.tsx:3

  • Removing the file extension in the App import may cause module resolution issues in some environments. Ensure the project's configuration supports this pattern.
import App from "./App";

src/UserInput.tsx:182

  • The button rendering the 'Copied!' state lacks an explicit type attribute, which may default to 'submit' when used within a form. Consider adding type='button' to prevent unintended form submissions.
<button className={`${styles.button} ${styles.buttonOutline} ${styles.buttonOutlinePrimary}`}>

src/UserInput.tsx:194

  • The 'Copy to Clipboard' button also lacks an explicit type attribute. Adding type='button' will prevent it from inadvertently submitting the form.
<button className={`${styles.button} ${styles.buttonOutline} ${styles.buttonOutlineSecondary}`}>

@Cellule Cellule merged commit 990eadb into master Apr 13, 2025
4 of 5 checks passed
@Cellule Cellule deleted the remove-bootstrap branch April 13, 2025 02:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants