mazipan / mazipan/html-tools

feat: add Text Case Converter tool

Open
#128 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement
Dominant language
HTML
Stars
5
Forks
0
PR merge metrics
No merged PRs in 30d

Description

Summary

Add a case-converter.html tool that converts any text between all common naming and writing conventions in one view.

Motivation

"camelCase to snake_case", "snake_case to PascalCase", and similar queries are searched thousands of times daily by developers renaming variables, functions, and database columns across language boundaries. Most online tools only handle one or two conversions — this tool shows all formats simultaneously so one paste covers every case.

Proposed UX

  • Single input textarea at the top
  • Simultaneous output cards (one-click copy each):
    • camelCasemyVariableName
    • PascalCaseMyVariableName
    • snake_casemy_variable_name
    • SCREAMING_SNAKE_CASEMY_VARIABLE_NAME
    • kebab-casemy-variable-name
    • COBOL-CASEMY-VARIABLE-NAME
    • dot.casemy.variable.name
    • Title CaseMy Variable Name
    • Sentence caseMy variable name
    • lowercase / UPPERCASE
  • Smart word-splitting handles: existing separators (-, _, ., space), camelCase/PascalCase transitions, number boundaries (v2Apiv2, Api)
  • Live update as you type; "Copy all" button exports a JSON map of all formats

Implementation notes

  • Category: Code
  • Slug: case-converter
  • Icon: 🔡
  • No npm dependencies — splitter + formatter logic is ~60 lines inline
  • All logic inline in <script>
  • Follow src/_tool-template.html and run bun run generate:sections, bun run generate:index, bun run generate:favicon after adding to tools.json

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with src/_tool-template.html and inspect tools.json for the tool entry format. Add case-converter.html with the specified textarea, output cards, copy actions, and inline conversion logic, then run bun run generate:sections, bun run generate:index, and bun run generate:favicon. Done means all listed formats update live and the generated project data is refreshed.

Written by the indexing model from the issue text.

Assessment

Tech stack
html, javascript
Domain
tooling, web-dev
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Clearly specified
Newbie friendliness
78/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.