Giter VIP home page Giter VIP logo

obisdian-fast-text-color's Introduction

Fast Text Color

This Obsidian plugin allows you to create beautifully colored and still interactive notes with a custom coloring syntax.

Features

  • Custom coloring syntax that integrates well with existing obsidian syntax.
  • Keyboard-centric coloring menu.
  • Editor integrations to add and remove color.
  • Wide variety of formatting options through the use of CSS classes.
  • Sorting of Colors into themes and the ability to select them in a Notes frontmatter.
  • No use of HTML tags.

Usage

Colored text uses the following syntax:

~={id} This text is colored according to the id=~

The id maps to the color and formatting options given by the currently active theme wich can be changed in the settings.

The formatting options include:

  • Text color
  • Italic
  • Bold
  • Underline, overline, throughline
  • Capital letters, small capitals

These options are handled with CSS classes, wich means that any changes apply retroactively to all sections marked with the respective id.

Themes

Colors are boundled into themes. You can create, manage and set the currently active theme in the settings.

if you want to have a certain theme active in a note although it is not set as the currently active theme you can do so by setting the property ftcTheme in the frontmatter to the name of the theme you want to use.

Applying Color

Editor Context Menu

Right clicking on highlighted text lets you change the textcolor via the context menu. All Colors available in the current theme will be shown.

Interactive Delimiter

If the interactive delimiter option is enabled in the settings (default). you can change or remove the color of text via the interactive delimiter shown in place of the color name.

Coloring Menu

Calling the change text color command opens the coloring menu, which allows you to choose the color of the selected text or inserts a colored section if no text is selected.

You can select a color by either by clicking on a button or by using the assigned keybind. Keybinds can be set in the settings or be disabled if so wanted.

Known issues

These issues mainly arrise from the different techniques needed for Live Preview and Reading Mode and will be fixed in the future.

  • Reading Mode.
    • an unopened closing delimiter =~ will lead to problems in reading mode.

Planned Features:

  • Selectable color themes
  • More/better ways to apply color
    • submenu in editor context menu
    • add suggester
  • changing color through interactable delimiter.
  • Individual Commands for Theme Colors.
  • Automatically Color by Keyword
  • More (Custom) Css options.
  • Option to use a Suggester Modal to choose color
  • Full Note Commands (color by keyword etc.)

How it works

This plugin works by using a custom parser which allows the colloring to interact with the usual obsidian syntax. For each coloring id a css class is created.

obisdian-fast-text-color's People

Contributors

superschnizel avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.