Flexcyon

<div align="center"> <a href="https://flexcyon.github.io/docs-en/"> <img alt="English Documentation" src="https://img.shields.io/badge/english-docs-blue?style=for-the-badge"> </a> <a href="https://flexcyon.github.io/docs-en/zh"> <img alt="中文文档" src="https://img.shields.io/badge/%E4%B8%AD%E6%96%87-%E6%96%87%E6%A1%A3-purple?style=for-the-badge"> </a> <a href="https://matrix.to/#/#flexcyon-space:matrix.org"> <img alt="Matrix Space" src="https://img.shields.io/matrix/flexcyon-space%3Amatrix.org?style=for-the-badge&logo=matrix&label=Matrix%20Space"> </a> </div> <div align="center"> <a href="https://www.moritzjung.dev/obsidian-stats/themes/flexcyon"> <a href="https://www.moritzjung.dev/obsidian-stats/themes/flexcyon"> <img src="https://img.shields.io/badge/dynamic/json?query=%24%5B%22flexcyon%22%5D.download&url=https%3A%2F%2Freleases.obsidian.md%2Fstats%2Ftheme&style=for-the-badge&label=Downloads&logo=obsidian" referrerpolicy="noreferrer"> </a> <a href="https://github.com/bladeacer/flexcyon/releases/latest"> <img src="https://img.shields.io/github/v/release/bladeacer/flexcyon?style=for-the-badge&sort=semver&logo=semantic-release" referrerpolicy="noreferrer"> </a> <img alt="Min App Version" src="https://img.shields.io/github/manifest-json/minAppVersion/bladeacer/flexcyon?style=for-the-badge&logo=semver"> </div> <div align="center"> <a href="https://github.com/bladeacer/flexcyon/blob/master/LICENSE"> <img src="https://img.shields.io/github/license/bladeacer/flexcyon?style=for-the-badge" referrerpolicy="noreferrer"> </a> <a href="https://github.com/flexcyon/docs-en"> <img alt="GitHub deployments" src="https://img.shields.io/github/deployments/flexcyon/docs-en/github-pages?style=for-the-badge&logo=github"> </a> </div> <br> <div align="center"> <img alt="Dark mode theme thumbnail" src="./docs/dark_thumb.webp"> </div> <div align="center"> <img alt="Light mode theme thumbnail" src="./docs/light_thumb.webp"> </div>

About Flexcyon

A Obsidian theme combining the colour schemes of Halcyon and Flexoki.

I really liked the vibrant colours of the Halcyon colour scheme, and the inky aesthetic of the Flexoki colour scheme. Hence, I decided to combine the two which started this theme.

There is also a light mode colour scheme combining Origami theme's and Flexoki light's colour schemes.

Screenshots

<div align="center"> <img alt="Figure 1: ASCII Art, Dimmed File Extensions" src="./docs/showcase1.png" style="width: 47.5%;"> <img alt="Figure 2: Vim Status Mode, Coloured Headings, Hide Until Hover Status Bar" src="./docs/showcase2.png" style="width: 47.5%;"> </div> <div align="center"> <img alt="Figure 3: Dimmed Inactive Settings navigation, smiley and coloured icons" src="./docs/showcase3.png" style="width: 47.5%;"> <img alt="Figure 5: ASCII checkboxes" src="./docs/ascii_checkboxes1.png" style="width: 47.5%;"> </div> <div align="center"> <img alt="Figure 4: Light Mode with Powerlevel10k layout and status style" src="./docs/showcase4.png" style="width: 95%;"> </div>

Installation via community store (recommended)

To install this theme via the community store, navigate to Settings > Appearance

1. Under Themes, click Manage
2. Type "Flexcyon in the search bar > Select it > Click "Install and Use"

Installation of Style Settings is highly recommended for this theme, as most customisation and functionality is built around it.

Installation via BRAT

To install this theme via BRAT, navigate to Settings > Community Plugins > Browse

1. Type "BRAT" in the search bar > Select it (the one by TftHacker) > Click install
2. Wait for installation to complete then click Enable
3. Click Options
4. Click Add Beta Theme
5. Input https://github.com/bladeacer/flexcyon and then click Add Theme

Supported versions

Flexcyon is officially supported from Obsidian Version 1.6.3 onwards.

Obsidian 1.6 and above was chosen to be the minimum version supported as support for RTL languages was added then.

Beta or insider versions of Obsidian will not be officially supported, although the theme should (hopefully) not break too much.

If significant issues are found, do open an issue here. I (bladeacer) will try to troubleshoot them once the beta or insider version of Obsidian has a public equivalent.

You can also find this in the documentation.

Documentation

A huge thanks to GitHub Pages for hosting the documentation.

如果您更熟悉中文, 请 单击此处 查看中文文档。

Design Principles

This theme tries to:

• be "reasonably opinionated"
  • Choose between the opinionated Flex Max mode
  • or customising the theme extensively
  • Opt into customisations you choose instead of opting out
• be decently lightweight, meaning:
  • fonts, svgs and the like are not embedded in this theme
  • (hopefully) sane defaults, customisable with style settings
• dim inactive or unfocused UI elements to reduce information overload
• have a decent feature set of style settings for customisation
• bundle numerous callout metadata utilites

Features

Refer to the documentation for the full set of features in Flexcyon.

What this theme has

• vim mode status (when using builtin vim keybinds)
• Status bar options like Powerlevel10k inspired status bar styling
• Smiley toggle icons and other options for settings
• ASCII art or custom quote in new empty tabs
• subtle opacity effects for UI elements
• a light and dark mode colour scheme
• ASCII checkboxes
• Heading options like underline, numbered, coloured
• A plethora of cssclasses and callout customisation options
• A plethora of cssclasses and callout customisation options
• Workspace Layouts like card layout with TUI inspired add-on, angled layout
• Configure left, right sidebar and modal background images
• Animation options for tabs
• And many more...

What this theme does not have

• multiple colour schemes (though you can override the existing one with your own, see Style Settings)
• alternate checkboxes
• embedded fonts, svgs

Supported plugins/snippets

View supported plugins and snippets here

For plugins/snippets that are not styled yet, feel free to open a Pull Request/ Feature Request/start a Discussion on it.

Snippet collection

Some of the theme's snippets like ASCII Art and its callouts can be found here.

Questions, Issues?

Feel free to talk about it at:

• this Matrix Space
• this Obsidian forum topic
• this Discord thread
• start a GitHub discussion

Methods of communication are listed in order of preference.

Contributing

When contributing do open an issue at the repository or start a GitHub discussion first.

You can create your own fork before making a pull request.

Before doing this, do open an issue at this repository first.

This repository comes with some scripts. The important ones include:

• npm run dev: SCSS to CSS compiler, assumes you have Sass (Dart, Node) installed
• npm run lint: Lints the entire SCSS codebase. Reruns linting when a file write is detected in source files
• npm run lint-once: As its namesake says, lints the codebase once
• npm run fix: Equivalent to running stylelint --fix. Run this only after your file changes are saved.

If you prefer to use CSS instead of SCSS, place your proposed code changes or snippets in the css/ folder. The maintainer will try to integrate them.

Do note that this repository has its own Code of Conduct and Contributing Guide.

Style Settings

Documentation for style settings of this theme can be found here

Documentation on installing and using style settings can be found here

License

This theme is licensed under the MIT License

Credits

Without these contributors and tools, flexcyon would not be possible.

The code of conduct was adopted from the Contributor Covenant

The contributing guide was adopted from conduct