Remove Lines Containing Tool

Filtered Text

body { font-family: Arial, sans-serif; background-color: #f0f0f0; color: #333; margin: 0; padding: 0; } .container { max-width: 800px; margin: 20px auto; padding: 20px; background-color: #fff; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); text-align: center; } h1 { color: #FF6384; } .form-container, .result-container { margin-bottom: 20px; } textarea { width: 100%; height: 150px; padding: 10px; font-size: 16px; border: 1px solid #ccc; border-radius: 4px; margin-bottom: 10px; } input { width: 100%; padding: 10px; font-size: 16px; border: 1px solid #ccc; border-radius: 4px; margin-bottom: 10px; } button { padding: 10px 20px; font-size: 16px; background-color: #FF6384; color: #fff; border: none; border-radius: 4px; cursor: pointer; } button:hover { background-color: #FF4C6A; } .result-container h2 { margin-top: 20px; } textarea[readonly] { background-color: #e0e0e0; cursor: not-allowed; } function removeLines() { const textInput = document.getElementById('textInput').value; const keyword = document.getElementById('keyword').value; const lines = textInput.split('\n'); const filteredLines = lines.filter(line => !line.includes(keyword)); const resultOutput = document.getElementById('resultOutput'); resultOutput.value = filteredLines.join('\n'); }

Explanation

1. HTML:

   • Contains a text area for input text and another text area for displaying the filtered text.
   • Includes an input field for the keyword and a button to trigger the line removal process.

2. CSS:

   • Styles the text areas, input field, button, and overall layout for a colorful and responsive design.

3. JavaScript:

   • The removeLines function retrieves the text and keyword, filters out lines containing the keyword, and displays the filtered text in the output text area.

This code provides a complete, responsive, and colorful "Remove Lines Containing" tool. You can further customize it by adding more features or styling options as needed.