A tool to convert HTML to Twig and CSS to SCSS
Project description
webez
A versatile tool to convert HTML to Twig and CSS to SCSS
Overview
webez simplifies the conversion of HTML content to Twig templates and CSS stylesheets to SCSS formats. By leveraging this tool, developers can accelerate their workflow when working with modern templating systems and SCSS frameworks.
Features
- HTML to Twig Conversion: Quickly convert HTML files into Twig template format with appropriate variable mappings.
- CSS to SCSS Conversion: Replace CSS color values with predefined SCSS variables to streamline your styling workflow.
Installation
pip install webez
Usage
webez provides a command-line interface for converting files. Below are the available commands and their usage.
HTML to Twig
Convert an HTML file to a Twig file:
python <script_name>.py html2twig <html_file> <output_file>
Example:
python <script_name>.py html2twig input.html output.twig
CSS to SCSS
Convert a CSS file to SCSS format using variable mappings from an SCSS variables file:
python <script_name>.py css2scss <css_file> <variables_file> <output_file>
Example:
python <script_name>.py css2scss styles.css variables.scss output.scss
Example Code
Convert HTML to Twig using Python
# Import required modules
from webez.html_converter import convert_html_to_twig
from IPython.display import HTML, display
# Sample HTML content
sample_html = """
<!DOCTYPE html>
<html>
<head>
<title>Test Page</title>
</head>
<body>
<h1>Welcome</h1>
<div class="container">
<p>This is a test paragraph</p>
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
</div>
</body>
</html>
"""
# Convert HTML to Twig
twig_output = convert_html_to_twig(sample_html)
# Display original HTML
print("Original HTML:")
print("-" * 50)
display(HTML(sample_html))
# Display converted Twig
print("\nConverted Twig:")
print("-" * 50)
print(twig_output)
Code Explanation
webez consists of two main converters:
HTML Converter
The html_converter.py module leverages BeautifulSoup to parse and modify HTML content into Twig templates. This includes converting text and attributes into Twig variable placeholders.
CSS Converter
The css_converter.py module reads an SCSS variable file, creates a mapping of color values to variables, and replaces corresponding CSS values with SCSS variables.
Example Input and Output
HTML to Twig
Input HTML:
<div class="example">Welcome</div>
Output Twig:
<!-- `{{ div_content }}`: Content for <div> -->
<div class="{{ class_div }}">{{ div_content }}</div>
CSS to SCSS
Input CSS:
body {
background-color: #ffffff;
color: #333333;
}
Variable File (variables.scss):
$white: #ffffff;
$gray-dark: #333333;
Output SCSS:
body {
background-color: $white;
color: $gray-dark;
}
License
This project is licensed under the MIT License.
Author
- Akshay Chame
- Email: akshaychame2@gmail.com
- GitHub: akshayram1
Contributing
Contributions, issues, and feature requests are welcome! Feel free to fork the repository and submit pull requests on GitHub.
Additional Information
Package Metadata
- Name: webez
- Description: A tool to convert HTML to Twig and CSS to SCSS.
- Long Description:
file: README.md - Content Type:
text/markdown - Author: Akshay Chame
- Email: akshaychame2@gmail.com
- URL: https://github.com/akshayram1/webez
- License: MIT
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
Filter files by name, interpreter, ABI, and platform.
If you're not sure about the file name format, learn more about wheel file names.
Copy a direct link to the current filters
File details
Details for the file webez-0.1.0.tar.gz.
File metadata
- Download URL: webez-0.1.0.tar.gz
- Upload date:
- Size: 5.2 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/6.0.1 CPython/3.11.5
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 |
c1746a73d1fd4efd3c233420a90d3366978a5b535600cac53da08ecea96c440d
|
|
| MD5 |
5b52f8e06fc0f9d19a6a07da30027b24
|
|
| BLAKE2b-256 |
06cab623f966b4b4e022fe5595b6bf13072d57d3308e6ab05fb0ae73059c4056
|
File details
Details for the file webez-0.1.0-py3-none-any.whl.
File metadata
- Download URL: webez-0.1.0-py3-none-any.whl
- Upload date:
- Size: 5.8 kB
- Tags: Python 3
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/6.0.1 CPython/3.11.5
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 |
75ba4cfd13e5f37c07c7c9e621da902d78fb983c83f717f32d4cf63789552db0
|
|
| MD5 |
6ec5a312109183abd348b166bc9e089f
|
|
| BLAKE2b-256 |
80103ef327fb91b07db7c0df19717e7e7b2c0829cfe0702482c9f06681b2ce00
|
