Socket
Socket
Sign inDemoInstall

PythonVuetifyMarkdown

Package Overview
Dependencies
0
Maintainers
1
Alerts
File Explorer

Install Socket

Detect and block malicious and high-risk dependencies

Install

    PythonVuetifyMarkdown

Adds Vuetify typography classes to various tags


Maintainers
1

Readme

Python Vuetify Markdown

This is an extension for Python-Markdown created for those who combine Python, Markdown, Vue, and Vuetify. I've been using this combination in several projects, and finally came across a need to process Markdown code, and keep it styled with Vuetify. Rather than McGuyver some solution in, I settled on a simple extension to do the heavy lifting.

The code is dead simple, and can be modified or extended to fit your needs.

Installation

pip install PythonVuetifyMarkdown

Usage

Here's a quick example of usage within a Django project. We have a Page model for custom pages, and a function to return the content parsed through Markdown.

from django.db import models
from django.utils.html import mark_safe
import markdown
from python_vuetify_markdown import PythonVuetifyMarkdown


class Page(models.Model):
    title = models.CharField(max_length=200)
    body = models.TextField()

    def get_body_as_markdown(self):
        return mark_safe(markdown.markdown(self.body, extensions=[PythonVuetifyMarkdown()]))

With this, you can create a Page object, and when displaying the body, you can use Page.get_body_as_markdown() to pass in the Markdown-formatted code.

Features

Currently, this extension modifies several tags, and adds spoiler text functionality. The styles can be found on the Vuetify Typography page.

  • <h1> → <h1 class="text-h1">
  • <h2> → <h2 class="text-h2">
  • <h3> → <h3 class="text-h3">
  • <h4> → <h4 class="text-h4">
  • <h5> → <h5 class="text-h5">
  • <h6> → <h6 class="text-h6">
  • <p> → <p class="text-body-1">
  • <a> → <a class="text-no-decoration">
  • *text* → <span class="font-weight-medium">text</span>
  • **text** → <span class="font-weight-bold">text</span>
  • ***text*** → <span class="font-weight-black">text</span>
  • !!text!! → <span class="font-weight-thin">text</span>
  • !text! → <span class="font-weight-light">text</span>
  • _text_ → <span class="font-italic">text</span>
  • __text__ → <span class="font-decoration-underline">text</span>
  • --text-- → <span class="font-decoration-line-through">text</span>
  • ||text|| → "â–’â–’â–’â–’" normally, "text" on hover

Support

There is none. This is a small side project, like 30 minutes of research and work went into it. Good luck.

FAQs


Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc